@anji-dashing/dam-solution-v2 5.8.173

package/build/MyDrive/ImageEditor/TuiImageEditor.js

@@ -0,0 +1,99 @@
+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 } from "react/jsx-runtime";
+import { get } from "lodash";
+import { useEffect, useRef, forwardRef, useImperativeHandle, useMemo, useState, } from "react";
+import ImageEditor from "tui-image-editor";
+import "tui-image-editor/dist/tui-image-editor.css";
+import { useDamConfig } from "../../hocs/DamConfigContext";
+import { createApiClient } from "../../hocs/configureAxios";
+import { GET_BASE64_USING_PATH_URL } from "../../utilities/constants/apiUrls";
+const TuiImageEditor = forwardRef(({ file, path }, ref) => {
+    const editorRef = useRef(null);
+    const editorInstance = useRef(null);
+    const damConfig = useDamConfig();
+    const api = useMemo(() => createApiClient(damConfig), [damConfig]);
+    const [base64, setBase64] = useState("");
+    useEffect(() => {
+        if (path) {
+            getBase64();
+        }
+    }, [path]);
+    const getBase64 = () => __awaiter(void 0, void 0, void 0, function* () {
+        try {
+            const response = yield api.get(`${GET_BASE64_USING_PATH_URL}?key=${path}`);
+            // console.log(response);
+            const base64 = get(response, "base64", "");
+            const mimeType = get(response, "contentType", "image/png");
+            setBase64(`data:${mimeType};base64,${base64}`);
+        }
+        catch (err) {
+            console.log("Error while fetching file base64", err);
+        }
+    });
+    useEffect(() => {
+        if (!editorRef.current)
+            return;
+        editorInstance.current = new ImageEditor(editorRef.current, {
+            includeUI: {
+                loadImage: {
+                    path: base64,
+                    name: get(file, "name", "N/A"),
+                },
+                theme: {
+                    "loadButton.display": "none",
+                },
+                menu: [
+                    "crop",
+                    "flip",
+                    "rotate",
+                    "draw",
+                    "shape",
+                    "icon",
+                    "text",
+                    "mask",
+                    "filter",
+                ],
+                initMenu: "filter",
+                uiSize: {
+                    width: "100%",
+                    height: "700px",
+                },
+                menuBarPosition: "bottom",
+            },
+            cssMaxWidth: 700,
+            cssMaxHeight: 500,
+            selectionStyle: {
+                cornerSize: 20,
+                rotatingPointOffset: 70,
+            },
+        });
+        return () => {
+            var _a, _b;
+            (_b = (_a = editorInstance.current) === null || _a === void 0 ? void 0 : _a.destroy) === null || _b === void 0 ? void 0 : _b.call(_a);
+        };
+    }, [base64]);
+    useImperativeHandle(ref, () => ({
+        getEditedFile() {
+            return __awaiter(this, void 0, void 0, function* () {
+                if (!editorInstance.current)
+                    return null;
+                const dataURL = editorInstance.current.toDataURL();
+                const blob = yield (yield fetch(dataURL)).blob();
+                return new File([blob], get(file, "name", "edited-image.png"), {
+                    type: get(file, "mimetype", blob.type),
+                });
+            });
+        },
+    }));
+    return (_jsx("div", { className: "md-lib-w-full", children: _jsx("div", { ref: editorRef, className: "mb-4" }) }));
+});
+TuiImageEditor.displayName = "TuiImageEditor";
+export default TuiImageEditor;

package/build/MyDrive/ImagePickerBreadCrumbList.d.ts

@@ -0,0 +1,8 @@
+import { FolderEntity } from "../utilities/constants/interface";
+declare function ImagePickerBreadCrumbList({ folder, parentFolderId, setParentFolderId, pickerFolderId, }: {
+    folder: FolderEntity;
+    parentFolderId?: string;
+    setParentFolderId?: (id: string) => void;
+    pickerFolderId?: string;
+}): JSX.Element;
+export default ImagePickerBreadCrumbList;

package/build/MyDrive/ImagePickerBreadCrumbList.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Breadcrumb, Tooltip } from "antd";
+import { findIndex, get, last, map, slice } from "lodash";
+import { useMemo } from "react";
+import { FaChevronRight } from "react-icons/fa";
+import { useDamConfig } from "../hocs/DamConfigContext";
+const FaChevronRightIcon = FaChevronRight;
+function ImagePickerBreadCrumbList({ folder, parentFolderId, setParentFolderId, pickerFolderId, }) {
+    const damConfig = useDamConfig();
+    const { rootFolderId } = damConfig;
+    const tree = useMemo(() => {
+        const fullTree = get(folder, "tree", []);
+        if (pickerFolderId) {
+            const pickerIndex = findIndex(fullTree, (item) => get(item, "_id") === pickerFolderId);
+            const parentIndex = findIndex(fullTree, (item) => get(item, "_id") === parentFolderId);
+            if (pickerIndex !== -1) {
+                const end = parentIndex !== -1 ? parentIndex + 1 : get(fullTree, "length");
+                return slice(fullTree, pickerIndex, end);
+            }
+        }
+        return fullTree;
+    }, [folder, pickerFolderId, parentFolderId]);
+    return (_jsx(Breadcrumb, { className: "md-lib-font-semibold md-lib-text-[22px] md-lib-truncate", separator: _jsx(FaChevronRightIcon, { className: "md-lib-mt-2" }), children: map(tree, (item) => {
+            const treeId = get(item, "_id");
+            const name = get(item, "name", "N/A");
+            const isLast = treeId === get(last(tree), "_id");
+            const handleClick = () => {
+                if (pickerFolderId && setParentFolderId && !isLast) {
+                    setParentFolderId(treeId);
+                }
+            };
+            return (_jsx(Breadcrumb.Item, { onClick: handleClick, className: "md-lib-h-auto md-lib-cursor-pointer", children: _jsx(Tooltip, { title: name, children: _jsx("p", { className: "md-lib-max-w-28 md-lib-truncate md-lib-font-semibold md-lib-text-[22px]", children: name }) }) }, treeId));
+        }) }));
+}
+export default ImagePickerBreadCrumbList;

package/build/MyDrive/ImagePickerDrive.d.ts

@@ -0,0 +1 @@
+export default function ImagePickerDrive(): JSX.Element;

package/build/MyDrive/ImagePickerDrive.js

@@ -0,0 +1,41 @@
+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 { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { DriveModes } from "../utilities/constants/interface";
+import { createApiClient } from "../hocs/configureAxios";
+import { useEffect, useMemo } from "react";
+import { FETCH_SHARED_FILE_URL } from "../utilities/constants/apiUrls";
+import { get } from "lodash";
+import useConfig from "antd/es/config-provider/hooks/useConfig";
+import useAppParams from "../utilities/useAppParams";
+export default function ImagePickerDrive() {
+    const params = useAppParams();
+    const damConfig = useConfig();
+    const api = useMemo(() => createApiClient(damConfig), [damConfig]);
+    useEffect(() => {
+        if (get(params, "type") === DriveModes.FILE) {
+            fetchFileData();
+        }
+    }, []);
+    const fetchFileData = () => __awaiter(this, void 0, void 0, function* () {
+        const response = yield api.get(FETCH_SHARED_FILE_URL.replace(":fileId", get(params, "id")));
+    });
+    //   const renderContent = () => {
+    //     switch (get(params, "type")) {
+    //       case DriveModes.FILE:
+    //         return <FileDetails open={true} file={get(fileData, "data")} />;
+    //       case DriveModes.FOLDERS:
+    //         return <DriveContainer />;
+    //       default:
+    //         redirect("/not-found");
+    //     }
+    //   };
+    return _jsx(_Fragment, {});
+}

package/build/MyDrive/MyDriveMainContainer.d.ts

@@ -0,0 +1,6 @@
+import { type FolderTypes } from "../utilities/FoldersContext";
+export default function MyDriveMainContainer({ folders, setFolders, onFolderChange, }: {
+    folders: FolderTypes[];
+    setFolders: React.Dispatch<React.SetStateAction<FolderTypes[]>>;
+    onFolderChange?: (folderId: string) => void;
+}): JSX.Element;

package/build/MyDrive/MyDriveMainContainer.js

@@ -0,0 +1,63 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import FolderTree from "./FolderTree";
+import { useEffect, useState, useRef } from "react";
+import { useDamConfig } from "../hocs/DamConfigContext";
+import { isArray, map } from "lodash";
+import DriveContainer from "./DriveContainer";
+import useAppParams from "../utilities/useAppParams";
+import { FoldersProvider } from "../utilities/FoldersContext";
+export default function MyDriveMainContainer({ folders, setFolders, onFolderChange, }) {
+    const damConfig = useDamConfig();
+    const { rootFolderId, brand, isAdmin } = damConfig;
+    const params = useAppParams();
+    console.log('## all params from useAppParams', params);
+    const [selectedKeys, setSelectedKeys] = useState([]);
+    const [expandedKeys, setExpandedKeys] = useState([]);
+    const [globalSearch, setGlobalSearch] = useState("");
+    // Track if we've initialized from params to prevent rootFolderId from overriding
+    const initializedFromParamsRef = useRef(false);
+    useEffect(() => {
+        // Priority: URL params > Props from ParamsProvider > rootFolderId from config
+        if (params === null || params === void 0 ? void 0 : params.folderId) {
+            console.log('## Setting selectedKeys from params.folderId:', params.folderId);
+            setSelectedKeys(params.folderId);
+            initializedFromParamsRef.current = true;
+        }
+        else if (!(params === null || params === void 0 ? void 0 : params.folderId) && rootFolderId && !selectedKeys && !initializedFromParamsRef.current) {
+            // Only set to rootFolderId if no params AND selectedKeys is empty AND we haven't initialized from params
+            console.log('## No params.folderId and no selectedKeys, using rootFolderId:', rootFolderId);
+            setSelectedKeys(rootFolderId);
+        }
+    }, [params === null || params === void 0 ? void 0 : params.folderId, params === null || params === void 0 ? void 0 : params.id, params === null || params === void 0 ? void 0 : params.parentId]);
+    // Priority: selectedKeys > params > rootFolderId
+    // Never fall back to rootFolderId if params.folderId is set
+    const currentRootId = isArray(selectedKeys)
+        ? selectedKeys.length
+            ? selectedKeys[selectedKeys.length - 1]
+            : ((params === null || params === void 0 ? void 0 : params.folderId) || (params === null || params === void 0 ? void 0 : params.id) || (params === null || params === void 0 ? void 0 : params.parentId) || rootFolderId)
+        : selectedKeys
+            ? selectedKeys
+            : ((params === null || params === void 0 ? void 0 : params.folderId) || (params === null || params === void 0 ? void 0 : params.id) || (params === null || params === void 0 ? void 0 : params.parentId) || rootFolderId);
+    // Get the currently selected folder ID for DriveContainer
+    const selectedFolderId = isArray(selectedKeys)
+        ? selectedKeys.length
+            ? selectedKeys[selectedKeys.length - 1]
+            : ((params === null || params === void 0 ? void 0 : params.folderId) || (params === null || params === void 0 ? void 0 : params.id) || (params === null || params === void 0 ? void 0 : params.parentId) || rootFolderId)
+        : selectedKeys
+            ? selectedKeys
+            : ((params === null || params === void 0 ? void 0 : params.folderId) || (params === null || params === void 0 ? void 0 : params.id) || (params === null || params === void 0 ? void 0 : params.parentId) || rootFolderId);
+    console.log('## MyDriveMainContainer - selectedKeys:', selectedKeys, 'currentRootId:', currentRootId, 'selectedFolderId:', selectedFolderId, 'rootFolderId:', rootFolderId);
+    const handleExpand = (keys) => {
+        setExpandedKeys(map(keys, (k) => k.toString()));
+    };
+    // Wrapper function to handle both string and string[] for setSelectedKeys
+    const handleSetSelectedKeys = (keys) => {
+        const next = typeof keys === "string" ? [keys] : keys;
+        setSelectedKeys(next);
+        const singleFolderId = Array.isArray(next) && next.length === 1 ? next[0] : null;
+        if (singleFolderId && onFolderChange) {
+            onFolderChange(singleFolderId);
+        }
+    };
+    return (_jsxs(FoldersProvider, { value: { setFolders, folders, globalSearch }, children: [_jsx(FolderTree, { currentRootId: currentRootId, handleExpand: handleExpand, setSelectedKeys: setSelectedKeys, expandedKeys: expandedKeys, selectedKeys: selectedKeys, folders: folders, setExpandedKeys: setExpandedKeys, setFolders: setFolders, setGlobalSearch: setGlobalSearch, globalSearch: globalSearch }), _jsx("div", { className: "md-lib-h-[inherit] md-lib-overflow-x-auto", children: _jsx(DriveContainer, { parentFolderId: selectedFolderId, globalSearch: globalSearch, setGlobalSearch: setGlobalSearch, setSelectedKeys: handleSetSelectedKeys }) })] }));
+}

package/build/MyDrive/SearchFilter.d.ts

@@ -0,0 +1,8 @@
+export default function SearchFilter({ type, onSearch, name, isMetadata, isSelected, searchValue, }: {
+    type: string;
+    onSearch: (filters: Record<string, any>) => void;
+    isMetadata: boolean;
+    name: string;
+    isSelected: boolean;
+    searchValue: string | [string | string] | null;
+}): JSX.Element;

package/build/MyDrive/SearchFilter.js

@@ -0,0 +1,73 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, DatePicker, Input, Popover, Radio } from "antd";
+import { CiSearch } from "react-icons/ci";
+import { InputTypes } from "../utilities/constants/interface";
+import { useEffect, useState } from "react";
+import dayjs from "dayjs";
+import { DATE_FORMAT, DATE_WITH_TIME_FORMAT } from "../hocs/appConstants";
+const CiSearchIcon = CiSearch;
+export default function SearchFilter({ type, onSearch, name, isMetadata, isSelected, searchValue, }) {
+    const [open, setOpen] = useState(false);
+    const [value, setValue] = useState(null);
+    const [withTime, setWithTime] = useState(false); // toggle mode
+    useEffect(() => {
+        if (type === InputTypes.DATE || type === InputTypes.DATE_RANGE) {
+            setValue(isSelected && typeof searchValue === "string"
+                ? dayjs(searchValue)
+                : null);
+        }
+        else {
+            setValue(isSelected ? searchValue : null);
+        }
+    }, [type, isSelected, searchValue]);
+    const getInputField = (type) => {
+        switch (type) {
+            case InputTypes.DATE_RANGE:
+            case InputTypes.DATE:
+                return (_jsxs("div", { className: "md-lib-flex md-lib-flex-col md-lib-gap-2", children: [_jsxs(Radio.Group, { value: withTime ? "withTime" : "dateOnly", onChange: (e) => setWithTime(e.target.value === "withTime"), children: [_jsx(Radio, { value: "dateOnly", children: "Date only" }), _jsx(Radio, { value: "withTime", children: "With time" })] }), _jsx(DatePicker, { style: { width: "100%" }, onChange: (val) => setValue(val), value: value, placeholder: withTime ? "Select date & time" : "Select date", showTime: withTime })] }));
+            default:
+                return (_jsx(Input, { value: value, onChange: (e) => setValue(e.target.value), placeholder: "Search (min. 2 characters required)" }));
+        }
+    };
+    const handleCancel = () => {
+        onSearch({
+            searchKey: "",
+            searchValue: "",
+            metadataKey: "",
+            metadataValue: "",
+        });
+        setValue(null);
+        setWithTime(false);
+        setOpen(false);
+    };
+    const handleSearch = () => {
+        let formattedValue = value;
+        if ((type === InputTypes.DATE || type === InputTypes.DATE_RANGE) && value) {
+            formattedValue = withTime
+                ? value.format(DATE_WITH_TIME_FORMAT) // includes time
+                : value.format(DATE_FORMAT); // date only
+        }
+        if (type === InputTypes.TEXT
+            ? formattedValue.length >= 2 || !formattedValue
+            : true) {
+            onSearch(isMetadata
+                ? {
+                    searchKey: "",
+                    searchValue: "",
+                    metadataKey: name,
+                    metadataValue: formattedValue,
+                    searchData: true,
+                }
+                : {
+                    searchKey: name,
+                    searchValue: formattedValue,
+                    metadataKey: "",
+                    metadataValue: "",
+                    searchData: true,
+                });
+            setOpen(false);
+        }
+    };
+    const content = (_jsxs("div", { children: [getInputField(type), _jsxs("div", { className: "md-lib-flex md-lib-items-center md-lib-justify-end md-lib-mt-2 md-lib-gap-2", children: [_jsx(Button, { onClick: handleCancel, children: "Reset" }), _jsx(Button, { onClick: handleSearch, type: "primary", children: "Search" })] })] }));
+    return (_jsx(Popover, { content: content, title: "Search", trigger: "click", placement: "bottom", open: open, onOpenChange: (newOpen) => setOpen(newOpen), children: _jsx(CiSearchIcon, { onClick: () => setOpen(!open), className: "md-lib-mt-1 md-lib-cursor-pointer md-lib-shrink-0 md-lib-text-textColor dark:md-lib-text-darkTextColor hover:md-lib-opacity-80", size: 18 }) }));
+}

package/build/MyDrive/ShareBtn.d.ts

@@ -0,0 +1,5 @@
+import { FileEntity } from "../utilities/constants/interface";
+declare const Sharebtn: ({ file }: {
+    file: FileEntity;
+}) => JSX.Element;
+export default Sharebtn;

package/build/MyDrive/ShareBtn.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { GoShareAndroid } from "react-icons/go";
+import { DriveModes } from "../utilities/constants/interface";
+import CustomButton from "../common/Button";
+import InviteTeamModal from "../settings/InviteTeamModal";
+import { get } from "lodash";
+const GoShareAndroidIcon = GoShareAndroid;
+const Sharebtn = ({ file }) => {
+    const [state, setState] = useState({
+        showShareModal: false,
+    });
+    const { showShareModal } = state;
+    const toggleShareModal = () => {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { showShareModal: !prevState.showShareModal })));
+    };
+    return (_jsxs(_Fragment, { children: [_jsx(CustomButton, { icon: _jsx(GoShareAndroidIcon, { size: 16 }), type: "primary", size: "large", label: "Share", onClick: toggleShareModal }), showShareModal && (_jsx(InviteTeamModal, { open: showShareModal, onClose: toggleShareModal, onFetchInvitations: () => { }, shareModal: true, fileIds: [get(file, "_id")], folderIds: [], inviteType: DriveModes.FILE, file: file }))] }));
+};
+export default Sharebtn;

package/build/MyDrive/ToggleView.d.ts

@@ -0,0 +1,4 @@
+export default function ToggleView({ showGrid, toggleView, }: {
+    showGrid: boolean;
+    toggleView: (value: boolean) => void;
+}): JSX.Element;

package/build/MyDrive/ToggleView.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Radio } from "antd";
+import { BsGrid, BsList } from "react-icons/bs";
+const BsListIcon = BsList;
+const BsGridIcon = BsGrid;
+export default function ToggleView({ showGrid, toggleView, }) {
+    const options = [
+        { label: _jsx(BsListIcon, {}), value: false },
+        { label: _jsx(BsGridIcon, {}), value: true },
+    ];
+    return (_jsx(Radio.Group, { options: options, onChange: (e) => toggleView(e.target.value), optionType: "button", buttonStyle: "solid", value: showGrid, size: "large", className: "grid-radio-btns md-lib-hidden md:md-lib-block" }));
+}

package/build/MyDrive/UploadStatusModal.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { FileUploadStatus } from "../utilities/constants/interface";
+interface Props {
+    open: boolean;
+    statusList: {
+        name: string;
+        status: FileUploadStatus;
+    }[];
+    onClose: () => void;
+}
+declare const UploadStatusModal: React.FC<Props>;
+export default UploadStatusModal;

package/build/MyDrive/UploadStatusModal.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Drawer, Progress } from "antd";
+import { CheckCircleOutlined, CloseCircleOutlined, LoadingOutlined, } from "@ant-design/icons";
+import { FileUploadStatus } from "../utilities/constants/interface";
+import { map } from "lodash";
+var ThemeModes;
+(function (ThemeModes) {
+    ThemeModes["SUCCESS"] = "#016A1C";
+    ThemeModes["ERROR"] = "#E42131";
+    ThemeModes["PENDING"] = "#FB8951";
+})(ThemeModes || (ThemeModes = {}));
+const getStatusProps = (status) => {
+    switch (status) {
+        case FileUploadStatus.PENDING:
+            return {
+                percent: 0, // Will show animated progress with status="active"
+                status: "active",
+                icon: _jsx(LoadingOutlined, { spin: true, className: "md-lib-text-imagesColor", style: { fontSize: '18px' } }),
+            };
+        case FileUploadStatus.SUCCESS:
+            return {
+                percent: 100,
+                status: "success",
+                icon: _jsx(CheckCircleOutlined, { className: "md-lib-text-themeGreen", style: { fontSize: '18px' } }),
+            };
+        case FileUploadStatus.ERROR:
+            return {
+                percent: 100,
+                status: "exception",
+                icon: _jsx(CloseCircleOutlined, { className: "md-lib-text-dangerColor", style: { fontSize: '18px' } }),
+            };
+    }
+};
+const UploadStatusModal = ({ open, statusList, onClose }) => {
+    return (_jsx(Drawer, { title: "Uploading File", open: open, onClose: onClose, placement: "right", width: 400, mask: false, maskClosable: true, closable: true, destroyOnClose: false, children: _jsx("div", { className: "md-lib-space-y-4 md-lib-max-h-[calc(100vh-100px)] md-lib-overflow-y-auto md-lib-pr-2", children: map(statusList, ({ name, status }) => {
+                const { percent, status: progressStatus, icon, } = getStatusProps(status);
+                return (_jsxs("div", { className: "md-lib-mb-4 md-lib-p-3 md-lib-border md-lib-border-gray-200 md-lib-rounded", children: [_jsxs("div", { className: "md-lib-flex md-lib-justify-between md-lib-items-center md-lib-mb-2", children: [_jsx("span", { className: "md-lib-truncate md-lib-w-4/5 md-lib-text-sm md-lib-font-medium", children: name }), icon] }), _jsx(Progress, { percent: status === FileUploadStatus.PENDING ? undefined : percent, status: progressStatus, showInfo: true, strokeColor: status === FileUploadStatus.PENDING
+                                ? ThemeModes.PENDING
+                                : status === FileUploadStatus.SUCCESS
+                                    ? ThemeModes.SUCCESS
+                                    : ThemeModes.ERROR, strokeWidth: 10, format: () => {
+                                if (status === FileUploadStatus.PENDING) {
+                                    return _jsx("span", { className: "md-lib-text-orange-600 md-lib-font-medium", children: "Uploading..." });
+                                }
+                                if (status === FileUploadStatus.SUCCESS) {
+                                    return _jsx("span", { className: "md-lib-text-green-600 md-lib-font-medium", children: "Complete" });
+                                }
+                                return _jsx("span", { className: "md-lib-text-red-600 md-lib-font-medium", children: "Failed" });
+                            } })] }, name));
+            }) }) }));
+};
+export default UploadStatusModal;

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

@@ -0,0 +1,8 @@
+import { CommentEntityType, FileEntity } from "../../utilities/constants/interface";
+declare function CommentEntity({ comment, refreshData, parentId, file, }: {
+    comment: CommentEntityType;
+    refreshData: (params: any) => void;
+    parentId?: string;
+    file: FileEntity;
+}): JSX.Element;
+export default CommentEntity;

package/build/MyDrive/fileDetails/CommentEntity.js

@@ -0,0 +1,102 @@
+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 { getProfile, getRelativeTime } from "../../hocs/helpers";
+import { NotificationStatus, } from "../../utilities/constants/interface";
+import { Avatar, Dropdown } from "antd";
+import { filter, get, includes } from "lodash";
+import { PiArrowBendDownRight, PiThumbsUp, PiThumbsUpFill, } from "react-icons/pi";
+import CustomButton from "../../common/Button";
+import { MoreOutlined } from "@ant-design/icons";
+import { useMemo, useState } from "react";
+import { DeleteConfirmationModal } from "../../common/CustomElements";
+import { DELETE_CONFIRMATION_MESSAGE, DELETE_MESSAGE_DESCRIPTION, DELETE_OK_TEXT, DELETE_SUCCESS, SOMETHING_WENT_WRONG, UPDATE_SUCCESS, } from "../../utilities/constants/messages";
+import { FETCH_COMMENT_URL } from "../../utilities/constants/apiUrls";
+import { showNotification } from "../../common/notifications";
+import Editor from "./Editor";
+import Comments from "./Comments";
+import { useDamConfig } from "../../hocs/DamConfigContext";
+import { createApiClient } from "../../hocs/configureAxios";
+const PiArrowBendDownRightIcon = PiArrowBendDownRight;
+const PiThumbsUpFillIcon = PiThumbsUpFill;
+const PiThumbsUpIcon = PiThumbsUp;
+function CommentEntity({ comment, refreshData, parentId, file, }) {
+    const damConfig = useDamConfig();
+    const { user } = damConfig;
+    const userId = get(user, "_id");
+    const api = useMemo(() => createApiClient(damConfig), [damConfig]);
+    const [state, setState] = useState({
+        loadingType: "",
+        showConfimation: false,
+        showEdit: false,
+        editorState: get(comment, "text", ""),
+        commentData: comment,
+        showReplies: false,
+    });
+    const { loadingType, showConfimation, showEdit, editorState, commentData, showReplies, } = state;
+    const toggleShowEdit = () => {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { showEdit: !prevState.showEdit, loadingType: "" })));
+    };
+    const toggleConfirmation = () => {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { showConfimation: !prevState.showConfimation, loadingType: "" })));
+    };
+    const toggleShowReplies = () => {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { showReplies: !prevState.showReplies })));
+    };
+    const name = useMemo(() => get(commentData, "createdBy.name", "Unknown User"), [commentData]);
+    const text = useMemo(() => get(commentData, "text", ""), [commentData]);
+    const createdAt = useMemo(() => get(commentData, "createdAt"), [commentData]);
+    const likes = useMemo(() => get(commentData, "likes.length", 0), [commentData]);
+    const likesArray = useMemo(() => get(commentData, "likes", []), [commentData]);
+    const items = [
+        {
+            key: "edit",
+            label: "Edit",
+            onClick: toggleShowEdit,
+        },
+        {
+            key: "delete",
+            label: "Delete",
+            danger: true,
+            onClick: toggleConfirmation,
+        },
+    ];
+    const onDeleteComment = () => __awaiter(this, void 0, void 0, function* () {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { loadingType: "delete" })));
+        try {
+            const response = yield api.delete(FETCH_COMMENT_URL.replace(":commentId", get(commentData, "_id")));
+            refreshData({});
+            toggleConfirmation();
+            showNotification(get(response, "data.message", DELETE_SUCCESS), NotificationStatus.SUCCESS);
+        }
+        catch (error) {
+            setState((prevState) => (Object.assign(Object.assign({}, prevState), { loadingType: "" })));
+            showNotification(get(error, "message", SOMETHING_WENT_WRONG), NotificationStatus.ERROR);
+        }
+    });
+    const handleUpdateComment = (payload, loadingType) => __awaiter(this, void 0, void 0, function* () {
+        setState((prevState) => (Object.assign(Object.assign({}, prevState), { loadingType })));
+        try {
+            const response = yield api.put(FETCH_COMMENT_URL.replace(":commentId", get(commentData, "_id")), payload);
+            setState((prevState) => (Object.assign(Object.assign({}, prevState), { commentData: get(response, "data.comment", commentData), loadingType: "", editorState: get(response, "data.comment.text", ""), showEdit: false })));
+            showNotification(get(response, "data.message", UPDATE_SUCCESS), NotificationStatus.SUCCESS);
+        }
+        catch (error) {
+            setState((prevState) => (Object.assign(Object.assign({}, prevState), { loadingType: "" })));
+            showNotification(get(error, "message", SOMETHING_WENT_WRONG), NotificationStatus.ERROR);
+        }
+    });
+    return (_jsxs(_Fragment, { children: [showEdit ? (_jsxs("div", { className: "md-lib-flex md-lib-flex-col md-lib-gap-2 md-lib-transition-all md-lib-duration-300 md-lib-ease-in-out md-lib-opacity-100 md-lib-animate-fade-in", children: [_jsx(Editor, { setEditorState: (state) => setState((prevState) => (Object.assign(Object.assign({}, prevState), { editorState: state }))), editorState: editorState }), _jsxs("div", { className: "md-lib-flex md-lib-justify-end md-lib-pt-2 md-lib-gap-2", children: [_jsx(CustomButton, { label: "Cancel", onClick: toggleShowEdit }), _jsx(CustomButton, { type: "primary", label: "Update", onClick: () => handleUpdateComment({ text: editorState }, "text"), loading: loadingType === "text" })] })] }, get(commentData, "_id"))) : (_jsxs("div", { className: `md-lib-transition-all md-lib-duration-300 md-lib-ease-in-out md-lib-animate-fade-in ${parentId ? "md-lib-bg-borderColor md-lib-dark:bg-darkBorderColor" : ""}`, children: [_jsxs("div", { className: "md-lib-flex md-lib-items-center md-lib-justify-between", children: [_jsxs("div", { className: "md-lib-flex md-lib-items-center md-lib-gap-2", children: [_jsx(Avatar, { className: "md-lib-bg-secondaryTextColor dark:md-lib-bg-darkSecondaryTextColor md-lib-cursor-default", size: 36, children: getProfile(name) }), _jsx("p", { className: "md-lib-font-semibold md-lib-text-textColor dark:md-lib-text-darkTextColor md-lib-text-base", children: name })] }), _jsxs("div", { className: "md-lib-flex md-lib-items-center md-lib-gap-2", children: [_jsx("p", { className: "md-lib-text-xs md-lib-text-secondaryTextColor dark:md-lib-text-darkSecondaryTextColor", children: getRelativeTime(createdAt) }), userId === get(commentData, "createdBy._id") && (_jsx(Dropdown, { menu: { items }, trigger: ["click"], placement: "bottomRight", children: _jsx(MoreOutlined, {}) }))] })] }), _jsx("div", { className: "md-lib-py-4 md-lib-text-textColor dark:md-lib-text-darkTextColor md-lib-pr-[10px] md-lib-text-base", dangerouslySetInnerHTML: { __html: text } }), _jsxs("div", { className: "md-lib-flex md-lib-items-center md-lib-justify-between md-lib-pr-[10px]", children: [_jsxs("div", { className: "md-lib-flex md-lib-items-center md-lib-gap-2", children: [_jsxs("p", { className: "md-lib-p-2 md-lib-text-interactiveTextColor dark:md-lib-text-darkTextColor md-lib-text-base md-lib-font-medium", children: [likes, " ", likes === 1 ? "like" : "likes"] }), _jsx(CustomButton, { type: "text", icon: _jsx(PiArrowBendDownRightIcon, { size: 24 }), size: "large", className: "md-lib-text-interactiveTextColor dark:md-lib-text-darkTextColor md-lib-text-base md-lib-font-medium", label: "Reply", onClick: toggleShowReplies })] }), _jsx(CustomButton, { type: "text", loading: loadingType === "like", icon: loadingType === "like" ? (_jsx(_Fragment, {})) : includes(likesArray, userId) ? (_jsx(PiThumbsUpFillIcon, { size: 24 })) : (_jsx(PiThumbsUpIcon, { size: 24 })), size: "large", className: "md-lib-text-interactiveTextColor dark:md-lib-text-darkTextColor", label: "", onClick: () => handleUpdateComment({
+                                    likes: includes(likesArray, userId)
+                                        ? filter(likesArray, (id) => id !== userId)
+                                        : [...likesArray, userId],
+                                }, "like") })] })] }, get(commentData, "_id"))), showConfimation && (_jsx(DeleteConfirmationModal, { showDeleteModal: showConfimation, toggleDeleteModal: toggleConfirmation, okText: DELETE_OK_TEXT, onOk: onDeleteComment, loading: loadingType === "delete", description: DELETE_CONFIRMATION_MESSAGE.replace(":action", "Delete").replace(" :entity", ""), subHeading: DELETE_MESSAGE_DESCRIPTION })), showReplies && (_jsxs("div", { className: "md-lib-mt-3 md-lib-ml-12 md-lib-flex md-lib-flex-col md-lib-gap-3 md-lib-animate-fade-in md-lib-transition-all md-lib-duration-300 md-lib-ease-in-out", children: [_jsx("p", { className: "md-lib-text-sm md-lib-text-secondaryTextColor dark:md-lib-text-darkSecondaryTextColor md-lib-font-semibold", children: "Replies" }), _jsx(Comments, { parentId: get(comment, "_id"), file: file })] }))] }));
+}
+export default CommentEntity;

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

@@ -0,0 +1,6 @@
+import { FileEntity } from "../../utilities/constants/interface";
+declare const Comments: ({ file, parentId, }: {
+    file?: FileEntity;
+    parentId?: string;
+}) => JSX.Element;
+export default Comments;