@anji-dashing/dam-solution-v2 5.8.173

package/build/MyDrive/fileDetails/MetaForm.js

@@ -0,0 +1,199 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useMemo } from "react";
+import { Form, Input, InputNumber, DatePicker, Select, Checkbox, Radio, } from "antd";
+import { find, first, get, includes, isArray, isNumber, map, mapValues, nth, } from "lodash";
+import dayjs from "dayjs";
+import { InputSupportedTypes, InputTypes, } from "../../utilities/constants/interface";
+import { INVALID_URL } from "../../utilities/constants/messages";
+import { useQueryClient } from "react-query";
+import { getCurrentBrandUsers } from "../../react-query/hooks/brand-hooks";
+import { getUserAvatar } from "../../settings/getUserAvatar";
+import { useDamConfig } from "../../hocs/DamConfigContext";
+const { RangePicker } = DatePicker;
+export const buildInitialValues = (formData, metaFields, isEditMode) => {
+    const dataWithDefaultValues = metaFields.reduce((acc, field) => {
+        const id = get(field, "_id");
+        const defaultValue = get(field, "defaultValue");
+        if (defaultValue) {
+            acc[id] = defaultValue;
+        }
+        return acc;
+    }, {});
+    return mapValues(isEditMode ? formData : dataWithDefaultValues, (value, key) => {
+        const field = find(metaFields, { _id: key });
+        if (!field)
+            return value;
+        const defaultName = get(field, "defaultName");
+        const inputTypeSettings = get(field, "inputTypeSettings", {});
+        const allowMultiple = get(inputTypeSettings, `${InputSupportedTypes.ALLOW_MULTIPLE}`, false);
+        switch (defaultName) {
+            case InputTypes.DATE:
+                return value ? dayjs(value) : undefined;
+            case InputTypes.DATE_RANGE:
+                return isArray(value) && get(value, "length") === 2
+                    ? [dayjs(first(value)), dayjs(nth(value, 1))]
+                    : undefined;
+            case InputTypes.SELECT:
+                return allowMultiple ? value || [] : value !== null && value !== void 0 ? value : undefined;
+            case InputTypes.CHECKBOX:
+                return value || [];
+            default:
+                return value;
+        }
+    });
+};
+export const getFormItem = (item, fromDefaultValue, userOptions) => {
+    const name = get(item, "_id");
+    const label = get(item, "name");
+    const placeholder = get(item, "placeholder", "");
+    const defaultName = get(item, "defaultName");
+    const settings = get(item, "inputTypeSettings", {});
+    const options = get(item, "options", []);
+    const itemName = fromDefaultValue ? name : ["metadata", name];
+    const rules = fromDefaultValue
+        ? [...get(item, "additionalRules", [])]
+        : [];
+    if (get(item, "isMandatory")) {
+        rules.push({
+            required: true,
+            message: `${label} is required.`,
+        });
+    }
+    // NUMERIC_VALUE
+    if (get(settings, "NUMERIC_VALUE", null) === false) {
+        rules.push({
+            pattern: /^[^0-9]*$/,
+            message: "Numbers are not allowed.",
+        });
+    }
+    // SPECIAL_CHARACTERS
+    if (get(settings, "SPECIAL_CHARACTERS", null) === false) {
+        rules.push({
+            pattern: /^[a-zA-Z0-9\s]*$/,
+            message: "Special characters are not allowed.",
+        });
+    }
+    // CHARACTER_LIMIT
+    let maxLength = 255; // Default to 255 characters
+    if (get(settings, "CHARACTER_LIMIT.allow", null) === true) {
+        const min = get(settings, "CHARACTER_LIMIT.minValue");
+        const max = get(settings, "CHARACTER_LIMIT.maxValue");
+        let message = "";
+        const hasMin = isNumber(min);
+        const hasMax = isNumber(max);
+        if (hasMin && hasMax) {
+            message = `Must be between ${min} and ${max} characters.`;
+        }
+        else if (hasMin && !hasMax) {
+            message = `Minimum ${min} characters required.`;
+        }
+        else if (!hasMin && hasMax) {
+            message = `Maximum ${max} characters allowed.`;
+        }
+        rules.push(Object.assign(Object.assign(Object.assign({}, (hasMin ? { min } : {})), (hasMax ? { max } : {})), { message }));
+        if (hasMax && isNumber(max)) {
+            maxLength = max;
+        }
+    }
+    // REGEX
+    if (get(settings, "REGEX.allow") && get(settings, "REGEX.value")) {
+        const rawRegex = get(settings, "REGEX.value", "/.*/");
+        try {
+            const regex = new RegExp(rawRegex.replace(/\//g, ""));
+            rules.push({
+                pattern: regex,
+                message: `Must match pattern ${rawRegex}`,
+            });
+        }
+        catch (err) {
+            console.warn("Invalid regex: ", rawRegex);
+        }
+    }
+    // VALUE_RANGE
+    if (defaultName === InputTypes.NUMBERS &&
+        get(settings, "VALUE_RANGE.allow")) {
+        const min = get(settings, "VALUE_RANGE.minValue");
+        const max = get(settings, "VALUE_RANGE.maxValue");
+        const hasMin = isNumber(min);
+        const hasMax = isNumber(max);
+        let message = "";
+        if (hasMin && hasMax) {
+            message = `Must be between ${min} and ${max}.`;
+        }
+        else if (hasMin && !hasMax) {
+            message = `Minimum value is ${min}.`;
+        }
+        else if (!hasMin && hasMax) {
+            message = `Maximum value is ${max}.`;
+        }
+        rules.push(Object.assign(Object.assign(Object.assign({ type: "number" }, (hasMin ? { min } : {})), (hasMax ? { max } : {})), { message }));
+    }
+    switch (defaultName) {
+        case InputTypes.TEXT:
+            return (_jsx(Form.Item, { name: itemName, label: label, rules: rules, children: _jsx(Input, { placeholder: placeholder, maxLength: maxLength, showCount: true }) }, name));
+        case InputTypes.PARAGRAPH:
+            return (_jsx(Form.Item, { name: itemName, label: label, rules: rules, children: _jsx(Input.TextArea, { rows: 4, placeholder: placeholder, maxLength: maxLength, showCount: true }) }, name));
+        case InputTypes.DATE_RANGE:
+            return (_jsx(Form.Item, { name: itemName, label: label, rules: rules, children: _jsx(RangePicker, { showTime: !!get(settings, `${InputSupportedTypes.ALLOW_TIME}.allow`), style: { width: "100%" }, placeholder: ["Start", "End"], placement: "bottomLeft" }) }, name));
+        case InputTypes.LINK:
+            rules.push({
+                type: "url",
+                message: INVALID_URL,
+            });
+            return (_jsx(Form.Item, { name: itemName, label: label, rules: rules, children: _jsx(Input, { placeholder: placeholder, maxLength: maxLength, showCount: true }) }, name));
+        case InputTypes.CHECKBOX:
+            return (_jsx(Form.Item, { name: itemName, label: label, children: _jsx(Checkbox.Group, { options: map(options, (opt) => ({
+                        label: get(opt, "label"),
+                        value: get(opt, "value"),
+                    })) }) }, name));
+        case InputTypes.NUMBERS:
+            return (_jsx(Form.Item, { name: itemName, label: label, rules: rules, children: _jsx(InputNumber, { style: { width: "100%" }, placeholder: placeholder }) }, name));
+        case InputTypes.DATE:
+            return (_jsx(Form.Item, { name: itemName, label: label, rules: rules, children: _jsx(DatePicker, { showTime: !!get(settings, `${InputSupportedTypes.ALLOW_TIME}.allow`), style: { width: "100%" }, placeholder: placeholder }) }, name));
+        case InputTypes.PERSON:
+            return (_jsx(Form.Item, { name: itemName, label: label, rules: rules, children: _jsx(Select, { mode: get(settings, InputSupportedTypes.ALLOW_MULTIPLE)
+                        ? "multiple"
+                        : undefined, allowClear: !!get(settings, InputSupportedTypes.ALLOW_CLEAR), showSearch: !!get(settings, InputSupportedTypes.SEARCHABLE), filterOption: (inputValue, option) => {
+                        const name = get(option, "name") || "";
+                        const email = get(option, "email") || "";
+                        if (includes(name.toLowerCase(), inputValue.toLowerCase()) ||
+                            includes(email.toLowerCase(), inputValue.toLowerCase())) {
+                            return true;
+                        }
+                        return false;
+                    }, placeholder: placeholder, options: userOptions, optionFilterProp: "children" }) }, name));
+        case InputTypes.TEAM:
+        case InputTypes.SELECT:
+            return (_jsx(Form.Item, { name: itemName, label: label, rules: rules, children: _jsx(Select, { mode: get(settings, InputSupportedTypes.ALLOW_MULTIPLE)
+                        ? "multiple"
+                        : undefined, allowClear: !!get(settings, InputSupportedTypes.ALLOW_CLEAR), showSearch: !!get(settings, InputSupportedTypes.SEARCHABLE), filterOption: (input, option) => { var _a; return ((_a = option === null || option === void 0 ? void 0 : option.label) === null || _a === void 0 ? void 0 : _a.toLowerCase().indexOf(input.toLowerCase())) >= 0; }, placeholder: placeholder, options: map(options, (opt) => ({
+                        label: get(opt, "label"),
+                        value: get(opt, "value"),
+                    })) }) }, name));
+        case InputTypes.RADIO:
+            return (_jsx(Form.Item, { name: itemName, label: label, children: _jsx(Radio.Group, { options: map(options, (opt) => ({
+                        label: get(opt, "label"),
+                        value: get(opt, "value"),
+                    })) }) }, name));
+        default:
+            return null;
+    }
+};
+const MetaForm = ({ metaFields, metaData, form, isEditMode, }) => {
+    const damConfig = useDamConfig();
+    const { brand, teams } = damConfig;
+    const brandId = get(brand, "_id");
+    const queryClient = useQueryClient();
+    const brandUsers = getCurrentBrandUsers(queryClient, brandId);
+    useEffect(() => {
+        const formData = {
+            metadata: buildInitialValues(metaData, metaFields, isEditMode),
+        };
+        form.setFieldsValue(formData);
+    }, [metaData, metaFields]);
+    const userOptions = useMemo(() => {
+        return map(brandUsers, (user) => getUserAvatar(user));
+    }, [brandUsers, brandId]);
+    return (_jsx(_Fragment, { children: metaFields.map((item) => getFormItem(item, false, userOptions)) }));
+};
+export default MetaForm;

package/build/MyDrive/fileDetails/Metadata.d.ts

@@ -0,0 +1,8 @@
+import { FormInstance } from "antd";
+import { AssetTemplateEntity, FileEntity } from "../../utilities/constants/interface";
+declare const Metadata: ({ file, asset, form, }: {
+    file?: FileEntity;
+    asset: AssetTemplateEntity;
+    form: FormInstance;
+}) => JSX.Element;
+export default Metadata;

package/build/MyDrive/fileDetails/Metadata.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { get, isEmpty } from "lodash";
+import Loader from "../../common/loader/loader";
+import MetaForm from "./MetaForm";
+import { useDamConfig } from "../../hocs/DamConfigContext";
+import { createApiClient } from "../../hocs/configureAxios";
+import { META_DATA_EMPTY_URL } from "../../utilities/constants/imageUrls";
+const Metadata = ({ file, asset, form, }) => {
+    const damConfig = useDamConfig();
+    const api = useMemo(() => createApiClient(damConfig), [damConfig]);
+    const [state, setState] = useState({
+        assetsLoading: false,
+        assets: [],
+        loading: false,
+        templateLoading: false,
+    });
+    const { templateLoading } = state;
+    // useEffect(() => {
+    //   if (assetId) {
+    //     fetchTemplate();
+    //   }
+    // }, [assetId]);
+    // const fetchTemplate = async () => {
+    //   setState((prevState) => ({ ...prevState, templateLoading: true }));
+    //   try {
+    //     const response = await api.get(
+    //       `${FETCH_ASSET_URL.replace(":assetId", assetId)}`
+    //     );
+    //     setState((prevState) => ({
+    //       ...prevState,
+    //       assetTemplate: get(response, "data", {}),
+    //       templateLoading: false,
+    //     }));
+    //     setMetaFields(get(response, "data.metadataFields", []));
+    //   } catch (error) {
+    //     setState((prevState) => ({
+    //       ...prevState,
+    //       assetTemplate: {},
+    //       templateLoading: false,
+    //     }));
+    //     showNotification(
+    //       get(error, "message", SOMETHING_WENT_WRONG),
+    //       NotificationStatus.ERROR
+    //     );
+    //   }
+    // };
+    const metaFields = useMemo(() => get(asset, "metadataFields", []), [asset]);
+    const metaData = useMemo(() => get(file, "metadata", {}), [file]);
+    return (_jsx("div", { className: "", children: templateLoading ? (_jsx(Loader, {})) : (_jsx(_Fragment, { children: isEmpty(metaFields) ? (_jsxs("div", { className: `md-lib-flex md-lib-flex-col md-lib-items-center md-lib-justify-center md-lib-min-h-[calc(100vh-127px)]`, children: [_jsx("img", { src: META_DATA_EMPTY_URL, alt: "No comments", width: 182, height: 114 }), _jsx("p", { className: "md-lib-pt-3 md-lib-font-semibold md-lib-text-textColor dark:md-lib-text-darkTextColor", children: "No metadata has been added yet" })] })) : (_jsx(MetaForm, { metaFields: metaFields, metaData: metaData, form: form, isEditMode: (file === null || file === void 0 ? void 0 : file._id) ? true : false })) })) }));
+};
+export default Metadata;

package/build/MyDrive/fileDetails/PdfOptions.d.ts

@@ -0,0 +1,9 @@
+import { FileEntity, FolderEntity } from "../../utilities/constants/interface";
+declare const PdfOptions: ({ zoom, setZoom, currentPage, totalPages, file, }: {
+    zoom: number;
+    setZoom: (z: number) => void;
+    currentPage: number;
+    totalPages: number;
+    file: FileEntity & FolderEntity;
+}) => JSX.Element;
+export default PdfOptions;

package/build/MyDrive/fileDetails/PdfOptions.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { AiOutlineInfoCircle, AiOutlineZoomIn, AiOutlineZoomOut, } from "react-icons/ai";
+import { FiChevronDown } from "react-icons/fi";
+import { Dropdown, Popover } from "antd";
+import { FileInfoContent } from "../../common/CustomElements";
+import ManageFile from "./ManageFile";
+const AiOutlineInfoCircleIcon = AiOutlineInfoCircle;
+const AiOutlineZoomOutIcon = AiOutlineZoomOut;
+const FiChevronDownIcon = FiChevronDown;
+const AiOutlineZoomInIcon = AiOutlineZoomIn;
+const zoomLevels = [0.1, 0.25, 0.5, 0.75, 1.0];
+const PdfOptions = ({ zoom, setZoom, currentPage, totalPages, file, }) => {
+    const [state, setState] = useState({
+        showFileAccess: false,
+    });
+    const { showFileAccess } = state;
+    const handleZoomChange = ({ key }) => {
+        setZoom(parseFloat(key));
+    };
+    const items = zoomLevels.map((z) => ({
+        key: z.toString(),
+        label: `${Math.round(z * 100)}%`,
+    }));
+    const toggleFileAccess = () => {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { showFileAccess: !prevState.showFileAccess })));
+    };
+    return (_jsxs("div", { className: "md-lib-fixed md-lib-bottom-10 md-lib-left-1/2 -md-lib-translate-x-1/2 md-lib-bg-white dark:md-lib-bg-darkPrimary md-lib-rounded-xl md-lib-shadow-md md-lib-px-4 md-lib-py-2 md-lib-flex md-lib-items-center md-lib-gap-4 md-lib-border md-lib-border-borderColor dark:md-lib-border-darkBorderColor md-lib-z-50", children: [_jsx(Popover, { content: _jsx(FileInfoContent, { file: file }), title: "File Info", placement: "top", children: _jsx("button", { className: "md-lib-p-2 hover:md-lib-bg-secondaryColor hover:dark:md-lib-bg-darkPrimaryHoverColor md-lib-rounded-lg", onClick: toggleFileAccess, children: _jsx(AiOutlineInfoCircleIcon, { className: "md-lib-text-[20px]" }) }) }), _jsx("p", { className: "md-lib-h-10 md-lib-w-10 md-lib-flex md-lib-items-center md-lib-justify-center md-lib-text-base md-lib-text-secondaryTextColor dark:md-lib-text-darkSecondaryTextColor md-lib-border-borderColor md-lib-border md-lib-rounded-lg", children: currentPage + 1 }), _jsx("p", { className: "md-lib-text-textColor dark:md-lib-text-darkTextColor", children: "/" }), _jsx("p", { className: "md-lib-h-10 md-lib-w-10 md-lib-flex md-lib-items-center md-lib-justify-center md-lib-bg-secondaryColor dark:md-lib-bg-darkPrimaryHoverColor md-lib-rounded-lg", children: totalPages }), _jsx("div", { className: "md-lib-w-[1px] md-lib-h-5 md-lib-bg-borderColor dark:md-lib-bg-darkBorderColor" }), _jsx("button", { className: "md-lib-h-10 md-lib-w-10 md-lib-flex md-lib-items-center md-lib-justify-center hover:md-lib-bg-secondaryColor hover:dark:md-lib-bg-darkPrimaryHoverColor md-lib-rounded-lg", onClick: () => setZoom(Math.max(0.5, zoom - 0.1)), disabled: zoom <= 0.1, children: _jsx(AiOutlineZoomOutIcon, { className: "md-lib-text-[20px]" }) }), _jsx(Dropdown, { menu: {
+                    items: items,
+                    onClick: handleZoomChange,
+                    selectable: true,
+                    selectedKeys: [`${Math.round(zoom * 100)}%`],
+                }, trigger: ["click"], placement: "top", children: _jsxs("div", { className: "md-lib-flex md-lib-items-center md-lib-gap-1 md-lib-px-3 md-lib-py-1 md-lib-bg-secondaryColor dark:md-lib-bg-darkPrimaryHoverColor md-lib-rounded-md md-lib-cursor-pointer md-lib-text-sm md-lib-text-textColor dark:md-lib-text-darkTextColor", children: [`${Math.round(zoom * 100)}%`, _jsx(FiChevronDownIcon, { className: "md-lib-text-[16px]" })] }) }), _jsx("button", { className: "md-lib-h-10 md-lib-w-10 md-lib-flex md-lib-items-center md-lib-justify-center hover:md-lib-bg-secondaryColor hover:dark:md-lib-bg-darkPrimaryHoverColor md-lib-rounded-lg", onClick: () => setZoom(Math.min(1.5, zoom + 0.1)), disabled: zoom >= 1.5, children: _jsx(AiOutlineZoomInIcon, { className: "md-lib-text-[20px]" }) }), showFileAccess && (_jsx(ManageFile, { file: file, onClose: toggleFileAccess, open: showFileAccess }))] }));
+};
+export default PdfOptions;

package/build/MyDrive/fileDetails/PdfViewer.d.ts

@@ -0,0 +1,8 @@
+import "@react-pdf-viewer/core/lib/styles/index.css";
+import "@react-pdf-viewer/zoom/lib/styles/index.css";
+import { FileEntity } from "../../utilities/constants/interface";
+declare const PDFViewer: ({ fileUrl, file, }: {
+    fileUrl: string;
+    file: FileEntity;
+}) => JSX.Element;
+export default PDFViewer;

package/build/MyDrive/fileDetails/PdfViewer.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { Worker, Viewer, ScrollMode } from "@react-pdf-viewer/core";
+import { zoomPlugin } from "@react-pdf-viewer/zoom";
+import "@react-pdf-viewer/core/lib/styles/index.css";
+import "@react-pdf-viewer/zoom/lib/styles/index.css";
+import PdfOptions from "./PdfOptions";
+const PDFViewer = ({ fileUrl, file, }) => {
+    const [currentPage, setCurrentPage] = useState(0);
+    const [totalPages, setTotalPages] = useState(0);
+    const [zoom, setZoom] = useState(1.0);
+    const zoomPluginInstance = zoomPlugin();
+    useEffect(() => {
+        zoomPluginInstance.zoomTo(zoom);
+    }, [zoom]);
+    return (_jsxs("div", { className: "md-lib-relative md-lib-w-full", children: [_jsx(Worker, { workerUrl: `https://unpkg.com/pdfjs-dist@3.11.174/build/pdf.worker.min.js`, children: _jsx("div", { style: { height: "calc(100vh - 80px)" }, children: _jsx(Viewer, { fileUrl: fileUrl, scrollMode: ScrollMode.Vertical, plugins: [zoomPluginInstance], onPageChange: (e) => setCurrentPage(e.currentPage), onDocumentLoad: (e) => setTotalPages(e.doc.numPages), initialPage: currentPage, defaultScale: zoom }) }) }), _jsx(PdfOptions, { zoom: zoom, setZoom: setZoom, currentPage: currentPage, totalPages: totalPages, file: file })] }));
+};
+export default PDFViewer;

package/build/MyDrive/fileDetails/Previewdetails.d.ts

@@ -0,0 +1,10 @@
+import { FileEntity } from "../../utilities/constants/interface";
+declare const PreviewDetails: ({ file, hasPrev, hasNext, onPrev, onNext, showFilePreview, }: {
+    file: FileEntity;
+    hasPrev: boolean;
+    hasNext: boolean;
+    onPrev: () => void;
+    onNext: () => void;
+    showFilePreview?: boolean;
+}) => JSX.Element;
+export default PreviewDetails;

package/build/MyDrive/fileDetails/Previewdetails.js

@@ -0,0 +1,53 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Button } from "antd";
+import { GoArrowLeft, GoArrowRight } from "react-icons/go";
+import { get, startsWith } from "lodash";
+import ImageViewer from "./ImageViewer";
+import { useMemo } from "react";
+import VideoPlayer from "./VideoPlayer";
+import useAppParams from "../../utilities/useAppParams";
+// const PDFViewer = lazy(() => import("./PdfViewer"));
+const GoArrowLeftIcon = GoArrowLeft;
+const GoArrowRightIcon = GoArrowRight;
+const PreviewDetails = ({ file, hasPrev, hasNext, onPrev, onNext, showFilePreview, }) => {
+    const { id } = useAppParams();
+    const mimetype = get(file, "mimetype", "");
+    const fileComponent = useMemo(() => {
+        if (startsWith(mimetype, "image/")) {
+            return _jsx(ImageViewer, { file: file, showFilePreview: showFilePreview });
+        }
+        else if (startsWith(mimetype, "video/")) {
+            return _jsx(VideoPlayer, { src: get(file, "s3Url") || get(file, "downloadUrl") || get(file, "thumbnailUrl", "") });
+        }
+        // else if (mimetype === "application/pdf") {
+        //   // return <PDFViewer fileUrl={get(file, "s3Url")} file={file} />;
+        // } else if (
+        //   includes(
+        //     [
+        //       "text/csv",
+        //       "application/vnd.ms-excel",
+        //       "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+        //     ],
+        //     mimetype
+        //   )
+        // ) {
+        //   return (
+        //     <div className="p-4 text-center text-lg text-textColor dark:text-darkTextColor">
+        //       Preview not supported for this file type.{" "}
+        //       <a href={get(file, "s3Url")} className="underline ml-1">
+        //         Download File
+        //       </a>
+        //     </div>
+        //   );
+        // }
+        else {
+            return (_jsxs("div", { className: "p-4 text-center text-lg text-textColor dark:text-darkTextColor", children: ["Preview not supported for this file type.", " ", _jsx("a", { href: get(file, "s3Url"), download: true, className: "underline ml-1", children: "Download File" })] })
+            // <div className="p-4 text-center text-lg text-textColor dark:text-darkTextColor">
+            //   Unsupported file type.
+            // </div>
+            );
+        }
+    }, [mimetype, file]);
+    return (_jsxs(_Fragment, { children: [fileComponent, !id && (_jsxs(_Fragment, { children: [_jsx(Button, { icon: _jsx(GoArrowLeftIcon, { size: 24 }), className: "md-lib-h-11 md-lib-bg-white !md-lib-w-12 md-lib-rounded-lg md-lib-text-textColor dark:md-lib-text-darkTextColor dark:md-lib-bg-darkPrimary md-lib-absolute md-lib-left-6 md-lib-top-1/2 -md-lib-translate-y-1/2", onClick: onPrev, disabled: !hasPrev }), _jsx(Button, { icon: _jsx(GoArrowRightIcon, { size: 24 }), className: "md-lib-h-11 md-lib-bg-white !md-lib-w-12 md-lib-rounded-lg md-lib-text-textColor dark:md-lib-text-darkTextColor dark:md-lib-bg-darkPrimary md-lib-absolute md-lib-right-6 md-lib-top-1/2 -md-lib-translate-y-1/2", onClick: onNext, disabled: !hasNext })] }))] }));
+};
+export default PreviewDetails;

package/build/MyDrive/fileDetails/VideoPlayer.d.ts

@@ -0,0 +1,4 @@
+declare const VideoPlayer: ({ src }: {
+    src: string;
+}) => JSX.Element;
+export default VideoPlayer;

package/build/MyDrive/fileDetails/VideoPlayer.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef, useState } from "react";
+const VideoPlayer = ({ src }) => {
+    const videoRef = useRef(null);
+    const [isPlaying, setIsPlaying] = useState(false);
+    const togglePlay = () => {
+        const video = videoRef.current;
+        if (!video)
+            return;
+        if (video.paused) {
+            video.play();
+            setIsPlaying(true);
+        }
+        else {
+            video.pause();
+            setIsPlaying(false);
+        }
+    };
+    return (_jsxs(_Fragment, { children: [" ", _jsx("div", { className: "md-lib-relative md-lib-max-w-4xl md-lib-w-full md-lib-aspect-video md-lib-mx-auto md-lib-rounded-xl md-lib-overflow-hidden md-lib-bg-black md-lib-shadow-lg", children: _jsx("video", { ref: videoRef, className: "md-lib-w-full md-lib-h-full", src: src, controls: true }) })] }));
+};
+export default VideoPlayer;

package/build/MyDrive/files/AssetSelectionFormItem.d.ts

@@ -0,0 +1,7 @@
+import { AntOptionType } from "../../utilities/constants/interface";
+declare function AssetSelectionFormItem({ handleAssetTemplateChange, assetOptions, assetsLoading, }: {
+    handleAssetTemplateChange: (value: any) => void;
+    assetOptions: AntOptionType[];
+    assetsLoading: boolean;
+}): JSX.Element;
+export default AssetSelectionFormItem;

package/build/MyDrive/files/AssetSelectionFormItem.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ENTITY_REQUIRED } from "../../utilities/constants/messages";
+import { Form, Select } from "antd";
+function AssetSelectionFormItem({ handleAssetTemplateChange, assetOptions, assetsLoading, }) {
+    return (_jsx(Form.Item, { name: "assetId", label: "Choose a template for metadata", rules: [
+            {
+                required: true,
+                message: ENTITY_REQUIRED.replace(":entity", "Asset"),
+            },
+        ], children: _jsx(Select, { placeholder: "Select template", size: "large", showSearch: true, options: assetOptions, allowClear: true, loading: assetsLoading, optionFilterProp: "label", onChange: (val) => {
+                handleAssetTemplateChange(val);
+            } }) }));
+}
+export default AssetSelectionFormItem;

package/build/MyDrive/files/FolderTabs.d.ts

@@ -0,0 +1,6 @@
+declare function FolderTabs({ folderIds, selectedFolderId, setSelectedFolderId, }: {
+    folderIds?: string[];
+    selectedFolderId: string;
+    setSelectedFolderId: (value: string) => void;
+}): JSX.Element;
+export default FolderTabs;

package/build/MyDrive/files/FolderTabs.js

@@ -0,0 +1,90 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { capitalize, filter, first, flatMap, get, includes, initial, isEmpty, last, map, nth, } from "lodash";
+import { useEffect, useMemo, useRef, useState } from "react";
+import { FaArrowLeftLong } from "react-icons/fa6";
+import LoadMoreItems from "../../common/LoadMoreItems";
+import { useFolders } from "../../react-query/services/folder-services";
+import { generateFoldersQueryKey, QueryKeys, } from "../../utilities/constants/queryKeys";
+import { DriveModes } from "../../utilities/constants/interface";
+import { DEFAULT_PAGE } from "../../hocs/appConstants";
+import Loader from "../../common/loader/loader";
+import { SOMETHING_WENT_WRONG } from "../../utilities/constants/messages";
+import AddFolder from "../AddFolder";
+import { FaFolder } from "react-icons/fa";
+import { FiChevronRight } from "react-icons/fi";
+import { Tabs } from "antd";
+import { useDamConfig } from "../../hocs/DamConfigContext";
+import { createApiClient } from "../../hocs/configureAxios";
+import { NOT_FOUND_IMAGE_URL } from "../../utilities/constants/imageUrls";
+const FaFolderIcon = FaFolder;
+const FiChevronRightIcon = FiChevronRight;
+const FaArrowLeftLongIcon = FaArrowLeftLong;
+function FolderTabs({ folderIds = [], selectedFolderId, setSelectedFolderId, }) {
+    const damConfig = useDamConfig();
+    const { rootFolderId } = damConfig;
+    const api = useMemo(() => createApiClient(damConfig), [damConfig]);
+    const [state, setState] = useState({
+        activeTabKey: DriveModes.RECENTS,
+        parentFoldersList: [],
+        openAddFolder: false,
+    });
+    const { activeTabKey, parentFoldersList, openAddFolder } = state;
+    const toggleAddFolder = () => {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { openAddFolder: !prevState.openAddFolder })));
+    };
+    const { data: foldersPaginatedData, isLoading, hasNextPage, fetchNextPage, refetch, isFetching, error, } = useFolders(api, generateFoldersQueryKey(activeTabKey), Object.assign(Object.assign({ page: DEFAULT_PAGE }, (activeTabKey
+        ? {
+            category: activeTabKey && isEmpty(parentFoldersList)
+                ? activeTabKey
+                : QueryKeys.ALL,
+        }
+        : {})), { includeFiles: false, includeSubFoldersCount: true, fetchMainFolders: true }), last(parentFoldersList) ? last(parentFoldersList) : rootFolderId);
+    const folders = useMemo(() => {
+        return !!foldersPaginatedData
+            ? flatMap(get(foldersPaginatedData, "pages"), "folders")
+            : [];
+    }, [foldersPaginatedData]);
+    const prevActiveKeyRef = useRef();
+    useEffect(() => {
+        const prevActiveKeyState = prevActiveKeyRef.current;
+        const shouldRefetch = activeTabKey !== prevActiveKeyState;
+        if (shouldRefetch) {
+            refetch();
+        }
+        prevActiveKeyRef.current = activeTabKey;
+    }, [activeTabKey, prevActiveKeyRef]);
+    function RenderTabContent() {
+        return (_jsx(_Fragment, { children: isLoading ? (_jsx(Loader, {})) : isEmpty(folders) ? (_jsxs("div", { className: "md-lib-flex md-lib-flex-col md-lib-items-center md-lib-justify-center ", children: [_jsx("img", { src: NOT_FOUND_IMAGE_URL, alt: "Not Found", width: 300, height: 300 }), _jsx("p", { className: "md-lib-mt-3 md-lib-text-sm md-lib-font-semibold", children: error
+                            ? get(error, "message", SOMETHING_WENT_WRONG)
+                            : includes(Object.values(DriveModes), activeTabKey)
+                                ? "No data found"
+                                : "No files has been created yet" }), includes(Object.values(DriveModes), activeTabKey) && (_jsx(AddFolder, { open: openAddFolder, handleCancel: toggleAddFolder }))] })) : (_jsxs("div", { className: "md-lib-h-[300px] md-lib-overflow-y-auto", children: [map(isEmpty(folderIds)
+                        ? folders
+                        : filter(folders, (fol) => !includes(folderIds, get(fol, "_id"))), (folder) => (_jsxs("div", { role: "button", tabIndex: 0, className: `md-lib-flex md-lib-justify-between md-lib-items-center md-lib-px-6 md-lib-py-3 md-lib-rounded-md hover:md-lib-bg-secondaryHoverColor dark:hover:md-lib-bg-darkSecondaryColor md-lib-cursor-pointer md-lib-w-full ${selectedFolderId === get(folder, "_id")
+                            ? "md-lib-bg-secondaryHoverColor dark:md-lib-bg-darkSecondaryColor"
+                            : ""}`, onClick: () => {
+                            setSelectedFolderId(get(folder, "_id") || "");
+                        }, onKeyDown: (e) => {
+                            if (e.key === "Enter" || e.key === " ") {
+                                e.preventDefault();
+                                setSelectedFolderId(get(folder, "_id") || "");
+                            }
+                        }, children: [_jsxs("div", { className: "md-lib-flex md-lib-items-center md-lib-gap-2 md-lib-text-textColor dark:md-lib-text-darkTextColor md-lib-truncate md-lib-max-w-64 md-lib-min-w-0", title: get(folder, "name", "N/A"), children: [_jsx(FaFolderIcon, { className: "md-lib-text-primaryColor md-lib-shrink-0" }), _jsx("span", { className: "md-lib-truncate", children: get(folder, "name", "N/A") })] }), !!get(folder, "subFoldersCount") && (_jsx(FiChevronRightIcon, { size: 20, className: "md-lib-shrink-0", onClick: (e) => {
+                                    e.stopPropagation();
+                                    const folderId = get(folder, "_id");
+                                    setState((prevState) => (Object.assign(Object.assign({}, prevState), { parentFoldersList: [
+                                            ...prevState.parentFoldersList,
+                                            folderId,
+                                        ] })));
+                                    setSelectedFolderId(folderId || "");
+                                } }))] }, get(folder, "_id")))), _jsx(LoadMoreItems, { hasNextPage: !!hasNextPage, fetchNextPage: fetchNextPage, isItemsFetching: isFetching })] })) }));
+    }
+    const currentFolder = useMemo(() => {
+        return get(first(get(foldersPaginatedData, "pages", [])), "folder", {});
+    }, [foldersPaginatedData]);
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "md-lib-text-sm md-lib-mb-4 md-lib-text-secondaryTextColor", children: ["Current location:", " ", _jsx("span", { className: "font-semibold truncate ", title: get(currentFolder, "name", capitalize(activeTabKey)), children: get(currentFolder, "name", capitalize(activeTabKey)) })] }), get(parentFoldersList, "length") ? (_jsxs("div", { className: "md-lib-flex md-lib-flex-col md-lib-gap-3", children: [_jsxs("div", { className: "md-lib-flex md-lib-gap-4 md-lib-cursor-pointer md-lib-items-center", onClick: () => {
+                            setState((prevState) => (Object.assign(Object.assign({}, prevState), { parentFoldersList: initial(prevState.parentFoldersList) })));
+                            setSelectedFolderId("");
+                        }, children: [_jsx(FaArrowLeftLongIcon, {}), _jsx("span", { className: "md-lib-font-semibold md-lib-truncate md-lib-max-w-7xl", title: get(nth(get(currentFolder, "tree", []), get(currentFolder, "tree.length") - 1), "name", capitalize(activeTabKey)), children: get(nth(get(currentFolder, "tree", []), get(currentFolder, "tree.length") - 1), "name", capitalize(activeTabKey)) })] }), _jsx(RenderTabContent, {})] })) : (_jsxs(Tabs, { activeKey: activeTabKey, onChange: (key) => setState((prev) => (Object.assign(Object.assign({}, prev), { activeTabKey: key }))), children: [_jsx(Tabs.TabPane, { tab: "Suggested", children: _jsx(RenderTabContent, {}) }, DriveModes.RECENTS), _jsx(Tabs.TabPane, { tab: "All locations", children: _jsx(RenderTabContent, {}) }, "all")] }))] }));
+}
+export default FolderTabs;

package/build/MyDrive/files/MapFile.d.ts

@@ -0,0 +1,9 @@
+import { FileEntity, ResponseFile } from "../../utilities/constants/interface";
+declare function MapFile({ open, handleCancel, filesList, fromUpload, parentFolderId, }: {
+    open?: boolean;
+    handleCancel?: (shouldDelete?: boolean) => void;
+    filesList: ResponseFile[] | FileEntity[];
+    fromUpload?: boolean;
+    parentFolderId?: string;
+}): JSX.Element;
+export default MapFile;