@strapi/upload 5.12.0 → 5.12.2

package/dist/admin/components/UploadAssetDialog/AddAssetStep/FromComputerForm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FromComputerForm.js","sources":["../../../../../admin/src/components/UploadAssetDialog/AddAssetStep/FromComputerForm.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useTracking } from '@strapi/admin/strapi-admin';\nimport { Box, Button, Flex, Modal, Typography } from '@strapi/design-system';\nimport { PlusCircle as PicturePlus } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { AssetSource } from '../../../constants';\nimport { getTrad, rawFileToAsset } from '../../../utils';\n\nimport type { FileWithRawFile } from './AddAssetStep';\n\nconst Wrapper = styled(Flex)`\n  flex-direction: column;\n`;\n\nconst IconWrapper = styled.div`\n  font-size: 6rem;\n\n  svg path {\n    fill: ${({ theme }) => theme.colors.primary600};\n  }\n`;\n\nconst MediaBox = styled(Box)`\n  border-style: dashed;\n`;\n\nconst OpaqueBox = styled(Box)`\n  opacity: 0;\n  cursor: pointer;\n`;\n\ninterface FromComputerFormProps {\n  onClose: () => void;\n  onAddAssets: (assets: FileWithRawFile[]) => void;\n  trackedLocation?: string;\n}\n\nexport const FromComputerForm = ({\n  onClose,\n  onAddAssets,\n  trackedLocation,\n}: FromComputerFormProps) => {\n  const { formatMessage } = useIntl();\n  const [dragOver, setDragOver] = React.useState(false);\n  const inputRef = React.useRef<HTMLInputElement>(null);\n  const { trackUsage } = useTracking();\n\n  const handleDragOver = (event: React.DragEvent<HTMLDivElement>) => {\n    event.preventDefault();\n  };\n\n  const handleDragEnter = (event: React.DragEvent<HTMLDivElement>) => {\n    event.preventDefault();\n    setDragOver(true);\n  };\n\n  const handleDragLeave = () => setDragOver(false);\n\n  const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n    e.preventDefault();\n    inputRef.current?.click();\n  };\n\n  const handleChange = () => {\n    const files = inputRef.current?.files;\n    const assets: FileWithRawFile[] = [];\n\n    if (files) {\n      for (let i = 0; i < files.length; i++) {\n        const file = files.item(i);\n        if (file) {\n          const asset = rawFileToAsset(file, AssetSource.Computer);\n          assets.push(asset);\n        }\n      }\n    }\n\n    if (trackedLocation) {\n      trackUsage('didSelectFile', { source: 'computer', location: trackedLocation });\n    }\n\n    onAddAssets(assets);\n  };\n\n  const handleDrop = (e: React.DragEvent<HTMLDivElement>) => {\n    e.preventDefault();\n\n    if (e?.dataTransfer?.files) {\n      const files = e.dataTransfer.files;\n      const assets = [];\n\n      for (let i = 0; i < files.length; i++) {\n        const file = files.item(i);\n        if (file) {\n          const asset = rawFileToAsset(file, AssetSource.Computer);\n          assets.push(asset);\n        }\n      }\n\n      onAddAssets(assets);\n    }\n\n    setDragOver(false);\n  };\n\n  return (\n    <form>\n      <Box paddingLeft={8} paddingRight={8} paddingTop={6} paddingBottom={6}>\n        <label>\n          <MediaBox\n            paddingTop={11}\n            paddingBottom={11}\n            hasRadius\n            justifyContent=\"center\"\n            borderColor={dragOver ? 'primary500' : 'neutral300'}\n            background={dragOver ? 'primary100' : 'neutral100'}\n            position=\"relative\"\n            onDragEnter={handleDragEnter}\n            onDragLeave={handleDragLeave}\n            onDragOver={handleDragOver}\n            onDrop={handleDrop}\n          >\n            <Flex justifyContent=\"center\">\n              <Wrapper>\n                <IconWrapper>\n                  <PicturePlus aria-hidden width=\"3.2rem\" height=\"3.2rem\" />\n                </IconWrapper>\n\n                <Box paddingTop={3} paddingBottom={5}>\n                  <Typography variant=\"delta\" textColor=\"neutral600\" tag=\"span\">\n                    {formatMessage({\n                      id: getTrad('input.label'),\n                      defaultMessage: 'Drag & Drop here or',\n                    })}\n                  </Typography>\n                </Box>\n\n                <OpaqueBox\n                  tag=\"input\"\n                  position=\"absolute\"\n                  left={0}\n                  right={0}\n                  bottom={0}\n                  top={0}\n                  width=\"100%\"\n                  type=\"file\"\n                  multiple\n                  name=\"files\"\n                  aria-label={formatMessage({\n                    id: getTrad('input.label'),\n                    defaultMessage: 'Drag & Drop here or',\n                  })}\n                  tabIndex={-1}\n                  ref={inputRef}\n                  zIndex={1}\n                  onChange={handleChange}\n                />\n\n                <Box position=\"relative\">\n                  <Button type=\"button\" onClick={handleClick}>\n                    {formatMessage({\n                      id: getTrad('input.button.label'),\n                      defaultMessage: 'Browse files',\n                    })}\n                  </Button>\n                </Box>\n              </Wrapper>\n            </Flex>\n          </MediaBox>\n        </label>\n      </Box>\n\n      <Modal.Footer>\n        <Button onClick={onClose} variant=\"tertiary\">\n          {formatMessage({\n            id: 'app.components.Button.cancel',\n            defaultMessage: 'cancel',\n          })}\n        </Button>\n      </Modal.Footer>\n    </form>\n  );\n};\n"],"names":["Wrapper","styled","Flex","IconWrapper","div","theme","colors","primary600","MediaBox","Box","OpaqueBox","FromComputerForm","onClose","onAddAssets","trackedLocation","formatMessage","useIntl","dragOver","setDragOver","React","useState","inputRef","useRef","trackUsage","useTracking","handleDragOver","event","preventDefault","handleDragEnter","handleDragLeave","handleClick","e","current","click","handleChange","files","assets","i","length","file","item","asset","rawFileToAsset","AssetSource","Computer","push","source","location","handleDrop","dataTransfer","_jsxs","form","_jsx","paddingLeft","paddingRight","paddingTop","paddingBottom","label","hasRadius","justifyContent","borderColor","background","position","onDragEnter","onDragLeave","onDragOver","onDrop","PicturePlus","aria-hidden","width","height","Typography","variant","textColor","tag","id","getTrad","defaultMessage","left","right","bottom","top","type","multiple","name","aria-label","tabIndex","ref","zIndex","onChange","Button","onClick","Modal","Footer"],"mappings":"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"}

package/dist/admin/components/UploadAssetDialog/AddAssetStep/FromComputerForm.mjs

@@ -0,0 +1,182 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import * as React from 'react';
+import { useTracking } from '@strapi/admin/strapi-admin';
+import { Flex, Box, Typography, Button, Modal } from '@strapi/design-system';
+import { PlusCircle } from '@strapi/icons';
+import { useIntl } from 'react-intl';
+import { styled } from 'styled-components';
+import { AssetSource } from '../../../constants.mjs';
+import 'byte-size';
+import 'date-fns';
+import { getTrad } from '../../../utils/getTrad.mjs';
+import 'qs';
+import { rawFileToAsset } from '../../../utils/rawFileToAsset.mjs';
+import '../../../utils/urlYupSchema.mjs';
+
+const Wrapper = styled(Flex)`
+  flex-direction: column;
+`;
+const IconWrapper = styled.div`
+  font-size: 6rem;
+
+  svg path {
+    fill: ${({ theme })=>theme.colors.primary600};
+  }
+`;
+const MediaBox = styled(Box)`
+  border-style: dashed;
+`;
+const OpaqueBox = styled(Box)`
+  opacity: 0;
+  cursor: pointer;
+`;
+const FromComputerForm = ({ onClose, onAddAssets, trackedLocation })=>{
+    const { formatMessage } = useIntl();
+    const [dragOver, setDragOver] = React.useState(false);
+    const inputRef = React.useRef(null);
+    const { trackUsage } = useTracking();
+    const handleDragOver = (event)=>{
+        event.preventDefault();
+    };
+    const handleDragEnter = (event)=>{
+        event.preventDefault();
+        setDragOver(true);
+    };
+    const handleDragLeave = ()=>setDragOver(false);
+    const handleClick = (e)=>{
+        e.preventDefault();
+        inputRef.current?.click();
+    };
+    const handleChange = ()=>{
+        const files = inputRef.current?.files;
+        const assets = [];
+        if (files) {
+            for(let i = 0; i < files.length; i++){
+                const file = files.item(i);
+                if (file) {
+                    const asset = rawFileToAsset(file, AssetSource.Computer);
+                    assets.push(asset);
+                }
+            }
+        }
+        if (trackedLocation) {
+            trackUsage('didSelectFile', {
+                source: 'computer',
+                location: trackedLocation
+            });
+        }
+        onAddAssets(assets);
+    };
+    const handleDrop = (e)=>{
+        e.preventDefault();
+        if (e?.dataTransfer?.files) {
+            const files = e.dataTransfer.files;
+            const assets = [];
+            for(let i = 0; i < files.length; i++){
+                const file = files.item(i);
+                if (file) {
+                    const asset = rawFileToAsset(file, AssetSource.Computer);
+                    assets.push(asset);
+                }
+            }
+            onAddAssets(assets);
+        }
+        setDragOver(false);
+    };
+    return /*#__PURE__*/ jsxs("form", {
+        children: [
+            /*#__PURE__*/ jsx(Box, {
+                paddingLeft: 8,
+                paddingRight: 8,
+                paddingTop: 6,
+                paddingBottom: 6,
+                children: /*#__PURE__*/ jsx("label", {
+                    children: /*#__PURE__*/ jsx(MediaBox, {
+                        paddingTop: 11,
+                        paddingBottom: 11,
+                        hasRadius: true,
+                        justifyContent: "center",
+                        borderColor: dragOver ? 'primary500' : 'neutral300',
+                        background: dragOver ? 'primary100' : 'neutral100',
+                        position: "relative",
+                        onDragEnter: handleDragEnter,
+                        onDragLeave: handleDragLeave,
+                        onDragOver: handleDragOver,
+                        onDrop: handleDrop,
+                        children: /*#__PURE__*/ jsx(Flex, {
+                            justifyContent: "center",
+                            children: /*#__PURE__*/ jsxs(Wrapper, {
+                                children: [
+                                    /*#__PURE__*/ jsx(IconWrapper, {
+                                        children: /*#__PURE__*/ jsx(PlusCircle, {
+                                            "aria-hidden": true,
+                                            width: "3.2rem",
+                                            height: "3.2rem"
+                                        })
+                                    }),
+                                    /*#__PURE__*/ jsx(Box, {
+                                        paddingTop: 3,
+                                        paddingBottom: 5,
+                                        children: /*#__PURE__*/ jsx(Typography, {
+                                            variant: "delta",
+                                            textColor: "neutral600",
+                                            tag: "span",
+                                            children: formatMessage({
+                                                id: getTrad('input.label'),
+                                                defaultMessage: 'Drag & Drop here or'
+                                            })
+                                        })
+                                    }),
+                                    /*#__PURE__*/ jsx(OpaqueBox, {
+                                        tag: "input",
+                                        position: "absolute",
+                                        left: 0,
+                                        right: 0,
+                                        bottom: 0,
+                                        top: 0,
+                                        width: "100%",
+                                        type: "file",
+                                        multiple: true,
+                                        name: "files",
+                                        "aria-label": formatMessage({
+                                            id: getTrad('input.label'),
+                                            defaultMessage: 'Drag & Drop here or'
+                                        }),
+                                        tabIndex: -1,
+                                        ref: inputRef,
+                                        zIndex: 1,
+                                        onChange: handleChange
+                                    }),
+                                    /*#__PURE__*/ jsx(Box, {
+                                        position: "relative",
+                                        children: /*#__PURE__*/ jsx(Button, {
+                                            type: "button",
+                                            onClick: handleClick,
+                                            children: formatMessage({
+                                                id: getTrad('input.button.label'),
+                                                defaultMessage: 'Browse files'
+                                            })
+                                        })
+                                    })
+                                ]
+                            })
+                        })
+                    })
+                })
+            }),
+            /*#__PURE__*/ jsx(Modal.Footer, {
+                children: /*#__PURE__*/ jsx(Button, {
+                    onClick: onClose,
+                    variant: "tertiary",
+                    children: formatMessage({
+                        id: 'app.components.Button.cancel',
+                        defaultMessage: 'cancel'
+                    })
+                })
+            })
+        ]
+    });
+};
+
+export { FromComputerForm };
+//# sourceMappingURL=FromComputerForm.mjs.map

package/dist/admin/components/UploadAssetDialog/AddAssetStep/FromComputerForm.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FromComputerForm.mjs","sources":["../../../../../admin/src/components/UploadAssetDialog/AddAssetStep/FromComputerForm.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useTracking } from '@strapi/admin/strapi-admin';\nimport { Box, Button, Flex, Modal, Typography } from '@strapi/design-system';\nimport { PlusCircle as PicturePlus } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { AssetSource } from '../../../constants';\nimport { getTrad, rawFileToAsset } from '../../../utils';\n\nimport type { FileWithRawFile } from './AddAssetStep';\n\nconst Wrapper = styled(Flex)`\n  flex-direction: column;\n`;\n\nconst IconWrapper = styled.div`\n  font-size: 6rem;\n\n  svg path {\n    fill: ${({ theme }) => theme.colors.primary600};\n  }\n`;\n\nconst MediaBox = styled(Box)`\n  border-style: dashed;\n`;\n\nconst OpaqueBox = styled(Box)`\n  opacity: 0;\n  cursor: pointer;\n`;\n\ninterface FromComputerFormProps {\n  onClose: () => void;\n  onAddAssets: (assets: FileWithRawFile[]) => void;\n  trackedLocation?: string;\n}\n\nexport const FromComputerForm = ({\n  onClose,\n  onAddAssets,\n  trackedLocation,\n}: FromComputerFormProps) => {\n  const { formatMessage } = useIntl();\n  const [dragOver, setDragOver] = React.useState(false);\n  const inputRef = React.useRef<HTMLInputElement>(null);\n  const { trackUsage } = useTracking();\n\n  const handleDragOver = (event: React.DragEvent<HTMLDivElement>) => {\n    event.preventDefault();\n  };\n\n  const handleDragEnter = (event: React.DragEvent<HTMLDivElement>) => {\n    event.preventDefault();\n    setDragOver(true);\n  };\n\n  const handleDragLeave = () => setDragOver(false);\n\n  const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n    e.preventDefault();\n    inputRef.current?.click();\n  };\n\n  const handleChange = () => {\n    const files = inputRef.current?.files;\n    const assets: FileWithRawFile[] = [];\n\n    if (files) {\n      for (let i = 0; i < files.length; i++) {\n        const file = files.item(i);\n        if (file) {\n          const asset = rawFileToAsset(file, AssetSource.Computer);\n          assets.push(asset);\n        }\n      }\n    }\n\n    if (trackedLocation) {\n      trackUsage('didSelectFile', { source: 'computer', location: trackedLocation });\n    }\n\n    onAddAssets(assets);\n  };\n\n  const handleDrop = (e: React.DragEvent<HTMLDivElement>) => {\n    e.preventDefault();\n\n    if (e?.dataTransfer?.files) {\n      const files = e.dataTransfer.files;\n      const assets = [];\n\n      for (let i = 0; i < files.length; i++) {\n        const file = files.item(i);\n        if (file) {\n          const asset = rawFileToAsset(file, AssetSource.Computer);\n          assets.push(asset);\n        }\n      }\n\n      onAddAssets(assets);\n    }\n\n    setDragOver(false);\n  };\n\n  return (\n    <form>\n      <Box paddingLeft={8} paddingRight={8} paddingTop={6} paddingBottom={6}>\n        <label>\n          <MediaBox\n            paddingTop={11}\n            paddingBottom={11}\n            hasRadius\n            justifyContent=\"center\"\n            borderColor={dragOver ? 'primary500' : 'neutral300'}\n            background={dragOver ? 'primary100' : 'neutral100'}\n            position=\"relative\"\n            onDragEnter={handleDragEnter}\n            onDragLeave={handleDragLeave}\n            onDragOver={handleDragOver}\n            onDrop={handleDrop}\n          >\n            <Flex justifyContent=\"center\">\n              <Wrapper>\n                <IconWrapper>\n                  <PicturePlus aria-hidden width=\"3.2rem\" height=\"3.2rem\" />\n                </IconWrapper>\n\n                <Box paddingTop={3} paddingBottom={5}>\n                  <Typography variant=\"delta\" textColor=\"neutral600\" tag=\"span\">\n                    {formatMessage({\n                      id: getTrad('input.label'),\n                      defaultMessage: 'Drag & Drop here or',\n                    })}\n                  </Typography>\n                </Box>\n\n                <OpaqueBox\n                  tag=\"input\"\n                  position=\"absolute\"\n                  left={0}\n                  right={0}\n                  bottom={0}\n                  top={0}\n                  width=\"100%\"\n                  type=\"file\"\n                  multiple\n                  name=\"files\"\n                  aria-label={formatMessage({\n                    id: getTrad('input.label'),\n                    defaultMessage: 'Drag & Drop here or',\n                  })}\n                  tabIndex={-1}\n                  ref={inputRef}\n                  zIndex={1}\n                  onChange={handleChange}\n                />\n\n                <Box position=\"relative\">\n                  <Button type=\"button\" onClick={handleClick}>\n                    {formatMessage({\n                      id: getTrad('input.button.label'),\n                      defaultMessage: 'Browse files',\n                    })}\n                  </Button>\n                </Box>\n              </Wrapper>\n            </Flex>\n          </MediaBox>\n        </label>\n      </Box>\n\n      <Modal.Footer>\n        <Button onClick={onClose} variant=\"tertiary\">\n          {formatMessage({\n            id: 'app.components.Button.cancel',\n            defaultMessage: 'cancel',\n          })}\n        </Button>\n      </Modal.Footer>\n    </form>\n  );\n};\n"],"names":["Wrapper","styled","Flex","IconWrapper","div","theme","colors","primary600","MediaBox","Box","OpaqueBox","FromComputerForm","onClose","onAddAssets","trackedLocation","formatMessage","useIntl","dragOver","setDragOver","React","useState","inputRef","useRef","trackUsage","useTracking","handleDragOver","event","preventDefault","handleDragEnter","handleDragLeave","handleClick","e","current","click","handleChange","files","assets","i","length","file","item","asset","rawFileToAsset","AssetSource","Computer","push","source","location","handleDrop","dataTransfer","_jsxs","form","_jsx","paddingLeft","paddingRight","paddingTop","paddingBottom","label","hasRadius","justifyContent","borderColor","background","position","onDragEnter","onDragLeave","onDragOver","onDrop","PicturePlus","aria-hidden","width","height","Typography","variant","textColor","tag","id","getTrad","defaultMessage","left","right","bottom","top","type","multiple","name","aria-label","tabIndex","ref","zIndex","onChange","Button","onClick","Modal","Footer"],"mappings":"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"}

package/dist/admin/components/UploadAssetDialog/AddAssetStep/FromUrlForm.js

@@ -0,0 +1,127 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var strapiAdmin = require('@strapi/admin/strapi-admin');
+var designSystem = require('@strapi/design-system');
+var formik = require('formik');
+var reactIntl = require('react-intl');
+require('byte-size');
+require('date-fns');
+var getTrad = require('../../../utils/getTrad.js');
+require('qs');
+require('../../../constants.js');
+var urlsToAssets = require('../../../utils/urlsToAssets.js');
+var urlYupSchema = require('../../../utils/urlYupSchema.js');
+
+function _interopNamespaceDefault(e) {
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+const FromUrlForm = ({ onClose, onAddAsset, trackedLocation })=>{
+    const [loading, setLoading] = React__namespace.useState(false);
+    const [error, setError] = React__namespace.useState(undefined);
+    const { formatMessage } = reactIntl.useIntl();
+    const { trackUsage } = strapiAdmin.useTracking();
+    const handleSubmit = async ({ urls })=>{
+        setLoading(true);
+        const urlArray = urls.split(/\r?\n/);
+        try {
+            const assets = await urlsToAssets.urlsToAssets(urlArray);
+            if (trackedLocation) {
+                trackUsage('didSelectFile', {
+                    source: 'url',
+                    location: trackedLocation
+                });
+            }
+            // no need to set the loading to false since the component unmounts
+            onAddAsset(assets);
+        } catch (e) {
+            setError(e);
+            setLoading(false);
+        }
+    };
+    return /*#__PURE__*/ jsxRuntime.jsx(formik.Formik, {
+        enableReinitialize: true,
+        initialValues: {
+            urls: ''
+        },
+        onSubmit: handleSubmit,
+        validationSchema: urlYupSchema.urlSchema,
+        validateOnChange: false,
+        children: ({ values, errors, handleChange })=>/*#__PURE__*/ jsxRuntime.jsxs(formik.Form, {
+                noValidate: true,
+                children: [
+                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
+                        paddingLeft: 8,
+                        paddingRight: 8,
+                        paddingBottom: 6,
+                        paddingTop: 6,
+                        children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Field.Root, {
+                            hint: formatMessage({
+                                id: getTrad.getTrad('input.url.description'),
+                                defaultMessage: 'Separate your URL links by a carriage return.'
+                            }),
+                            error: error?.message || (errors.urls ? formatMessage({
+                                id: errors.urls,
+                                defaultMessage: 'An error occured'
+                            }) : undefined),
+                            children: [
+                                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Label, {
+                                    children: formatMessage({
+                                        id: getTrad.getTrad('input.url.label'),
+                                        defaultMessage: 'URL'
+                                    })
+                                }),
+                                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Textarea, {
+                                    name: "urls",
+                                    onChange: handleChange,
+                                    value: values.urls
+                                }),
+                                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Hint, {}),
+                                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Error, {})
+                            ]
+                        })
+                    }),
+                    /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Modal.Footer, {
+                        children: [
+                            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Button, {
+                                onClick: onClose,
+                                variant: "tertiary",
+                                children: formatMessage({
+                                    id: 'app.components.Button.cancel',
+                                    defaultMessage: 'cancel'
+                                })
+                            }),
+                            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Button, {
+                                type: "submit",
+                                loading: loading,
+                                children: formatMessage({
+                                    id: getTrad.getTrad('button.next'),
+                                    defaultMessage: 'Next'
+                                })
+                            })
+                        ]
+                    })
+                ]
+            })
+    });
+};
+
+exports.FromUrlForm = FromUrlForm;
+//# sourceMappingURL=FromUrlForm.js.map

package/dist/admin/components/UploadAssetDialog/AddAssetStep/FromUrlForm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FromUrlForm.js","sources":["../../../../../admin/src/components/UploadAssetDialog/AddAssetStep/FromUrlForm.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useTracking } from '@strapi/admin/strapi-admin';\nimport { Box, Button, Field, Modal, Textarea } from '@strapi/design-system';\nimport { Form, Formik } from 'formik';\nimport { useIntl } from 'react-intl';\n\nimport { getTrad, urlsToAssets, urlSchema } from '../../../utils';\n\nimport type { FileWithRawFile } from './AddAssetStep';\n\ninterface FromUrlFormProps {\n  onClose: () => void;\n  onAddAsset: (assets: FileWithRawFile[]) => void;\n  trackedLocation?: string;\n}\n\nexport const FromUrlForm = ({ onClose, onAddAsset, trackedLocation }: FromUrlFormProps) => {\n  const [loading, setLoading] = React.useState(false);\n  const [error, setError] = React.useState<Error | undefined>(undefined);\n  const { formatMessage } = useIntl();\n  const { trackUsage } = useTracking();\n\n  const handleSubmit = async ({ urls }: { urls: string }) => {\n    setLoading(true);\n    const urlArray = urls.split(/\\r?\\n/);\n    try {\n      const assets: FileWithRawFile[] = await urlsToAssets(urlArray);\n\n      if (trackedLocation) {\n        trackUsage('didSelectFile', { source: 'url', location: trackedLocation });\n      }\n\n      // no need to set the loading to false since the component unmounts\n      onAddAsset(assets);\n    } catch (e: unknown) {\n      setError(e as Error);\n      setLoading(false);\n    }\n  };\n\n  return (\n    <Formik\n      enableReinitialize\n      initialValues={{\n        urls: '',\n      }}\n      onSubmit={handleSubmit}\n      validationSchema={urlSchema}\n      validateOnChange={false}\n    >\n      {({ values, errors, handleChange }) => (\n        <Form noValidate>\n          <Box paddingLeft={8} paddingRight={8} paddingBottom={6} paddingTop={6}>\n            <Field.Root\n              hint={formatMessage({\n                id: getTrad('input.url.description'),\n                defaultMessage: 'Separate your URL links by a carriage return.',\n              })}\n              error={\n                error?.message ||\n                (errors.urls\n                  ? formatMessage({ id: errors.urls, defaultMessage: 'An error occured' })\n                  : undefined)\n              }\n            >\n              <Field.Label>\n                {formatMessage({ id: getTrad('input.url.label'), defaultMessage: 'URL' })}\n              </Field.Label>\n              <Textarea name=\"urls\" onChange={handleChange} value={values.urls} />\n              <Field.Hint />\n              <Field.Error />\n            </Field.Root>\n          </Box>\n\n          <Modal.Footer>\n            <Button onClick={onClose} variant=\"tertiary\">\n              {formatMessage({ id: 'app.components.Button.cancel', defaultMessage: 'cancel' })}\n            </Button>\n            <Button type=\"submit\" loading={loading}>\n              {formatMessage({\n                id: getTrad('button.next'),\n                defaultMessage: 'Next',\n              })}\n            </Button>\n          </Modal.Footer>\n        </Form>\n      )}\n    </Formik>\n  );\n};\n"],"names":["FromUrlForm","onClose","onAddAsset","trackedLocation","loading","setLoading","React","useState","error","setError","undefined","formatMessage","useIntl","trackUsage","useTracking","handleSubmit","urls","urlArray","split","assets","urlsToAssets","source","location","e","_jsx","Formik","enableReinitialize","initialValues","onSubmit","validationSchema","urlSchema","validateOnChange","values","errors","handleChange","_jsxs","Form","noValidate","Box","paddingLeft","paddingRight","paddingBottom","paddingTop","Field","Root","hint","id","getTrad","defaultMessage","message","Label","Textarea","name","onChange","value","Hint","Error","Modal","Footer","Button","onClick","variant","type"],"mappings":"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"}

package/dist/admin/components/UploadAssetDialog/AddAssetStep/FromUrlForm.mjs

@@ -0,0 +1,106 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import * as React from 'react';
+import { useTracking } from '@strapi/admin/strapi-admin';
+import { Box, Field, Textarea, Modal, Button } from '@strapi/design-system';
+import { Formik, Form } from 'formik';
+import { useIntl } from 'react-intl';
+import 'byte-size';
+import 'date-fns';
+import { getTrad } from '../../../utils/getTrad.mjs';
+import 'qs';
+import '../../../constants.mjs';
+import { urlsToAssets } from '../../../utils/urlsToAssets.mjs';
+import { urlSchema } from '../../../utils/urlYupSchema.mjs';
+
+const FromUrlForm = ({ onClose, onAddAsset, trackedLocation })=>{
+    const [loading, setLoading] = React.useState(false);
+    const [error, setError] = React.useState(undefined);
+    const { formatMessage } = useIntl();
+    const { trackUsage } = useTracking();
+    const handleSubmit = async ({ urls })=>{
+        setLoading(true);
+        const urlArray = urls.split(/\r?\n/);
+        try {
+            const assets = await urlsToAssets(urlArray);
+            if (trackedLocation) {
+                trackUsage('didSelectFile', {
+                    source: 'url',
+                    location: trackedLocation
+                });
+            }
+            // no need to set the loading to false since the component unmounts
+            onAddAsset(assets);
+        } catch (e) {
+            setError(e);
+            setLoading(false);
+        }
+    };
+    return /*#__PURE__*/ jsx(Formik, {
+        enableReinitialize: true,
+        initialValues: {
+            urls: ''
+        },
+        onSubmit: handleSubmit,
+        validationSchema: urlSchema,
+        validateOnChange: false,
+        children: ({ values, errors, handleChange })=>/*#__PURE__*/ jsxs(Form, {
+                noValidate: true,
+                children: [
+                    /*#__PURE__*/ jsx(Box, {
+                        paddingLeft: 8,
+                        paddingRight: 8,
+                        paddingBottom: 6,
+                        paddingTop: 6,
+                        children: /*#__PURE__*/ jsxs(Field.Root, {
+                            hint: formatMessage({
+                                id: getTrad('input.url.description'),
+                                defaultMessage: 'Separate your URL links by a carriage return.'
+                            }),
+                            error: error?.message || (errors.urls ? formatMessage({
+                                id: errors.urls,
+                                defaultMessage: 'An error occured'
+                            }) : undefined),
+                            children: [
+                                /*#__PURE__*/ jsx(Field.Label, {
+                                    children: formatMessage({
+                                        id: getTrad('input.url.label'),
+                                        defaultMessage: 'URL'
+                                    })
+                                }),
+                                /*#__PURE__*/ jsx(Textarea, {
+                                    name: "urls",
+                                    onChange: handleChange,
+                                    value: values.urls
+                                }),
+                                /*#__PURE__*/ jsx(Field.Hint, {}),
+                                /*#__PURE__*/ jsx(Field.Error, {})
+                            ]
+                        })
+                    }),
+                    /*#__PURE__*/ jsxs(Modal.Footer, {
+                        children: [
+                            /*#__PURE__*/ jsx(Button, {
+                                onClick: onClose,
+                                variant: "tertiary",
+                                children: formatMessage({
+                                    id: 'app.components.Button.cancel',
+                                    defaultMessage: 'cancel'
+                                })
+                            }),
+                            /*#__PURE__*/ jsx(Button, {
+                                type: "submit",
+                                loading: loading,
+                                children: formatMessage({
+                                    id: getTrad('button.next'),
+                                    defaultMessage: 'Next'
+                                })
+                            })
+                        ]
+                    })
+                ]
+            })
+    });
+};
+
+export { FromUrlForm };
+//# sourceMappingURL=FromUrlForm.mjs.map

package/dist/admin/components/UploadAssetDialog/AddAssetStep/FromUrlForm.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FromUrlForm.mjs","sources":["../../../../../admin/src/components/UploadAssetDialog/AddAssetStep/FromUrlForm.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useTracking } from '@strapi/admin/strapi-admin';\nimport { Box, Button, Field, Modal, Textarea } from '@strapi/design-system';\nimport { Form, Formik } from 'formik';\nimport { useIntl } from 'react-intl';\n\nimport { getTrad, urlsToAssets, urlSchema } from '../../../utils';\n\nimport type { FileWithRawFile } from './AddAssetStep';\n\ninterface FromUrlFormProps {\n  onClose: () => void;\n  onAddAsset: (assets: FileWithRawFile[]) => void;\n  trackedLocation?: string;\n}\n\nexport const FromUrlForm = ({ onClose, onAddAsset, trackedLocation }: FromUrlFormProps) => {\n  const [loading, setLoading] = React.useState(false);\n  const [error, setError] = React.useState<Error | undefined>(undefined);\n  const { formatMessage } = useIntl();\n  const { trackUsage } = useTracking();\n\n  const handleSubmit = async ({ urls }: { urls: string }) => {\n    setLoading(true);\n    const urlArray = urls.split(/\\r?\\n/);\n    try {\n      const assets: FileWithRawFile[] = await urlsToAssets(urlArray);\n\n      if (trackedLocation) {\n        trackUsage('didSelectFile', { source: 'url', location: trackedLocation });\n      }\n\n      // no need to set the loading to false since the component unmounts\n      onAddAsset(assets);\n    } catch (e: unknown) {\n      setError(e as Error);\n      setLoading(false);\n    }\n  };\n\n  return (\n    <Formik\n      enableReinitialize\n      initialValues={{\n        urls: '',\n      }}\n      onSubmit={handleSubmit}\n      validationSchema={urlSchema}\n      validateOnChange={false}\n    >\n      {({ values, errors, handleChange }) => (\n        <Form noValidate>\n          <Box paddingLeft={8} paddingRight={8} paddingBottom={6} paddingTop={6}>\n            <Field.Root\n              hint={formatMessage({\n                id: getTrad('input.url.description'),\n                defaultMessage: 'Separate your URL links by a carriage return.',\n              })}\n              error={\n                error?.message ||\n                (errors.urls\n                  ? formatMessage({ id: errors.urls, defaultMessage: 'An error occured' })\n                  : undefined)\n              }\n            >\n              <Field.Label>\n                {formatMessage({ id: getTrad('input.url.label'), defaultMessage: 'URL' })}\n              </Field.Label>\n              <Textarea name=\"urls\" onChange={handleChange} value={values.urls} />\n              <Field.Hint />\n              <Field.Error />\n            </Field.Root>\n          </Box>\n\n          <Modal.Footer>\n            <Button onClick={onClose} variant=\"tertiary\">\n              {formatMessage({ id: 'app.components.Button.cancel', defaultMessage: 'cancel' })}\n            </Button>\n            <Button type=\"submit\" loading={loading}>\n              {formatMessage({\n                id: getTrad('button.next'),\n                defaultMessage: 'Next',\n              })}\n            </Button>\n          </Modal.Footer>\n        </Form>\n      )}\n    </Formik>\n  );\n};\n"],"names":["FromUrlForm","onClose","onAddAsset","trackedLocation","loading","setLoading","React","useState","error","setError","undefined","formatMessage","useIntl","trackUsage","useTracking","handleSubmit","urls","urlArray","split","assets","urlsToAssets","source","location","e","_jsx","Formik","enableReinitialize","initialValues","onSubmit","validationSchema","urlSchema","validateOnChange","values","errors","handleChange","_jsxs","Form","noValidate","Box","paddingLeft","paddingRight","paddingBottom","paddingTop","Field","Root","hint","id","getTrad","defaultMessage","message","Label","Textarea","name","onChange","value","Hint","Error","Modal","Footer","Button","onClick","variant","type"],"mappings":"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"}