synapse-react-client
Version:
[](https://badge.fury.io/js/synapse-react-client) [](https://github.com/prettier/prettie
127 lines (126 loc) • 4.33 kB
JavaScript
import { jsx as t, jsxs as l, Fragment as w } from "react/jsx-runtime";
import S from "../../assets/icons/NoSearchResults.js";
import { useGetFavorites as b } from "../../synapse-queries/user/useFavorites.js";
import { useSynapseContext as R } from "../../utils/context/SynapseContext.js";
import { entityTypeToFriendlyName as p, convertToEntityType as u } from "../../utils/functions/EntityTypeUtils.js";
import { PRODUCTION_ENDPOINT_CONFIG as x } from "../../utils/functions/getEndpoint.js";
import { TextField as M, InputAdornment as N, Stack as C } from "@mui/material";
import { useReactTable as E, getFacetedUniqueValues as I, getFacetedRowModel as P, getSortedRowModel as z, getFilteredRowModel as A, getCoreRowModel as O, createColumnHelper as G } from "@tanstack/react-table";
import { useState as g, useMemo as D, useEffect as f } from "react";
import { EntityTypeIcon as H } from "../EntityIcon.js";
import { ErrorBanner as U } from "../error/ErrorBanner.js";
import V from "../IconSvg/IconSvg.js";
import { SynapseSpinner as W } from "../LoadingScreen/LoadingScreen.js";
import h from "../TanStackTable/ColumnHeader.js";
import j from "../TanStackTable/StyledTanStackTable.js";
import k from "./FavoriteButton.js";
const n = G(), q = [
n.display({
id: "removeFavorite",
cell: (e) => /* @__PURE__ */ t(k, { entityId: e.row.original.id }),
size: 60,
enableResizing: !1,
meta: {
textAlign: "center"
}
}),
n.accessor("name", {
cell: (e) => /* @__PURE__ */ t(
"a",
{
rel: "noopener noreferrer",
href: `${x.PORTAL}Synapse:${e.row.original.id}`,
children: e.row.original.name
}
),
enableGlobalFilter: !0,
header: (e) => /* @__PURE__ */ t(h, { ...e, title: "Name" }),
size: 400,
enableColumnFilter: !1,
sortingFn: "alphanumeric",
enableSorting: !0
}),
n.accessor("type", {
cell: (e) => {
const r = u(e.row.original.type);
return /* @__PURE__ */ l(w, { children: [
/* @__PURE__ */ t(H, { type: r, style: { marginRight: "5px" } }),
p(r)
] });
},
header: (e) => /* @__PURE__ */ t(h, { ...e, title: "Type" }),
size: 160,
enableGlobalFilter: !1,
sortingFn: "alphanumeric",
filterFn: "arrIncludes",
meta: {
enableMultipleSelect: !0,
filterVariant: "enumeration",
getDisplayText: (e) => p(u(e))
},
enableSorting: !0
})
];
function ne() {
const { isAuthenticated: e } = R(), [r, y] = g(""), [s, o] = g(), { data: i, isLoading: c, isError: m, error: a } = b(), F = D(() => i ?? [], [i]), d = E({
data: F,
columns: q,
getCoreRowModel: O(),
getFilteredRowModel: A(),
getSortedRowModel: z(),
getFacetedRowModel: P(),
getFacetedUniqueValues: I(),
globalFilterFn: "includesString",
state: {
globalFilter: r
},
columnResizeMode: "onChange"
});
if (f(() => {
m && a && o(a);
}, [m, a]), f(() => {
o(e ? void 0 : new Error("Please sign in to access your favorites."));
}, [e]), s)
return /* @__PURE__ */ t(U, { error: s });
const v = d.getRowModel().rows.length > 0;
return /* @__PURE__ */ l("div", { className: "FavoritesPage", children: [
/* @__PURE__ */ t(
M,
{
type: "search",
placeholder: "Favorite Name",
value: r,
onChange: (T) => {
y(T.target.value);
},
fullWidth: !0,
sx: { mb: 4, maxWidth: "800px" },
slotProps: {
input: {
startAdornment: /* @__PURE__ */ t(N, { position: "start", children: /* @__PURE__ */ t(V, { icon: "search", wrap: !1 }) })
}
}
}
),
/* @__PURE__ */ t(j, { table: d, fullWidth: !1 }),
!v && !c && /* @__PURE__ */ l(
C,
{
sx: {
my: 2,
gap: 1,
textAlign: "center"
},
children: [
/* @__PURE__ */ t(S, { height: "150px" }),
i?.length == 0 ? /* @__PURE__ */ t("p", { children: "You currently have no favorites" }) : /* @__PURE__ */ t("p", { children: "No matching favorites found" })
]
}
),
c && /* @__PURE__ */ t("div", { className: "placeholder", children: /* @__PURE__ */ t(W, { size: 30 }) })
] });
}
export {
ne as default
};
//# sourceMappingURL=FavoritesPage.js.map