synapse-react-client
Version:
[](https://badge.fury.io/js/synapse-react-client) [](https://github.com/prettier/prettie
135 lines (134 loc) • 3.78 kB
JavaScript
import { jsxs as o, jsx as e } from "react/jsx-runtime";
import { useGetPersonalAccessTokensInfinite as x } from "../../synapse-queries/user/usePersonalAccessToken.js";
import { AddCircleTwoTone as u } from "@mui/icons-material";
import { Box as n, Button as l, Typography as k } from "@mui/material";
import { useState as y } from "react";
import { SynapseErrorBoundary as g, ErrorBanner as w } from "../error/ErrorBanner.js";
import C from "../LoadingScreen/LoadingScreen.js";
import { AccessTokenCard as T } from "./AccessTokenCard/AccessTokenCard.js";
import { CreateAccessTokenModal as v } from "./CreateAccessTokenModal.js";
function E({ title: d, body: c }) {
const [m, a] = y(!1), {
data: p,
isLoading: i,
error: t,
fetchNextPage: f,
hasNextPage: h
} = x(), s = p?.pages.flatMap((r) => r.results) ?? [];
return /* @__PURE__ */ o("div", { children: [
/* @__PURE__ */ o(
n,
{
sx: {
display: "flex",
gap: 2,
justifyContent: "space-between",
flexDirection: { xs: "column", md: "row" }
},
children: [
/* @__PURE__ */ o(
n,
{
sx: {
flexGrow: 1
},
children: [
/* @__PURE__ */ e("h1", { children: d }),
c
]
}
),
/* @__PURE__ */ e(
n,
{
sx: (r) => ({
flexShrink: 0,
alignSelf: "end",
[r.breakpoints.down("md")]: { width: "100%" }
}),
children: /* @__PURE__ */ e(
l,
{
sx: (r) => ({
[r.breakpoints.down("md")]: { width: "100%" }
}),
variant: "contained",
color: "primary",
onClick: () => a(!0),
startIcon: /* @__PURE__ */ e(u, {}),
children: "Create New Token"
}
)
}
)
]
}
),
/* @__PURE__ */ o(g, { children: [
m && /* @__PURE__ */ e(
v,
{
onClose: () => a(!1)
}
),
/* @__PURE__ */ o("div", { children: [
!i && !t && s.length === 0 && /* @__PURE__ */ e(
k,
{
variant: "headline2",
sx: {
m: 5,
textAlign: "center"
},
children: "You currently have no personal access tokens."
}
),
/* @__PURE__ */ o(
n,
{
sx: {
maxWidth: "800px",
mx: "auto",
my: 2.5
},
children: [
s.map((r) => /* @__PURE__ */ e(
T,
{
accessToken: r
},
r.id
)),
i && C,
!i && h && !t && /* @__PURE__ */ e(
n,
{
sx: {
display: "flex",
justifyContent: "flex-end"
},
children: /* @__PURE__ */ e(
l,
{
variant: "contained",
color: "primary",
onClick: () => {
f();
},
children: "Load More"
}
)
}
)
]
}
),
t && /* @__PURE__ */ e(w, { error: t })
] })
] })
] });
}
export {
E as AccessTokenPage
};
//# sourceMappingURL=AccessTokenPage.js.map