diff --git a/admin/src/containers/ExportPage/index.js b/admin/src/containers/ExportPage/index.js index 316f309..0a02dbf 100644 --- a/admin/src/containers/ExportPage/index.js +++ b/admin/src/containers/ExportPage/index.js @@ -3,108 +3,20 @@ * ExportPage * */ - -import React, { memo, useState, useMemo } from "react"; +import React, { memo, useState } from "react"; import PropTypes from "prop-types"; import { Loader, Block, Row } from "../../components/common"; -import { Select, Label, Button } from "@buffetjs/core"; -import DataViewer from "../../components/DataViewer"; - -import FORMATS from "../../constants/formats"; - -import pluginId from "../../pluginId"; -import { request } from "strapi-helper-plugin"; -import { downloadFile, copyClipboard } from "../../utils/exportUtils"; - -import { Collapse } from "reactstrap"; -import { FilterIcon } from "strapi-helper-plugin"; -import BASE_OPTIONS from "../../constants/options"; -import OptionsExport from "../../components/OptionsExport"; - -const exportFormatsOptions = FORMATS.map(({ name, mimeType }) => ({ - label: name, - value: mimeType, -})); - -function ImportPage({ contentTypes }) { - const [target, setTarget] = useState(null); - const [sourceExports, setSourceExports] = useState(""); - const [exportFormat, setExportFormat] = useState("application/json"); - const [contentToExport, setContentToExport] = useState(""); - - const sourceOptions = useMemo( - () => - [{ label: "Select Export Source", value: "" }].concat( - contentTypes.map(({ uid, info, apiID }) => ({ - label: info.label || apiID, - value: uid, - })) - ), - [contentTypes] - ); - - // Source Options Handler - const handleSelectSourceExports = ({ target: { value } }) => { - setSourceExports(value); - setTarget(contentTypes.find(({ uid }) => uid === value)); - setContentToExport(""); - }; - - // Source Options Handler - const handleSelectExportFormat = ({ target: { value } }) => { - setExportFormat(value); - setContentToExport(""); - }; +import { Select, Label } from "@buffetjs/core"; - // Options to exporting - const [isOptionsOpen, setIsOptionsOpen] = useState(false); - const [options, setOptions] = useState( - BASE_OPTIONS.reduce((acc, { name, defaultValue }) => { - acc[name] = defaultValue; - return acc; - }, {}) - ); +import SingleExport from "../SingleExport"; +import GroupExport from "../GroupExport"; - const handleChangeOptions = (option, value) => { - setOptions({ - ...options, - [option]: value, - }); - }; +function ExportPage({ contentTypes }) { + const [isLoading, setIsLoading] = useState(false); + const [exportType, setExportType] = useState("single"); - // Request to Get Available Content - const [isLoading, setIsLoadig] = useState(false); - const getContent = async () => { - if (sourceExports === "") - return strapi.notification.toggle({ - type: "warning", - message: "export.source.empty", - }); - - try { - setIsLoadig(true); - const { data } = await request(`/${pluginId}/export`, { - method: "POST", - body: { target, type: exportFormat, options }, - }); - - setContentToExport(data); - } catch (error) { - strapi.notification.toggle({ - type: "warning", - message: `export.items.error`, - }); - } - - setIsLoadig(false); - }; - - // Export Options - const handleDownload = () => { - downloadFile(target.info.name, contentToExport, exportFormat); - }; - const handleCopy = () => copyClipboard(contentToExport); + const handleSelectExportType = ({ target: { value } }) => setExportType(value); return ( {isLoading && } +
- + -
-
-
-
- -
- - - -
-
- -
- -
-
-
-
-
-
-
+ + {exportType === 'single' && ( + + )} + {exportType === 'group' && ( + + )}
- ); + ) } -ImportPage.defaultProps = { +ExportPage.defaultProps = { contentTypes: [], }; -ImportPage.propTypes = { +ExportPage.propTypes = { contentTypes: PropTypes.array, }; -export default memo(ImportPage); +export default memo(ExportPage); diff --git a/admin/src/containers/GroupExport/index.js b/admin/src/containers/GroupExport/index.js new file mode 100644 index 0000000..fc9a4f3 --- /dev/null +++ b/admin/src/containers/GroupExport/index.js @@ -0,0 +1,171 @@ +/* + * + * GroupExport + * + */ + +import React, { memo, useState, useMemo } from "react"; +import PropTypes from "prop-types"; + +import { Row } from "../../components/common"; +import { Select, Label, Button, Checkbox } from "@buffetjs/core"; + +import pluginId from "../../pluginId"; +import { request, auth } from "strapi-helper-plugin"; + +import { Collapse } from "reactstrap"; +import { FilterIcon } from "strapi-helper-plugin"; +import OptionsExport from "../../components/OptionsExport"; +import useExportFormats from "../../hooks/useExportFormat"; +import useExportOptions from "../../hooks/useExportOptions"; + +function GroupExport({ contentTypes, setIsLoading }) { + const [targets, setTargets] = useState( + contentTypes.reduce((acc, type) => ({ + ...acc, [type.uid]: { + enabled: true, + label: type.info.label || apiID, + } + }), {}) + ); + + const { + exportFormat, + setExportFormat, + exportFormatsOptions, + } = useExportFormats(); + + const { + options, + isOptionsOpen, + setIsOptionsOpen, + updateOption, + } = useExportOptions(); + + const handleSelectExportFormat = ({ target: { value } }) => { + setExportFormat(value); + }; + + const getContent = async () => { + if (Object.keys(targets).every(uid => !targets[uid].enabled)) + return strapi.notification.toggle({ + type: "warning", + message: "export.source.empty", + }); + + try { + setIsLoading(true); + + const token = auth.getToken(); + + const response = await fetch(`/${pluginId}/export-multi`, { + method: "POST", + headers: { + Authorization: `Bearer ${token}`, + }, + body: JSON.stringify({ + targets: contentTypes.filter(({ uid }) => !!targets[uid].enabled), + type: exportFormat, + options + }), + }); + + if (response.status === 200) { + const blob = await response.blob(); + + const url = window.URL.createObjectURL(blob); + const a = document.createElement('a'); + a.href = url; + a.download = `export.zip`; + document.body.appendChild(a); + a.click(); + a.remove(); + } + } catch (error) { + strapi.notification.toggle({ + type: "warning", + message: `export.items.error`, + }); + } + + setIsLoading(false); + }; + + return ( + <> + +
+ + {Object.keys(targets).map(current => { + return ( +
+ { + setTargets(prevState => ({ + ...prevState, + [current]: { + ...targets[current], + enabled: value, + }, + })); + }} + /> +
+ ); + })} +
+
+ +
+ + +
+
+ +