@solidstarters/solid-core-ui 1.1.210 → 1.1.211

package/dist/components/core/module/CreateModule.js

@@ -1,51 +1,4 @@
 "use client";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-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());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { BackButton } from "../../../components/common/BackButton";
 import { CancelButton } from "../../../components/common/CancelButton";
@@ -74,33 +27,31 @@ import { classNames } from "primereact/utils";
 import { useEffect, useRef, useState } from "react";
 import { useDropzone } from "react-dropzone";
 import * as Yup from "yup";
-var footer = (_jsxs(_Fragment, { children: [_jsx(Divider, {}), _jsx("p", { className: "mt-2", children: "Suggestions" }), _jsxs("ul", { className: "pl-2 ml-2 mt-0 line-height-3", children: [_jsx("li", { children: "At least one lowercase" }), _jsx("li", { children: "At least one uppercase" }), _jsx("li", { children: "At least one numeric" }), _jsx("li", { children: "Minimum 8 characters" })] })] }));
-var CreateModule = function (_a) {
-    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
-    var data = _a.data;
-    var toast = useRef(null);
-    var router = useRouter();
-    var pathname = usePathname();
-    var _p = useState(false), isDialogVisible = _p[0], setDialogVisible = _p[1];
-    var _q = useState(false), isImageDialogVisible = _q[0], setImageDialogVisible = _q[1];
-    var _r = useState(data ? true : false), isLoadingData = _r[0], setIsLoadingData = _r[1];
-    var _s = useState(null), menuIconPreview = _s[0], setmenuIconPreview = _s[1];
-    var _t = useState(0), uploadProgress = _t[0], setUploadProgress = _t[1];
-    var _u = useState(false), uploadCompleted = _u[0], setUploadCompleted = _u[1];
-    var _v = useState(null), fileDetails = _v[0], setFileDetails = _v[1];
-    var _w = useState("0 MB"), uploadedSize = _w[0], setUploadedSize = _w[1];
-    var _x = useState("0 KB"), totalSize = _x[0], setTotalSize = _x[1];
-    var formatFileSize = function (size) {
+const footer = (_jsxs(_Fragment, { children: [_jsx(Divider, {}), _jsx("p", { className: "mt-2", children: "Suggestions" }), _jsxs("ul", { className: "pl-2 ml-2 mt-0 line-height-3", children: [_jsx("li", { children: "At least one lowercase" }), _jsx("li", { children: "At least one uppercase" }), _jsx("li", { children: "At least one numeric" }), _jsx("li", { children: "Minimum 8 characters" })] })] }));
+const CreateModule = ({ data }) => {
+    const toast = useRef(null);
+    const router = useRouter();
+    const pathname = usePathname();
+    const [isDialogVisible, setDialogVisible] = useState(false);
+    const [isImageDialogVisible, setImageDialogVisible] = useState(false);
+    const [isLoadingData, setIsLoadingData] = useState(data ? true : false);
+    const [menuIconPreview, setmenuIconPreview] = useState(null);
+    const [uploadProgress, setUploadProgress] = useState(0);
+    const [uploadCompleted, setUploadCompleted] = useState(false);
+    const [fileDetails, setFileDetails] = useState(null);
+    const [uploadedSize, setUploadedSize] = useState("0 MB");
+    const [totalSize, setTotalSize] = useState("0 KB");
+    const formatFileSize = (size) => {
         return size >= 1024 * 1024
-            ? "".concat((size / (1024 * 1024)).toFixed(1), " MB")
-            : "".concat((size / 1024).toFixed(1), " KB");
+            ? `${(size / (1024 * 1024)).toFixed(1)} MB`
+            : `${(size / 1024).toFixed(1)} KB`;
     };
-    var _y = useCreatemoduleMutation(), CreateModule = _y[0], _z = _y[1], isLoading = _z.isLoading, isSuccess = _z.isSuccess, isError = _z.isError, error = _z.error, newModule = _z.data;
-    var _0 = useUpdatemoduleMutation(), UpdateModule = _0[0], _1 = _0[1], isModuleUpdateLoading = _1.isLoading, isModuleUpdateSuccess = _1.isSuccess, isModuleUpdateError = _1.isError, updateModuleError = _1.error, updatedModule = _1.data;
-    var _2 = useGetFieldDefaultMetaDataQuery(null), fieldDefaultMetaData = _2.data, isFieldDefaultMetaDataLoading = _2.isLoading, FieldDefaultMetaDataError = _2.error, fieldDefaultMetaDataRefech = _2.refetch;
-    var _3 = useDeletemoduleMutation(), deleteModule = _3[0], _4 = _3[1], isModuleDeleted = _4.isLoading, isDeleteModuleSuceess = _4.isSuccess, isModuleDeleteError = _4.isError, ModuleDeleteError = _4.error, DeletedModule = _4.data;
-    var _5 = useDeleteMediaMutation(), deleteMedia = _5[0], _6 = _5[1], isMediaDeleted = _6.isLoading, isDeleteMediaSuceess = _6.isSuccess, isMediaDeleteError = _6.isError, mediaDeleteError = _6.error, DeletedMedia = _6.data;
-    var initialValues = {
+    const [CreateModule, { isLoading, isSuccess, isError, error, data: newModule },] = useCreatemoduleMutation();
+    const [UpdateModule, { isLoading: isModuleUpdateLoading, isSuccess: isModuleUpdateSuccess, isError: isModuleUpdateError, error: updateModuleError, data: updatedModule },] = useUpdatemoduleMutation();
+    const { data: fieldDefaultMetaData, isLoading: isFieldDefaultMetaDataLoading, error: FieldDefaultMetaDataError, refetch: fieldDefaultMetaDataRefech } = useGetFieldDefaultMetaDataQuery(null);
+    const [deleteModule, { isLoading: isModuleDeleted, isSuccess: isDeleteModuleSuceess, isError: isModuleDeleteError, error: ModuleDeleteError, data: DeletedModule },] = useDeletemoduleMutation();
+    const [deleteMedia, { isLoading: isMediaDeleted, isSuccess: isDeleteMediaSuceess, isError: isMediaDeleteError, error: mediaDeleteError, data: DeletedMedia },] = useDeleteMediaMutation();
+    const initialValues = {
         name: data ? data.name : "",
         displayName: data ? data.displayName : "",
         description: data ? data.description : "",
@@ -109,7 +60,7 @@ var CreateModule = function (_a) {
         menuIconUrl: data ? data.menuIconUrl : "",
         menuSequenceNumber: data ? data.menuSequenceNumber : ""
     };
-    var validationSchema = Yup.object({
+    const validationSchema = Yup.object({
         name: Yup.string()
             // .matches(
             //   /^[a-z]+(-[a-z]+)*$/,
@@ -123,55 +74,49 @@ var CreateModule = function (_a) {
         isSystem: Yup.boolean(),
         menuSequenceNumber: Yup.number(),
     });
-    var dataSources = [
+    const dataSources = [
         { label: "Mysql", value: "mysql" },
         { label: "Postgres", value: "postgres" },
         { label: "Mssql", value: "mssql" },
         { label: "Oracle", value: "oracle" },
         { label: "Mariadb", value: "mariadb" },
     ];
-    var isFormFieldValid = function (formik, fieldName) {
-        return formik.touched[fieldName] && formik.errors[fieldName];
-    };
-    var formik = useFormik({
-        initialValues: initialValues,
-        validationSchema: validationSchema,
+    const isFormFieldValid = (formik, fieldName) => formik.touched[fieldName] && formik.errors[fieldName];
+    const formik = useFormik({
+        initialValues,
+        validationSchema,
         enableReinitialize: true,
-        onSubmit: function (values) { return __awaiter(void 0, void 0, void 0, function () {
-            var formData;
-            return __generator(this, function (_a) {
-                try {
-                    formData = new FormData();
-                    formData.append('name', values.name);
-                    formData.append('displayName', values.displayName.trim());
-                    formData.append('description', values.description);
-                    formData.append('defaultDataSource', values.defaultDataSource);
-                    formData.append('isSystem', values.isSystem == "true" ? "true" : "");
-                    if (values.menuIconUrl) {
-                        formData.append('menuIconUrl', values.menuIconUrl);
-                    }
-                    formData.append('menuSequenceNumber', values.menuSequenceNumber);
-                    // let formData = new FormData();
-                    // formData.append('name', values.name);
-                    // formData.append('displayName', values.displayName);
-                    // formData.append('description', values.description);
-                    // formData.append('defaultDataSource', values.defaultDataSource);
-                    if (data) {
-                        UpdateModule({ id: data.id, data: formData });
-                    }
-                    else {
-                        CreateModule(formData);
-                    }
+        onSubmit: async (values) => {
+            try {
+                let formData = new FormData();
+                formData.append('name', values.name);
+                formData.append('displayName', values.displayName.trim());
+                formData.append('description', values.description);
+                formData.append('defaultDataSource', values.defaultDataSource);
+                formData.append('isSystem', values.isSystem == "true" ? "true" : "");
+                if (values.menuIconUrl) {
+                    formData.append('menuIconUrl', values.menuIconUrl);
                 }
-                catch (err) {
-                    console.error(ERROR_MESSAGES.FAILED_CREATE_MENU, err);
+                formData.append('menuSequenceNumber', values.menuSequenceNumber);
+                // let formData = new FormData();
+                // formData.append('name', values.name);
+                // formData.append('displayName', values.displayName);
+                // formData.append('description', values.description);
+                // formData.append('defaultDataSource', values.defaultDataSource);
+                if (data) {
+                    UpdateModule({ id: data.id, data: formData });
                 }
-                return [2 /*return*/];
-            });
-        }); },
+                else {
+                    CreateModule(formData);
+                }
+            }
+            catch (err) {
+                console.error(ERROR_MESSAGES.FAILED_CREATE_MENU, err);
+            }
+        },
     });
-    var handleDropmenuIcon = function (acceptedFiles) {
-        var file = acceptedFiles[0];
+    const handleDropmenuIcon = (acceptedFiles) => {
+        const file = acceptedFiles[0];
         if (!file)
             return;
         setUploadCompleted(false);
@@ -179,19 +124,19 @@ var CreateModule = function (_a) {
         setTotalSize(formatFileSize(file.size));
         setUploadedSize("0 KB");
         setFileDetails({ name: file.name, type: file.type });
-        var reader = new FileReader();
-        reader.onloadstart = function () {
+        const reader = new FileReader();
+        reader.onloadstart = () => {
             setUploadProgress(0);
             setUploadedSize("0 KB");
         };
-        reader.onprogress = function (event) {
+        reader.onprogress = (event) => {
             if (event.loaded && event.total) {
-                var percent = Math.round((event.loaded / event.total) * 100);
+                const percent = Math.round((event.loaded / event.total) * 100);
                 setUploadProgress(percent);
                 setUploadedSize(formatFileSize(event.loaded));
             }
         };
-        reader.onloadend = function () {
+        reader.onloadend = () => {
             setUploadProgress(100);
             setUploadCompleted(true);
             setUploadedSize(totalSize); // Set uploaded size to total size after completion
@@ -199,7 +144,7 @@ var CreateModule = function (_a) {
         reader.readAsDataURL(file);
         formik.setFieldValue("menuIconUrl", file);
     };
-    var _7 = useDropzone({
+    const { getRootProps: getRootPropsmenuIcon, getInputProps: getInputPropsmenuIcon, isDragActive: isDragActivemenuIcon } = useDropzone({
         onDrop: handleDropmenuIcon,
         accept: {
             'image/jpeg': [],
@@ -207,12 +152,11 @@ var CreateModule = function (_a) {
             'image/svg+xml': ['.svg']
         },
         maxSize: 2 * 1024 * 1024, // 2MB
-    }), getRootPropsmenuIcon = _7.getRootProps, getInputPropsmenuIcon = _7.getInputProps, isDragActivemenuIcon = _7.isDragActive;
-    useEffect(function () {
-        var _a;
+    });
+    useEffect(() => {
         if (data) {
-            setmenuIconPreview("".concat(process.env.API_URL, "/").concat(data.menuIconUrl));
-            var fileName = (_a = data === null || data === void 0 ? void 0 : data.menuIconUrl) === null || _a === void 0 ? void 0 : _a.split("/").pop(); // Extract filename from URL
+            setmenuIconPreview(`${process.env.API_URL}/${data.menuIconUrl}`);
+            const fileName = data?.menuIconUrl?.split("/").pop(); // Extract filename from URL
             setFileDetails({ name: fileName || "Unknown File", type: "Uploaded File" });
             // Set the upload progress to 100% since the file is already uploaded
             setUploadProgress(100);
@@ -221,140 +165,120 @@ var CreateModule = function (_a) {
             formik.setFieldValue("menuIconUrl", data.menuIconUrl);
         }
     }, [data]);
-    var handleCancelUpload = function (e) {
+    const handleCancelUpload = (e) => {
         e.stopPropagation();
         setUploadProgress(0);
         setUploadCompleted(false);
         setFileDetails(null);
         formik.setFieldValue("menuIconUrl", null);
     };
-    var deteleAction = function () { return __awaiter(void 0, void 0, void 0, function () {
-        return __generator(this, function (_a) {
-            deleteModule(data.id);
-            return [2 /*return*/];
-        });
-    }); };
-    var showError = function () { return __awaiter(void 0, void 0, void 0, function () {
-        var errors, errorMessages;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0: return [4 /*yield*/, formik.validateForm()];
-                case 1:
-                    errors = _a.sent();
-                    errorMessages = Object.values(errors);
-                    if (errorMessages.length > 0 && toast.current) {
-                        handleError(errorMessages);
-                        // toast.current.show({
-                        //   severity: "success",
-                        //   summary: "Can you send me the report?",
-                        //   // sticky: true,
-                        //   life: 3000,
-                        //   //@ts-ignore
-                        //   content: (props) => (
-                        //     <div
-                        //       className="flex flex-column align-items-left"
-                        //       style={{ flex: "1" }}
-                        //     >
-                        //       {errorMessages.map((m: any, index) => (
-                        //         <div className="flex align-items-center gap-2" key={index}>
-                        //           <span className="font-bold text-900">{m}</span>
-                        //         </div>
-                        //       ))}
-                        //     </div>
-                        //   ),
-                        // });
-                    }
-                    return [2 /*return*/];
-            }
-        });
-    }); };
-    var showCustomeError = function (error) { return __awaiter(void 0, void 0, void 0, function () {
-        return __generator(this, function (_a) {
-            if (error.length > 0 && toast.current) {
-                toast.current.show({
-                    severity: "error",
-                    summary: ERROR_MESSAGES.SEND_REPORT,
-                    // sticky: true,
-                    life: 3000,
-                    //@ts-ignore
-                    content: function (props) { return (_jsx("div", { className: "flex flex-column align-items-left", style: { flex: "1" }, children: error.map(function (m, index) { return (_jsx("div", { className: "flex align-items-center gap-2", children: _jsx("span", { className: "font-bold text-900", children: m }) }, index)); }) })); },
-                });
-            }
-            return [2 /*return*/];
-        });
-    }); };
-    useEffect(function () {
+    const deteleAction = async () => {
+        deleteModule(data.id);
+    };
+    const showError = async () => {
+        const errors = await formik.validateForm(); // Trigger validation and get the updated errors
+        const errorMessages = Object.values(errors);
+        if (errorMessages.length > 0 && toast.current) {
+            handleError(errorMessages);
+            // toast.current.show({
+            //   severity: "success",
+            //   summary: "Can you send me the report?",
+            //   // sticky: true,
+            //   life: 3000,
+            //   //@ts-ignore
+            //   content: (props) => (
+            //     <div
+            //       className="flex flex-column align-items-left"
+            //       style={{ flex: "1" }}
+            //     >
+            //       {errorMessages.map((m: any, index) => (
+            //         <div className="flex align-items-center gap-2" key={index}>
+            //           <span className="font-bold text-900">{m}</span>
+            //         </div>
+            //       ))}
+            //     </div>
+            //   ),
+            // });
+        }
+    };
+    const showCustomeError = async (error) => {
+        if (error.length > 0 && toast.current) {
+            toast.current.show({
+                severity: "error",
+                summary: ERROR_MESSAGES.SEND_REPORT,
+                // sticky: true,
+                life: 3000,
+                //@ts-ignore
+                content: (props) => (_jsx("div", { className: "flex flex-column align-items-left", style: { flex: "1" }, children: error.map((m, index) => (_jsx("div", { className: "flex align-items-center gap-2", children: _jsx("span", { className: "font-bold text-900", children: m }) }, index))) })),
+            });
+        }
+    };
+    useEffect(() => {
         if (isSuccess == true || isDeleteModuleSuceess == true || isModuleUpdateSuccess == true) {
-            router.push("/admin/core/solid-core/module-metadata/list");
+            router.push(`/admin/core/solid-core/module-metadata/list`);
         }
     }, [isSuccess, isDeleteModuleSuceess, isModuleUpdateSuccess]);
-    var serachDDefaultDataSource = function (event) { return __awaiter(void 0, void 0, void 0, function () {
-        var query, filterredData, transformedData;
-        return __generator(this, function (_a) {
-            query = event.query;
-            try {
-                filterredData = fieldDefaultMetaData.data.dataSource.filter(function (t) { return t.name.toLowerCase().startsWith(query.toLowerCase()); });
-                transformedData = filterredData.map(function (e) { return ({ label: e.name, value: e.name, type: e.type }); });
-                return [2 /*return*/, transformedData];
-            }
-            catch (error) {
-                console.error(ERROR_MESSAGES.FETCHING_ITEMS, error);
-                return [2 /*return*/, []];
-            }
-            return [2 /*return*/];
-        });
-    }); };
+    const serachDDefaultDataSource = async (event) => {
+        const query = event.query;
+        try {
+            const filterredData = fieldDefaultMetaData.data.dataSource.filter((t) => t.name.toLowerCase().startsWith(query.toLowerCase()));
+            const transformedData = filterredData.map((e) => ({ label: e.name, value: e.name, type: e.type }));
+            return transformedData;
+        }
+        catch (error) {
+            console.error(ERROR_MESSAGES.FETCHING_ITEMS, error);
+            return [];
+        }
+    };
     // Error Handler 
-    useEffect(function () {
-        var errors = [
-            { isError: isError, error: error },
+    useEffect(() => {
+        const errors = [
+            { isError, error },
             { isError: isModuleUpdateError, error: updateModuleError },
             { isError: isModuleDeleteError, error: ModuleDeleteError },
             { isError: isMediaDeleteError, error: mediaDeleteError },
         ];
         // Handle any error
-        errors.forEach(function (_a) {
-            var isError = _a.isError, error = _a.error;
+        errors.forEach(({ isError, error }) => {
             if (isError && error) {
                 handleError(error); // Call the centralized error handler
             }
         });
     }, [isError, isModuleUpdateError, isModuleDeleteError, isMediaDeleteError]);
-    var op = useRef(null);
-    var formActionDropdown = function () {
+    const op = useRef(null);
+    const formActionDropdown = () => {
         return (_jsxs("div", { children: [_jsx(Button, { outlined: true, severity: "secondary", type: "button", icon: 'pi pi-cog', size: "small", className: "surface-card p-0", style: {
                         height: 33.06,
                         width: 33.06
-                    }, onClick: function (e) {
-                        // @ts-ignore 
-                        return op.current.toggle(e);
-                    } }), _jsx(OverlayPanel, { ref: op, className: "solid-custom-overlay", children: _jsx("div", { className: "flex flex-column gap-1 p-1", children: _jsx(Button, { text: true, type: "button", className: "w-8rem text-left gap-2", label: "Delete", size: "small", iconPos: "left", severity: "danger", icon: 'pi pi-trash', onClick: deteleAction }) }) })] }));
+                    }, onClick: (e) => 
+                    // @ts-ignore 
+                    op.current.toggle(e) }), _jsx(OverlayPanel, { ref: op, className: "solid-custom-overlay", children: _jsx("div", { className: "flex flex-column gap-1 p-1", children: _jsx(Button, { text: true, type: "button", className: "w-8rem text-left gap-2", label: "Delete", size: "small", iconPos: "left", severity: "danger", icon: 'pi pi-trash', onClick: deteleAction }) }) })] }));
     };
     return (_jsxs("div", { className: "solid-form-wrapper", children: [_jsx(Toast, { ref: toast }), _jsxs("form", { style: { width: '100%', borderRight: '1px solid var(--primary-light-color' }, onSubmit: formik.handleSubmit, children: [_jsx("div", { className: "solid-form-header", children: pathname.includes('new') ?
                             _jsxs(_Fragment, { children: [_jsxs("div", { className: "flex align-items-center gap-3", children: [_jsx(BackButton, {}), _jsx("div", { className: "form-wrapper-title", children: "Create Module" })] }), _jsxs("div", { className: "gap-3 flex", children: [formik.dirty &&
-                                                _jsx(Button, { label: "Save", size: "small", onClick: function () { return showError(); }, type: "submit" }), _jsx(CancelButton, {})] })] })
+                                                _jsx(Button, { label: "Save", size: "small", onClick: () => showError(), type: "submit" }), _jsx(CancelButton, {})] })] })
                             :
-                                _jsxs(_Fragment, { children: [_jsxs("div", { className: "flex align-items-center gap-3", children: [_jsx(BackButton, {}), _jsx("div", { className: "form-wrapper-title", children: " Edit Module" })] }), _jsx("div", { className: "gap-3 flex", children: (data === null || data === void 0 ? void 0 : data.isSystem) !== true &&
+                                _jsxs(_Fragment, { children: [_jsxs("div", { className: "flex align-items-center gap-3", children: [_jsx(BackButton, {}), _jsx("div", { className: "form-wrapper-title", children: " Edit Module" })] }), _jsx("div", { className: "gap-3 flex", children: data?.isSystem !== true &&
                                                 _jsxs(_Fragment, { children: [formik.dirty &&
-                                                            _jsx(Button, { label: "Save", size: "small", onClick: function () { return showError(); }, type: "submit" }), _jsx(CancelButton, {}), formActionDropdown()] }) })] }) }), _jsx(SolidFormHeader, {}), _jsxs("div", { className: "px-4 py-3 md:p-4 solid-form-content", children: [_jsxs(Panel, { header: "Basic Info", className: "solid-column-panel", children: [_jsxs("div", { className: "formgrid grid mt-3", children: [_jsxs("div", { className: "field col-12 pb-3 lg:pb-0 lg:col-6 flex flex-column gap-2", children: [_jsxs("label", { htmlFor: "displayName", className: "form-field-label", children: ["Display Name ", _jsx("span", { style: { color: 'red' }, children: "*" })] }), _jsx(InputText, { disabled: data ? true : false, type: "text", id: "displayName", name: "displayName", 
+                                                            _jsx(Button, { label: "Save", size: "small", onClick: () => showError(), type: "submit" }), _jsx(CancelButton, {}), formActionDropdown()] }) })] }) }), _jsx(SolidFormHeader, {}), _jsxs("div", { className: "px-4 py-3 md:p-4 solid-form-content", children: [_jsxs(Panel, { header: "Basic Info", className: "solid-column-panel", children: [_jsxs("div", { className: "formgrid grid mt-3", children: [_jsxs("div", { className: "field col-12 pb-3 lg:pb-0 lg:col-6 flex flex-column gap-2", children: [_jsxs("label", { htmlFor: "displayName", className: "form-field-label", children: ["Display Name ", _jsx("span", { style: { color: 'red' }, children: "*" })] }), _jsx(InputText, { disabled: data ? true : false, type: "text", id: "displayName", name: "displayName", 
                                                         // onChange={formik.handleChange}
-                                                        onChange: function (e) {
+                                                        onChange: (e) => {
                                                             formik.handleChange(e);
-                                                            var _a = getSingularAndPlural(e.target.value), toKebabCase = _a.toKebabCase, toSnakeCase = _a.toSnakeCase, toPluralCamelCase = _a.toPluralCamelCase;
+                                                            const { toKebabCase, toSnakeCase, toPluralCamelCase } = getSingularAndPlural(e.target.value);
                                                             if (pathname.includes('new')) {
                                                                 formik.setFieldValue("name", toKebabCase);
                                                             }
                                                         }, value: formik.values.displayName, className: classNames("", {
                                                             "p-invalid": isFormFieldValid(formik, "displayName"),
-                                                        }) }), isFormFieldValid(formik, "displayName") && (_jsx(Message, { severity: "error", text: (_c = (_b = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _b === void 0 ? void 0 : _b.displayName) === null || _c === void 0 ? void 0 : _c.toString() }))] }), _jsxs("div", { className: "field col-12  lg:col-6 flex flex-column gap-2", children: [_jsxs("label", { htmlFor: "name", className: "form-field-label", children: ["Name ", _jsx("span", { style: { color: 'red' }, children: "*" })] }), _jsx(InputText, { disabled: true, type: "text", id: "name", name: "name", onChange: formik.handleChange, value: formik.values.name, className: classNames("", {
+                                                        }) }), isFormFieldValid(formik, "displayName") && (_jsx(Message, { severity: "error", text: formik?.errors?.displayName?.toString() }))] }), _jsxs("div", { className: "field col-12  lg:col-6 flex flex-column gap-2", children: [_jsxs("label", { htmlFor: "name", className: "form-field-label", children: ["Name ", _jsx("span", { style: { color: 'red' }, children: "*" })] }), _jsx(InputText, { disabled: true, type: "text", id: "name", name: "name", onChange: formik.handleChange, value: formik.values.name, className: classNames("", {
                                                             "p-invalid": isFormFieldValid(formik, "name"),
-                                                        }) }), isFormFieldValid(formik, "name") && (_jsx(Message, { severity: "error", text: (_e = (_d = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _d === void 0 ? void 0 : _d.name) === null || _e === void 0 ? void 0 : _e.toString() }))] })] }), _jsxs("div", { className: "formgrid grid mt-4", children: [_jsxs("div", { className: "field col-12 pb-3 ld:pb-0 lg:col-6 flex flex-column gap-2", children: [_jsx("label", { htmlFor: "description", className: "form-field-label", children: "Menu Sequence Number" }), _jsx(InputText, { id: "menuSequenceNumber", type: "number", onChange: formik.handleChange, min: 0, value: formik.values.menuSequenceNumber, className: classNames("", {
+                                                        }) }), isFormFieldValid(formik, "name") && (_jsx(Message, { severity: "error", text: formik?.errors?.name?.toString() }))] })] }), _jsxs("div", { className: "formgrid grid mt-4", children: [_jsxs("div", { className: "field col-12 pb-3 ld:pb-0 lg:col-6 flex flex-column gap-2", children: [_jsx("label", { htmlFor: "description", className: "form-field-label", children: "Menu Sequence Number" }), _jsx(InputText, { id: "menuSequenceNumber", type: "number", onChange: formik.handleChange, min: 0, value: formik.values.menuSequenceNumber, className: classNames("", {
                                                             "p-invalid": isFormFieldValid(formik, "menuSequenceNumber"),
-                                                        }) }), isFormFieldValid(formik, "menuSequenceNumber") && (_jsx(Message, { severity: "error", text: (_g = (_f = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _f === void 0 ? void 0 : _f.menuSequenceNumber) === null || _g === void 0 ? void 0 : _g.toString() }))] }), _jsxs("div", { className: "field col-12 lg:col-6 flex flex-column gap-2", children: [_jsxs("label", { htmlFor: "description", className: "form-field-label", children: ["Description ", _jsx("span", { style: { color: 'red' }, children: "*" })] }), _jsx(InputTextarea, { id: "description", name: "description", onChange: formik.handleChange, value: formik.values.description, className: classNames("", {
+                                                        }) }), isFormFieldValid(formik, "menuSequenceNumber") && (_jsx(Message, { severity: "error", text: formik?.errors?.menuSequenceNumber?.toString() }))] }), _jsxs("div", { className: "field col-12 lg:col-6 flex flex-column gap-2", children: [_jsxs("label", { htmlFor: "description", className: "form-field-label", children: ["Description ", _jsx("span", { style: { color: 'red' }, children: "*" })] }), _jsx(InputTextarea, { id: "description", name: "description", onChange: formik.handleChange, value: formik.values.description, className: classNames("", {
                                                             "p-invalid": isFormFieldValid(formik, "description"),
-                                                        }), rows: 5, cols: 30 }), isFormFieldValid(formik, "description") && (_jsx(Message, { severity: "error", text: (_j = (_h = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _h === void 0 ? void 0 : _h.description) === null || _j === void 0 ? void 0 : _j.toString() }))] })] })] }), _jsx(Panel, { header: "Configurations", className: "solid-column-panel mt-4", children: _jsxs("div", { className: "formgrid grid mt-3", children: [_jsxs("div", { className: "field col-12 pb-3 lg:pb-0 lg:col-6 flex flex-column gap-2", children: [_jsx("label", { htmlFor: "defaultDataSource", className: "form-field-label", children: "Default Data Source" }), _jsx(SingleSelectAutoCompleteField, { disabled: data ? true : false, formik: formik, isFormFieldValid: isFormFieldValid, 
+                                                        }), rows: 5, cols: 30 }), isFormFieldValid(formik, "description") && (_jsx(Message, { severity: "error", text: formik?.errors?.description?.toString() }))] })] })] }), _jsx(Panel, { header: "Configurations", className: "solid-column-panel mt-4", children: _jsxs("div", { className: "formgrid grid mt-3", children: [_jsxs("div", { className: "field col-12 pb-3 lg:pb-0 lg:col-6 flex flex-column gap-2", children: [_jsx("label", { htmlFor: "defaultDataSource", className: "form-field-label", children: "Default Data Source" }), _jsx(SingleSelectAutoCompleteField, { disabled: data ? true : false, formik: formik, isFormFieldValid: isFormFieldValid, 
                                                     // relationField={false}
-                                                    fieldName: "defaultDataSource", fieldNameId: null, labelKey: "label", valueKey: "value", searchData: serachDDefaultDataSource, existingData: formik.values.defaultDataSource }, "defaultDataSource"), isFormFieldValid(formik, "defaultDataSource") && (_jsx(Message, { severity: "error", text: (_l = (_k = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _k === void 0 ? void 0 : _k.defaultDataSource) === null || _l === void 0 ? void 0 : _l.toString() }))] }), _jsxs("div", { className: "field col-12 lg:col-6 flex flex-column gap-2", children: [_jsxs("label", { htmlFor: "menuIconUrl", className: "form-label form-field-label", children: ["Menu Icon ", _jsx("small", { className: "text-red-500 helper-text", children: "(only svg, png and jpeg are allowed)" })] }), _jsxs("div", __assign({}, getRootPropsmenuIcon(), { className: "solid-dropzone-wrapper", children: [_jsx("input", __assign({}, getInputPropsmenuIcon())), _jsx(DropzonePlaceholder, {})] })), isFormFieldValid(formik, "menuIconUrl") && (_jsx(Message, { severity: "error", text: (_o = (_m = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _m === void 0 ? void 0 : _m.menuIconUrl) === null || _o === void 0 ? void 0 : _o.toString() })), fileDetails && (_jsxs("div", { className: "solid-file-upload-wrapper", children: [_jsxs("div", { className: "flex align-items-center gap-2", children: [_jsx(FileReaderExt, { fileDetails: fileDetails }), _jsxs("div", { className: "w-full flex flex-column gap-1", children: [_jsxs("div", { className: "flex align-items-center justify-content-between", children: [_jsx("div", { className: "font-bold solid-module-mobile-text-wrapper", children: fileDetails.name }), _jsx("div", { className: "cancel-upload-button", onClick: handleCancelUpload, children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "6", height: "6", viewBox: "0 0 6 6", fill: "none", children: _jsx("path", { d: "M0.6 6L0 5.4L2.4 3L0 0.6L0.6 0L3 2.4L5.4 0L6 0.6L3.6 3L6 5.4L5.4 6L3 3.6L0.6 6Z", fill: "#4B4D52" }) }) })] }), uploadCompleted ?
+                                                    fieldName: "defaultDataSource", fieldNameId: null, labelKey: "label", valueKey: "value", searchData: serachDDefaultDataSource, existingData: formik.values.defaultDataSource }, "defaultDataSource"), isFormFieldValid(formik, "defaultDataSource") && (_jsx(Message, { severity: "error", text: formik?.errors?.defaultDataSource?.toString() }))] }), _jsxs("div", { className: "field col-12 lg:col-6 flex flex-column gap-2", children: [_jsxs("label", { htmlFor: "menuIconUrl", className: "form-label form-field-label", children: ["Menu Icon ", _jsx("small", { className: "text-red-500 helper-text", children: "(only svg, png and jpeg are allowed)" })] }), _jsxs("div", { ...getRootPropsmenuIcon(), className: "solid-dropzone-wrapper", children: [_jsx("input", { ...getInputPropsmenuIcon() }), _jsx(DropzonePlaceholder, {})] }), isFormFieldValid(formik, "menuIconUrl") && (_jsx(Message, { severity: "error", text: formik?.errors?.menuIconUrl?.toString() })), fileDetails && (_jsxs("div", { className: "solid-file-upload-wrapper", children: [_jsxs("div", { className: "flex align-items-center gap-2", children: [_jsx(FileReaderExt, { fileDetails: fileDetails }), _jsxs("div", { className: "w-full flex flex-column gap-1", children: [_jsxs("div", { className: "flex align-items-center justify-content-between", children: [_jsx("div", { className: "font-bold solid-module-mobile-text-wrapper", children: fileDetails.name }), _jsx("div", { className: "cancel-upload-button", onClick: handleCancelUpload, children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "6", height: "6", viewBox: "0 0 6 6", fill: "none", children: _jsx("path", { d: "M0.6 6L0 5.4L2.4 3L0 0.6L0.6 0L3 2.4L5.4 0L6 0.6L3.6 3L6 5.4L5.4 6L3 3.6L0.6 6Z", fill: "#4B4D52" }) }) })] }), uploadCompleted ?
                                                                             _jsxs("div", { className: "flex align-items-center gap-2 text-sm", children: [totalSize, " of ", totalSize, _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "4", height: "4", viewBox: "0 0 4 4", fill: "none", children: _jsx("circle", { cx: "2", cy: "2", r: "2", fill: "#C1C1C1" }) }), _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: [_jsx("mask", { id: "mask0_2480_8635", style: { maskType: 'alpha' }, maskUnits: "userSpaceOnUse", x: "0", y: "0", width: "20", height: "20", children: _jsx("rect", { width: "20", height: "20", fill: "#D9D9D9" }) }), _jsx("g", { mask: "url(#mask0_2480_8635)", children: _jsx("path", { d: "M9.16 12.76L13.39 8.53L12.55 7.69L9.16 11.08L7.45 9.37L6.61 10.21L9.16 12.76ZM10 16C9.17 16 8.39 15.8424 7.66 15.5272C6.93 15.2124 6.295 14.785 5.755 14.245C5.215 13.705 4.7876 13.07 4.4728 12.34C4.1576 11.61 4 10.83 4 10C4 9.17 4.1576 8.39 4.4728 7.66C4.7876 6.93 5.215 6.295 5.755 5.755C6.295 5.215 6.93 4.7874 7.66 4.4722C8.39 4.1574 9.17 4 10 4C10.83 4 11.61 4.1574 12.34 4.4722C13.07 4.7874 13.705 5.215 14.245 5.755C14.785 6.295 15.2124 6.93 15.5272 7.66C15.8424 8.39 16 9.17 16 10C16 10.83 15.8424 11.61 15.5272 12.34C15.2124 13.07 14.785 13.705 14.245 14.245C13.705 14.785 13.07 15.2124 12.34 15.5272C11.61 15.8424 10.83 16 10 16Z", fill: "#722ED1" }) })] }), "Completed"] })
                                                                             :
                                                                                 _jsxs("div", { className: "flex align-items-center gap-2 text-sm", children: [uploadedSize, " of ", totalSize, _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "4", height: "4", viewBox: "0 0 4 4", fill: "none", children: _jsx("circle", { cx: "2", cy: "2", r: "2", fill: "#C1C1C1" }) }), _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M7.375 10.5V5.40625L5.75 7.03125L4.875 6.125L8 3L11.125 6.125L10.25 7.03125L8.625 5.40625V10.5H7.375ZM4.25 13C3.90625 13 3.61198 12.8776 3.36719 12.6328C3.1224 12.388 3 12.0938 3 11.75V9.875H4.25V11.75H11.75V9.875H13V11.75C13 12.0938 12.8776 12.388 12.6328 12.6328C12.388 12.8776 12.0938 13 11.75 13H4.25Z", fill: "black" }) }), "Uploading $", uploadProgress, "% Completed"] })] })] }), _jsx(ProgressBar, { value: uploadProgress, showValue: false, style: { height: 4 }, className: "mt-2" })] }))] })] }) })] })] })] }));