@bindu-dashing/dam-solution-v2 5.8.6

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,9 @@
+import { FileEntity } from "../../utilities/constants/interface";
+declare const PreviewDetails: ({ file, hasPrev, hasNext, onPrev, onNext, }: {
+    file: FileEntity;
+    hasPrev: boolean;
+    hasNext: boolean;
+    onPrev: () => void;
+    onNext: () => void;
+}) => 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, }) => {
+    const { id } = useAppParams();
+    const mimetype = get(file, "mimetype", "");
+    const fileComponent = useMemo(() => {
+        if (startsWith(mimetype, "image/")) {
+            return _jsx(ImageViewer, { file: file });
+        }
+        else if (startsWith(mimetype, "video/")) {
+            return _jsx(VideoPlayer, { src: get(file, "s3Url") });
+        }
+        // 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,83 @@
+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", { 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 ${selectedFolderId === get(folder, "_id")
+                            ? "md-lib-bg-secondaryHoverColor dark:md-lib-bg-darkSecondaryColor"
+                            : ""}`, 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", title: get(folder, "name", "N/A"), onClick: () => {
+                                    setSelectedFolderId(get(folder, "_id"));
+                                }, children: [_jsx(FaFolderIcon, { className: "md-lib-text-primaryColor" }), _jsx("span", { children: get(folder, "name", "N/A") })] }), !!get(folder, "subFoldersCount") && (_jsx(FiChevronRightIcon, { size: 20, onClick: () => {
+                                    setState((prevState) => (Object.assign(Object.assign({}, prevState), { parentFoldersList: [
+                                            ...prevState.parentFoldersList,
+                                            get(folder, "_id"),
+                                        ] })));
+                                    setSelectedFolderId("");
+                                } }))] }, folder))), _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: "Starred", children: _jsx(RenderTabContent, {}) }, DriveModes.STARRED), _jsx(Tabs.TabPane, { tab: "All locations", children: _jsx(RenderTabContent, {}) }, "all")] }))] }));
+}
+export default FolderTabs;

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

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

package/build/MyDrive/files/MapFile.js

@@ -0,0 +1,217 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { CREATE_FILE_URL, FETCH_ASSETS_URL, } from "../../utilities/constants/apiUrls";
+import { InputSupportedTypes, InputTypes, NotificationStatus, } from "../../utilities/constants/interface";
+import { CREATE_SUCCESS, SOMETHING_WENT_WRONG, UPDATE_SUCCESS, } from "../../utilities/constants/messages";
+import { Button, DatePicker, Drawer, Form, Select, Typography, } from "antd";
+import { first, get, isArray, map, nth } from "lodash";
+import { useEffect, useMemo, useState } from "react";
+import { showNotification } from "../../common/notifications";
+import { generateFoldersQueryKey, invalidateData, QueryKeys, } from "../../utilities/constants/queryKeys";
+import { useMutation, useQueryClient } from "react-query";
+import AssetSelectionFormItem from "./AssetSelectionFormItem";
+import { useDamConfig } from "../../hocs/DamConfigContext";
+import { createApiClient } from "../../hocs/configureAxios";
+import useAppParams from "../../utilities/useAppParams";
+import Metadata from "../fileDetails/Metadata";
+import { updateFile } from "../../react-query/services/file-services";
+import { DATE_FORMAT, DATE_WITH_TIME_FORMAT } from "../../hocs/appConstants";
+import dayjs from "dayjs";
+import { useNavigate } from "react-router-dom";
+import { addQueryParams } from "../../hocs/helpers";
+function MapFile({ open, handleCancel, filesList, fromUpload, }) {
+    const { folderId, type } = useAppParams();
+    const damConfig = useDamConfig();
+    const externalTeams = (damConfig === null || damConfig === void 0 ? void 0 : damConfig.teams) || [];
+    const { rootFolderId, brand } = damConfig;
+    const brandId = get(brand, "_id");
+    const queryClient = useQueryClient();
+    const [form] = Form.useForm();
+    const api = useMemo(() => createApiClient(damConfig), [damConfig]);
+    const file = filesList === null || filesList === void 0 ? void 0 : filesList[0];
+    const navigate = useNavigate();
+    const [state, setState] = useState({
+        loading: false,
+        selectedAssetTemplate: null,
+        metadata: {},
+        selectedTeams: [],
+        assetsLoading: false,
+        assets: [],
+        assetOptions: [],
+    });
+    const { loading, selectedAssetTemplate, assets, assetsLoading, assetOptions, } = state;
+    useEffect(() => {
+        if (brandId) {
+            fetchAssets({});
+        }
+    }, [brandId]);
+    const fetchAssets = (params, isReset) => __awaiter(this, void 0, void 0, function* () {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { assetsLoading: true })));
+        try {
+            const response = yield api.get(`${FETCH_ASSETS_URL.replace(":brandId", brandId)}?${addQueryParams(Object.assign(Object.assign({}, params), { isActive: true, isPagination: false }))}`);
+            setState((prevState) => (Object.assign(Object.assign({}, prevState), { assetOptions: map(get(response, "data.data", []), (asset) => ({
+                    value: get(asset, "_id"),
+                    label: get(asset, "name", "N/A"),
+                })), assets: get(response, "data.data", []), assetsLoading: false })));
+        }
+        catch (error) {
+            setState((prevState) => (Object.assign(Object.assign({}, prevState), { assets: [], assetsLoading: false })));
+            showNotification(get(error, "message", SOMETHING_WENT_WRONG), NotificationStatus.ERROR);
+        }
+    });
+    const metaFields = useMemo(() => get(selectedAssetTemplate, "metadataFields", []), [selectedAssetTemplate]);
+    useEffect(() => {
+        if (file) {
+            form.setFieldsValue({
+                assetId: file === null || file === void 0 ? void 0 : file.assetId,
+                teamIds: file === null || file === void 0 ? void 0 : file.teamIds,
+                expiryDate: (file === null || file === void 0 ? void 0 : file.expiryDate) ? dayjs(file === null || file === void 0 ? void 0 : file.expiryDate) : null,
+            });
+            const selectedAsset = assets.find((asset) => asset._id === (file === null || file === void 0 ? void 0 : file.assetId));
+            setState((prevState) => (Object.assign(Object.assign({}, prevState), { selectedAssetTemplate: selectedAsset })));
+        }
+    }, [file, assets]);
+    const teamOptions = useMemo(() => {
+        return map(externalTeams, (team) => {
+            return {
+                label: (_jsxs(Typography.Text, { style: { display: "flex" }, children: [team === null || team === void 0 ? void 0 : team.id, " ", team === null || team === void 0 ? void 0 : team.name, " ", _jsx("span", { style: { marginLeft: "auto" }, children: team === null || team === void 0 ? void 0 : team.type })] })),
+                value: team === null || team === void 0 ? void 0 : team.id,
+                key: `${team === null || team === void 0 ? void 0 : team.id} - ${team === null || team === void 0 ? void 0 : team.name} - ${team === null || team === void 0 ? void 0 : team.type}`,
+            };
+        });
+    }, [externalTeams]);
+    const updateFileMutation = useMutation({
+        mutationFn: updateFile,
+        onSuccess: (response) => {
+            invalidateData(queryClient, QueryKeys.FILE, get(file, "_id"));
+            invalidateData(queryClient, generateFoldersQueryKey(type), folderId ? folderId : rootFolderId);
+            setState((prevState) => (Object.assign(Object.assign({}, prevState), { editTemplate: false, editForm: false })));
+            showNotification(get(response, "data.message", UPDATE_SUCCESS), NotificationStatus.SUCCESS);
+        },
+        onError: (error) => {
+            setState((prevState) => (Object.assign(Object.assign({}, prevState), { selectedAssetId: get(file, "assetId", undefined) })));
+            showNotification(get(error, "message", SOMETHING_WENT_WRONG), NotificationStatus.ERROR);
+        },
+    });
+    const onUpdateFile = (payload) => {
+        updateFileMutation.mutate({
+            fileId: get(file, "_id", ""),
+            payload,
+            api,
+        });
+    };
+    const handleSubmit = () => {
+        form.validateFields().then((values) => __awaiter(this, void 0, void 0, function* () {
+            setState((prevState) => (Object.assign(Object.assign({}, prevState), { loading: true })));
+            try {
+                const formattedValues = getFormattedMetadata(values);
+                const expiryDate = values.expiryDate || null;
+                delete values.expiryDate;
+                const response = yield api.post(CREATE_FILE_URL, Object.assign(Object.assign({}, values), { folderId: folderId || rootFolderId, files: map(filesList, (file) => {
+                        const fileData = {
+                            name: get(file, "name"),
+                            path: get(file, "filePath"),
+                            size: get(file, "size"),
+                            mimetype: get(file, "mimetype"),
+                            metadata: formattedValues,
+                            teamIds: values.teamIds || [],
+                        };
+                        if (expiryDate) {
+                            fileData["expiryDate"] = dayjs(expiryDate).format(DATE_FORMAT);
+                        }
+                        return fileData;
+                    }) }));
+                showNotification(get(response, "data.message", CREATE_SUCCESS), NotificationStatus.SUCCESS);
+                handleCancel && handleCancel();
+            }
+            catch (error) {
+                showNotification(get(error, "message", SOMETHING_WENT_WRONG), NotificationStatus.ERROR);
+            }
+            finally {
+                invalidateData(queryClient, QueryKeys.FILE, folderId || rootFolderId);
+                invalidateData(queryClient, QueryKeys.FOLDERS, folderId || rootFolderId);
+                setState((prevState) => (Object.assign(Object.assign({}, prevState), { loading: false })));
+            }
+        }));
+    };
+    const getFormattedMetadata = (values) => {
+        const updatedMetadata = values.metadata || {};
+        const formattedValues = Object.assign({}, updatedMetadata);
+        metaFields.forEach((field) => {
+            const defaultName = get(field, "defaultName");
+            const allowTime = get(field, `inputTypeSettings.${InputSupportedTypes.ALLOW_TIME}.allow`, false);
+            const allowMultiple = get(field, `inputTypeSettings.${InputSupportedTypes.ALLOW_MULTIPLE}`, false);
+            const name = get(field, "_id");
+            switch (defaultName) {
+                case InputTypes.DATE_RANGE:
+                case InputTypes.DATE:
+                    const format = allowTime ? DATE_WITH_TIME_FORMAT : DATE_FORMAT;
+                    if (isArray(updatedMetadata[name]) &&
+                        get(updatedMetadata[name], "length") === 2) {
+                        formattedValues[name] = [
+                            first(updatedMetadata[name])
+                                ? dayjs(first(updatedMetadata[name])).format(format)
+                                : null,
+                            nth(updatedMetadata[name], 1)
+                                ? dayjs(nth(updatedMetadata[name], 1)).format(format)
+                                : null,
+                        ];
+                        break;
+                    }
+                    formattedValues[name] = updatedMetadata[name]
+                        ? dayjs(updatedMetadata[name]).format(format)
+                        : null;
+                    break;
+                case InputTypes.CHECKBOX:
+                    formattedValues[name] = updatedMetadata[name] || [];
+                    break;
+                case InputTypes.SELECT:
+                    formattedValues[name] = allowMultiple
+                        ? updatedMetadata[name] || []
+                        : updatedMetadata[name] || undefined;
+                    break;
+            }
+        });
+        // console.log("formateed", formattedValues);
+        return formattedValues;
+    };
+    const handleUpdate = (values) => {
+        // console.log("update", values, metaFields);
+        const formattedValues = getFormattedMetadata(values);
+        const data = {
+            metadata: formattedValues,
+            teamIds: values.teamIds || [],
+        };
+        if (values.expiryDate) {
+            data["expiryDate"] = dayjs(values.expiryDate).format(DATE_FORMAT);
+        }
+        onUpdateFile(data);
+    };
+    const handleAssetTemplateChange = (value) => {
+        const selectedAsset = assets.find((asset) => asset._id === value);
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { selectedAssetTemplate: selectedAsset })));
+    };
+    const onChangeTeams = (value) => {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { selectedTeams: value })));
+    };
+    const getMetadataForm = (_jsxs(Form, { layout: "vertical", form: form, scrollToFirstError: true, onFinish: fromUpload ? handleSubmit : handleUpdate, className: "md-lib-m-2", children: [_jsx(AssetSelectionFormItem, { handleAssetTemplateChange: handleAssetTemplateChange, assetOptions: assetOptions, assetsLoading: assetsLoading }), selectedAssetTemplate && (_jsxs(_Fragment, { children: [_jsx(Form.Item, { name: "teamIds", label: "Teams", children: _jsx(Select, { options: teamOptions, placeholder: "Select teams", mode: "multiple", onChange: (val) => onChangeTeams(val), style: { width: "100%" }, showSearch: true, optionFilterProp: "key" }) }), _jsx(Form.Item, { name: "expiryDate", label: "Expiry Date", children: _jsx(DatePicker, { placeholder: "Expiry Date", style: { width: "100%" } }) }), _jsx(Metadata, { asset: selectedAssetTemplate, form: form, file: (filesList === null || filesList === void 0 ? void 0 : filesList[0]) || null })] })), _jsxs("div", { className: "md-lib-flex md-lib-items-center md-lib-justify-end md-lib-gap-3", children: [_jsx(Button, { onClick: () => {
+                            if (handleCancel) {
+                                handleCancel();
+                            }
+                            else {
+                                navigate(-1);
+                            }
+                        }, children: "Cancel" }), _jsx(Button, { disabled: !selectedAssetTemplate, type: "primary", 
+                        // onClick={handleSubmit}
+                        loading: loading || updateFileMutation.isLoading, htmlType: "submit", children: "Save" })] })] }));
+    return (_jsx(_Fragment, { children: fromUpload ? (_jsx(Drawer, { title: "Metadata", open: open, onClose: handleCancel, maskClosable: false, children: getMetadataForm })) : (_jsxs("div", { className: "md-lib-p-2 md-lib-overflow-y-scroll md-lib-max-h-[calc(100vh-65px)]", children: [_jsx("p", { className: "md-lib-text-lg md-lib-font-semibold", children: "Metadata" }), getMetadataForm] })) }));
+}
+export default MapFile;

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

@@ -0,0 +1,9 @@
+declare function MoveToAnotherFolder({ open, handleCancel, fileIds, entity, folderIds, onCloseSelection, }: {
+    open: boolean;
+    handleCancel: () => void;
+    fileIds?: string[];
+    entity: any;
+    folderIds?: string[];
+    onCloseSelection?: () => void;
+}): JSX.Element;
+export default MoveToAnotherFolder;

package/build/MyDrive/files/MoveToAnotherFolder.js

@@ -0,0 +1,53 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { Modal } from "antd";
+import { generateFoldersQueryKey, invalidateData, } from "../../utilities/constants/queryKeys";
+import { NotificationStatus, } from "../../utilities/constants/interface";
+import { get } from "lodash";
+import { MOVE_SUCCESS, SOMETHING_WENT_WRONG, } from "../../utilities/constants/messages";
+import { useMutation, useQueryClient } from "react-query";
+import { moveFiles } from "../../react-query/services/file-services";
+import { showNotification } from "../../common/notifications";
+import FolderTabs from "./FolderTabs";
+import { useDamConfig } from "../../hocs/DamConfigContext";
+import { createApiClient } from "../../hocs/configureAxios";
+import useAppParams from "../../utilities/useAppParams";
+function MoveToAnotherFolder({ open, handleCancel, fileIds = [], entity, folderIds = [], onCloseSelection, }) {
+    const { folderId, type } = useAppParams();
+    const queryClient = useQueryClient();
+    const damConfig = useDamConfig();
+    const { rootFolderId } = damConfig;
+    const api = useMemo(() => createApiClient(damConfig), [damConfig]);
+    const [state, setState] = useState({
+        selectedFolderId: "",
+    });
+    const { selectedFolderId } = state;
+    const moveFileMutation = useMutation({
+        mutationFn: moveFiles,
+        onSuccess: (response) => {
+            invalidateData(queryClient, generateFoldersQueryKey(type), folderId ? folderId : rootFolderId);
+            handleCancel();
+            onCloseSelection === null || onCloseSelection === void 0 ? void 0 : onCloseSelection();
+            showNotification(get(response, "data.message", MOVE_SUCCESS), NotificationStatus.SUCCESS);
+        },
+        onError: (error) => {
+            showNotification(get(error, "message", SOMETHING_WENT_WRONG), NotificationStatus.ERROR);
+        },
+    });
+    const onMoveFile = () => {
+        moveFileMutation.mutate({
+            payload: {
+                fileIds,
+                folderIds,
+                destinationFolderId: selectedFolderId,
+            },
+            api,
+        });
+    };
+    return (_jsx(Modal, { open: open, onCancel: handleCancel, title: _jsx("div", { className: "md-lib-font-semibold md-lib-text-lg md-lib-truncate md-lib-max-w-7xl", title: get(entity, "name", "N/"), children: entity ? `Move “${get(entity, "name", "N/A")}”` : "Move Items" }), width: 600, okButtonProps: {
+            disabled: !selectedFolderId,
+            loading: moveFileMutation.isLoading,
+            type: selectedFolderId ? "primary" : "default",
+        }, okText: "Move", onOk: onMoveFile, children: _jsx(FolderTabs, { folderIds: folderIds, selectedFolderId: selectedFolderId, setSelectedFolderId: (value) => setState((prevState) => (Object.assign(Object.assign({}, prevState), { selectedFolderId: value }))) }) }));
+}
+export default MoveToAnotherFolder;

package/build/MyDrive/filesListView.d.ts

@@ -0,0 +1,2 @@
+declare const FilesListView: ({ data }: any) => JSX.Element;
+export default FilesListView;

package/build/MyDrive/filesListView.js

@@ -0,0 +1,57 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { Table, Tooltip, Typography } from "antd";
+import dayjs from "dayjs";
+const FilesListView = ({ data }) => {
+    const columns = [
+        {
+            title: "Name",
+            dataIndex: "name",
+            key: "name",
+            width: 150,
+            render: (props) => {
+                return (_jsx(Tooltip, { title: props, children: _jsx(Typography.Text, { ellipsis: { tooltip: true }, children: props }) }));
+            },
+        },
+        {
+            title: "Folder name",
+            dataIndex: "folder_name",
+            key: "createdAt",
+            render: (props) => {
+                return (_jsx(Tooltip, { title: props, children: _jsx(Typography.Text, { ellipsis: { tooltip: true }, children: props }) }));
+            },
+        },
+        {
+            title: "Type",
+            dataIndex: "type",
+            key: "type",
+        },
+        {
+            title: "Created at",
+            dataIndex: "created_at",
+            key: "createdAt",
+            render: (value) => {
+                return dayjs(value).format("MMM D, YYYY HH:MM a");
+            },
+            width: 200
+        },
+        {
+            title: "Updated at",
+            dataIndex: "updated_at",
+            key: "updatedAt",
+            render: (value) => {
+                return dayjs(value).format("MMM D, YYYY HH:MM a");
+            },
+            width: 200
+        },
+        {
+            title: "Thumbnail url",
+            dataIndex: "thumbnail_url",
+            key: "thumbnailUrl",
+            render: (props) => {
+                return (_jsx(Tooltip, { title: props, children: _jsx(Typography.Text, { ellipsis: { tooltip: true }, children: props }) }));
+            },
+        },
+    ];
+    return (_jsx(_Fragment, { children: _jsx(Table, { columns: columns, dataSource: data, scroll: { x: true } }) }));
+};
+export default FilesListView;

package/build/MyDrive/index.d.ts

@@ -0,0 +1,10 @@
+declare function App(props: {
+    accessKey: string;
+    secretKey: string;
+    subdomain: string;
+    teamIds: string[] | number[];
+    styles: Record<string, any>;
+    appType: string;
+    routerVersion: 4 | 5 | 6;
+}): JSX.Element;
+export default App;

package/build/MyDrive/index.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { DamConfigProvider } from "../hocs/DamConfigContext";
+import { MemoryRouter } from "react-router-dom";
+import { ThemeProvider } from "../hocs/ThemeContext";
+import { ThemeModes } from "../utilities/constants/interface";
+import AppRoutes from "./routes";
+import AppProvider from "../hocs/AppProvider";
+import ToastProvider from "../hocs/ToastProvider";
+import { useMemo, useState } from "react";
+import process from "process";
+import { ParamsProvider } from "../utilities/useAppParams";
+function App(props) {
+    const config = useMemo(() => ({
+        damAccessKey: props === null || props === void 0 ? void 0 : props.accessKey,
+        secretKey: props === null || props === void 0 ? void 0 : props.secretKey,
+        subdomain: props === null || props === void 0 ? void 0 : props.subdomain,
+        teamIds: props === null || props === void 0 ? void 0 : props.teamIds,
+        styles: props === null || props === void 0 ? void 0 : props.styles,
+        appType: props === null || props === void 0 ? void 0 : props.appType,
+    }), [
+        props === null || props === void 0 ? void 0 : props.accessKey,
+        props === null || props === void 0 ? void 0 : props.secretKey,
+        props === null || props === void 0 ? void 0 : props.subdomain,
+        props === null || props === void 0 ? void 0 : props.teamIds,
+        props === null || props === void 0 ? void 0 : props.styles,
+        props === null || props === void 0 ? void 0 : props.appType,
+        props === null || props === void 0 ? void 0 : props.routerVersion,
+    ]);
+    const [folders, setFolders] = useState([]);
+    if (typeof window !== "undefined" && !window.process) {
+        window.process = process;
+    }
+    return (_jsx(AppProvider, { children: _jsx(DamConfigProvider, { config: config, children: _jsxs(ThemeProvider, { styles: props === null || props === void 0 ? void 0 : props.styles, sessionTheme: ThemeModes.LIGHT, children: [_jsx(MemoryRouter, { initialEntries: ["/"], children: _jsxs("div", { className: "md-lib-grid md:md-lib-grid-cols-[auto,1fr] md-lib-h-[inherit]", children: [" ", _jsx(ParamsProvider, { children: _jsx(AppRoutes, { setFolders: setFolders, folders: folders, routerVersion: (props === null || props === void 0 ? void 0 : props.routerVersion) || 6 }) })] }) }), _jsx(ToastProvider, {})] }) }) }));
+}
+export default App;

package/build/MyDrive/routes.d.ts

@@ -0,0 +1,7 @@
+type AppRoutesProps = {
+    folders: any[];
+    setFolders: (f: any[]) => void;
+    routerVersion: 4 | 5 | 6;
+};
+export default function AppRoutes({ folders, setFolders, routerVersion, }: AppRoutesProps): JSX.Element;
+export {};