"use strict";
exports.id = 9417;
exports.ids = [9417];
exports.modules = {

/***/ 9417:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Z": () => (/* binding */ TargetUserPreviewPopup)
/* harmony export */ });
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(997);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6689);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _functions_frontend_fetchApi__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(6729);
/* harmony import */ var _general_GeneralPopup__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(5472);
/* harmony import */ var _general_LoadingBlock__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(5264);
/* harmony import */ var _form_FormCheckboxes__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(9486);
/* harmony import */ var _form_FormSelect__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(4114);
// @ts-check
/**
 * ==============================================================================
 * Imports
 * ==============================================================================
 */ 







/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
 * ==============================================================================
 * Main Component { Functional }
 * ==============================================================================
 * @param {Object} props
 * @param {import("@/package-shared/types").MYSQL_user_users_table_def | null} props.targetUser
 * @param {React.Dispatch<React.SetStateAction<import("@/package-shared/types").MYSQL_user_users_table_def | null>>} props.setTargetUser
 * @param {import("@/package-shared/types").UserType} props.user
 */ function TargetUserPreviewPopup({ targetUser , user , setTargetUser ,  }) {
    /**
     * Get Contexts
     *
     * @abstract { React.useContext }
     */ ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * Javascript Variables
     *
     * @abstract Non hook variables and functions
     */ const userPriviledges = __webpack_require__(9169);
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    if (!targetUser) {
        return null;
    }
    /**
     * React Hooks
     *
     * @abstract { useState, useEffect, useRef, etc ... }
     */ const [loading, setLoading] = react__WEBPACK_IMPORTED_MODULE_1___default().useState(true);
    /** @type {any} */ const databasesState = react__WEBPACK_IMPORTED_MODULE_1___default().useState([]);
    /** @type {[ dbTables: import("@/package-shared/types").DSQL_MYSQL_user_databases_Type[], setDbTables: React.Dispatch<React.SetStateAction<import("@/package-shared/types").DSQL_MYSQL_user_databases_Type[]>> ]} */ const [databases, setDatabases] = databasesState;
    const [allDbSelected, setAllDbSelected] = react__WEBPACK_IMPORTED_MODULE_1___default().useState(false);
    /** @type {any} */ const priviledgesState = react__WEBPACK_IMPORTED_MODULE_1___default().useState(targetUser ? targetUser.user_priviledge?.split("|") : []);
    /** @type {[ dbTables: string[], setDbTables: React.Dispatch<React.SetStateAction<string[]>> ]} */ const [priviledges, setPriviledges] = priviledgesState;
    const [databasesAccess, setDatabasesAccess] = react__WEBPACK_IMPORTED_MODULE_1___default().useState(targetUser?.database_access ? targetUser.database_access.split("|") : []);
    /** @type {any} */ const targetDbsState = react__WEBPACK_IMPORTED_MODULE_1___default().useState(targetUser ? targetUser.database_access?.split("|")[0] : null);
    /** @type {[ dbTables: string | null, setDbTables: React.Dispatch<React.SetStateAction<string | null>> ]} */ const [targetDb, setTargetDb] = targetDbsState;
    /** @type {any} */ const dbTablesState = react__WEBPACK_IMPORTED_MODULE_1___default().useState([]);
    /** @type {[ dbTables: import("@/package-shared/types").MYSQL_user_database_tables_table_def[] | null, setDbTables: React.Dispatch<React.SetStateAction<import("@/package-shared/types").MYSQL_user_database_tables_table_def[] | null>> ]} */ const [dbTables, setDbTables] = dbTablesState;
    /** @type {any} */ const selectedDbTablesState = react__WEBPACK_IMPORTED_MODULE_1___default().useState([]);
    /** @type {[ dbTables: string[], setDbTables: React.Dispatch<React.SetStateAction<string[]>> ]} */ const [selectedDbTables, setSlectedDbTables] = selectedDbTablesState;
    react__WEBPACK_IMPORTED_MODULE_1___default().useEffect(()=>{
        (0,_functions_frontend_fetchApi__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z)("/api/getUserDatabases").then((res)=>{
            if (res.success) {
                setDatabases(res.databases);
            }
        });
    }, []);
    react__WEBPACK_IMPORTED_MODULE_1___default().useEffect(()=>{
        if (!targetUser) return;
        if (!targetDb) {
            setTargetDb(targetUser.database_access?.split("|")[0] || null);
        } else {
            (0,_functions_frontend_fetchApi__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z)(`/api/getDatabaseTables?dbSlug=${targetDb}&dbOwnerId=${user.id}&delegatedUserId=${targetUser.invited_user_id}`).then((res)=>{
                if (res.success) {
                    setDbTables(null);
                    setTimeout(()=>{
                        setDbTables([
                            ...res.tables
                        ]);
                    }, 200);
                }
                if (res.accessed_tables && res.accessed_tables[0] && !selectedDbTables[0]) {
                    setSlectedDbTables(res.accessed_tables.map((/** @type {any} */ acTb)=>`${acTb.database}-${acTb.table}`));
                }
            });
        }
    }, [
        targetDb
    ]);
    react__WEBPACK_IMPORTED_MODULE_1___default().useEffect(()=>{
        setLoading(true);
        if (targetUser) {
            setPriviledges(targetUser.user_priviledge?.split("|") || []);
            setDatabasesAccess(targetUser.database_access?.split("|") || []);
        }
        setTimeout(()=>{
            setLoading(false);
        }, 500);
    }, [
        targetUser
    ]);
    react__WEBPACK_IMPORTED_MODULE_1___default().useEffect(()=>{
        setTargetDb(databasesAccess?.[0] || null);
    }, [
        databasesAccess
    ]);
    ////////////////////////////////////////
    ////////////////////////////////////////
    ////////////////////////////////////////
    /**
     * Function Return
     *
     * @abstract Main Function Return
     */ return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_general_GeneralPopup__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .ZP, {
        title: "target-user-popup",
        closePopupDispatch: ()=>{
            setTargetUser(null);
        },
        children: [
            loading && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_general_LoadingBlock__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z, {
                position: "relative"
            }),
            !loading && targetUser && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx((react__WEBPACK_IMPORTED_MODULE_1___default().Fragment), {
                children: /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
                    className: "flex-col w-full items-start p-4",
                    children: [
                        /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("h4", {
                            className: "m-0",
                            children: [
                                "Edit ",
                                targetUser.first_name,
                                " ",
                                targetUser.last_name,
                                "'s Access"
                            ]
                        }),
                        /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("hr", {}),
                        /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("form", {
                            className: "flex flex-col items-start w-full",
                            onSubmit: (e)=>{
                                e.preventDefault();
                                setLoading(true);
                                (0,_functions_frontend_fetchApi__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z)("/api/updateAdminUserAccess", {
                                    method: "post",
                                    body: {
                                        userObject: targetUser,
                                        user_priviledge: priviledges.join("|"),
                                        database_access: databasesAccess?.join("|"),
                                        db_tables: databasesAccess && databasesAccess[0] ? selectedDbTables.join("|") : "",
                                        inv_user_id: targetUser.invited_user_id
                                    }
                                }, true).then((res)=>{
                                    window.location.reload();
                                    setTimeout(()=>{
                                        setLoading(false);
                                    }, 500);
                                });
                            },
                            children: [
                                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("h3", {
                                    className: "m-0 text-lg font-semibold mb-1 text-slate-600",
                                    children: "User Priviledges"
                                }),
                                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_form_FormCheckboxes__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z, {
                                    checkBoxValues: userPriviledges.map((userPriviledge)=>{
                                        return {
                                            title: userPriviledge,
                                            name: userPriviledge,
                                            default: priviledges.includes(userPriviledge) ? true : false,
                                            onChangeHandler: (e)=>{
                                                if (priviledges.includes(userPriviledge)) {
                                                    let newArray = priviledges.filter((priv)=>priv != userPriviledge);
                                                    setPriviledges([
                                                        ...newArray, 
                                                    ]);
                                                } else {
                                                    setPriviledges((prev)=>[
                                                            ...prev,
                                                            userPriviledge, 
                                                        ]);
                                                }
                                            }
                                        };
                                    }),
                                    smallText: true,
                                    flexRow: true
                                }),
                                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("hr", {
                                    className: "my-6"
                                }),
                                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("h3", {
                                    className: "m-0 text-lg font-semibold mb-2 text-slate-600",
                                    children: "Databases Access"
                                }),
                                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("span", {
                                    className: "button outlined gray px-4 py-1 -mt-1 mb-1.5",
                                    onClick: (e)=>{
                                        if (allDbSelected) {
                                            databases.forEach((db)=>{
                                                setTimeout(()=>{
                                                    /** @type {HTMLInputElement} */ // @ts-ignore
                                                    const elt = document.getElementById(db.db_slug);
                                                    if (elt?.checked) elt.click();
                                                }, 200);
                                            });
                                            setAllDbSelected(false);
                                        } else {
                                            databases.forEach((db)=>{
                                                setTimeout(()=>{
                                                    /** @type {HTMLInputElement} */ // @ts-ignore
                                                    const elt = document.getElementById(db.db_slug);
                                                    if (!elt.checked) elt.click();
                                                }, 200);
                                            });
                                            setAllDbSelected(true);
                                        }
                                    },
                                    children: allDbSelected ? "Deselect All" : "Select All"
                                }),
                                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_form_FormCheckboxes__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z, {
                                    checkBoxValues: databases.map((db)=>{
                                        return {
                                            title: db.db_name,
                                            name: db.db_slug,
                                            onChangeHandler: (e)=>{
                                                if (databasesAccess.includes(db.db_slug)) {
                                                    let newArray = databasesAccess.filter((_db)=>_db != db.db_slug);
                                                    setDatabasesAccess([
                                                        ...newArray, 
                                                    ]);
                                                } else {
                                                    setDatabasesAccess((prev)=>[
                                                            ...prev,
                                                            db.db_slug, 
                                                        ]);
                                                }
                                                if (databasesAccess.length === databases.length) {
                                                    setAllDbSelected(true);
                                                } else {
                                                    setAllDbSelected(false);
                                                }
                                            },
                                            default: databasesAccess.includes(db.db_slug) ? true : false
                                        };
                                    }),
                                    smallText: true,
                                    flexRow: true
                                }),
                                databasesAccess && databasesAccess[0] && /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)((react__WEBPACK_IMPORTED_MODULE_1___default().Fragment), {
                                    children: [
                                        /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("hr", {
                                            className: "my-6"
                                        }),
                                        /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("h3", {
                                            className: "m-0 text-lg font-semibold mb-2 text-slate-600",
                                            children: "Database Tables"
                                        }),
                                        /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_form_FormSelect__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {
                                            required: true,
                                            selectOptions: databases.filter((db)=>databasesAccess.includes(db.db_slug)).map((db)=>{
                                                return {
                                                    title: db.db_name,
                                                    payload: db.db_slug
                                                };
                                            }),
                                            name: "databases",
                                            onChangeHandler: (e)=>{
                                                setTargetDb(e.target.value);
                                            }
                                        }),
                                        /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                                            className: "h-2"
                                        }),
                                        dbTables && dbTables[0] && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_form_FormCheckboxes__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z, {
                                            checkBoxValues: dbTables.map((dbTable)=>{
                                                return {
                                                    title: dbTable.table_name,
                                                    name: dbTable.table_slug,
                                                    onChangeHandler: (e)=>{
                                                        if (selectedDbTables.includes(`${targetDb}-${dbTable.table_slug}`)) {
                                                            let newArray = selectedDbTables.filter((table)=>table != `${targetDb}-${dbTable.table_slug}`);
                                                            setSlectedDbTables([
                                                                ...newArray, 
                                                            ]);
                                                        } else {
                                                            setSlectedDbTables((prev)=>[
                                                                    ...prev,
                                                                    `${targetDb}-${dbTable.table_slug}`, 
                                                                ]);
                                                        }
                                                    },
                                                    default: selectedDbTables.includes(`${targetDb}-${dbTable.table_slug}`) ? true : false
                                                };
                                            }),
                                            smallText: true,
                                            flexRow: true
                                        })
                                    ]
                                }),
                                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("button", {
                                    className: "mt-4 w-full",
                                    children: "Update User Access"
                                })
                            ]
                        })
                    ]
                })
            })
        ]
    });
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
} /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */  /** ****************************************************************************** */ 


/***/ }),

/***/ 9169:
/***/ ((module) => {

module.exports = JSON.parse('["Edit Tables","Update Entries","Create Table","Delete Entries","Delete Tables"]');

/***/ })

};
;