synapse-react-client
Version:
[](https://badge.fury.io/js/synapse-react-client) [](https://github.com/prettier/prettie
279 lines (278 loc) • 8.67 kB
JavaScript
import { jsx as s, Fragment as p, jsxs as d } from "react/jsx-runtime";
import * as h from "../../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 "@sage-bionetworks/synapse-types";
import "../../utils/functions/EntityTypeUtils.js";
import { SRC_SIGN_IN_CLASS as g } from "../../utils/SynapseConstants.js";
import { get as u, includes as D } from "lodash-es";
import "@sage-bionetworks/synapse-client/util/synapseClientFetch";
import "../../utils/PermissionLevelToAccessType.js";
import { Component as F } from "react";
import { useSynapseContext as v } from "../../utils/context/SynapseContext.js";
import "use-deep-compare-effect";
import "@tanstack/react-query";
import "@tanstack/query-core";
import "lodash-es/isEmpty";
import "lodash-es/isEqual";
import "lodash-es/xorWith";
import { Button as R } from "@mui/material";
import "@sage-bionetworks/synapse-client";
import "../../utils/types/IsType.js";
import "../../utils/hooks/useCookiePreferences.js";
import "../../utils/hooks/useSourceAppConfigs.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 "react-router";
import E from "@apidevtools/json-schema-ref-parser";
import I from "../FullWidthAlert/FullWidthAlert.js";
import C from "./SynapseForm.js";
import { getFileEntityData as c } from "./SynapseFormUtils.js";
import { StatusEnum as a } from "./types.js";
class w extends F {
constructor(t) {
super(t), this.state = {
isLoading: !0,
formDataId: this.props?.formDataId
};
}
componentDidMount() {
this.getData(this.props.token);
}
componentDidUpdate(t) {
this.props.token !== t.token && this.getData(this.props.token);
}
//same as above but also uses $RefParser to convert json $refs to regular json
getFileEntityDataDereferenced = async (t, e, r) => {
const { version: i, content: o } = await c(
t,
e,
r,
this.onError
), n = await E.dereference(o);
return {
version: i,
content: n
};
};
getData = async (t) => {
if (t)
try {
let e = {};
const r = this.props.dataFileHandleId, i = this.props.submitted;
let o, n, f;
if (r) {
const y = await h.getFileHandleContentFromID(
r,
t
);
e = JSON.parse(y), i && e && e.metadata && ({ formSchemaVersion: o, uiSchemaVersion: n, navSchemaVersion: f } = e.metadata);
}
const S = [
this.getFileEntityDataDereferenced(
t,
this.props.formSchemaEntityId,
o
),
c(
t,
this.props.formUiSchemaEntityId,
n,
this.onError
),
c(
t,
this.props.formNavSchemaEntityId,
f,
this.onError
)
], m = await Promise.all(S);
r || (e = {
metadata: {
formSchemaVersion: m[0].version,
uiSchemaVersion: m[1].version,
navSchemaVersion: m[2].version
}
}), this.setState({
formData: e,
formSchema: m[0].content,
formUiSchema: m[1].content,
formNavSchema: m[2].content,
isLoading: !1
});
} catch (e) {
this.onError({ message: e });
} finally {
this.setState({
isLoading: !1
});
}
};
finishedProcessing = (t, e) => {
this.setState({
isLoading: !1,
notification: { type: t, message: e },
status: t
}), setTimeout(() => {
this.setState({ status: void 0 });
}, 7e3);
};
onError = (t) => {
this.setState({
notification: {
type: a.ERROR,
message: t.message,
name: t.name
},
status: a.ERROR,
isLoading: !1
});
};
submitForm = async (t) => {
await this.saveToFile(t), this.setState({
isLoading: !0
}), await h.submitFormData(this.state.formDataId, this.props.token), this.finishedProcessing(a.SUBMIT_SUCCESS, "File Submitted");
};
createOrUpdateFormDataFile = async (t, e) => {
t = `${t}.json`;
const r = await h.uploadFile(
this.props.token,
t,
e
), i = this.props.formGroupId;
if (!i)
throw console.error("formGroupId must be defined"), new Error("formGroupId must be defined");
try {
const o = r.fileHandleId;
let n;
return this.state.formDataId ? n = await h.updateFormData(
this.state.formDataId,
t,
o,
this.props.token
) : n = await h.createFormData(
i,
t,
o,
this.props.token
), n;
} catch (o) {
throw this.onError(o), o;
}
};
saveToFile = async (t) => {
const e = u(t, this.props.fileNamePath);
if (this.setState({
status: a.PROGRESS,
notification: { type: a.PROGRESS, message: "Progress" },
isLoading: !0
}), !e) {
let r = "File Name";
try {
const i = `${this.props.fileNamePath.replace(
".",
".properties."
)}.title`;
r = u(
this.state.formSchema.properties,
i,
r
);
} finally {
const i = new Error(
`Please Provide the ${r} before saving`
);
this.onError(i);
}
return;
}
try {
const r = new Blob([JSON.stringify(t)], {
type: "text/json"
}), i = await this.createOrUpdateFormDataFile(
e,
r
);
this.setState({
formDataId: i.formDataId
}), this.finishedProcessing(a.SAVE_SUCCESS, "File Saved");
} catch (r) {
this.onError(r);
}
};
isReadyToDisplayForm = (t) => this.state.status !== a.ERROR_CRITICAL && t.formSchema && t.formUiSchema && t.formNavSchema && t.formData;
renderLoader = (t, e) => D([a.ERROR, a.ERROR_CRITICAL], t.status) && e.token && t.isLoading ? /* @__PURE__ */ s("div", { className: "text-center", children: /* @__PURE__ */ s("span", { className: "spinner" }) }) : /* @__PURE__ */ s(p, {});
renderNotification = (t) => t ? t.type === a.ERROR ? /* @__PURE__ */ s(
I,
{
variant: "danger",
title: "Error",
isGlobal: !1,
description: /* @__PURE__ */ d(p, { children: [
t.name,
" ",
t.message
] }),
onClose: () => this.setState({ status: void 0 })
}
) : /* @__PURE__ */ s(p, {}) : /* @__PURE__ */ s(p, {});
renderUnauthenticatedView = (t) => t ? /* @__PURE__ */ s(p, {}) : /* @__PURE__ */ d("div", { className: "panel padding-full unauthenticated text-center", children: [
"Please",
/* @__PURE__ */ s(
R,
{
variant: "text",
color: "primary",
sx: {
mx: 1,
fontSize: "1.4rem",
verticalAlign: "baseline",
textTransform: "none"
},
className: `${g}`,
children: "sign in"
}
),
"to initiate or continue your submission"
] });
render() {
return /* @__PURE__ */ s("div", { className: `theme-${this.props.formClass}`, children: /* @__PURE__ */ d("div", { className: "SRC-ReactJsonForm", children: [
this.renderNotification(this.state.notification),
this.renderLoader(this.state, this.props),
this.renderUnauthenticatedView(this.props.token),
this.isReadyToDisplayForm(this.state) && /* @__PURE__ */ s("div", { children: /* @__PURE__ */ s(
C,
{
schema: this.state.formSchema,
uiSchema: this.state.formUiSchema,
formData: this.state.formData,
navSchema: this.state.formNavSchema,
isWizardMode: this.props.isWizardMode,
formTitle: this.props.formTitle,
formClass: this.props.formClass,
callbackStatus: this.state.status,
onSave: (t) => {
this.saveToFile(t);
},
onSubmit: (t) => {
this.submitForm(t);
},
isSubmitted: this.props.submitted
}
) })
] }) });
}
}
function nt(l) {
const t = v();
return /* @__PURE__ */ s(w, { ...l, token: t.accessToken });
}
export {
nt as SynapseFormWrapper,
nt as default
};
//# sourceMappingURL=SynapseFormWrapper.js.map