UNPKG

synapse-react-client

Version:

[![npm version](https://badge.fury.io/js/synapse-react-client.svg)](https://badge.fury.io/js/synapse-react-client) [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettie

62 lines (61 loc) 2.42 kB
import { jsxs as l, jsx as r } from "react/jsx-runtime"; import { useListPortalsInfinite as P } from "../../synapse-queries/portal/useListPortals.js"; import { Alert as x, Box as t, Typography as h, Button as y, CircularProgress as g } from "@mui/material"; import { useState as M, useEffect as v, Fragment as w } from "react"; import { useInView as I } from "react-intersection-observer"; import { PortalCard as L } from "./PortalCard.js"; import { CreatePortalModal as O } from "./CreatePortalModal.js"; import e from "./PortalList.module.scss.js"; import { Add as A } from "@mui/icons-material"; function z() { const { ref: u, inView: c } = I(), [N, d] = M(!1), { data: C, status: m, error: f, isLoading: p, hasNextPage: o, isFetchingNextPage: s, fetchNextPage: i } = P({ throwOnError: !1 }); v(() => { m === "success" && !s && o && i && c && i(); }, [m, o, s, i, c]); const n = C?.pages.flatMap((a) => a.page ?? []) ?? []; return f ? /* @__PURE__ */ l(x, { severity: "error", className: e.errorAlert, children: [ "Error loading portals: ", f.message ] }) : /* @__PURE__ */ l(t, { className: e.portalListContainer, children: [ /* @__PURE__ */ l(t, { className: e.header, children: [ /* @__PURE__ */ r(h, { variant: "h4", component: "h2", className: e.title, children: "Portals" }), /* @__PURE__ */ r( y, { variant: "contained", color: "primary", startIcon: /* @__PURE__ */ r(A, {}), onClick: () => d(!0), children: "Create New Portal" } ) ] }), p && /* @__PURE__ */ r(t, { className: e.loadingContainer, children: /* @__PURE__ */ r(g, {}) }), !p && n.length === 0 && /* @__PURE__ */ r(h, { variant: "body1", color: "text.secondary", children: "No portals found." }), n.length > 0 && /* @__PURE__ */ r(t, { className: e.portalGrid, children: n.map((a) => /* @__PURE__ */ r(w, { children: /* @__PURE__ */ r(L, { portal: a }) }, a.id ?? JSON.stringify(a))) }), o && /* @__PURE__ */ r("div", { ref: u, className: e.loadMoreTrigger }), s && /* @__PURE__ */ r(t, { className: e.loadingMoreContainer, children: /* @__PURE__ */ r(g, { size: 32 }) }), /* @__PURE__ */ r( O, { open: N, onClose: () => d(!1) } ) ] }); } export { z as PortalList, z as default }; //# sourceMappingURL=PortalList.js.map