@solidstarters/solid-core-ui 1.1.210 → 1.1.212

package/dist/components/core/common/PDFViewer.js

@@ -1,87 +1,39 @@
 'use client';
-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 } from "react/jsx-runtime";
 import { useEffect, useState } from 'react';
 import { Document, Page, pdfjs } from 'react-pdf';
 import 'react-pdf/dist/esm/Page/AnnotationLayer.css';
 import 'react-pdf/dist/esm/Page/TextLayer.css';
 // Local worker recommended (avoids CORS)
-pdfjs.GlobalWorkerOptions.workerSrc = "//cdnjs.cloudflare.com/ajax/libs/pdf.js/".concat(pdfjs.version, "/pdf.worker.min.js");
-export default function PDFViewer(_a) {
-    var _this = this;
-    var url = _a.url;
-    var _b = useState(null), numPages = _b[0], setNumPages = _b[1];
-    var _c = useState(1), pageNumber = _c[0], setPageNumber = _c[1];
-    var _d = useState(true), loading = _d[0], setLoading = _d[1];
-    var _e = useState(null), error = _e[0], setError = _e[1];
-    var _f = useState(null), blobUrl = _f[0], setBlobUrl = _f[1];
+pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.min.js`;
+export default function PDFViewer({ url }) {
+    const [numPages, setNumPages] = useState(null);
+    const [pageNumber, setPageNumber] = useState(1);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState(null);
+    const [blobUrl, setBlobUrl] = useState(null);
     // Convert signed URL → Blob → Object URL
-    useEffect(function () {
+    useEffect(() => {
         if (!url)
             return;
         setLoading(true);
         setError(null);
         fetch(url)
-            .then(function (res) { return __awaiter(_this, void 0, void 0, function () {
-            var blob, blobUrl;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        if (!res.ok)
-                            throw new Error("Failed to fetch PDF");
-                        return [4 /*yield*/, res.blob()];
-                    case 1:
-                        blob = _a.sent();
-                        blobUrl = URL.createObjectURL(blob);
-                        setBlobUrl(blobUrl);
-                        setLoading(false);
-                        return [2 /*return*/];
-                }
-            });
-        }); })
-            .catch(function (err) {
+            .then(async (res) => {
+            if (!res.ok)
+                throw new Error("Failed to fetch PDF");
+            const blob = await res.blob();
+            const blobUrl = URL.createObjectURL(blob);
+            setBlobUrl(blobUrl);
+            setLoading(false);
+        })
+            .catch((err) => {
             console.error("Blob fetch error:", err);
             setError("Failed to load PDF");
             setLoading(false);
         });
     }, [url]);
-    function onDocumentLoadSuccess(_a) {
-        var numPages = _a.numPages;
+    function onDocumentLoadSuccess({ numPages }) {
         setNumPages(numPages);
         setError(null);
     }
@@ -89,8 +41,8 @@ export default function PDFViewer(_a) {
         console.error("PDF load error:", err);
         setError("Failed to render PDF");
     }
-    var goToPrevPage = function () { return setPageNumber(function (p) { return Math.max(p - 1, 1); }); };
-    var goToNextPage = function () { return setPageNumber(function (p) { return Math.min(p + 1, numPages); }); };
+    const goToPrevPage = () => setPageNumber((p) => Math.max(p - 1, 1));
+    const goToNextPage = () => setPageNumber((p) => Math.min(p + 1, numPages));
     if (!url) {
         return (_jsx("div", { className: "flex items-center justify-center h-96 bg-gray-100 rounded-lg", children: _jsx("p", { className: "text-gray-500", children: "No PDF URL provided" }) }));
     }

package/dist/components/core/common/PDFViewer.js.map

@@ -1 +1 @@
-{"version":3,"file":"PDFViewer.js","sourceRoot":"","sources":["../../../../src/components/core/common/PDFViewer.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"PDFViewer.js","sourceRoot":"./","sources":["components/core/common/PDFViewer.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { useEffect, useState } from 'react';\nimport { Document, Page, pdfjs } from 'react-pdf';\nimport 'react-pdf/dist/esm/Page/AnnotationLayer.css';\nimport 'react-pdf/dist/esm/Page/TextLayer.css';\n\n// Local worker recommended (avoids CORS)\npdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.min.js`;\n\nexport default function PDFViewer({ url }: any) {\n    const [numPages, setNumPages] = useState<any>(null);\n    const [pageNumber, setPageNumber] = useState(1);\n    const [loading, setLoading] = useState(true);\n    const [error, setError] = useState<any>(null);\n    const [blobUrl, setBlobUrl] = useState<string | null>(null);\n\n    // Convert signed URL → Blob → Object URL\n    useEffect(() => {\n        if (!url) return;\n\n        setLoading(true);\n        setError(null);\n\n        fetch(url)\n            .then(async (res) => {\n                if (!res.ok) throw new Error(\"Failed to fetch PDF\");\n\n                const blob = await res.blob();\n                const blobUrl = URL.createObjectURL(blob);\n                setBlobUrl(blobUrl);\n                setLoading(false);\n            })\n            .catch((err) => {\n                console.error(\"Blob fetch error:\", err);\n                setError(\"Failed to load PDF\");\n                setLoading(false);\n            });\n    }, [url]);\n\n    function onDocumentLoadSuccess({ numPages }: any) {\n        setNumPages(numPages);\n        setError(null);\n    }\n\n    function onDocumentLoadError(err: any) {\n        console.error(\"PDF load error:\", err);\n        setError(\"Failed to render PDF\");\n    }\n\n    const goToPrevPage = () => setPageNumber((p) => Math.max(p - 1, 1));\n    const goToNextPage = () => setPageNumber((p) => Math.min(p + 1, numPages));\n\n    if (!url) {\n        return (\n            <div className=\"flex items-center justify-center h-96 bg-gray-100 rounded-lg\">\n                <p className=\"text-gray-500\">No PDF URL provided</p>\n            </div>\n        );\n    }\n\n    return (\n        <div className=\"flex flex-col items-center space-y-4 p-4\">\n            {loading && (\n                <div className=\"flex items-center justify-center h-96 bg-gray-100 rounded-lg w-full\">\n                    <p className=\"text-gray-600\">Loading PDF...</p>\n                </div>\n            )}\n\n            {error && (\n                <div className=\"flex items-center justify-center h-96 bg-red-50 rounded-lg w-full\">\n                    <p className=\"text-red-600\">{error}</p>\n                </div>\n            )}\n\n            {/* Render only after Blob URL is created */}\n            {blobUrl && !loading && !error && (\n                <Document\n                    file={blobUrl}\n                    onLoadSuccess={onDocumentLoadSuccess}\n                    onLoadError={onDocumentLoadError}\n                    className=\"border border-gray-300 rounded-lg shadow-lg\"\n                >\n                    <Page\n                        pageNumber={pageNumber}\n                        renderTextLayer={true}\n                        renderAnnotationLayer={true}\n                    />\n                </Document>\n            )}\n\n            {numPages && (\n                <div className=\"flex items-center space-x-4 bg-white p-4 rounded-lg shadow-md\">\n                    <button\n                        onClick={goToPrevPage}\n                        disabled={pageNumber <= 1}\n                        className=\"px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600 disabled:bg-gray-300 disabled:cursor-not-allowed\"\n                    >\n                        Previous\n                    </button>\n\n                    <span className=\"text-gray-700 font-medium\">\n                        Page {pageNumber} of {numPages}\n                    </span>\n\n                    <button\n                        onClick={goToNextPage}\n                        disabled={pageNumber >= numPages}\n                        className=\"px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600 disabled:bg-gray-300 disabled:cursor-not-allowed\"\n                    >\n                        Next\n                    </button>\n                </div>\n            )}\n        </div>\n    );\n}\n"]}

package/dist/components/core/common/PDFViewer.tsx

@@ -0,0 +1,117 @@
+'use client';
+
+import { useEffect, useState } from 'react';
+import { Document, Page, pdfjs } from 'react-pdf';
+import 'react-pdf/dist/esm/Page/AnnotationLayer.css';
+import 'react-pdf/dist/esm/Page/TextLayer.css';
+
+// Local worker recommended (avoids CORS)
+pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.min.js`;
+
+export default function PDFViewer({ url }: any) {
+    const [numPages, setNumPages] = useState<any>(null);
+    const [pageNumber, setPageNumber] = useState(1);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState<any>(null);
+    const [blobUrl, setBlobUrl] = useState<string | null>(null);
+
+    // Convert signed URL → Blob → Object URL
+    useEffect(() => {
+        if (!url) return;
+
+        setLoading(true);
+        setError(null);
+
+        fetch(url)
+            .then(async (res) => {
+                if (!res.ok) throw new Error("Failed to fetch PDF");
+
+                const blob = await res.blob();
+                const blobUrl = URL.createObjectURL(blob);
+                setBlobUrl(blobUrl);
+                setLoading(false);
+            })
+            .catch((err) => {
+                console.error("Blob fetch error:", err);
+                setError("Failed to load PDF");
+                setLoading(false);
+            });
+    }, [url]);
+
+    function onDocumentLoadSuccess({ numPages }: any) {
+        setNumPages(numPages);
+        setError(null);
+    }
+
+    function onDocumentLoadError(err: any) {
+        console.error("PDF load error:", err);
+        setError("Failed to render PDF");
+    }
+
+    const goToPrevPage = () => setPageNumber((p) => Math.max(p - 1, 1));
+    const goToNextPage = () => setPageNumber((p) => Math.min(p + 1, numPages));
+
+    if (!url) {
+        return (
+            <div className="flex items-center justify-center h-96 bg-gray-100 rounded-lg">
+                <p className="text-gray-500">No PDF URL provided</p>
+            </div>
+        );
+    }
+
+    return (
+        <div className="flex flex-col items-center space-y-4 p-4">
+            {loading && (
+                <div className="flex items-center justify-center h-96 bg-gray-100 rounded-lg w-full">
+                    <p className="text-gray-600">Loading PDF...</p>
+                </div>
+            )}
+
+            {error && (
+                <div className="flex items-center justify-center h-96 bg-red-50 rounded-lg w-full">
+                    <p className="text-red-600">{error}</p>
+                </div>
+            )}
+
+            {/* Render only after Blob URL is created */}
+            {blobUrl && !loading && !error && (
+                <Document
+                    file={blobUrl}
+                    onLoadSuccess={onDocumentLoadSuccess}
+                    onLoadError={onDocumentLoadError}
+                    className="border border-gray-300 rounded-lg shadow-lg"
+                >
+                    <Page
+                        pageNumber={pageNumber}
+                        renderTextLayer={true}
+                        renderAnnotationLayer={true}
+                    />
+                </Document>
+            )}
+
+            {numPages && (
+                <div className="flex items-center space-x-4 bg-white p-4 rounded-lg shadow-md">
+                    <button
+                        onClick={goToPrevPage}
+                        disabled={pageNumber <= 1}
+                        className="px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600 disabled:bg-gray-300 disabled:cursor-not-allowed"
+                    >
+                        Previous
+                    </button>
+
+                    <span className="text-gray-700 font-medium">
+                        Page {pageNumber} of {numPages}
+                    </span>
+
+                    <button
+                        onClick={goToNextPage}
+                        disabled={pageNumber >= numPages}
+                        className="px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600 disabled:bg-gray-300 disabled:cursor-not-allowed"
+                    >
+                        Next
+                    </button>
+                </div>
+            )}
+        </div>
+    );
+}

package/dist/components/core/common/SolidAccountSettings/SolidAccountSettings.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SolidAccountSettings.d.ts","sourceRoot":"","sources":["../../../../../src/components/core/common/SolidAccountSettings/SolidAccountSettings.tsx"],"names":[],"mappings":"AASA,eAAO,MAAM,oBAAoB,gEAAiE,GAAG,4CA6EpG,CAAA"}
+{"version":3,"file":"SolidAccountSettings.d.ts","sourceRoot":"./","sources":["components/core/common/SolidAccountSettings/SolidAccountSettings.tsx"],"names":[],"mappings":"AASA,eAAO,MAAM,oBAAoB,gEAAiE,GAAG,4CAiFpG,CAAA"}

package/dist/components/core/common/SolidAccountSettings/SolidAccountSettings.js

@@ -1,19 +1,19 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Dialog } from "primereact/dialog";
-import { useEffect, useMemo, useState } from "react";
+import { useMemo, useState } from "react";
 import { SolidPersonalInfo } from "./SolidPersonalInfo";
 import { SolidChangePassword } from "./SolidChangePassword";
 import styles from './SolidAccountSettings.module.css';
-import { useLazyGetSolidSettingsQuery } from "../../../../redux/api/solidSettingsApi";
-export var SolidAccountSettings = function (_a) {
-    var showProfileSettingsDialog = _a.showProfileSettingsDialog, setShowProfileSettingsDialog = _a.setShowProfileSettingsDialog;
-    var _b = useState({ key: "personal_info", label: "Persnoal Info" }), setting = _b[0], setSetting = _b[1];
-    var _c = useLazyGetSolidSettingsQuery(), trigger = _c[0], solidSettingsData = _c[1].data;
-    useEffect(function () {
-        trigger(""); // Fetch settings on mount
-    }, []);
-    var settings = [
+import { useSelector } from "react-redux";
+export const SolidAccountSettings = ({ showProfileSettingsDialog, setShowProfileSettingsDialog }) => {
+    const [setting, setSetting] = useState({ key: "personal_info", label: "Persnoal Info" });
+    // const [trigger, { data: solidSettingsData }] = useLazyGetSolidSettingsQuery();
+    // useEffect(() => {
+    //     trigger("") // Fetch settings on mount
+    // }, [])
+    const solidSettingsData = useSelector((state) => state.settingsState?.solidSettings);
+    const settings = [
         {
             label: "Persnoal Info",
             key: "personal_info",
@@ -30,7 +30,7 @@ export var SolidAccountSettings = function (_a) {
             icon: "pi pi-key"
         },
     ];
-    var renderSettingComponent = useMemo(function () {
+    const renderSettingComponent = useMemo(() => {
         switch (setting.key) {
             case "personal_info":
                 return _jsx(SolidPersonalInfo, {});
@@ -40,10 +40,10 @@ export var SolidAccountSettings = function (_a) {
                 return null;
         }
     }, [setting.key, solidSettingsData]);
-    return (_jsx(Dialog, { header: _jsx("h5", { className: 'm-0 font-bold', children: "Account Settings" }), headerClassName: "px-4 py-3 secondary-border-bottom", contentClassName: "p-0", visible: showProfileSettingsDialog, className: "solid-account-setting-main", style: { width: '60vw' }, onHide: function () {
+    return (_jsx(Dialog, { header: _jsx("h5", { className: 'm-0 font-bold', children: "Account Settings" }), headerClassName: "px-4 py-3 secondary-border-bottom", contentClassName: "p-0", visible: showProfileSettingsDialog, className: "solid-account-setting-main", style: { width: '60vw' }, onHide: () => {
             if (!showProfileSettingsDialog)
                 return;
             setShowProfileSettingsDialog(false);
-        }, draggable: false, children: _jsxs("div", { className: "grid m-0", children: [_jsx("div", { className: "col-2 md:col-3 p-3 ".concat(styles.SolidSettingTabWrapper), children: _jsx("div", { className: "flex flex-column gap-1", children: settings.map(function (option) { return (_jsxs("div", { className: "w-full flex align-items-center gap-2 text-start ".concat(styles.SolidSettingTab, " ").concat(option.key === setting.key ? styles.SolidActiveSetting : styles.SolidDeActiveSetting), onClick: function () { return setSetting(option); }, children: [_jsx("span", { className: option.icon }), _jsx("span", { className: "hidden sm:inline", children: option.label })] }, option.key)); }) }) }), _jsx("div", { className: "col-9 py-3 px-4 ".concat(styles.SolidAccountSettingFormWrapper), children: renderSettingComponent })] }) }));
+        }, draggable: false, children: _jsxs("div", { className: "grid m-0", children: [_jsx("div", { className: `col-2 md:col-3 p-3 ${styles.SolidSettingTabWrapper}`, children: _jsx("div", { className: "flex flex-column gap-1", children: settings.map((option) => (_jsxs("div", { className: `w-full flex align-items-center gap-2 text-start ${styles.SolidSettingTab} ${option.key === setting.key ? styles.SolidActiveSetting : styles.SolidDeActiveSetting}`, onClick: () => setSetting(option), children: [_jsx("span", { className: option.icon }), _jsx("span", { className: "hidden sm:inline", children: option.label })] }, option.key))) }) }), _jsx("div", { className: `col-9 py-3 px-4 ${styles.SolidAccountSettingFormWrapper}`, children: renderSettingComponent })] }) }));
 };
 //# sourceMappingURL=SolidAccountSettings.js.map

package/dist/components/core/common/SolidAccountSettings/SolidAccountSettings.js.map

@@ -1 +1 @@
-{"version":3,"file":"SolidAccountSettings.js","sourceRoot":"","sources":["../../../../../src/components/core/common/SolidAccountSettings/SolidAccountSettings.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAExD,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,MAAM,MAAM,mCAAmC,CAAA;AACtD,OAAO,EAAE,4BAA4B,EAAE,MAAM,8BAA8B,CAAC;AAC5E,MAAM,CAAC,IAAM,oBAAoB,GAAG,UAAC,EAAgE;QAA9D,yBAAyB,+BAAA,EAAE,4BAA4B,kCAAA;IACpF,IAAA,KAAwB,QAAQ,CAAC,EAAE,GAAG,EAAE,eAAe,EAAE,KAAK,EAAE,eAAe,EAAE,CAAC,EAAjF,OAAO,QAAA,EAAE,UAAU,QAA8D,CAAC;IAEnF,IAAA,KAAyC,4BAA4B,EAAE,EAAtE,OAAO,QAAA,EAAU,iBAAiB,aAAoC,CAAC;IAC9E,SAAS,CAAC;QACN,OAAO,CAAC,EAAE,CAAC,CAAA,CAAC,0BAA0B;IAC1C,CAAC,EAAE,EAAE,CAAC,CAAA;IACN,IAAM,QAAQ,GAAG;QACb;YACI,KAAK,EAAE,eAAe;YACtB,GAAG,EAAE,eAAe;YACpB,IAAI,EAAE,iBAAiB;SAC1B;QACD,IAAI;QACJ,6BAA6B;QAC7B,4BAA4B;QAC5B,yBAAyB;QACzB,KAAK;QACL;YACI,KAAK,EAAE,iBAAiB;YACxB,GAAG,EAAE,iBAAiB;YACtB,IAAI,EAAE,WAAW;SACpB;KACJ,CAAA;IAED,IAAM,sBAAsB,GAAG,OAAO,CAAC;QACnC,QAAQ,OAAO,CAAC,GAAG,EAAE;YACjB,KAAK,eAAe;gBAChB,OAAO,KAAC,iBAAiB,KAAG,CAAC;YACjC,KAAK,iBAAiB;gBAClB,OAAO,KAAC,mBAAmB,IAAC,iBAAiB,EAAE,iBAAiB,GAAI,CAAC;YACzE;gBACI,OAAO,IAAI,CAAC;SACnB;IACL,CAAC,EAAE,CAAC,OAAO,CAAC,GAAG,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAErC,OAAO,CACH,KAAC,MAAM,IACH,MAAM,EAAE,aAAI,SAAS,EAAC,eAAe,iCAAsB,EAC3D,eAAe,EAAC,mCAAmC,EACnD,gBAAgB,EAAC,KAAK,EACtB,OAAO,EAAE,yBAAyB,EAClC,SAAS,EAAC,4BAA4B,EACtC,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EACxB,MAAM,EAAE;YACJ,IAAI,CAAC,yBAAyB;gBAAE,OAAO;YACvC,4BAA4B,CAAC,KAAK,CAAC,CAAC;QACxC,CAAC,EACD,SAAS,EAAE,KAAK,YAEhB,eAAK,SAAS,EAAC,UAAU,aACrB,cAAK,SAAS,EAAE,6BAAsB,MAAM,CAAC,sBAAsB,CAAE,YACjE,cAAK,SAAS,EAAC,wBAAwB,YAClC,QAAQ,CAAC,GAAG,CAAC,UAAC,MAAM,IAAK,OAAA,CACtB,eAEI,SAAS,EAAE,0DAAmD,MAAM,CAAC,eAAe,cAAI,MAAM,CAAC,GAAG,KAAK,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC,CAAC,MAAM,CAAC,oBAAoB,CAAE,EAC9K,OAAO,EAAE,cAAM,OAAA,UAAU,CAAC,MAAM,CAAC,EAAlB,CAAkB,aAEhC,eAAM,SAAS,EAAE,MAAM,CAAC,IAAI,GAAS,EACrC,eAAM,SAAS,EAAC,kBAAkB,YAAE,MAAM,CAAC,KAAK,GAAQ,KALpD,MAAM,CAAC,GAAG,CAMb,CACT,EATyB,CASzB,CAAC,GACA,GACJ,EACN,cAAK,SAAS,EAAE,0BAAmB,MAAM,CAAC,8BAA8B,CAAE,YACrE,sBAAsB,GAOrB,IACJ,GACD,CACZ,CAAA;AACL,CAAC,CAAA"}
+{"version":3,"file":"SolidAccountSettings.js","sourceRoot":"./","sources":["components/core/common/SolidAccountSettings/SolidAccountSettings.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport { Dialog } from \"primereact/dialog\";\nimport { useMemo, useState } from \"react\";\nimport { SolidPersonalInfo } from \"./SolidPersonalInfo\";\nimport { SolidChangePassword } from \"./SolidChangePassword\";\nimport styles from './SolidAccountSettings.module.css'\nimport { useSelector } from \"react-redux\";\n\nexport const SolidAccountSettings = ({ showProfileSettingsDialog, setShowProfileSettingsDialog }: any) => {\n    const [setting, setSetting] = useState({ key: \"personal_info\", label: \"Persnoal Info\" });\n\n    // const [trigger, { data: solidSettingsData }] = useLazyGetSolidSettingsQuery();\n\n\n    // useEffect(() => {\n    //     trigger(\"\") // Fetch settings on mount\n    // }, [])\n\n    const solidSettingsData = useSelector((state: any) => state.settingsState?.solidSettings);\n    const settings = [\n        {\n            label: \"Persnoal Info\",\n            key: \"personal_info\",\n            icon: \"pi pi-user-edit\"\n        },\n        // {\n        //     label: \"Notification\",\n        //     key: \"notifications\",\n        //     icon: \"pi pi-bell\"\n        // },\n        {\n            label: \"Change Password\",\n            key: \"change_password\",\n            icon: \"pi pi-key\"\n        },\n    ]\n\n    const renderSettingComponent = useMemo(() => {\n        switch (setting.key) {\n            case \"personal_info\":\n                return <SolidPersonalInfo />;\n            case \"change_password\":\n                return <SolidChangePassword solidSettingsData={solidSettingsData} />;\n            default:\n                return null;\n        }\n    }, [setting.key, solidSettingsData]);\n\n    return (\n        <Dialog\n            header={<h5 className='m-0 font-bold'>Account Settings</h5>}\n            headerClassName=\"px-4 py-3 secondary-border-bottom\"\n            contentClassName=\"p-0\"\n            visible={showProfileSettingsDialog}\n            className=\"solid-account-setting-main\"\n            style={{ width: '60vw' }}\n            onHide={() => {\n                if (!showProfileSettingsDialog) return;\n                setShowProfileSettingsDialog(false);\n            }}\n            draggable={false}\n        >\n            <div className=\"grid m-0\">\n                <div className={`col-2 md:col-3 p-3 ${styles.SolidSettingTabWrapper}`}>\n                    <div className=\"flex flex-column gap-1\">\n                        {settings.map((option) => (\n                            <div\n                                key={option.key}\n                                className={`w-full flex align-items-center gap-2 text-start ${styles.SolidSettingTab} ${option.key === setting.key ? styles.SolidActiveSetting : styles.SolidDeActiveSetting}`}\n                                onClick={() => setSetting(option)}\n                            >\n                                <span className={option.icon}></span>\n                                <span className=\"hidden sm:inline\">{option.label}</span>\n                            </div>\n                        ))}\n                    </div>\n                </div>\n                <div className={`col-9 py-3 px-4 ${styles.SolidAccountSettingFormWrapper}`}>\n                    {renderSettingComponent}\n                    {/* <div className=\"p-3 secondary-border-bottom\">\n                        <h5 className=\"m-0\"></h5>\n                    </div>\n                    <div className=\"py-3 px-4 h-full\">\n                        {renderSettingComponent()}\n                    </div> */}\n                </div>\n            </div>\n        </Dialog>\n    )\n}"]}

package/dist/components/core/common/SolidAccountSettings/SolidAccountSettings.tsx

@@ -0,0 +1,89 @@
+"use client"
+
+import { Dialog } from "primereact/dialog";
+import { useEffect, useMemo, useState } from "react";
+import { SolidPersonalInfo } from "./SolidPersonalInfo";
+import { SolidChangePassword } from "./SolidChangePassword";
+import styles from './SolidAccountSettings.module.css'
+import { useSelector } from "react-redux";
+import { useLazyGetSolidSettingsQuery } from "../../../../redux/api/solidSettingsApi";
+
+export const SolidAccountSettings = ({ showProfileSettingsDialog, setShowProfileSettingsDialog }: any) => {
+    const [setting, setSetting] = useState({ key: "personal_info", label: "Persnoal Info" });
+
+    const [trigger, { data: solidSettingsData }] = useLazyGetSolidSettingsQuery();
+    useEffect(() => {
+        trigger("") // Fetch settings on mount
+    }, [])
+
+    const settings = [
+        {
+            label: "Persnoal Info",
+            key: "personal_info",
+            icon: "pi pi-user-edit"
+        },
+        // {
+        //     label: "Notification",
+        //     key: "notifications",
+        //     icon: "pi pi-bell"
+        // },
+        {
+            label: "Change Password",
+            key: "change_password",
+            icon: "pi pi-key"
+        },
+    ]
+
+    const renderSettingComponent = useMemo(() => {
+        switch (setting.key) {
+            case "personal_info":
+                return <SolidPersonalInfo />;
+            case "change_password":
+                return <SolidChangePassword solidSettingsData={solidSettingsData} />;
+            default:
+                return null;
+        }
+    }, [setting.key, solidSettingsData]);
+
+    return (
+        <Dialog
+            header={<h5 className='m-0 font-bold'>Account Settings</h5>}
+            headerClassName="px-4 py-3 secondary-border-bottom"
+            contentClassName="p-0"
+            visible={showProfileSettingsDialog}
+            className="solid-account-setting-main"
+            style={{ width: '60vw' }}
+            onHide={() => {
+                if (!showProfileSettingsDialog) return;
+                setShowProfileSettingsDialog(false);
+            }}
+            draggable={false}
+        >
+            <div className="grid m-0">
+                <div className={`col-2 md:col-3 p-3 ${styles.SolidSettingTabWrapper}`}>
+                    <div className="flex flex-column gap-1">
+                        {settings.map((option) => (
+                            <div
+                                key={option.key}
+                                className={`w-full flex align-items-center gap-2 text-start ${styles.SolidSettingTab} ${option.key === setting.key ? styles.SolidActiveSetting : styles.SolidDeActiveSetting}`}
+                                onClick={() => setSetting(option)}
+                            >
+                                <span className={option.icon}></span>
+                                <span className="hidden sm:inline">{option.label}</span>
+                            </div>
+                        ))}
+                    </div>
+                </div>
+                <div className={`col-9 py-3 px-4 ${styles.SolidAccountSettingFormWrapper}`}>
+                    {renderSettingComponent}
+                    {/* <div className="p-3 secondary-border-bottom">
+                        <h5 className="m-0"></h5>
+                    </div>
+                    <div className="py-3 px-4 h-full">
+                        {renderSettingComponent()}
+                    </div> */}
+                </div>
+            </div>
+        </Dialog>
+    )
+}

package/dist/components/core/common/SolidAccountSettings/SolidChangePassword.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SolidChangePassword.d.ts","sourceRoot":"","sources":["../../../../../src/components/core/common/SolidAccountSettings/SolidChangePassword.tsx"],"names":[],"mappings":"AAcA,eAAO,MAAM,mBAAmB,0BAA2B,GAAG,4CA6K7D,CAAA"}
+{"version":3,"file":"SolidChangePassword.d.ts","sourceRoot":"./","sources":["components/core/common/SolidAccountSettings/SolidChangePassword.tsx"],"names":[],"mappings":"AAcA,eAAO,MAAM,mBAAmB,0BAA2B,GAAG,4CA6K7D,CAAA"}