@bindu-dashing/dam-solution-v2 5.8.6

package/build/ImagePickerFilters/ImagePickerFiltersComponent.js

@@ -0,0 +1,223 @@
+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 { NotificationStatus } from "../utilities/constants/interface";
+import { get } from "lodash";
+import { useEffect, useMemo, useState } from "react";
+import { useDamConfig } from "../hocs/DamConfigContext";
+import { FETCH_ASSET_URL, FETCH_IMAGEPICKER_URL, FETCH_META_FIELD_FILES_URL, FETCH_META_FIELD_OPTIONS_URL, } from "../utilities/constants/apiUrls";
+import { createApiClient } from "../hocs/configureAxios";
+import { Empty, Form, Select, Spin } from "antd";
+import { showNotification } from "../common/notifications";
+import { SOMETHING_WENT_WRONG } from "../utilities/constants/messages";
+import { getFormattedValue } from "../hocs/helpers";
+function ImagePickerFiltersComponent({ id, onSelect, url, value, fileId, }) {
+    var _a, _b, _c;
+    const damConfig = useDamConfig();
+    const { brand } = damConfig;
+    const [state, setState] = useState({
+        assetType: null,
+        imagePicker: {},
+        loading: false,
+        fieldOptions: {},
+        filters: {},
+        fieldName: "",
+        files: [],
+        selectedFileUrl: null,
+        selectedFileId: null,
+        loaderType: "",
+        selectedFieldName: "",
+    });
+    const api = useMemo(() => createApiClient(damConfig), [damConfig]);
+    useEffect(() => {
+        if (id && brand) {
+            getImagePicker();
+        }
+    }, [id, brand]);
+    const getImagePicker = () => __awaiter(this, void 0, void 0, function* () {
+        try {
+            setState((prevState) => (Object.assign(Object.assign({}, prevState), { loading: true, loaderType: "IMAGE_PICKER" })));
+            const response = yield api.get(FETCH_IMAGEPICKER_URL.replace(":id", id));
+            const assetId = get(response, "data.assetId", "");
+            const assetTemplateResponse = yield api.get(FETCH_ASSET_URL.replace(":assetId", assetId || ""));
+            setState((prevState) => (Object.assign(Object.assign({}, prevState), { loading: false, loaderType: "", imagePicker: get(response, "data", {}), assetType: get(assetTemplateResponse, "data", {}) })));
+        }
+        catch (err) {
+            console.log("Error while fetching image picker", err);
+        }
+    });
+    const fields = ((_a = state === null || state === void 0 ? void 0 : state.assetType) === null || _a === void 0 ? void 0 : _a.metadataFields) || [];
+    const onFilter = (filters_1, fieldOptions_1, nextField_1, ...args_1) => __awaiter(this, [filters_1, fieldOptions_1, nextField_1, ...args_1], void 0, function* (filters, fieldOptions, nextField, fromValue = false) {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+        const filtersObj = Object.keys(filters).reduce((acc, key) => {
+            const value = (filters === null || filters === void 0 ? void 0 : filters[key]) || "";
+            if (value) {
+                acc = Object.assign(Object.assign({}, acc), { [key]: value });
+            }
+            return acc;
+        }, {});
+        setState((prevState) => {
+            return Object.assign(Object.assign({}, prevState), { filters,
+                fieldOptions, loading: true, fieldName: nextField, selectedFieldName: null });
+        });
+        try {
+            const payload = {
+                distinctValuesKey: nextField,
+                filters: filtersObj,
+            };
+            const response = !nextField
+                ? yield api.put(FETCH_META_FIELD_FILES_URL.replace(":id", get(state, "imagePicker._id")), { filters })
+                : yield api.put(FETCH_META_FIELD_OPTIONS_URL.replace(":id", get(state, "imagePicker._id")), payload);
+            // console.log(response, nextField);
+            const filesResponse = ((_b = (_a = response === null || response === void 0 ? void 0 : response.data) === null || _a === void 0 ? void 0 : _a.values) === null || _b === void 0 ? void 0 : _b.length) == 0
+                ? yield api.put(FETCH_META_FIELD_FILES_URL.replace(":id", get(state, "imagePicker._id")), { filters })
+                : null;
+            const currentFieldOptions = Object.assign(Object.assign({}, fieldOptions), { [nextField]: ((_c = response === null || response === void 0 ? void 0 : response.data) === null || _c === void 0 ? void 0 : _c.values) || [] });
+            const finalState = !nextField || ((_e = (_d = response === null || response === void 0 ? void 0 : response.data) === null || _d === void 0 ? void 0 : _d.values) === null || _e === void 0 ? void 0 : _e.length) == 0
+                ? {
+                    files: ((_g = (_f = response === null || response === void 0 ? void 0 : response.data) === null || _f === void 0 ? void 0 : _f.values) === null || _g === void 0 ? void 0 : _g.length) == 0
+                        ? (filesResponse === null || filesResponse === void 0 ? void 0 : filesResponse.data) || []
+                        : !nextField
+                            ? (response === null || response === void 0 ? void 0 : response.data) || []
+                            : [],
+                    loading: false,
+                }
+                : {
+                    fieldOptions: currentFieldOptions,
+                    loading: false,
+                    fieldName: "",
+                };
+            if (!fromValue) {
+                finalState["selectedFileId"] = null;
+                finalState["selectedFileUrl"] = null;
+            }
+            else if (nextField == "") {
+                const selectedFile = (_h = response === null || response === void 0 ? void 0 : response.data) === null || _h === void 0 ? void 0 : _h.find((item) => item._id == fileId);
+                finalState["selectedFileId"] = selectedFile === null || selectedFile === void 0 ? void 0 : selectedFile._id;
+                finalState["selectedFileUrl"] = selectedFile === null || selectedFile === void 0 ? void 0 : selectedFile.thumbnailUrl;
+            }
+            setState((prevState) => {
+                return Object.assign(Object.assign({}, prevState), finalState);
+            });
+            if (fromValue && nextField !== "") {
+                const index = fields === null || fields === void 0 ? void 0 : fields.findIndex((field) => {
+                    return field._id == nextField;
+                });
+                const nextNextField = fields.length !== index + 1 ? ((_j = fields === null || fields === void 0 ? void 0 : fields[index + 1]) === null || _j === void 0 ? void 0 : _j._id) || "" : "";
+                const prevFields = fields.slice(0, index + 1);
+                const allFilters = {};
+                const allFieldOptions = {};
+                prevFields.forEach((item) => {
+                    allFilters[item._id] = filters === null || filters === void 0 ? void 0 : filters[item._id];
+                    allFieldOptions[item._id] = currentFieldOptions === null || currentFieldOptions === void 0 ? void 0 : currentFieldOptions[item._id];
+                });
+                allFilters[nextField] = value === null || value === void 0 ? void 0 : value[nextField];
+                if (((_k = response === null || response === void 0 ? void 0 : response.data) === null || _k === void 0 ? void 0 : _k.length) == 0) {
+                    onFilter(allFilters, allFieldOptions, nextNextField, true);
+                }
+            }
+        }
+        catch (err) {
+            showNotification(get(err, "message", SOMETHING_WENT_WRONG), NotificationStatus.ERROR);
+            setState((prevState) => {
+                return Object.assign(Object.assign({}, prevState), { loading: false, fieldName: "" });
+            });
+        }
+    });
+    useEffect(() => {
+        var _a, _b;
+        try {
+            if (fields.length > 0) {
+                if (value) {
+                    const fieldName = ((_a = fields === null || fields === void 0 ? void 0 : fields[0]) === null || _a === void 0 ? void 0 : _a._id) || "";
+                    const currentFilters = {
+                        [fieldName]: "",
+                    };
+                    onFilter(currentFilters, {}, fieldName, true);
+                }
+                else {
+                    const fieldName = ((_b = fields === null || fields === void 0 ? void 0 : fields[0]) === null || _b === void 0 ? void 0 : _b._id) || "";
+                    const currentFilters = {
+                        [fieldName]: "",
+                    };
+                    onFilter(currentFilters, {}, fieldName);
+                }
+            }
+        }
+        catch (err) {
+            console.log(err);
+        }
+    }, [fields, value]);
+    // console.log(
+    //   state?.filters,
+    //   state?.selectedFileUrl,
+    //   state?.fieldOptions,
+    //   state?.imagePicker,
+    //   state
+    // );
+    return (_jsx("div", { className: "image-picker-filters", style: { width: "100%" }, children: (state === null || state === void 0 ? void 0 : state.loading) && (state === null || state === void 0 ? void 0 : state.loaderType) == "IMAGE_PICKER" ? (_jsx("div", { className: "md-lib-h-full md-lib-flex md-lib-items-center md-lib-justify-center", children: _jsx(Spin, {}) })) : (_jsx("div", { className: "md-lib-border md-lib-p-4 md-lib-rounded", children: !(state === null || state === void 0 ? void 0 : state.assetType) ? (_jsx(Empty, { description: "Asset Type not found", image: Empty.PRESENTED_IMAGE_SIMPLE })) : (_jsxs(_Fragment, { children: [_jsx("h2", { className: "md-lib-text-xl md-lib-font-semibold", children: (_b = state === null || state === void 0 ? void 0 : state.imagePicker) === null || _b === void 0 ? void 0 : _b.name }), _jsx("br", {}), _jsxs(Form, { layout: "vertical", children: [fields === null || fields === void 0 ? void 0 : fields.map((field, index) => {
+                                var _a, _b, _c, _d;
+                                // console.log(field);
+                                const fieldName = (field === null || field === void 0 ? void 0 : field._id) || "";
+                                const fieldLabel = (field === null || field === void 0 ? void 0 : field.name) || "";
+                                const nextField = fields.length !== index + 1
+                                    ? ((_a = fields === null || fields === void 0 ? void 0 : fields[index + 1]) === null || _a === void 0 ? void 0 : _a._id) || ""
+                                    : "";
+                                return (_jsx(Form.Item, { label: fieldLabel, children: _jsx(Select, { placeholder: fieldLabel, style: { width: "100%" }, options: (_c = (((_b = state === null || state === void 0 ? void 0 : state.fieldOptions) === null || _b === void 0 ? void 0 : _b[fieldName]) || [])) === null || _c === void 0 ? void 0 : _c.map((option) => {
+                                            return {
+                                                label: option,
+                                                value: option,
+                                            };
+                                        }), showSearch: true, value: ((_d = state === null || state === void 0 ? void 0 : state.filters) === null || _d === void 0 ? void 0 : _d[fieldName]) || null, onChange: (val) => {
+                                            const prevFields = fields.slice(0, index + 1);
+                                            const allFilters = {};
+                                            const allFieldOptions = {};
+                                            // console.log("onChange", val, prevFields);
+                                            prevFields.forEach((item) => {
+                                                var _a, _b;
+                                                allFilters[item._id] = (_a = state === null || state === void 0 ? void 0 : state.filters) === null || _a === void 0 ? void 0 : _a[item._id];
+                                                allFieldOptions[item._id] =
+                                                    (_b = state === null || state === void 0 ? void 0 : state.fieldOptions) === null || _b === void 0 ? void 0 : _b[item._id];
+                                            });
+                                            allFilters[fieldName] = val;
+                                            onFilter(allFilters, allFieldOptions, nextField);
+                                        }, loading: (state === null || state === void 0 ? void 0 : state.loading) && (state === null || state === void 0 ? void 0 : state.fieldName) == fieldName }, fieldName) }, fieldName));
+                            }), _jsxs(Form.Item, { label: "Image", children: [_jsx(Select, { placeholder: "Select Image", style: { width: "100%" }, loading: (state === null || state === void 0 ? void 0 : state.loading) && (state === null || state === void 0 ? void 0 : state.fieldName) == "", showSearch: true, options: (_c = state === null || state === void 0 ? void 0 : state.files) === null || _c === void 0 ? void 0 : _c.map((file) => {
+                                            return {
+                                                label: file === null || file === void 0 ? void 0 : file.name,
+                                                value: file === null || file === void 0 ? void 0 : file._id,
+                                                file,
+                                            };
+                                        }), optionLabelProp: "label", value: state === null || state === void 0 ? void 0 : state.selectedFileId, onChange: (val, option) => {
+                                            if (onSelect) {
+                                                const file = get(option, "file", {});
+                                                const imagePickerOutputFormat = get(state === null || state === void 0 ? void 0 : state.assetType, "imagePickerOutputFormat", []);
+                                                const metadataFields = get(state === null || state === void 0 ? void 0 : state.assetType, "metadataFields", []);
+                                                // console.log(imagePickerOutputFormat);
+                                                const formattedOutputFormat = imagePickerOutputFormat.map((field) => {
+                                                    // console.log("field", field);
+                                                    const metaField = metadataFields.find((item) => (item === null || item === void 0 ? void 0 : item.name) == (field === null || field === void 0 ? void 0 : field.name));
+                                                    return Object.assign(Object.assign({}, field), { fieldId: get(metaField, "_id") });
+                                                });
+                                                // console.log(formattedOutputFormat);
+                                                const value = getFormattedValue(formattedOutputFormat, file === null || file === void 0 ? void 0 : file.s3Url, get(file, "metadata", {}));
+                                                // console.log(val, value);
+                                                onSelect(val, value);
+                                            }
+                                            setState((prevState) => {
+                                                var _a;
+                                                return Object.assign(Object.assign({}, prevState), { selectedFileId: val, selectedFileUrl: (_a = option === null || option === void 0 ? void 0 : option.file) === null || _a === void 0 ? void 0 : _a.thumbnailUrl, selectedFieldName: "" });
+                                            });
+                                        } }, "IMAGE_THUMBNAIL"), (state === null || state === void 0 ? void 0 : state.selectedFileUrl) && (_jsx("img", { src: state === null || state === void 0 ? void 0 : state.selectedFileUrl, width: 200, style: {
+                                            borderRadius: "10px",
+                                            marginTop: "10px",
+                                        }, alt: "Selected file preview" }, state === null || state === void 0 ? void 0 : state.selectedFileUrl))] })] })] })) })) }));
+}
+export default ImagePickerFiltersComponent;

package/build/ImagePickerFilters/index.d.ts

@@ -0,0 +1,12 @@
+declare function App(props: {
+    accessKey?: string;
+    secretKey?: string;
+    subdomain?: string;
+    teamIds?: string[];
+    styles?: any;
+    appType?: string;
+    id: string;
+    onSelect?: (url: string, value: any) => void;
+    url?: string;
+}): JSX.Element;
+export default App;

package/build/ImagePickerFilters/index.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { DamConfigProvider } from "../hocs/DamConfigContext";
+import { ThemeProvider } from "../hocs/ThemeContext";
+import { ThemeModes } from "../utilities/constants/interface";
+import AppProvider from "../hocs/AppProvider";
+import ToastProvider from "../hocs/ToastProvider";
+import ImagePickerFiltersComponent from "./ImagePickerFiltersComponent";
+function App(props) {
+    const config = {
+        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,
+    };
+    return (_jsx(DamConfigProvider, { config: config, children: _jsx(ThemeProvider, { styles: props === null || props === void 0 ? void 0 : props.styles, sessionTheme: ThemeModes.LIGHT, children: _jsxs(AppProvider, { children: [_jsx(ImagePickerFiltersComponent, { id: props.id, onSelect: props === null || props === void 0 ? void 0 : props.onSelect, url: props === null || props === void 0 ? void 0 : props.url }), _jsx(ToastProvider, {})] }) }) }));
+}
+export default App;

package/build/MyDrive/ActionBar.d.ts

@@ -0,0 +1,6 @@
+declare const ActionsBar: ({ fileIds, folderIds, onCloseSelection, }: {
+    fileIds: string[];
+    folderIds: string[];
+    onCloseSelection: () => void;
+}) => JSX.Element;
+export default ActionsBar;

package/build/MyDrive/ActionBar.js

@@ -0,0 +1,165 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { Button, Tag, Tooltip } from "antd";
+import { FiUpload, FiDownload, FiFolderPlus, FiTrash2, FiX, } from "react-icons/fi";
+import { IoArchiveOutline, IoLinkOutline } from "react-icons/io5";
+import { concat, find, first, get, join, map } from "lodash";
+import MoveToAnotherFolder from "./files/MoveToAnotherFolder";
+import { useMutation, useQueryClient } from "react-query";
+import { deleteFiles, downloadFiles, restoreFiles, } from "../react-query/services/file-services";
+import { DeleteConfirmationModal } from "../common/CustomElements";
+import { DeleteOutlined, RedoOutlined } from "@ant-design/icons";
+import { generateFoldersQueryKey, invalidateData, } from "../utilities/constants/queryKeys";
+import { DriveModes, NotificationStatus, } from "../utilities/constants/interface";
+import { ARCHIVE_OK_TEXT, DELETE_CONFIRMATION_MESSAGE, DELETE_MESSAGE_DESCRIPTION, DELETE_OK_TEXT, DELETE_SUCCESS, INVALID_URL, RESTORE_SUCCESS, SOMETHING_WENT_WRONG, } from "../utilities/constants/messages";
+import { showNotification } from "../common/notifications";
+import FileMenuOptions from "./FileMenuOptions";
+import { getFolderData } from "../react-query/hooks/folder-hooks";
+// import InviteTeamModal from "../settings/InviteTeamModal";
+import { FETCH_ENTITY_SCREEN } from "../utilities/constants/routes";
+import { useDamConfig } from "../hocs/DamConfigContext";
+import { createApiClient } from "../hocs/configureAxios";
+import useAppParams from "../utilities/useAppParams";
+const FiUploadIcon = FiUpload;
+const FiDownloadIcon = FiDownload;
+const FiFolderPlusIcon = FiFolderPlus;
+const IoLinkOutlineIcon = IoLinkOutline;
+const FiTrash2Icon = FiTrash2;
+const FiXIcon = FiX;
+const IoArchiveOutlineIcon = IoArchiveOutline;
+const ActionsBar = ({ fileIds, folderIds, onCloseSelection, }) => {
+    const { appType } = useDamConfig();
+    const { folderId, type } = useAppParams();
+    const queryClient = useQueryClient();
+    const damConfig = useDamConfig();
+    const { rootFolderId, isAdmin } = damConfig;
+    const api = useMemo(() => createApiClient(damConfig), [damConfig]);
+    const [state, setState] = useState({
+        showMoveFolder: false,
+        showConfirmModal: false,
+        actionType: "",
+        showShareModal: false,
+    });
+    const { showMoveFolder, showConfirmModal, actionType, showShareModal } = state;
+    const toggleShareModal = () => {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { showShareModal: !prevState.showShareModal })));
+    };
+    const folders = getFolderData(queryClient, folderId ? folderId : rootFolderId, generateFoldersQueryKey(type));
+    const selectedFolder = useMemo(() => {
+        if (get(folderIds, "length") === 1) {
+            return find(folders, (folder) => get(folder, "_id") === first(folderIds));
+        }
+        else {
+            return null;
+        }
+    }, [folderIds, folders]);
+    const selectedFile = useMemo(() => {
+        if (get(fileIds, "length") === 1) {
+            return find(folders, (folder) => get(folder, "_id") === first(fileIds));
+        }
+        else {
+            return null;
+        }
+    }, [fileIds, folders]);
+    const toggleConfirmPopup = (actionType = "") => {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { actionType, showConfirmModal: !prevState.showConfirmModal })));
+    };
+    const toggleShowMoveFolder = () => {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { showMoveFolder: !prevState.showMoveFolder })));
+    };
+    const onSuccess = (message) => {
+        invalidateData(queryClient, generateFoldersQueryKey(type), folderId ? folderId : rootFolderId);
+        showNotification(message, NotificationStatus.SUCCESS);
+    };
+    const onFailure = (message) => {
+        showNotification(message, NotificationStatus.ERROR);
+    };
+    const deleteFileMutation = useMutation({
+        mutationFn: deleteFiles,
+        onSuccess: (response) => {
+            toggleConfirmPopup();
+            onCloseSelection();
+            onSuccess(get(response, "data.message", DELETE_SUCCESS));
+        },
+        onError: (error) => {
+            onFailure(get(error, "message", SOMETHING_WENT_WRONG));
+        },
+    });
+    const onDeleteFile = () => {
+        deleteFileMutation.mutate({
+            fileIds,
+            folderIds,
+            api,
+        });
+    };
+    const restoreFileMutation = useMutation({
+        mutationFn: restoreFiles,
+        onSuccess: (response) => {
+            onCloseSelection();
+            onSuccess(get(response, "data.message", RESTORE_SUCCESS));
+        },
+        onError: (error) => {
+            onFailure(get(error, "message", SOMETHING_WENT_WRONG));
+        },
+    });
+    const onRestoreFiles = () => {
+        restoreFileMutation.mutate({
+            fileIds,
+            folderIds,
+            api,
+        });
+    };
+    const downloadFileMutation = useMutation({
+        mutationFn: downloadFiles,
+        onSuccess: (response) => {
+            const url = get(response, "data");
+            if (url) {
+                window.open(url, "_blank");
+            }
+            else {
+                onFailure(INVALID_URL);
+            }
+            onCloseSelection();
+        },
+        onError: (error) => {
+            onFailure(get(error, "message", SOMETHING_WENT_WRONG));
+        },
+    });
+    const onDownloadFiles = () => {
+        downloadFileMutation.mutate({
+            fileIds,
+            folderIds,
+            api,
+        });
+    };
+    const fileLinks = useMemo(() => {
+        return map(fileIds, (id) => `${appType == "reactJs"
+            ? process.env.REACT_APP_MIXDRIVE_SITE_URL
+            : process.env.NEXT_PUBLIC_MIXDRIVE_SITE_URL}` +
+            FETCH_ENTITY_SCREEN.replace(":type", DriveModes.FILE).replace(":id", id));
+    }, [fileIds]);
+    const folderLinks = useMemo(() => {
+        return map(folderIds, (id) => `${appType == "reactJs"
+            ? process.env.REACT_APP_MIXDRIVE_SITE_URL
+            : process.env.NEXT_PUBLIC_MIXDRIVE_SITE_URL}` +
+            FETCH_ENTITY_SCREEN.replace(":type", DriveModes.FOLDERS).replace(":id", id));
+    }, [folderIds]);
+    const link = useMemo(() => {
+        if (get(concat(fileLinks, folderLinks), "length")) {
+            return get(concat(fileLinks, folderLinks), "length") > 1
+                ? join(concat(fileLinks, folderLinks), ", ")
+                : first(concat(fileLinks, folderLinks));
+        }
+        else {
+            return `${appType == "reactJs"
+                ? process.env.REACT_APP_MIXDRIVE_SITE_URL
+                : process.env.NEXT_PUBLIC_MIXDRIVE_SITE_URL}`;
+        }
+    }, [fileLinks, folderLinks]);
+    const isTrashPage = useMemo(() => type === DriveModes.TRASH, [type]);
+    return (_jsxs("div", { className: "md-lib-fixed md-lib-bottom-6 md-lib-left-1/2 md-lib-transform -md-lib-translate-x-1/2 md-lib-w-80 md:md-lib-w-[720px] md-lib-max-w-3xl md-lib-bg-textColorActive md-lib-border dark:md-lib-bg-darkPrimary dark:md-lib-border-darkBorderColor md-lib-border-secondaryHoverColor md-lib-rounded-xl md-lib-shadow-md md-lib-flex md-lib-items-center md-lib-justify-between md-lib-px-4 md-lib-py-2 md-lib-z-50", children: [_jsxs("div", { className: "md-lib-flex md-lib-items-center md-lib-gap-5 md-lib-pl-2", children: [_jsx(Button, { type: "text", size: "large", icon: _jsx(FiDownloadIcon, { size: 24, className: "" }), disabled: isTrashPage, onClick: onDownloadFiles, loading: downloadFileMutation.isLoading }), isTrashPage ? (_jsx(Tooltip, { title: "Restore", children: _jsx(Button, { type: "text", size: "large", icon: _jsx(RedoOutlined, { className: "" }), onClick: () => onRestoreFiles(), disabled: !isTrashPage }) })) : (_jsx(_Fragment, { children: isAdmin && (_jsx(Tooltip, { title: "Delete", children: _jsx(Button, { type: "text", size: "large", icon: _jsx(FiTrash2Icon, { size: 24, className: "" }), onClick: () => toggleConfirmPopup("delete"), disabled: isTrashPage }) })) })), _jsx(FileMenuOptions, { file: selectedFile || null, fileIds: fileIds, folderIds: folderIds, folder: selectedFolder || null, onCloseSelection: onCloseSelection, readOnly: isTrashPage })] }), _jsx("div", { className: "md-lib-flex md-lib-items-center", children: _jsxs(Tag, { className: "md-lib-bg-[#DEE4ED] dark:md-lib-bg-darkPrimaryHoverColor  !md-lib-rounded-lg !md-lib-px-4 h-[38px] md-lib-text-sm md-lib-items-center md-lib-font-medium md-lib-flex md-lib-gap-2 md-lib-text-textColor dark:md-lib-text-darkTextColor", closable: true, closeIcon: _jsx(FiXIcon, { onClick: onCloseSelection, className: "md-lib-cursor-pointer" }), children: [get(fileIds, "length", 0) + get(folderIds, "length", 0), " Selected"] }) }), showMoveFolder && (_jsx(MoveToAnotherFolder, { open: showMoveFolder, handleCancel: () => {
+                    toggleShowMoveFolder();
+                    onCloseSelection();
+                }, folderIds: folderIds, fileIds: folderIds, entity: null })), _jsx(DeleteConfirmationModal, { showDeleteModal: showConfirmModal, toggleDeleteModal: toggleConfirmPopup, icon: actionType === "archive" ? (_jsx(IoArchiveOutlineIcon, {})) : (_jsx(DeleteOutlined, {})), okText: actionType === "archive" ? ARCHIVE_OK_TEXT : DELETE_OK_TEXT, description: DELETE_CONFIRMATION_MESSAGE.replace(":action", actionType).replace(" :entity", ""), subHeading: actionType === "archive" ? "" : DELETE_MESSAGE_DESCRIPTION, onOk: actionType === "archive" ? () => { } : onDeleteFile, loading: deleteFileMutation.isLoading })] }));
+};
+export default ActionsBar;

package/build/MyDrive/AddDrive.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+declare const AddDrive: React.FC;
+export default AddDrive;

package/build/MyDrive/AddDrive.js

@@ -0,0 +1,169 @@
+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 { useMemo, useRef, useState } from "react";
+import { Button, Dropdown } from "antd";
+import { MdKeyboardArrowDown } from "react-icons/md";
+import { BsUpload } from "react-icons/bs";
+import { PiFolderPlusLight } from "react-icons/pi";
+import { GoPlus } from "react-icons/go";
+import AddFolder from "./AddFolder";
+import MapFile from "./files/MapFile";
+import { showNotification } from "../common/notifications";
+import { SOMETHING_WENT_WRONG, UPLOAD_SUCCESS, } from "../utilities/constants/messages";
+import { FileUploadStatus, NotificationStatus, } from "../utilities/constants/interface";
+import { get, keyBy, map, merge, values } from "lodash";
+import { DELETE_S3_FILE_URL, FILE_UPLOAD_URL, } from "../utilities/constants/apiUrls";
+import CustomLoader from "../common/loader/CustomLoader";
+import axios from "axios";
+import UploadStatusModal from "./UploadStatusModal";
+import { useDamConfig } from "../hocs/DamConfigContext";
+import { createApiClient } from "../hocs/configureAxios";
+import BulkUploadModal from "./BulkUploadModal";
+import useAppParams from "../utilities/useAppParams";
+import CustomButton from "../common/Button";
+import { RiGalleryLine } from "react-icons/ri";
+const extensionToMime = {
+    ai: "application/postscript",
+    psd: "image/vnd.adobe.photoshop",
+    indd: "application/x-indesign",
+};
+const RiGalleryLineIcon = RiGalleryLine;
+const BsUploadIcon = BsUpload;
+const PiFolderPlusLightIcon = PiFolderPlusLight;
+const GoPlusIcon = GoPlus;
+const MdKeyboardArrowDownIconIcon = MdKeyboardArrowDown;
+const AddDrive = () => {
+    const damConfig = useDamConfig();
+    const { brand, rootFolderId } = damConfig;
+    const brandId = get(brand, "_id");
+    const { folderId } = useAppParams();
+    const fileInputRef = useRef(null);
+    const api = useMemo(() => createApiClient(damConfig), [damConfig]);
+    const [state, setState] = useState({
+        openFolderModal: false,
+        openMapFile: false,
+        uploading: false,
+        filesList: [],
+        showUploadStatus: false,
+        uploadStatusList: [],
+        openBlukUploadModal: false,
+        showGenerateThumbnails: false,
+    });
+    const { openFolderModal, openMapFile, uploading, filesList, showUploadStatus, uploadStatusList, openBlukUploadModal, showGenerateThumbnails, } = state;
+    const toggleOpenMapFile = (files = []) => {
+        if (openMapFile) {
+            try {
+                api.delete(DELETE_S3_FILE_URL.replace(":path", filesList === null || filesList === void 0 ? void 0 : filesList[0].filePath));
+            }
+            catch (err) {
+                console.log("Error while deleting file in s3", err);
+            }
+        }
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { openMapFile: !prevState.openMapFile, filesList: files, showUploadStatus: false })));
+    };
+    const toggleFolderModal = () => {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { openFolderModal: !prevState.openFolderModal })));
+    };
+    const toggleFolderBulkModal = () => {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { openBlukUploadModal: !prevState.openBlukUploadModal })));
+    };
+    const updateFileStatus = (fileName, status) => {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { uploadStatusList: map(prevState.uploadStatusList, (f) => get(f, "name") === fileName ? Object.assign(Object.assign({}, f), { status }) : f) })));
+    };
+    const handleNativeFileUpload = (event) => __awaiter(void 0, void 0, void 0, function* () {
+        const selectedFiles = get(event, "target.files", []);
+        if (!selectedFiles || selectedFiles.length === 0)
+            return;
+        const files = map(Array.from(selectedFiles), (file) => {
+            var _a;
+            const name = get(file, "name", "");
+            const ext = ((_a = name.split(".").pop()) === null || _a === void 0 ? void 0 : _a.toLowerCase()) || "";
+            const mimetype = get(file, "type") ||
+                get(extensionToMime, ext) ||
+                "application/octet-stream";
+            return {
+                name,
+                size: get(file, "size"),
+                mimetype,
+                file,
+            };
+        });
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { uploading: true, showUploadStatus: true, uploadStatusList: map(files, (f) => ({
+                name: get(f, "name"),
+                status: FileUploadStatus.PENDING,
+            })) })));
+        try {
+            const response = yield api.post(FILE_UPLOAD_URL, {
+                brandId,
+                folderId: folderId || rootFolderId,
+                files: map(files, (file) => ({
+                    name: get(file, "name"),
+                    size: get(file, "size"),
+                })),
+            });
+            const uploadData = get(response, "data", []);
+            const uploadMap = keyBy(uploadData, "name");
+            for (const file of files) {
+                const fileUrl = get(uploadMap, [get(file, "name"), "url"]);
+                if (!fileUrl) {
+                    updateFileStatus(get(file, "name"), FileUploadStatus.ERROR);
+                    continue;
+                }
+                try {
+                    yield axios.put(fileUrl, file.file, {
+                        headers: {
+                            "Content-Type": get(file, "mimetype"),
+                            "Access-Control-Allow-Origin": "*",
+                        },
+                    });
+                    updateFileStatus(get(file, "name"), FileUploadStatus.SUCCESS);
+                }
+                catch (_a) {
+                    updateFileStatus(get(file, "name"), FileUploadStatus.ERROR);
+                }
+            }
+            showNotification(get(response, "data.message", UPLOAD_SUCCESS), NotificationStatus.SUCCESS);
+            toggleOpenMapFile(values(merge({}, keyBy(files, "name"), keyBy(uploadData, "name"))));
+        }
+        catch (error) {
+            showNotification(get(error, "message", SOMETHING_WENT_WRONG), NotificationStatus.ERROR);
+        }
+        finally {
+            setState((prevState) => (Object.assign(Object.assign({}, prevState), { uploading: false })));
+            if (fileInputRef.current)
+                fileInputRef.current.value = "";
+        }
+    });
+    const items = [
+        {
+            key: "0",
+            label: "Upload file",
+            icon: uploading ? _jsx(CustomLoader, {}) : _jsx(BsUploadIcon, { size: 16 }),
+            disabled: uploading,
+            onClick: () => { var _a; return (_a = get(fileInputRef, "current")) === null || _a === void 0 ? void 0 : _a.click(); },
+        },
+        {
+            key: "2",
+            icon: _jsx(PiFolderPlusLightIcon, { size: 20 }),
+            label: "Create folder",
+            onClick: () => toggleFolderModal(),
+        },
+        {
+            key: "3",
+            icon: _jsx(BsUploadIcon, { size: 20 }),
+            label: "Bulk Upload",
+            onClick: () => toggleFolderBulkModal(),
+        },
+    ];
+    const toggleGenerateThumbnails = () => setState((prevState) => (Object.assign(Object.assign({}, prevState), { showGenerateThumbnails: !prevState.showGenerateThumbnails })));
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "md-lib-flex md-lib-gap-3", children: [_jsx(CustomButton, { label: "Generate Thumbnails", icon: _jsx(RiGalleryLineIcon, {}), size: "large", onClick: toggleGenerateThumbnails }), _jsx(Dropdown, { menu: { items }, trigger: ["click"], placement: "bottomRight", children: _jsxs(Button, { icon: _jsx(GoPlusIcon, { size: 16 }), type: "primary", size: "large", children: ["Add ", _jsx(MdKeyboardArrowDownIconIcon, {})] }) })] }), _jsx("input", { ref: fileInputRef, type: "file", className: "hidden", onChange: handleNativeFileUpload }), openFolderModal && (_jsx(AddFolder, { open: openFolderModal, handleCancel: toggleFolderModal })), openMapFile && (_jsx(MapFile, { open: openMapFile, handleCancel: toggleOpenMapFile, filesList: filesList, fromUpload: true })), showUploadStatus && (_jsx(UploadStatusModal, { open: showUploadStatus, statusList: uploadStatusList, onClose: () => setState((prevState) => (Object.assign(Object.assign({}, prevState), { showUploadStatus: false }))) })), openBlukUploadModal && (_jsx(BulkUploadModal, { toggleUpload: toggleFolderBulkModal, folderId: folderId !== null && folderId !== void 0 ? folderId : rootFolderId })), showGenerateThumbnails && (_jsx(BulkUploadModal, { toggleUpload: toggleGenerateThumbnails, thumbnailsOnly: true, folderId: folderId !== null && folderId !== void 0 ? folderId : rootFolderId }))] }));
+};
+export default AddDrive;

package/build/MyDrive/AddFolder.d.ts

@@ -0,0 +1,10 @@
+import { FileEntity, FolderEntity } from "../utilities/constants/interface";
+declare function AddFolder({ open, handleCancel, folder, file, onCloseSelection, fileModal, }: {
+    open: boolean;
+    handleCancel: () => void;
+    folder?: FolderEntity;
+    file?: FileEntity;
+    onCloseSelection?: () => void;
+    fileModal?: boolean;
+}): JSX.Element;
+export default AddFolder;