@oneblink/apps-react 8.13.2-beta.2 → 8.13.2-beta.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/downloadable-files/index.js +29 -13
- package/dist/components/downloadable-files/index.js.map +1 -1
- package/dist/components/downloadable-files/resource-components.d.ts +7 -3
- package/dist/components/downloadable-files/resource-components.js +11 -10
- package/dist/components/downloadable-files/resource-components.js.map +1 -1
- package/package.json +2 -2
|
@@ -2,10 +2,11 @@ import * as React from 'react';
|
|
|
2
2
|
import { localisationService, authService, } from '@oneblink/apps';
|
|
3
3
|
import { OnlyPDFDisplay, LoadAndDisplayAttachments, SingleFileDisplay, } from './resource-components';
|
|
4
4
|
import { LayoutProvider } from './LayoutProvider';
|
|
5
|
+
import { useCallback } from 'react';
|
|
5
6
|
function DownloadableFiles({ formSubmissionResult, divider, layout, }) {
|
|
6
|
-
const
|
|
7
|
-
var _a, _b, _c
|
|
8
|
-
const customFileName =
|
|
7
|
+
const getSubmissionPDFFileName = useCallback((pdfConfiguration) => {
|
|
8
|
+
var _a, _b, _c;
|
|
9
|
+
const customFileName = pdfConfiguration === null || pdfConfiguration === void 0 ? void 0 : pdfConfiguration.pdfFileName;
|
|
9
10
|
if (!customFileName) {
|
|
10
11
|
return 'Submission';
|
|
11
12
|
}
|
|
@@ -17,23 +18,38 @@ function DownloadableFiles({ formSubmissionResult, divider, layout, }) {
|
|
|
17
18
|
submissionTimestamp: formSubmissionResult.submissionTimestamp || '',
|
|
18
19
|
externalId: formSubmissionResult.externalId || undefined,
|
|
19
20
|
userProfile: authService.getUserProfile() || undefined,
|
|
20
|
-
task: (
|
|
21
|
-
taskGroup: (
|
|
22
|
-
taskGroupInstance: (
|
|
21
|
+
task: (_a = formSubmissionResult.taskCompletion) === null || _a === void 0 ? void 0 : _a.task,
|
|
22
|
+
taskGroup: (_b = formSubmissionResult.taskCompletion) === null || _b === void 0 ? void 0 : _b.taskGroup,
|
|
23
|
+
taskGroupInstance: (_c = formSubmissionResult.taskCompletion) === null || _c === void 0 ? void 0 : _c.taskGroupInstance,
|
|
23
24
|
}).text;
|
|
24
25
|
}, [formSubmissionResult]);
|
|
25
|
-
const
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
26
|
+
const pdfFileNodes = React.useMemo(() => {
|
|
27
|
+
var _a;
|
|
28
|
+
const allowPDFDownload = (_a = formSubmissionResult.definition.postSubmissionReceipt) === null || _a === void 0 ? void 0 : _a.allowPDFDownload;
|
|
29
|
+
if (!allowPDFDownload) {
|
|
30
|
+
return;
|
|
31
|
+
}
|
|
32
|
+
if (formSubmissionResult.downloadSubmissionPdfs) {
|
|
33
|
+
return formSubmissionResult.downloadSubmissionPdfs.reduce((memo, { id, configuration, url }) => {
|
|
34
|
+
memo.push({
|
|
35
|
+
key: `pdf-file-node-${id}`,
|
|
36
|
+
node: (React.createElement(SingleFileDisplay, { attachment: {
|
|
37
|
+
filename: getSubmissionPDFFileName(configuration),
|
|
38
|
+
signedUrl: url,
|
|
39
|
+
contentType: 'application/pdf',
|
|
40
|
+
}, className: `cypress-receipt-download-pdf-button-${id}` })),
|
|
41
|
+
});
|
|
42
|
+
return memo;
|
|
43
|
+
}, []);
|
|
44
|
+
}
|
|
45
|
+
}, [formSubmissionResult, getSubmissionPDFFileName]);
|
|
46
|
+
if (!formSubmissionResult.attachmentsAccessToken && !pdfFileNodes) {
|
|
31
47
|
return null;
|
|
32
48
|
}
|
|
33
49
|
return (React.createElement("div", { className: "ob-downloadable-files__wrapper" },
|
|
34
50
|
React.createElement(LayoutProvider, { layout: layout !== null && layout !== void 0 ? layout : 'GRID' },
|
|
35
51
|
divider && React.createElement("hr", { className: "divider" }),
|
|
36
|
-
|
|
52
|
+
pdfFileNodes && !formSubmissionResult.attachmentsAccessToken ? (React.createElement(OnlyPDFDisplay, null, pdfFileNodes)) : (React.createElement(LoadAndDisplayAttachments, { formSubmissionResult: formSubmissionResult, pdfFileNodes: pdfFileNodes })))));
|
|
37
53
|
}
|
|
38
54
|
/**
|
|
39
55
|
* Component for rendering post-submission downloadable files such as PDFs and
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/downloadable-files/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAEL,mBAAmB,EACnB,WAAW,GACZ,MAAM,gBAAgB,CAAA;AACvB,OAAO,EACL,cAAc,EACd,yBAAyB,EACzB,iBAAiB,GAClB,MAAM,uBAAuB,CAAA;AAC9B,OAAO,EAAE,cAAc,EAAc,MAAM,kBAAkB,CAAA;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/downloadable-files/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport {\n submissionService,\n localisationService,\n authService,\n} from '@oneblink/apps'\nimport {\n OnlyPDFDisplay,\n LoadAndDisplayAttachments,\n SingleFileDisplay,\n} from './resource-components'\nimport { LayoutProvider, LayoutType } from './LayoutProvider'\nimport { useCallback } from 'react'\nimport { PDFConfiguration } from '@oneblink/types/typescript/submissionEvents'\n\nfunction DownloadableFiles({\n formSubmissionResult,\n divider,\n layout,\n}: {\n /** The form submission with the pdf and/or attachments config on it. */\n formSubmissionResult: submissionService.FormSubmissionResult\n /** Whether to render a divider above the content. */\n divider?: boolean\n /**\n * The layout to use for the downloadable files. Options are `GRID` and\n * `LIST`. Defaults to `GRID`. `GRID` will render files next to each other at\n * some screen sizes. `LIST` will always render each file on a new line.\n */\n layout?: LayoutType\n}) {\n const getSubmissionPDFFileName = useCallback(\n (pdfConfiguration: PDFConfiguration) => {\n const customFileName = pdfConfiguration?.pdfFileName\n if (!customFileName) {\n return 'Submission'\n }\n\n return localisationService.replaceInjectablesWithSubmissionValues(\n customFileName,\n {\n previousApprovalId:\n formSubmissionResult.previousFormSubmissionApprovalId,\n form: formSubmissionResult.definition,\n submission: formSubmissionResult.submission,\n submissionId: formSubmissionResult.submissionId || '',\n submissionTimestamp: formSubmissionResult.submissionTimestamp || '',\n externalId: formSubmissionResult.externalId || undefined,\n userProfile: authService.getUserProfile() || undefined,\n task: formSubmissionResult.taskCompletion?.task,\n taskGroup: formSubmissionResult.taskCompletion?.taskGroup,\n taskGroupInstance:\n formSubmissionResult.taskCompletion?.taskGroupInstance,\n },\n ).text\n },\n [formSubmissionResult],\n )\n\n const pdfFileNodes = React.useMemo(() => {\n const allowPDFDownload =\n formSubmissionResult.definition.postSubmissionReceipt?.allowPDFDownload\n\n if (!allowPDFDownload) {\n return\n }\n\n if (formSubmissionResult.downloadSubmissionPdfs) {\n return formSubmissionResult.downloadSubmissionPdfs.reduce<\n Array<{\n key: string\n node: React.ReactNode\n }>\n >((memo, { id, configuration, url }) => {\n memo.push({\n key: `pdf-file-node-${id}`,\n node: (\n <SingleFileDisplay\n attachment={{\n filename: getSubmissionPDFFileName(configuration),\n signedUrl: url,\n contentType: 'application/pdf',\n }}\n className={`cypress-receipt-download-pdf-button-${id}`}\n />\n ),\n })\n\n return memo\n }, [])\n }\n }, [formSubmissionResult, getSubmissionPDFFileName])\n\n if (!formSubmissionResult.attachmentsAccessToken && !pdfFileNodes) {\n return null\n }\n\n return (\n <div className=\"ob-downloadable-files__wrapper\">\n <LayoutProvider layout={layout ?? 'GRID'}>\n {divider && <hr className=\"divider\" />}\n {pdfFileNodes && !formSubmissionResult.attachmentsAccessToken ? (\n <OnlyPDFDisplay>{pdfFileNodes}</OnlyPDFDisplay>\n ) : (\n <LoadAndDisplayAttachments\n formSubmissionResult={formSubmissionResult}\n pdfFileNodes={pdfFileNodes}\n />\n )}\n </LayoutProvider>\n </div>\n )\n}\n\n/**\n * Component for rendering post-submission downloadable files such as PDFs and\n * attachments. The only thing required is the `formSubmissionResult`.\n *\n * It is also recommended to import the `css` from this library as well.\n *\n * ```js\n * import { DownloadableFiles } from '@oneblink/apps-react'\n * import '@oneblink/apps-react/dist/styles.css'\n * ```\n *\n * #### Example\n *\n * ```tsx\n * import React from 'react'\n * import ReactDOM from 'react-dom'\n * import { DownloadableFiles } from '@oneblink/apps-react'\n * import '@oneblink/apps-react/dist/styles.css'\n *\n * function SubmissionContainer() {\n *\n * const [state, setState] = useState(null)\n *\n * const handleSubmit = React.useCallback(async () => {\n * ...\n * setState(result)\n * }, [])\n *\n * return (\n * <div>\n * ...\n * {state && (\n * <DownloadableFiles formSubmissionResult={state} />\n * )}\n * </div>\n * )\n * }\n *\n * function App() {\n * return (\n * <IsOfflineContextProvider>\n * <SubmissionContainer />\n * </IsOfflineContextProvider>\n * )\n * }\n *\n * const root = document.getElementById('root')\n * if (root) {\n * ReactDOM.render(<App />, root)\n * }\n * ```\n *\n * @param props\n * @returns\n * @group Components\n */\nexport default React.memo(DownloadableFiles)\n"]}
|
|
@@ -1,17 +1,21 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { submissionService } from '@oneblink/apps';
|
|
3
3
|
type Attachment = Awaited<ReturnType<typeof submissionService.getPostSubmissionAttachments>>[number];
|
|
4
|
-
export declare const LoadAndDisplayAttachments: ({
|
|
5
|
-
|
|
4
|
+
export declare const LoadAndDisplayAttachments: ({ pdfFileNodes, formSubmissionResult, }: {
|
|
5
|
+
pdfFileNodes?: PDFFileNode[];
|
|
6
6
|
formSubmissionResult: submissionService.FormSubmissionResult;
|
|
7
7
|
}) => React.JSX.Element;
|
|
8
|
+
export type PDFFileNode = {
|
|
9
|
+
key: string;
|
|
10
|
+
node: React.ReactNode;
|
|
11
|
+
};
|
|
8
12
|
export declare const SingleFileDisplay: ({ attachment, className, }: {
|
|
9
13
|
attachment: Attachment;
|
|
10
14
|
className?: string;
|
|
11
15
|
}) => React.JSX.Element;
|
|
12
16
|
/** Centers the PDF Download button */
|
|
13
17
|
export declare const OnlyPDFDisplay: ({ children, className, }: {
|
|
14
|
-
children:
|
|
18
|
+
children: PDFFileNode[];
|
|
15
19
|
className?: string;
|
|
16
20
|
}) => React.JSX.Element;
|
|
17
21
|
export {};
|
|
@@ -6,7 +6,7 @@ import useLoadDataState from '../../hooks/useLoadDataState';
|
|
|
6
6
|
import OneBlinkAppsErrorOriginalMessage from '../renderer/OneBlinkAppsErrorOriginalMessage';
|
|
7
7
|
import clsx from 'clsx';
|
|
8
8
|
import { useLayout } from './LayoutProvider';
|
|
9
|
-
export const LoadAndDisplayAttachments = ({
|
|
9
|
+
export const LoadAndDisplayAttachments = ({ pdfFileNodes, formSubmissionResult, }) => {
|
|
10
10
|
const loadAttachments = React.useCallback(() => submissionService.getPostSubmissionAttachments(formSubmissionResult), [formSubmissionResult]);
|
|
11
11
|
const [attachmentsState] = useLoadDataState(loadAttachments);
|
|
12
12
|
return (React.createElement(React.Fragment, null,
|
|
@@ -15,25 +15,27 @@ export const LoadAndDisplayAttachments = ({ pdfFileNode, formSubmissionResult, }
|
|
|
15
15
|
React.createElement("div", { className: "ob-list__text-secondary mb-1 has-text-centered" }, "Loading Attachments..."),
|
|
16
16
|
React.createElement(LinearProgress, { className: "ob-progress__downloadable-files" }))),
|
|
17
17
|
React.createElement(Collapse, { in: attachmentsState.status === 'ERROR', unmountOnExit: true },
|
|
18
|
-
|
|
19
|
-
React.createElement(OnlyPDFDisplay, { className: "ob-downloadable-files__error-pdf" },
|
|
18
|
+
!!(pdfFileNodes === null || pdfFileNodes === void 0 ? void 0 : pdfFileNodes.length) && (React.createElement(React.Fragment, null,
|
|
19
|
+
React.createElement(OnlyPDFDisplay, { className: "ob-downloadable-files__error-pdf" }, pdfFileNodes))),
|
|
20
20
|
React.createElement("div", { className: "ob-downloadable-files__error has-text-centered" },
|
|
21
21
|
React.createElement(MaterialIcon, { className: "has-text-danger icon-large" }, "error"),
|
|
22
22
|
React.createElement(OneBlinkAppsErrorOriginalMessage, { error: attachmentsState.status === 'ERROR'
|
|
23
23
|
? attachmentsState.error
|
|
24
24
|
: undefined }))),
|
|
25
25
|
React.createElement(Collapse, { in: attachmentsState.status === 'SUCCESS', unmountOnExit: true },
|
|
26
|
-
React.createElement(DownloadableFilesDisplay, { attachments: attachmentsState.status === 'SUCCESS' ? attachmentsState.result : [],
|
|
26
|
+
React.createElement(DownloadableFilesDisplay, { attachments: attachmentsState.status === 'SUCCESS' ? attachmentsState.result : [], pdfFileNodes: pdfFileNodes }))));
|
|
27
27
|
};
|
|
28
|
-
function DownloadableFilesDisplay({ attachments,
|
|
28
|
+
function DownloadableFilesDisplay({ attachments, pdfFileNodes, }) {
|
|
29
29
|
const layout = useLayout();
|
|
30
30
|
const totalToDisplay = React.useMemo(() => {
|
|
31
|
-
|
|
32
|
-
|
|
31
|
+
var _a;
|
|
32
|
+
return attachments.length + ((_a = pdfFileNodes === null || pdfFileNodes === void 0 ? void 0 : pdfFileNodes.length) !== null && _a !== void 0 ? _a : 0);
|
|
33
|
+
}, [attachments, pdfFileNodes]);
|
|
33
34
|
return (React.createElement(React.Fragment, null,
|
|
34
35
|
React.createElement("div", { className: "ob-downloadable-files__container" },
|
|
35
36
|
React.createElement(Grid, { container: true, spacing: 2, justifyContent: totalToDisplay === 1 ? 'center' : undefined },
|
|
36
|
-
|
|
37
|
+
pdfFileNodes &&
|
|
38
|
+
pdfFileNodes.map(({ node, key }) => (React.createElement(Grid, { item: true, xs: 12, sm: layout === 'GRID' ? 6 : 12, key: key }, node))),
|
|
37
39
|
attachments.map((attachment, index) => (React.createElement(Grid, { item: true, xs: 12, sm: layout === 'GRID' ? 6 : 12, key: index },
|
|
38
40
|
React.createElement(SingleFileDisplay, { attachment: attachment }))))))));
|
|
39
41
|
}
|
|
@@ -63,7 +65,6 @@ export const SingleFileDisplay = ({ attachment, className, }) => {
|
|
|
63
65
|
export const OnlyPDFDisplay = ({ children, className, }) => {
|
|
64
66
|
const layout = useLayout();
|
|
65
67
|
return (React.createElement("div", { className: clsx('ob-downloadable-files__container', className) },
|
|
66
|
-
React.createElement(Grid, { container: true, spacing: 2, justifyContent:
|
|
67
|
-
React.createElement(Grid, { item: true, xs: 12, sm: layout === 'GRID' ? 6 : 12 }, children))));
|
|
68
|
+
React.createElement(Grid, { container: true, spacing: 2, justifyContent: children.length === 1 ? 'center' : undefined }, children.map(({ node, key }) => (React.createElement(Grid, { item: true, xs: 12, sm: layout === 'GRID' ? 6 : 12, key: key }, node))))));
|
|
68
69
|
};
|
|
69
70
|
//# sourceMappingURL=resource-components.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resource-components.js","sourceRoot":"","sources":["../../../src/components/downloadable-files/resource-components.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { Collapse, Grid, LinearProgress, Tooltip } from '@mui/material'\nimport MaterialIcon from '../MaterialIcon'\nimport { submissionService } from '@oneblink/apps'\nimport useLoadDataState from '../../hooks/useLoadDataState'\nimport OneBlinkAppsErrorOriginalMessage from '../renderer/OneBlinkAppsErrorOriginalMessage'\nimport clsx from 'clsx'\nimport { useLayout } from './LayoutProvider'\n\ntype Attachment = Awaited<\n ReturnType<typeof submissionService.getPostSubmissionAttachments>\n>[number]\n\nexport const LoadAndDisplayAttachments = ({\n pdfFileNode,\n formSubmissionResult,\n}: {\n pdfFileNode: React.ReactNode\n formSubmissionResult: submissionService.FormSubmissionResult\n}) => {\n const loadAttachments = React.useCallback(\n () => submissionService.getPostSubmissionAttachments(formSubmissionResult),\n [formSubmissionResult],\n )\n const [attachmentsState] = useLoadDataState(loadAttachments)\n\n return (\n <>\n <Collapse in={attachmentsState.status === 'LOADING'} unmountOnExit>\n <div className=\"ob-downloadable-files__loading\">\n <div className=\"ob-list__text-secondary mb-1 has-text-centered\">\n Loading Attachments...\n </div>\n <LinearProgress className=\"ob-progress__downloadable-files\" />\n </div>\n </Collapse>\n <Collapse in={attachmentsState.status === 'ERROR'} unmountOnExit>\n {pdfFileNode && (\n <>\n <OnlyPDFDisplay className=\"ob-downloadable-files__error-pdf\">\n {pdfFileNode}\n </OnlyPDFDisplay>\n </>\n )}\n\n <div className=\"ob-downloadable-files__error has-text-centered\">\n <MaterialIcon className=\"has-text-danger icon-large\">\n error\n </MaterialIcon>\n <OneBlinkAppsErrorOriginalMessage\n error={\n attachmentsState.status === 'ERROR'\n ? attachmentsState.error\n : undefined\n }\n />\n </div>\n </Collapse>\n <Collapse in={attachmentsState.status === 'SUCCESS'} unmountOnExit>\n <DownloadableFilesDisplay\n attachments={\n attachmentsState.status === 'SUCCESS' ? attachmentsState.result : []\n }\n pdfFileNode={pdfFileNode}\n />\n </Collapse>\n </>\n )\n}\n\ntype DownloadableFilesDisplayProps = {\n attachments: Attachment[]\n pdfFileNode?: React.ReactNode\n}\nfunction DownloadableFilesDisplay({\n attachments,\n pdfFileNode,\n}: DownloadableFilesDisplayProps) {\n const layout = useLayout()\n\n const totalToDisplay = React.useMemo(() => {\n return attachments.length + (pdfFileNode ? 1 : 0)\n }, [attachments, pdfFileNode])\n\n return (\n <>\n <div className=\"ob-downloadable-files__container\">\n <Grid\n container\n spacing={2}\n justifyContent={totalToDisplay === 1 ? 'center' : undefined}\n >\n {pdfFileNode && (\n <Grid item xs={12} sm={layout === 'GRID' ? 6 : 12}>\n {pdfFileNode}\n </Grid>\n )}\n {attachments.map((attachment, index) => (\n <Grid item xs={12} sm={layout === 'GRID' ? 6 : 12} key={index}>\n <SingleFileDisplay attachment={attachment} />\n </Grid>\n ))}\n </Grid>\n </div>\n </>\n )\n}\n\nconst getFileTypeIcon = (type: string) => {\n // Add other appropriate icons for file types here anytime\n if (type.includes('doc')) {\n return 'description'\n }\n return 'attach_file'\n}\n\nexport const SingleFileDisplay = ({\n attachment,\n className,\n}: {\n attachment: Attachment\n className?: string\n}) => {\n const { avatar } = React.useMemo(() => {\n const avatar = () => {\n return attachment.contentType.includes('image') ? (\n <img\n src={attachment.signedUrl}\n alt={attachment.filename}\n className=\"ob-downloadable-files__thumbnail\"\n />\n ) : (\n <MaterialIcon className=\"ob-downloadable-files__icon\">\n {getFileTypeIcon(attachment.contentType)}\n </MaterialIcon>\n )\n }\n\n return { avatar: avatar() }\n }, [attachment.filename, attachment.contentType, attachment.signedUrl])\n\n return (\n <Tooltip title={attachment.filename} arrow>\n <a\n href={attachment.signedUrl}\n target=\"_blank\"\n rel=\"noreferrer\"\n download\n className={clsx('ob-downloadable-files__item', className)}\n >\n {avatar}\n <div className=\"ob-downloadable-files__content\">\n <div className=\"ob-downloadable-files__filename ob-downloadable-files__text\">\n {attachment.filename}\n </div>\n <div className=\"ob-downloadable-files__filetype ob-downloadable-files__text\">\n {attachment.contentType.split('/')[1] || 'Unknown'}\n </div>\n </div>\n <MaterialIcon className=\"ob-downloadable-files__download-icon\">\n download\n </MaterialIcon>\n </a>\n </Tooltip>\n )\n}\n\n/** Centers the PDF Download button */\nexport const OnlyPDFDisplay = ({\n children,\n className,\n}: {\n children: React.ReactNode\n className?: string\n}) => {\n const layout = useLayout()\n\n return (\n <div className={clsx('ob-downloadable-files__container', className)}>\n <Grid container spacing={2} justifyContent=\"center\">\n <Grid item xs={12} sm={layout === 'GRID' ? 6 : 12}>\n {children}\n </Grid>\n </Grid>\n </div>\n )\n}\n"]}
|
|
1
|
+
{"version":3,"file":"resource-components.js","sourceRoot":"","sources":["../../../src/components/downloadable-files/resource-components.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { Collapse, Grid, LinearProgress, Tooltip } from '@mui/material'\nimport MaterialIcon from '../MaterialIcon'\nimport { submissionService } from '@oneblink/apps'\nimport useLoadDataState from '../../hooks/useLoadDataState'\nimport OneBlinkAppsErrorOriginalMessage from '../renderer/OneBlinkAppsErrorOriginalMessage'\nimport clsx from 'clsx'\nimport { useLayout } from './LayoutProvider'\n\ntype Attachment = Awaited<\n ReturnType<typeof submissionService.getPostSubmissionAttachments>\n>[number]\n\nexport const LoadAndDisplayAttachments = ({\n pdfFileNodes,\n formSubmissionResult,\n}: {\n pdfFileNodes?: PDFFileNode[]\n formSubmissionResult: submissionService.FormSubmissionResult\n}) => {\n const loadAttachments = React.useCallback(\n () => submissionService.getPostSubmissionAttachments(formSubmissionResult),\n [formSubmissionResult],\n )\n const [attachmentsState] = useLoadDataState(loadAttachments)\n\n return (\n <>\n <Collapse in={attachmentsState.status === 'LOADING'} unmountOnExit>\n <div className=\"ob-downloadable-files__loading\">\n <div className=\"ob-list__text-secondary mb-1 has-text-centered\">\n Loading Attachments...\n </div>\n <LinearProgress className=\"ob-progress__downloadable-files\" />\n </div>\n </Collapse>\n <Collapse in={attachmentsState.status === 'ERROR'} unmountOnExit>\n {!!pdfFileNodes?.length && (\n <>\n <OnlyPDFDisplay className=\"ob-downloadable-files__error-pdf\">\n {pdfFileNodes}\n </OnlyPDFDisplay>\n </>\n )}\n\n <div className=\"ob-downloadable-files__error has-text-centered\">\n <MaterialIcon className=\"has-text-danger icon-large\">\n error\n </MaterialIcon>\n <OneBlinkAppsErrorOriginalMessage\n error={\n attachmentsState.status === 'ERROR'\n ? attachmentsState.error\n : undefined\n }\n />\n </div>\n </Collapse>\n <Collapse in={attachmentsState.status === 'SUCCESS'} unmountOnExit>\n <DownloadableFilesDisplay\n attachments={\n attachmentsState.status === 'SUCCESS' ? attachmentsState.result : []\n }\n pdfFileNodes={pdfFileNodes}\n />\n </Collapse>\n </>\n )\n}\n\nexport type PDFFileNode = {\n key: string\n node: React.ReactNode\n}\n\ntype DownloadableFilesDisplayProps = {\n attachments: Attachment[]\n pdfFileNodes?: PDFFileNode[]\n}\nfunction DownloadableFilesDisplay({\n attachments,\n pdfFileNodes,\n}: DownloadableFilesDisplayProps) {\n const layout = useLayout()\n\n const totalToDisplay = React.useMemo(() => {\n return attachments.length + (pdfFileNodes?.length ?? 0)\n }, [attachments, pdfFileNodes])\n\n return (\n <>\n <div className=\"ob-downloadable-files__container\">\n <Grid\n container\n spacing={2}\n justifyContent={totalToDisplay === 1 ? 'center' : undefined}\n >\n {pdfFileNodes &&\n pdfFileNodes.map(({ node, key }) => (\n <Grid item xs={12} sm={layout === 'GRID' ? 6 : 12} key={key}>\n {node}\n </Grid>\n ))}\n {attachments.map((attachment, index) => (\n <Grid item xs={12} sm={layout === 'GRID' ? 6 : 12} key={index}>\n <SingleFileDisplay attachment={attachment} />\n </Grid>\n ))}\n </Grid>\n </div>\n </>\n )\n}\n\nconst getFileTypeIcon = (type: string) => {\n // Add other appropriate icons for file types here anytime\n if (type.includes('doc')) {\n return 'description'\n }\n return 'attach_file'\n}\n\nexport const SingleFileDisplay = ({\n attachment,\n className,\n}: {\n attachment: Attachment\n className?: string\n}) => {\n const { avatar } = React.useMemo(() => {\n const avatar = () => {\n return attachment.contentType.includes('image') ? (\n <img\n src={attachment.signedUrl}\n alt={attachment.filename}\n className=\"ob-downloadable-files__thumbnail\"\n />\n ) : (\n <MaterialIcon className=\"ob-downloadable-files__icon\">\n {getFileTypeIcon(attachment.contentType)}\n </MaterialIcon>\n )\n }\n\n return { avatar: avatar() }\n }, [attachment.filename, attachment.contentType, attachment.signedUrl])\n\n return (\n <Tooltip title={attachment.filename} arrow>\n <a\n href={attachment.signedUrl}\n target=\"_blank\"\n rel=\"noreferrer\"\n download\n className={clsx('ob-downloadable-files__item', className)}\n >\n {avatar}\n <div className=\"ob-downloadable-files__content\">\n <div className=\"ob-downloadable-files__filename ob-downloadable-files__text\">\n {attachment.filename}\n </div>\n <div className=\"ob-downloadable-files__filetype ob-downloadable-files__text\">\n {attachment.contentType.split('/')[1] || 'Unknown'}\n </div>\n </div>\n <MaterialIcon className=\"ob-downloadable-files__download-icon\">\n download\n </MaterialIcon>\n </a>\n </Tooltip>\n )\n}\n\n/** Centers the PDF Download button */\nexport const OnlyPDFDisplay = ({\n children,\n className,\n}: {\n children: PDFFileNode[]\n className?: string\n}) => {\n const layout = useLayout()\n\n return (\n <div className={clsx('ob-downloadable-files__container', className)}>\n <Grid\n container\n spacing={2}\n justifyContent={children.length === 1 ? 'center' : undefined}\n >\n {children.map(({ node, key }) => (\n <Grid item xs={12} sm={layout === 'GRID' ? 6 : 12} key={key}>\n {node}\n </Grid>\n ))}\n </Grid>\n </div>\n )\n}\n"]}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@oneblink/apps-react",
|
|
3
3
|
"description": "Helper functions for OneBlink apps in ReactJS.",
|
|
4
|
-
"version": "8.13.2-beta.
|
|
4
|
+
"version": "8.13.2-beta.3",
|
|
5
5
|
"author": "OneBlink <developers@oneblink.io> (https://oneblink.io)",
|
|
6
6
|
"bugs": {
|
|
7
7
|
"url": "https://github.com/oneblink/apps-react/issues"
|
|
@@ -48,7 +48,7 @@
|
|
|
48
48
|
"@mui/lab": "^5.0.0-alpha.152",
|
|
49
49
|
"@mui/material": "^5.15.6",
|
|
50
50
|
"@mui/x-date-pickers": "^6.20.2",
|
|
51
|
-
"@oneblink/apps": "^23.
|
|
51
|
+
"@oneblink/apps": "^23.6.0-beta.2",
|
|
52
52
|
"@oneblink/release-cli": "^3.4.0-beta.1",
|
|
53
53
|
"@oneblink/types": "github:oneblink/types",
|
|
54
54
|
"@types/blueimp-load-image": "^5.16.6",
|