@solidxai/core-ui 0.0.1

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

@@ -0,0 +1,234 @@
+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 { useDeleteMediaMutation } from "../../../../redux/api/mediaApi";
+import { useGetUserQuery, useUpdateUserProfileMutation } from "../../../../redux/api/userApi";
+import { useFormik } from "formik";
+import { AutoComplete } from "primereact/autocomplete";
+import { Avatar } from "primereact/avatar";
+import { Button } from "primereact/button";
+import { Dialog } from "primereact/dialog";
+import { InputText } from "primereact/inputtext";
+import { Toast } from "primereact/toast";
+import { useRef, useState } from "react";
+import styles from './SolidAccountSettings.module.css';
+import { ERROR_MESSAGES } from "../../../../constants/error-messages";
+import showToast from "../../../../helpers/showToast";
+import { useSession } from '../../../../hooks/useSession';
+export var SolidPersonalInfo = function () {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
+    var fileInputRef = useRef(null);
+    var toast = useRef(null);
+    var _x = useState(null), previewImage = _x[0], setPreviewImage = _x[1];
+    var _y = useState(false), deleteDialogVisible = _y[0], setDeleteDialogVisible = _y[1];
+    var _z = useState(false), replaceDialogVisible = _z[0], setReplaceDialogVisible = _z[1];
+    var _0 = useState(null), pendingFile = _0[0], setPendingFile = _0[1];
+    var _1 = useSession(), session = _1.data, status = _1.status;
+    var user = session === null || session === void 0 ? void 0 : session.user;
+    var userId = user === null || user === void 0 ? void 0 : user.id;
+    var _2 = useGetUserQuery(userId), userData = _2.data, refetch = _2.refetch;
+    var deleteMedia = useDeleteMediaMutation()[0];
+    var updateUser = useUpdateUserProfileMutation()[0];
+    var initialValues = {
+        fullName: (_b = (_a = userData === null || userData === void 0 ? void 0 : userData.data) === null || _a === void 0 ? void 0 : _a.fullName) !== null && _b !== void 0 ? _b : "",
+        profilePicture: (_f = (_e = (_d = (_c = userData === null || userData === void 0 ? void 0 : userData.data) === null || _c === void 0 ? void 0 : _c._media) === null || _d === void 0 ? void 0 : _d.profilePicture[0]) === null || _e === void 0 ? void 0 : _e._full_url) !== null && _f !== void 0 ? _f : null,
+    };
+    var formik = useFormik({
+        initialValues: initialValues,
+        enableReinitialize: true,
+        onSubmit: function (values) { return __awaiter(void 0, void 0, void 0, function () {
+            var formData, response, error_1;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        _a.trys.push([0, 2, , 3]);
+                        formData = new FormData();
+                        if (values.fullName !== initialValues.fullName) {
+                            formData.append("fullName", values.fullName);
+                        }
+                        if (values.profilePicture && values.profilePicture instanceof File) {
+                            formData.append("profilePicture", values.profilePicture);
+                        }
+                        if (!formData.has("fullName") && !formData.has("profilePicture")) {
+                            showToast(toast, "info", ERROR_MESSAGES.NO_CHANGE, ERROR_MESSAGES.NO_UPDATE_MADE);
+                            return [2 /*return*/];
+                        }
+                        return [4 /*yield*/, updateUser({ data: formData }).unwrap()];
+                    case 1:
+                        response = _a.sent();
+                        if ((response === null || response === void 0 ? void 0 : response.statusCode) === 200) {
+                            showToast(toast, "success", ERROR_MESSAGES.PROFILE_SAVED, ERROR_MESSAGES.PROFILE_SAVED_SUCCESSFULLY);
+                            refetch();
+                            formik.resetForm();
+                            setPreviewImage(null);
+                        }
+                        else {
+                            showToast(toast, "error", ERROR_MESSAGES.FAILED, ERROR_MESSAGES.FAILED_UPDATED_PROFILE);
+                        }
+                        return [3 /*break*/, 3];
+                    case 2:
+                        error_1 = _a.sent();
+                        showToast(toast, "error", ERROR_MESSAGES.FAILED, ERROR_MESSAGES.SOMETHING_WRONG);
+                        return [3 /*break*/, 3];
+                    case 3: return [2 /*return*/];
+                }
+            });
+        }); },
+    });
+    var getInitials = function (value) {
+        var _a;
+        if (!value)
+            return "";
+        var email = value.includes('@') ? value.split('@')[0] : value;
+        return ((_a = email[0]) === null || _a === void 0 ? void 0 : _a.toUpperCase()) || "";
+    };
+    var getColorFromInitials = function (initials) {
+        var hash = 0;
+        for (var i = 0; i < initials.length; i++) {
+            hash = initials.charCodeAt(i) + ((hash << 5) - hash);
+        }
+        var hue = Math.abs(hash) % 360;
+        return "hsl(".concat(hue, ", 60%, 60%)");
+    };
+    var value = (_g = userData === null || userData === void 0 ? void 0 : userData.data) === null || _g === void 0 ? void 0 : _g.email;
+    var initials = getInitials(value);
+    var bgColor = getColorFromInitials(initials);
+    var handleFileChange = function (file) {
+        var _a, _b, _c;
+        var existing = (_c = (_b = (_a = userData === null || userData === void 0 ? void 0 : userData.data) === null || _a === void 0 ? void 0 : _a._media) === null || _b === void 0 ? void 0 : _b.profilePicture) === null || _c === void 0 ? void 0 : _c[0];
+        if (existing) {
+            setPendingFile(file);
+            setReplaceDialogVisible(true);
+        }
+        else {
+            formik.setFieldValue("profilePicture", file);
+            setPreviewImage(URL.createObjectURL(file));
+        }
+    };
+    var handleDeleteAvatar = function () {
+        var _a, _b, _c;
+        var existing = (_c = (_b = (_a = userData === null || userData === void 0 ? void 0 : userData.data) === null || _a === void 0 ? void 0 : _a._media) === null || _b === void 0 ? void 0 : _b.profilePicture) === null || _c === void 0 ? void 0 : _c[0];
+        if (existing) {
+            setDeleteDialogVisible(true);
+        }
+        else {
+            formik.setFieldValue("profilePicture", null);
+            setPreviewImage(null);
+        }
+    };
+    var confirmReplace = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var existing, error_2;
+        var _a, _b, _c;
+        return __generator(this, function (_d) {
+            switch (_d.label) {
+                case 0:
+                    existing = (_c = (_b = (_a = userData === null || userData === void 0 ? void 0 : userData.data) === null || _a === void 0 ? void 0 : _a._media) === null || _b === void 0 ? void 0 : _b.profilePicture) === null || _c === void 0 ? void 0 : _c[0];
+                    _d.label = 1;
+                case 1:
+                    _d.trys.push([1, 4, , 5]);
+                    if (!(existing === null || existing === void 0 ? void 0 : existing.id)) return [3 /*break*/, 3];
+                    return [4 /*yield*/, deleteMedia(existing.id).unwrap()];
+                case 2:
+                    _d.sent();
+                    _d.label = 3;
+                case 3:
+                    if (pendingFile) {
+                        formik.setFieldValue("profilePicture", pendingFile);
+                        setTimeout(function () {
+                            formik.submitForm();
+                        }, 0);
+                    }
+                    return [3 /*break*/, 5];
+                case 4:
+                    error_2 = _d.sent();
+                    showToast(toast, "error", ERROR_MESSAGES.FAILED, ERROR_MESSAGES.FAILED_DELETED_IMAGE);
+                    return [3 /*break*/, 5];
+                case 5:
+                    setReplaceDialogVisible(false);
+                    setPendingFile(null);
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    var confirmDelete = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var existing, _a;
+        var _b, _c, _d;
+        return __generator(this, function (_e) {
+            switch (_e.label) {
+                case 0:
+                    existing = (_d = (_c = (_b = userData === null || userData === void 0 ? void 0 : userData.data) === null || _b === void 0 ? void 0 : _b._media) === null || _c === void 0 ? void 0 : _c.profilePicture) === null || _d === void 0 ? void 0 : _d[0];
+                    if (!(existing === null || existing === void 0 ? void 0 : existing.id)) return [3 /*break*/, 4];
+                    _e.label = 1;
+                case 1:
+                    _e.trys.push([1, 3, , 4]);
+                    return [4 /*yield*/, deleteMedia(existing.id).unwrap()];
+                case 2:
+                    _e.sent();
+                    showToast(toast, "success", ERROR_MESSAGES.DELETED, ERROR_MESSAGES.PROFILE_PICTURE_REMOVE);
+                    refetch();
+                    return [3 /*break*/, 4];
+                case 3:
+                    _a = _e.sent();
+                    showToast(toast, "error", ERROR_MESSAGES.ERROR, ERROR_MESSAGES.FAILED_DELETED_IMAGE);
+                    return [3 /*break*/, 4];
+                case 4:
+                    formik.setFieldValue("profilePicture", null);
+                    setPreviewImage(null);
+                    setDeleteDialogVisible(false);
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    return (_jsxs("form", { onSubmit: formik.handleSubmit, className: "h-full flex flex-column justify-content-between", children: [_jsx(Toast, { ref: toast }), _jsxs("div", { children: [_jsxs("div", { children: [_jsx("label", { className: "form-field-label mb-2 font-bold", children: "Profile Picture" }), _jsxs("div", { className: "flex align-items-center gap-3", children: [previewImage ? (_jsx(Avatar, { image: previewImage, shape: "circle", style: {
+                                            height: '5rem',
+                                            width: '5rem'
+                                        } })) : ((_l = (_k = (_j = (_h = userData === null || userData === void 0 ? void 0 : userData.data) === null || _h === void 0 ? void 0 : _h._media) === null || _j === void 0 ? void 0 : _j.profilePicture) === null || _k === void 0 ? void 0 : _k[0]) === null || _l === void 0 ? void 0 : _l._full_url) ? (_jsxs("div", { className: "relative", children: [_jsx(Avatar, { image: (_q = (_p = (_o = (_m = userData === null || userData === void 0 ? void 0 : userData.data) === null || _m === void 0 ? void 0 : _m._media) === null || _o === void 0 ? void 0 : _o.profilePicture) === null || _p === void 0 ? void 0 : _p[0]) === null || _q === void 0 ? void 0 : _q._full_url, shape: "circle", style: {
+                                                    height: '5rem',
+                                                    width: '5rem'
+                                                } }), _jsx("div", { className: styles.SolidRemoveProfile, onClick: handleDeleteAvatar, children: _jsx("span", { className: "pi pi-times" }) })] })) : (_jsx(Avatar, { label: initials, size: "xlarge", shape: "circle", style: {
+                                            backgroundColor: bgColor,
+                                            color: '#ffffff',
+                                            height: '5rem',
+                                            width: '5rem'
+                                        } })), _jsxs("div", { className: "flex gap-2", children: [_jsx(Button, { type: "button", size: "small", severity: "secondary", label: "Upload Avatar", outlined: true, className: "small-button", onClick: function () { var _a; return (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click(); } }), _jsx("input", { ref: fileInputRef, type: "file", accept: ".jpg,.jpeg,.png,.svg", hidden: true, onChange: function (e) {
+                                                    var _a;
+                                                    var file = (_a = e.target.files) === null || _a === void 0 ? void 0 : _a[0];
+                                                    if (file)
+                                                        handleFileChange(file);
+                                                } })] })] })] }), _jsx("div", { className: 'mt-4 mb-2 sm:mb-0', style: { borderBottom: '1px dashed #D8E2EA' } }), _jsxs("div", { className: "mt-4", children: [_jsx("label", { className: "form-field-label mb-2 font-bold", children: "Details" }), _jsxs("div", { className: "grid", children: [_jsxs("div", { className: "col-12 md:col-8 lg:col-5", children: [_jsx("label", { className: "form-field-label mb-2", children: "Name" }), _jsx(InputText, { name: "fullName", value: formik.values.fullName, onChange: formik.handleChange, className: "w-full" })] }), _jsxs("div", { className: "col-12 md:col-8 lg:col-5", children: [_jsx("label", { className: "form-field-label mb-2", children: "Email" }), _jsx(InputText, { disabled: true, placeholder: (_r = userData === null || userData === void 0 ? void 0 : userData.data) === null || _r === void 0 ? void 0 : _r.email, value: (_s = userData === null || userData === void 0 ? void 0 : userData.data) === null || _s === void 0 ? void 0 : _s.email, className: "w-full" })] }), _jsxs("div", { className: "col-12 md:col-8 lg:col-5", children: [_jsx("label", { className: "form-field-label mb-2", children: "Contact Number" }), _jsx(InputText, { disabled: true, placeholder: (_t = userData === null || userData === void 0 ? void 0 : userData.data) === null || _t === void 0 ? void 0 : _t.mobile, value: (_u = userData === null || userData === void 0 ? void 0 : userData.data) === null || _u === void 0 ? void 0 : _u.mobile, className: "w-full" })] }), _jsxs("div", { className: "col-12 md:col-8 lg:col-5", children: [_jsx("label", { className: "form-field-label mb-2", children: "Role" }), _jsx(AutoComplete, { multiple: true, disabled: true, value: ((_w = (_v = userData === null || userData === void 0 ? void 0 : userData.data) === null || _v === void 0 ? void 0 : _v.roles) === null || _w === void 0 ? void 0 : _w.map(function (role) { return role.name; })) || [] })] })] })] })] }), _jsx("div", { children: _jsx(Button, { type: "submit", size: "small", label: "Save" }) }), _jsx(Dialog, { header: _jsx("h5", { className: 'm-0 font-bold', children: "Replace Profile Picture" }), visible: replaceDialogVisible, headerClassName: "px-4 py-3 secondary-border-bottom", contentClassName: "p-0", style: { width: '25vw' }, className: "solid-confirm-dialog ", modal: true, onHide: function () { return setReplaceDialogVisible(false); }, children: _jsxs("div", { className: "p-4", children: ["Do you want to replace the existing profile picture?", _jsxs("div", { className: "flex justify-content-start mt-4 gap-2", children: [_jsx(Button, { size: "small", label: "Confirm", severity: "danger", onClick: confirmReplace }), _jsx(Button, { size: "small", outlined: true, label: "Cancel", onClick: function () { return setReplaceDialogVisible(false); } })] })] }) }), _jsx(Dialog, { header: _jsx("h5", { className: 'm-0 font-bold', children: "Delete Profile Picture" }), visible: deleteDialogVisible, headerClassName: "px-4 py-3 secondary-border-bottom", contentClassName: "p-0", style: { width: '25vw' }, modal: true, className: "solid-confirm-dialog ", onHide: function () { return setDeleteDialogVisible(false); }, children: _jsxs("div", { className: "p-4", children: ["Do you want to delete your profile picture?", _jsxs("div", { className: "flex justify-content-start mt-4 gap-2", children: [_jsx(Button, { size: "small", label: "Confirm", severity: "danger", onClick: confirmDelete }), _jsx(Button, { size: "small", outlined: true, label: "Cancel", onClick: function () { return setDeleteDialogVisible(false); } })] })] }) })] }));
+};
+//# sourceMappingURL=SolidPersonalInfo.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SolidPersonalInfo.js","sourceRoot":"","sources":["../../../../../src/components/core/common/SolidAccountSettings/SolidPersonalInfo.tsx"],"names":[],"mappings":"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"}

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

@@ -0,0 +1,304 @@
+
+
+import { useDeleteMediaMutation } from "../../../../redux/api/mediaApi";
+import { useGetUserQuery, useUpdateUserProfileMutation } from "../../../../redux/api/userApi";
+import { useFormik } from "formik";
+import { AutoComplete } from "primereact/autocomplete";
+import { Avatar } from "primereact/avatar";
+import { Button } from "primereact/button";
+import { Dialog } from "primereact/dialog";
+import { InputText } from "primereact/inputtext";
+import { Toast } from "primereact/toast";
+import { useRef, useState } from "react";
+import styles from './SolidAccountSettings.module.css'
+import { ERROR_MESSAGES } from "../../../../constants/error-messages";
+import showToast from "../../../../helpers/showToast";
+import { useSession } from '../../../../hooks/useSession'
+
+export const SolidPersonalInfo = () => {
+    const fileInputRef = useRef<HTMLInputElement>(null);
+    const toast = useRef<Toast>(null);
+
+    const [previewImage, setPreviewImage] = useState<string | null>(null);
+    const [deleteDialogVisible, setDeleteDialogVisible] = useState(false);
+    const [replaceDialogVisible, setReplaceDialogVisible] = useState(false);
+    const [pendingFile, setPendingFile] = useState<File | null>(null);
+
+    const { data: session, status } = useSession();
+    const user = session?.user;
+    const userId = user?.id;
+
+    const { data: userData, refetch } = useGetUserQuery(userId);
+
+    const [
+        deleteMedia,
+    ] = useDeleteMediaMutation();
+    const [updateUser] = useUpdateUserProfileMutation();
+
+    const initialValues = {
+        fullName: userData?.data?.fullName ?? "",
+        profilePicture: userData?.data?._media?.profilePicture[0]?._full_url ?? null,
+    };
+
+    const formik = useFormik({
+        initialValues,
+        enableReinitialize: true,
+        onSubmit: async (values) => {
+            try {
+                const formData = new FormData();
+                if (values.fullName !== initialValues.fullName) {
+                    formData.append("fullName", values.fullName);
+                }
+
+                if (values.profilePicture && values.profilePicture instanceof File) {
+                    formData.append("profilePicture", values.profilePicture);
+                }
+
+                if (!formData.has("fullName") && !formData.has("profilePicture")) {
+                    showToast(toast, "info", ERROR_MESSAGES.NO_CHANGE, ERROR_MESSAGES.NO_UPDATE_MADE);
+                    return;
+                }
+
+                const response = await updateUser({ data: formData }).unwrap();
+                if (response?.statusCode === 200) {
+                    showToast(toast, "success", ERROR_MESSAGES.PROFILE_SAVED, ERROR_MESSAGES.PROFILE_SAVED_SUCCESSFULLY);
+                    refetch();
+                    formik.resetForm();
+                    setPreviewImage(null);
+                } else {
+                    showToast(toast, "error", ERROR_MESSAGES.FAILED, ERROR_MESSAGES.FAILED_UPDATED_PROFILE);
+                }
+            } catch (error) {
+                showToast(toast, "error", ERROR_MESSAGES.FAILED, ERROR_MESSAGES.SOMETHING_WRONG);
+            }
+        },
+    });
+
+    const getInitials = (value: string) => {
+        if (!value) return "";
+
+        const email = value.includes('@') ? value.split('@')[0] : value;
+        return email[0]?.toUpperCase() || "";
+    };
+
+    const getColorFromInitials = (initials: string) => {
+        let hash = 0;
+        for (let i = 0; i < initials.length; i++) {
+            hash = initials.charCodeAt(i) + ((hash << 5) - hash);
+        }
+        const hue = Math.abs(hash) % 360;
+        return `hsl(${hue}, 60%, 60%)`;
+    };
+    const value = userData?.data?.email;
+    const initials = getInitials(value);
+    const bgColor = getColorFromInitials(initials);
+
+    const handleFileChange = (file: File) => {
+        const existing = userData?.data?._media?.profilePicture?.[0];
+        if (existing) {
+            setPendingFile(file);
+            setReplaceDialogVisible(true);
+        } else {
+            formik.setFieldValue("profilePicture", file);
+            setPreviewImage(URL.createObjectURL(file));
+        }
+    };
+
+
+    const handleDeleteAvatar = () => {
+        const existing = userData?.data?._media?.profilePicture?.[0];
+        if (existing) {
+            setDeleteDialogVisible(true);
+        } else {
+            formik.setFieldValue("profilePicture", null);
+            setPreviewImage(null);
+        }
+    };
+
+    const confirmReplace = async () => {
+        const existing = userData?.data?._media?.profilePicture?.[0];
+        try {
+            if (existing?.id) {
+                await deleteMedia(existing.id).unwrap();
+            }
+
+            if (pendingFile) {
+                formik.setFieldValue("profilePicture", pendingFile);
+                setTimeout(() => {
+                    formik.submitForm();
+                }, 0);
+            }
+
+        } catch (error) {
+            showToast(toast, "error", ERROR_MESSAGES.FAILED, ERROR_MESSAGES.FAILED_DELETED_IMAGE);
+        }
+
+        setReplaceDialogVisible(false);
+        setPendingFile(null);
+    };
+
+    const confirmDelete = async () => {
+        const existing = userData?.data?._media?.profilePicture?.[0];
+        if (existing?.id) {
+            try {
+                await deleteMedia(existing.id).unwrap();
+                showToast(toast, "success", ERROR_MESSAGES.DELETED, ERROR_MESSAGES.PROFILE_PICTURE_REMOVE);
+                refetch();
+            } catch {
+                showToast(toast, "error", ERROR_MESSAGES.ERROR, ERROR_MESSAGES.FAILED_DELETED_IMAGE);
+            }
+        }
+
+        formik.setFieldValue("profilePicture", null);
+        setPreviewImage(null);
+        setDeleteDialogVisible(false);
+    };
+
+    return (
+        <form onSubmit={formik.handleSubmit} className="h-full flex flex-column justify-content-between">
+            <Toast ref={toast} />
+            <div>
+                <div>
+                    <label className="form-field-label mb-2 font-bold">Profile Picture</label>
+                    <div className="flex align-items-center gap-3">
+                        {previewImage ? (
+                            <Avatar image={previewImage} shape="circle"
+                                style={{
+                                    height: '5rem',
+                                    width: '5rem'
+                                }}
+                            />
+                        ) : userData?.data?._media?.profilePicture?.[0]?._full_url ? (
+                            <div className="relative">
+                                <Avatar
+                                    image={userData?.data?._media?.profilePicture?.[0]?._full_url}
+                                    shape="circle"
+                                    style={{
+                                        height: '5rem',
+                                        width: '5rem'
+                                    }}
+                                />
+                                <div className={styles.SolidRemoveProfile} onClick={handleDeleteAvatar}>
+                                    <span className="pi pi-times" />
+                                </div>
+                            </div>
+                        ) : (
+                            <Avatar
+                                label={initials}
+                                size="xlarge"
+                                shape="circle"
+                                style={{
+                                    backgroundColor: bgColor,
+                                    color: '#ffffff',
+                                    height: '5rem',
+                                    width: '5rem'
+                                }}
+                            />
+                        )}
+
+                        <div className="flex gap-2">
+                            <Button
+                                type="button"
+                                size="small"
+                                severity="secondary"
+                                label="Upload Avatar"
+                                outlined
+                                className="small-button"
+                                onClick={() => fileInputRef.current?.click()}
+                            />
+                            <input
+                                ref={fileInputRef}
+                                type="file"
+                                accept=".jpg,.jpeg,.png,.svg"
+                                hidden
+                                onChange={(e) => {
+                                    const file = e.target.files?.[0];
+                                    if (file) handleFileChange(file);
+                                }}
+                            />
+                        </div>
+                    </div>
+                </div>
+                <div className='mt-4 mb-2 sm:mb-0' style={{ borderBottom: '1px dashed #D8E2EA' }}></div>
+                <div className="mt-4">
+                    <label className="form-field-label mb-2 font-bold">Details</label>
+                    <div className="grid">
+                        <div className="col-12 md:col-8 lg:col-5">
+                            <label className="form-field-label mb-2">Name</label>
+                            <InputText
+                                name="fullName"
+                                value={formik.values.fullName}
+                                onChange={formik.handleChange}
+                                className="w-full"
+                            />
+                        </div>
+                        <div className="col-12 md:col-8 lg:col-5">
+                            <label className="form-field-label mb-2">Email</label>
+                            <InputText disabled placeholder={userData?.data?.email} value={userData?.data?.email}
+                                className="w-full" />
+                        </div>
+                        <div className="col-12 md:col-8 lg:col-5">
+                            <label className="form-field-label mb-2">Contact Number</label>
+                            <InputText disabled placeholder={userData?.data?.mobile} value={userData?.data?.mobile}
+                                className="w-full" />
+                        </div>
+                        <div className="col-12 md:col-8 lg:col-5">
+                            <label className="form-field-label mb-2">Role</label>
+                            <AutoComplete
+                                multiple
+                                disabled
+                                value={userData?.data?.roles?.map((role: any) => role.name) || []}
+                            />
+
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div>
+                <Button
+                    type="submit"
+                    size="small"
+                    label="Save"
+                />
+            </div>
+            <Dialog
+                header={<h5 className='m-0 font-bold'>Replace Profile Picture</h5>}
+                visible={replaceDialogVisible}
+                headerClassName="px-4 py-3 secondary-border-bottom"
+                contentClassName="p-0"
+                style={{ width: '25vw' }}
+                className="solid-confirm-dialog "
+                modal
+                onHide={() => setReplaceDialogVisible(false)}
+            >
+                <div className="p-4">
+                    Do you want to replace the existing profile picture?
+                    <div className="flex justify-content-start mt-4 gap-2">
+                        <Button size="small" label="Confirm" severity="danger" onClick={confirmReplace} />
+                        <Button size="small" outlined label="Cancel" onClick={() => setReplaceDialogVisible(false)} />
+                    </div>
+                </div>
+            </Dialog>
+
+            <Dialog
+                header={<h5 className='m-0 font-bold'>Delete Profile Picture</h5>}
+                visible={deleteDialogVisible}
+                headerClassName="px-4 py-3 secondary-border-bottom"
+                contentClassName="p-0"
+                style={{ width: '25vw' }}
+                modal
+                className="solid-confirm-dialog "
+                onHide={() => setDeleteDialogVisible(false)}
+            >
+                <div className="p-4">
+                    Do you want to delete your profile picture?
+                    <div className="flex justify-content-start mt-4 gap-2">
+                        <Button size="small" label="Confirm" severity="danger" onClick={confirmDelete} />
+                        <Button size="small" outlined label="Cancel" onClick={() => setDeleteDialogVisible(false)} />
+                    </div>
+                </div>
+            </Dialog>
+
+        </form>
+    )
+}

package/dist/components/core/common/SolidCreateButton.d.ts

@@ -0,0 +1,2 @@
+export declare const SolidCreateButton: ({ createButtonUrl, createActionQueryParams, solidListViewLayout, responsiveIconOnly }: any) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SolidCreateButton.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SolidCreateButton.d.ts","sourceRoot":"","sources":["../../../../src/components/core/common/SolidCreateButton.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,iBAAiB,0FAAmG,GAAG,4CAqDnI,CAAC"}

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

@@ -0,0 +1,24 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import Link from "../../common/Link";
+import { usePathname } from "../../../hooks/usePathname";
+import { Button } from 'primereact/button';
+import { normalizeSolidListKanbanActionPath } from "../../../helpers/routePaths";
+export var SolidCreateButton = function (_a) {
+    var _b, _c, _d;
+    var createButtonUrl = _a.createButtonUrl, createActionQueryParams = _a.createActionQueryParams, solidListViewLayout = _a.solidListViewLayout, _e = _a.responsiveIconOnly, responsiveIconOnly = _e === void 0 ? false : _e;
+    var pathName = usePathname();
+    var resolveCreatePath = function () {
+        if (createButtonUrl) {
+            var normalizedUrl = normalizeSolidListKanbanActionPath(pathName, createButtonUrl);
+            var query = new URLSearchParams(createActionQueryParams).toString();
+            return query ? "".concat(normalizedUrl, "?").concat(query) : normalizedUrl;
+        }
+        return "".concat(normalizeSolidListKanbanActionPath(pathName, "form"), "/new?viewMode=edit");
+    };
+    var createPath = resolveCreatePath();
+    var icon = ((_b = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _b === void 0 ? void 0 : _b.addButtonIcon) || "pi pi-plus";
+    var label = ((_c = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _c === void 0 ? void 0 : _c.addButtonTitle) || "Add";
+    var className = ((_d = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _d === void 0 ? void 0 : _d.addButtonClassName) || "";
+    return (_jsx("div", { children: _jsx(Link, { href: createPath, children: responsiveIconOnly ? (_jsxs(_Fragment, { children: [_jsx(Button, { type: "button", icon: icon, className: "".concat(className, " p-button-sm lg:hidden solid-icon-button "), size: 'small' }), _jsx(Button, { type: "button", icon: icon, label: label, className: "".concat(className, " hidden lg:inline-flex"), size: 'small' })] })) : (_jsx(Button, { type: "button", icon: icon, label: label, className: "".concat(className), size: 'small' })) }) }));
+};
+//# sourceMappingURL=SolidCreateButton.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SolidCreateButton.js","sourceRoot":"","sources":["../../../../src/components/core/common/SolidCreateButton.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,mBAAmB,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAE,kCAAkC,EAAE,MAAM,6BAA6B,CAAC;AAEjF,MAAM,CAAC,IAAM,iBAAiB,GAAG,UAAC,EAAkG;;QAAhG,eAAe,qBAAA,EAAE,uBAAuB,6BAAA,EAAE,mBAAmB,yBAAA,EAAE,0BAA0B,EAA1B,kBAAkB,mBAAG,KAAK,KAAA;IACzH,IAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAE/B,IAAM,iBAAiB,GAAG;QACtB,IAAI,eAAe,EAAE;YACjB,IAAM,aAAa,GAAG,kCAAkC,CAAC,QAAQ,EAAE,eAAe,CAAC,CAAC;YACpF,IAAM,KAAK,GAAG,IAAI,eAAe,CAAC,uBAAuB,CAAC,CAAC,QAAQ,EAAE,CAAC;YACtE,OAAO,KAAK,CAAC,CAAC,CAAC,UAAG,aAAa,cAAI,KAAK,CAAE,CAAC,CAAC,CAAC,aAAa,CAAC;SAC9D;QAED,OAAO,UAAG,kCAAkC,CAAC,QAAQ,EAAE,MAAM,CAAC,uBAAoB,CAAC;IACvF,CAAC,CAAC;IAEF,IAAM,UAAU,GAAG,iBAAiB,EAAE,CAAC;IAEvC,IAAM,IAAI,GAAG,CAAA,MAAA,mBAAmB,aAAnB,mBAAmB,uBAAnB,mBAAmB,CAAE,KAAK,0CAAE,aAAa,KAAI,YAAY,CAAC;IACvE,IAAM,KAAK,GAAG,CAAA,MAAA,mBAAmB,aAAnB,mBAAmB,uBAAnB,mBAAmB,CAAE,KAAK,0CAAE,cAAc,KAAI,KAAK,CAAC;IAClE,IAAM,SAAS,GAAG,CAAA,MAAA,mBAAmB,aAAnB,mBAAmB,uBAAnB,mBAAmB,CAAE,KAAK,0CAAE,kBAAkB,KAAI,EAAE,CAAC;IAEvE,OAAO,CACH,wBACI,KAAC,IAAI,IAAC,IAAI,EAAE,UAAU,YACjB,kBAAkB,CAAC,CAAC,CAAC,CAClB,8BACI,KAAC,MAAM,IACH,IAAI,EAAC,QAAQ,EACb,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,UAAG,SAAS,8CAA2C,EAClE,IAAI,EAAC,OAAO,GACd,EAEF,KAAC,MAAM,IACH,IAAI,EAAC,QAAQ,EACb,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,UAAG,SAAS,2BAAwB,EAC/C,IAAI,EAAC,OAAO,GAEd,IACH,CACN,CAAC,CAAC,CAAC,CACA,KAAC,MAAM,IACH,IAAI,EAAC,QAAQ,EACb,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,UAAG,SAAS,CAAE,EACzB,IAAI,EAAC,OAAO,GACd,CACL,GAEE,GACL,CACT,CAAC;AACN,CAAC,CAAC"}