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

170 lines (169 loc) 5.06 kB
import { jsxs as n, Fragment as B, jsx as e } from "react/jsx-runtime"; import { useCreatePersonalAccessToken as M } from "../../synapse-queries/user/usePersonalAccessToken.js"; import { Typography as r, Stack as V, FormControlLabel as m, Checkbox as p } from "@mui/material"; import { scopeDescriptions as a } from "@sage-bionetworks/synapse-types"; import { noop as g } from "lodash-es"; import { useState as s } from "react"; import { ConfirmationDialog as j } from "../ConfirmationDialog/ConfirmationDialog.js"; import { CopyToClipboardInput as q } from "../CopyToClipboardInput/CopyToClipboardInput.js"; import { ErrorBanner as y } from "../error/ErrorBanner.js"; import L from "../LoadingScreen/LoadingScreen.js"; import R from "../TextField/TextField.js"; const W = "You must provide a token name and at least one permission."; function Z(k) { const { onClose: h = g, onCreate: C = g } = k, [d, T] = s(""), [i, b] = s(!0), [c, x] = s(!1), [l, w] = s(!1), [u, f] = s(null), { mutate: A, isPending: N, error: v, data: t } = M(), I = (o) => { T(o.target.value); }, P = (o, E) => !!o && E.some((F) => F), S = () => { if (P(d, [i, c, l])) { f(null); const o = { scope: [], name: d }; i && o.scope.push("view"), c && o.scope.push("download"), l && o.scope.push("modify"), A(o), C(); } else f(W); }, D = t ? /* @__PURE__ */ n(B, { children: [ /* @__PURE__ */ n(r, { variant: "body1", children: [ /* @__PURE__ */ e( r, { variant: "body1", component: "span", sx: { fontWeight: 700 }, children: "This token will not be able to be retrieved again." } ), " ", "If needed, generate a new personal access token, and delete this one." ] }), /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e( q, { value: t.token, inputWidth: "350px" } ) }), /* @__PURE__ */ e(r, { variant: "body1", children: "This token grants access to your account functions and should be treated like a password." }) ] }) : /* @__PURE__ */ n("div", { children: [ /* @__PURE__ */ e( R, { autoFocus: !0, label: "Token Name", value: d, onChange: I, placeholder: "e.g. Synapse command line access on my laptop", sx: { mb: 2 } } ), /* @__PURE__ */ e(r, { variant: "label", children: "Token Permissions" }), /* @__PURE__ */ n( V, { sx: { gap: 2, my: 1 }, children: [ /* @__PURE__ */ n("div", { children: [ /* @__PURE__ */ e( m, { control: /* @__PURE__ */ e(p, {}), label: a.view.displayName, checked: i, onChange: () => b(!i) } ), /* @__PURE__ */ n( r, { variant: "smallText1", sx: { color: "grey.700" }, children: [ a.view.description, ". Required to use Synapse programmatic clients." ] } ) ] }), /* @__PURE__ */ n("div", { children: [ /* @__PURE__ */ e( m, { control: /* @__PURE__ */ e(p, {}), label: a.download.displayName, checked: c, onChange: () => x(!c) } ), /* @__PURE__ */ e( r, { variant: "smallText1", sx: { color: "grey.700" }, children: a.download.description } ) ] }), /* @__PURE__ */ n("div", { children: [ /* @__PURE__ */ e( m, { control: /* @__PURE__ */ e(p, {}), label: a.modify.displayName, checked: l, onChange: () => w(!l) } ), /* @__PURE__ */ e( r, { variant: "smallText1", sx: { color: "grey.700" }, children: a.modify.description } ) ] }) ] } ), u && /* @__PURE__ */ e(y, { error: u }), v && /* @__PURE__ */ e(y, { error: v.reason }) ] }); return /* @__PURE__ */ e( j, { open: !0, title: "Create New Personal Access Token", content: N ? L : D, confirmButtonProps: { children: t ? "Close" : "Create Token", variant: t ? "outlined" : "contained" }, hasCancelButton: !t, onCancel: h, onConfirm: t ? () => h() : () => { S(); } } ); } export { Z as CreateAccessTokenModal }; //# sourceMappingURL=CreateAccessTokenModal.js.map