344 lines
21 KiB
JavaScript
344 lines
21 KiB
JavaScript
"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"]');
|
|
|
|
/***/ })
|
|
|
|
};
|
|
; |