synapse-react-client
Version:
[](https://badge.fury.io/js/synapse-react-client) [](https://github.com/prettier/prettie
351 lines (350 loc) • 11.5 kB
JavaScript
import { jsxs as r, Fragment as a, jsx as e } from "react/jsx-runtime";
import "../../synapse-client/SynapseClient.js";
import "@sage-bionetworks/synapse-client/generated/models/ErrorResponseCode";
import "@sage-bionetworks/synapse-client/generated/models/TwoFactorAuthErrorResponse";
import "@sage-bionetworks/synapse-client/util/SynapseClientError";
import { ALL_ENTITY_BUNDLE_FIELDS as ie, SubscriptionObjectType as k, ObjectType as ne } from "@sage-bionetworks/synapse-types";
import "../../utils/functions/EntityTypeUtils.js";
import "../../utils/SynapseConstants.js";
import "lodash-es";
import "@sage-bionetworks/synapse-client/util/synapseClientFetch";
import "@tanstack/react-query";
import "../../utils/PermissionLevelToAccessType.js";
import { useState as i, useMemo as le } from "react";
import "../../utils/context/SynapseContext.js";
import "use-deep-compare-effect";
import { Box as d, Typography as g, ToggleButtonGroup as se, ToggleButton as I, TextField as v, Button as P } from "@mui/material";
import "../../utils/hooks/useCookiePreferences.js";
import "../../utils/hooks/useSourceAppConfigs.js";
import { useNativeSearchParams as ae } from "../../utils/hooks/useNativeSearchParams.js";
import "universal-cookie";
import "../../utils/AppUtils/session/ApplicationSessionContext.js";
import "../../utils/context/FullContextProvider.js";
import "../../utils/context/DocumentMetadataContext.js";
import '../../style/components/_spinner.css';/* empty css */
import "@tanstack/query-core";
import "lodash-es/isEmpty";
import "lodash-es/isEqual";
import "lodash-es/xorWith";
import "react-router";
import "@sage-bionetworks/synapse-client";
import "../../utils/types/IsType.js";
import de from "../../synapse-queries/entity/useEntityBundle.js";
import { useGetCurrentUserProfile as ce } from "../../synapse-queries/user/useUserBundle.js";
import { useGetRepliesInfinite as me } from "../../synapse-queries/forum/useReply.js";
import { useGetThread as pe, useDeleteThread as ue, useRestoreThread as he } from "../../synapse-queries/forum/useThread.js";
import { useSubscription as fe } from "../../synapse-queries/subscription/useSubscription.js";
import { formatDate as be } from "../../utils/functions/DateFormatter.js";
import ge from "dayjs";
import n from "../IconSvg/IconSvg.js";
import { Markdown as ye } from "../Markdown/MarkdownSynapse.js";
import { WarningDialog as A } from "../SynapseForm/WarningDialog.js";
import { displayToast as y } from "../ToastMessage/ToastMessage.js";
import { UserBadge as we } from "../UserCard/UserBadge.js";
import { DiscussionReply as xe } from "./DiscussionReply.js";
import { ForumThreadEditor as w } from "./ForumThreadEditor.js";
import { SubscribersModal as Te } from "./SubscribersModal.js";
import { useGetModerators as De } from "../../synapse-queries/forum/useForum.js";
import { REPLY_ID_PARAM_KEY as Me } from "./DiscussionConstants.js";
import { SignInRequiredModal as Ce } from "../SignInRequiredModal/SignInRequiredModal.js";
const Re = "You are following this topic. Click to stop following.", Se = "You are not following this topic. Click to follow.", N = "Write a reply...";
function Mo(L) {
const { threadId: l, limit: O } = L, u = "16px", [x, T] = i(!0), [U, D] = i(!1), [j, M] = i(!1), [Y, C] = i(!1), [_, h] = i(!1), [F, c] = i(!1), [G, f] = i(!1), [H, W] = i(!1), { threadData: o, threadBody: b, togglePin: X } = pe(l), { data: m } = ce(), { data: q } = de(
o?.projectId ?? "",
void 0,
ie,
{
enabled: !!o
}
), { subscription: R, toggleSubscribed: z, isLoading: K } = fe(
l,
k.THREAD
), { mutate: J } = ue({
onSuccess: () => {
h(!1), y("A thread has been deleted.", "info");
}
}), { mutate: Q } = he({
onSuccess: () => {
f(!1), y("A thread has been restored.", "info");
}
}), V = o?.createdBy == m?.ownerId;
function Z() {
if (m?.userName == "anonymous")
c(!0);
else
try {
z();
} catch (t) {
y(t.reason, "danger");
}
}
const {
data: S,
hasNextPage: $,
fetchNextPage: ee
} = me(l, x, O), { data: B } = De(o?.forumId ?? "", {
enabled: !!o?.forumId
}), oe = B?.includes(o?.createdBy ?? ""), [p, te] = ae(Me), E = le(() => {
const t = S?.pages.flatMap((s) => s.results) ?? [];
return p ? t.filter((s) => s.id === p) : t;
}, [S, p]), re = () => {
te(null);
};
return /* @__PURE__ */ r("div", { className: "DiscussionThread", role: "article", children: [
o && b ? /* @__PURE__ */ r(a, { children: [
/* @__PURE__ */ r(d, { sx: { mb: 2, textAlign: "right" }, children: [
/* @__PURE__ */ e(g, { component: "span", sx: { mr: 1 }, children: "Sort:" }),
/* @__PURE__ */ r(
se,
{
color: "primary",
exclusive: !0,
value: x ? "datePosted" : "mostRecent",
children: [
/* @__PURE__ */ e(
I,
{
value: "datePosted",
onClick: () => T(!0),
children: "Date Posted"
}
),
/* @__PURE__ */ e(
I,
{
value: "mostRecent",
onClick: () => T(!1),
children: "Most Recent"
}
)
]
}
)
] }),
/* @__PURE__ */ e(
we,
{
userId: o.createdBy,
withAvatar: !0,
avatarSize: "MEDIUM",
showCardOnHover: !0,
showModeratorBadge: oe
}
),
/* @__PURE__ */ r(
d,
{
sx: (t) => ({
[t.breakpoints.down("sm")]: {
display: "flex",
flexDirection: "column-reverse",
marginBottom: u,
marginTop: u,
".SubscribersModal": {
justifyContent: "flex-start",
marginBottom: u
}
}
}),
children: [
/* @__PURE__ */ e(g, { sx: { marginTop: "4px" }, variant: "headline2", children: o.title }),
/* @__PURE__ */ e(
Te,
{
id: l,
objectType: k.THREAD,
showModal: H,
handleModal: W
}
)
]
}
),
/* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
ye,
{
markdown: b,
objectType: ne.THREAD
}
) }),
/* @__PURE__ */ r("span", { children: [
"posted ",
be(ge(o.createdOn), "M/D/YYYY"),
o.isEdited ? /* @__PURE__ */ e("i", { children: " (Edited)" }) : null
] }),
/* @__PURE__ */ e(
w,
{
isReply: !1,
initialText: b,
onClose: () => D(!1),
initialTitle: o?.title,
id: l,
isDialog: !0,
openDialog: U
}
)
] }) : /* @__PURE__ */ e(a, {}),
/* @__PURE__ */ e(
d,
{
sx: {
float: "right",
margin: { xs: "8px 0", sm: "0 24px 0 0" }
},
children: o?.isDeleted ? /* @__PURE__ */ e("button", { onClick: () => f(!0), children: /* @__PURE__ */ e(n, { icon: "restore", label: "Restore deleted thread" }) }) : /* @__PURE__ */ r(a, { children: [
/* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(
"button",
{
className: "follow-button",
"aria-label": R ? "Unfollow thread" : "Follow thread",
disabled: K,
onClick: () => Z(),
children: R ? /* @__PURE__ */ e(n, { icon: "visibility", label: Re }) : /* @__PURE__ */ e(n, { icon: "visibilityOff", label: Se })
}
) }),
V && /* @__PURE__ */ e("button", { onClick: () => D(!0), children: /* @__PURE__ */ e(n, { icon: "edit", label: "Edit thread" }) }),
q?.permissions.canModerate ? /* @__PURE__ */ r(a, { children: [
/* @__PURE__ */ e("button", { onClick: () => h(!0), children: /* @__PURE__ */ e(n, { icon: "delete", label: "Delete thread" }) }),
/* @__PURE__ */ e("button", { onClick: () => X(), children: o?.isPinned ? /* @__PURE__ */ e(
n,
{
icon: "pushpin",
sx: { color: "error.main" },
label: "Unpin thread"
}
) : /* @__PURE__ */ e(n, { icon: "pushpin", label: "Pin thread" }) })
] }) : null
] })
}
),
/* @__PURE__ */ e(d, { sx: { mt: 2, mb: 3 }, children: j ? /* @__PURE__ */ e(
w,
{
id: l,
isReply: !0,
onClose: () => M(!1),
isDialog: !1
}
) : /* @__PURE__ */ e(
v,
{
fullWidth: !0,
placeholder: N,
onClick: () => {
m?.userName == "anonymous" ? c(!0) : M(!0);
}
}
) }),
p && /* @__PURE__ */ r(
P,
{
variant: "outlined",
onClick: re,
sx: {
display: "flex",
alignItems: "center",
padding: "2px 8px",
marginBottom: "12px",
gap: "4px"
},
children: [
/* @__PURE__ */ e(n, { icon: "arrowBack", sx: { width: "16px" } }),
/* @__PURE__ */ e(g, { variant: "smallText2", children: "Show all replies" })
]
}
),
/* @__PURE__ */ e("div", { children: E.map((t) => {
const s = B?.includes(
t.createdBy
);
return /* @__PURE__ */ e(
xe,
{
reply: t,
isReplyAuthorModerator: s
},
t.id
);
}) }),
E.length > 0 && /* @__PURE__ */ e(
d,
{
sx: (t) => ({
mt: 2,
mb: 3,
[t.breakpoints.down("sm")]: {
MarkdownEditor: {
display: "block"
}
}
}),
children: Y ? /* @__PURE__ */ e(
w,
{
id: l,
isReply: !0,
onClose: () => C(!1),
isDialog: !1
}
) : /* @__PURE__ */ e(
v,
{
fullWidth: !0,
placeholder: N,
onClick: () => {
m?.userName == "anonymous" ? c(!0) : C(!0);
}
}
)
}
),
$ ? /* @__PURE__ */ e(
P,
{
variant: "outlined",
onClick: () => {
ee();
},
children: "Show more results"
}
) : /* @__PURE__ */ e(a, {}),
/* @__PURE__ */ e(
A,
{
open: _,
title: "Confirm Deletion",
content: "Are you sure you want to delete this thread?",
onCancel: () => h(!1),
onConfirm: () => o && J(o),
confirmButtonColor: "error",
confirmButtonText: "Delete"
}
),
/* @__PURE__ */ e(
A,
{
open: G,
title: "Confirm Restoration",
content: "Are you sure you want to restore this thread?",
onCancel: () => f(!1),
onConfirm: () => o && Q(o),
confirmButtonColor: "info",
confirmButtonText: "Restore"
}
),
/* @__PURE__ */ e(
Ce,
{
open: F,
onHide: () => c(!1),
hasCancelButton: !1
}
)
] });
}
export {
Mo as DiscussionThread,
Mo as default
};
//# sourceMappingURL=DiscussionThread.js.map