dsql-admin/dsql-app/.local_dist/server/chunks/9035.js
2024-11-05 12:12:42 +01:00

2217 lines
108 KiB
JavaScript

"use strict";
exports.id = 9035;
exports.ids = [9035,2348];
exports.modules = {
/***/ 2943:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
// EXPORTS
__webpack_require__.d(__webpack_exports__, {
"Z": () => (/* binding */ ImportExportEntries)
});
// EXTERNAL MODULE: external "react/jsx-runtime"
var jsx_runtime_ = __webpack_require__(997);
// EXTERNAL MODULE: external "react"
var external_react_ = __webpack_require__(6689);
var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_);
// EXTERNAL MODULE: ./components/general/LoadingBlock.jsx
var LoadingBlock = __webpack_require__(5264);
// EXTERNAL MODULE: ./functions/frontend/inputFileToBase64.js
var inputFileToBase64 = __webpack_require__(3314);
// EXTERNAL MODULE: ./functions/frontend/fetchApi.js
var fetchApi = __webpack_require__(6729);
;// CONCATENATED MODULE: ./components/admin/databases/functions/import-export-handler.js
// @ts-check
/**
* Import ot Export Table Data
* ==============================================================================
* @param {Object} param0
* @param {"import" | "export"} param0.paradigm
* @param {any} [param0.payload]
* @param {any} param0.setLoading
* @param {DSQL_TableSchemaType} param0.table
* @param {DSQL_MYSQL_user_databases_Type} param0.database
*/ function importExportHandler({ paradigm , payload , setLoading , table , database , }) {
setLoading(true);
if (paradigm === "import") {}
(0,fetchApi/* default */.Z)("/api/exportTableData", {
method: "POST",
body: {
paradigm,
dbName: database.db_slug,
tableName: table.tableName,
payload: payload
}
}, true).then((res)=>{
if (res.success) {
if (paradigm == "export") {
const data = res.data;
const jsonString = JSON.stringify(data || [], null, 4);
const blob = new Blob([
jsonString
], {
type: "application/json"
});
const url = URL.createObjectURL(blob);
const a = document.createElement("a");
a.href = url;
a.style.display = "none";
a.download = `${database.db_slug}-${table.tableName}-${Date.now()}.json`;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
} else if (paradigm == "import") {
window.alert("Data Imported Successfully");
window.location.reload();
}
} else if (res.msg) {
window.alert(res.msg);
}
}).catch((error)=>{
console.log(error);
}).finally(()=>{
setLoading(false);
});
}
;// CONCATENATED MODULE: ./components/admin/databases/ImportExportEntries.jsx
// @ts-check
/**
* ==============================================================================
* Imports
* ==============================================================================
*/
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
* # Import Export Entries
* ===================================================
* @param {object} props
* @param {DSQL_MYSQL_user_databases_Type} props.database
* @param {DSQL_TableSchemaType} props.table
* @returns
*/ function ImportExportEntries({ database , table }) {
const [loading, setLoading] = external_react_default().useState(false);
const [inputReady, setInputReady] = external_react_default().useState(true);
/** @type {React.RefObject<HTMLInputElement>} */ const fileRef = external_react_default().useRef(null);
/** @type {React.RefObject<HTMLFormElement>} */ const formRef = external_react_default().useRef(null);
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
function resetForm() {
setInputReady(false);
setTimeout(()=>{
setInputReady(true);
}, 200);
}
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
return /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
className: "relative",
children: [
loading && /*#__PURE__*/ jsx_runtime_.jsx(LoadingBlock/* default */.Z, {
width: "15px"
}),
/*#__PURE__*/ jsx_runtime_.jsx("div", {
className: "button outlined gray",
onClick: (e)=>{
importExportHandler({
paradigm: "export",
database,
setLoading,
table
});
},
children: "Export"
}),
/*#__PURE__*/ jsx_runtime_.jsx("div", {
className: "button outlined gray",
onClick: (e)=>{
fileRef.current?.addEventListener("change", (e)=>{
setLoading(true);
/** @type {HTMLInputElement} */ // @ts-ignore
const inputEl = e.target;
if (!inputEl.files?.[0]) {
window.alert("No FIles selected");
setLoading(false);
return;
}
(0,inputFileToBase64/* default */.Z)({
inputFile: inputEl.files[0]
}).then((fileObject)=>{
if (window.confirm(`Use this file '${fileObject.fileName}' as your import file?`)) {
importExportHandler({
paradigm: "import",
payload: fileObject.fileBase64,
database,
setLoading,
table
});
resetForm();
} else {
setLoading(false);
resetForm();
}
});
});
fileRef.current?.click();
},
children: "Import"
}),
inputReady && /*#__PURE__*/ jsx_runtime_.jsx("input", {
type: "file",
name: "json_file_input",
id: "json_file_input",
accept: ".json",
className: "hidden",
ref: fileRef
})
]
});
}
/***/ }),
/***/ 3684:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "Z": () => (/* binding */ MoreTableOptions)
/* 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 react_tiny_popover__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(7076);
/* harmony import */ var react_tiny_popover__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_tiny_popover__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var lucide_react__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(2423);
/* harmony import */ var lucide_react__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(lucide_react__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _SyncDataButton__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(436);
// @ts-check
/**
* ==============================================================================
* Imports
* ==============================================================================
*/
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
* # Import Export Entries
* ===================================================
* @param {object} props
* @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} props.database
* @param {import("@/package-shared/types").DSQL_TableSchemaType} props.table
* @param {import("@/package-shared/types").DSQL_DatabaseSchemaType[]} props.dbSchemaData
* @param {any} props.query
* @returns
*/ function MoreTableOptions({ database , table , dbSchemaData , query , }) {
const [open, setOpen] = react__WEBPACK_IMPORTED_MODULE_1___default().useState(false);
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(react_tiny_popover__WEBPACK_IMPORTED_MODULE_2__.Popover, {
isOpen: open,
onClickOutside: ()=>setOpen(false),
positions: [
"bottom"
],
align: "end",
content: /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
className: "stack items-stretch bg-white rounded shadow-md gap-0 min-w-[200px]",
children: [
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_SyncDataButton__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z, {
database,
table,
setOpenPopover: setOpen,
dbSchemaData,
query
}),
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("hr", {
className: "m-0"
})
]
}),
containerClassName: "z-[1000]",
children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("button", {
onClick: ()=>{
setOpen(!open);
},
className: "outlined gray px-2 py-1.5",
children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(lucide_react__WEBPACK_IMPORTED_MODULE_3__.Ellipsis, {})
})
});
}
/***/ }),
/***/ 436:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
// EXPORTS
__webpack_require__.d(__webpack_exports__, {
"Z": () => (/* binding */ SyncDataButton)
});
// UNUSED EXPORTS: SyncDataModalContent
// EXTERNAL MODULE: external "react/jsx-runtime"
var jsx_runtime_ = __webpack_require__(997);
// EXTERNAL MODULE: ./components/form/FormRadios.jsx
var FormRadios = __webpack_require__(2348);
// EXTERNAL MODULE: ./components/form/FormSelect.jsx
var FormSelect = __webpack_require__(4114);
// EXTERNAL MODULE: ./components/general/LoadingBlock.jsx
var LoadingBlock = __webpack_require__(5264);
// EXTERNAL MODULE: ./components/general/Modal.jsx
var Modal = __webpack_require__(9471);
// EXTERNAL MODULE: ./functions/frontend/fetchApi.js
var fetchApi = __webpack_require__(6729);
;// CONCATENATED MODULE: ./functions/frontend/syncTableDataFormHandler.js
// @ts-check
/**
* ==============================================================================
* Imports
* ==============================================================================
*/
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
* ==============================================================================
* Auth user on client side
* ==============================================================================
* @param {object} params
* @param {React.FormEvent<HTMLFormElement>} params.e
* @param {React.Dispatch<React.SetStateAction<boolean>>} params.setLoading
* @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} params.database
* @param {import("@/package-shared/types").DSQL_TableSchemaType} params.table
* @param {any} params.query
*
* @requires search-field name attribute
*/ function syncTableDataFormHandler({ e , setLoading , database , table , query , }) {
e.preventDefault();
setLoading(true);
/** @type {HTMLFormElement} */ // @ts-ignore
const formEl = e.target;
const paradigm = formEl["paradigm"]?.value;
const dstDbName = formEl["database"]?.value;
const dstTableName = formEl["table"]?.value;
/** @type {import("@/pages/api/sync-table-data").SyncTableBody} */ const fetchObject = {
paradigm: paradigm,
src: {
db: database.db_slug,
table: table.tableName
},
dst: {
db: dstDbName,
table: dstTableName
},
delegated: query.delegated
};
const alertMsg = paradigm == "Pull" ? "NOTE: This operation will override the current database entries. Continue?" : "NOTE: This operation will override the selected database entries. Continue?";
if (!window.confirm(alertMsg)) {
setTimeout(()=>{
setLoading(false);
}, 1000);
return;
}
(0,fetchApi/* default */.Z)("/api/sync-table-data", {
method: "POST",
body: {
...fetchObject
}
}, true).then((res)=>{
if (res.success) {
window.alert("Data Sync Successful");
window.location.reload();
} else {
if (res.msg) window.alert("ERROR: " + res.msg);
}
}).finally(()=>{
setTimeout(()=>{
setLoading(false);
}, 1000);
});
} ////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
// EXTERNAL MODULE: external "lodash"
var external_lodash_ = __webpack_require__(6517);
var external_lodash_default = /*#__PURE__*/__webpack_require__.n(external_lodash_);
// EXTERNAL MODULE: external "react"
var external_react_ = __webpack_require__(6689);
var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_);
;// CONCATENATED MODULE: ./components/admin/databases/SyncDataButton.jsx
// @ts-check
/**
* ==============================================================================
* Imports
* ==============================================================================
*/
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
* @param {object} props
* @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} props.database
* @param {import("@/package-shared/types").DSQL_TableSchemaType} props.table
* @param {import("@/package-shared/types").DSQL_DatabaseSchemaType[]} props.dbSchemaData
* @param {React.Dispatch<React.SetStateAction<boolean>>} [props.setOpenPopover]
* @param {any} props.query
*/ function SyncDataButton({ database , table , setOpenPopover , dbSchemaData , query , }) {
const [open, setOpen] = external_react_default().useState(false);
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
return /*#__PURE__*/ (0,jsx_runtime_.jsxs)(jsx_runtime_.Fragment, {
children: [
/*#__PURE__*/ jsx_runtime_.jsx("button", {
className: "ghost p-3 justify-start",
onClick: ()=>{
setOpen(true);
setTimeout(()=>{
if (setOpenPopover) setOpenPopover(false);
}, 200);
},
children: "Sync Data"
}),
/*#__PURE__*/ jsx_runtime_.jsx(Modal/* default */.Z, {
open: open,
setOpen: setOpen,
children: /*#__PURE__*/ jsx_runtime_.jsx(SyncDataModalContent, {
database,
table,
dbSchemaData,
query
})
})
]
});
}
/**
* @param {object} props
* @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} props.database
* @param {import("@/package-shared/types").DSQL_TableSchemaType} props.table
* @param {import("@/package-shared/types").DSQL_DatabaseSchemaType[]} props.dbSchemaData
* @param {any} props.query
*/ function SyncDataModalContent({ database , table , query , dbSchemaData: initialSchema , }) {
/** @type {[ state: import("@/package-shared/types").DSQL_DatabaseSchemaType[], dispatch: React.Dispatch<React.SetStateAction<import("@/package-shared/types").DSQL_DatabaseSchemaType[]>> ]} */ // @ts-ignore
const [dbSchemaData, setDbSchemaData] = external_react_default().useState(initialSchema);
const [paradigm, setParadigm] = external_react_default().useState("Push");
const [targetDb, setTargetDb] = external_react_default().useState(dbSchemaData?.[0]);
const [tables, setTables] = external_react_default().useState(targetDb?.tables);
const [targetTable, setTargetTable] = external_react_default().useState(tables?.[0]);
const [loading, setLoading] = external_react_default().useState(false);
const [isCompatible, setIsCompatible] = external_react_default().useState(false);
external_react_default().useEffect(()=>{
const isEqual = external_lodash_default().isEqual(table?.fields, targetTable?.fields);
if (isEqual) {
setIsCompatible(true);
} else {
setIsCompatible(false);
}
}, [
targetTable,
setTargetDb
]);
external_react_default().useEffect(()=>{
if (query.delegated) {
(0,fetchApi/* default */.Z)("/api/get-authorized-databases").then((res)=>{
if (res.success && res.payload) {
setDbSchemaData(res.payload);
}
});
}
}, []);
return /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
className: "stack gap-2 relative w-full",
children: [
loading || !dbSchemaData && /*#__PURE__*/ jsx_runtime_.jsx(LoadingBlock/* default */.Z, {
width: "20px"
}),
/*#__PURE__*/ jsx_runtime_.jsx("h3", {
className: "m-0 text-lg",
children: "Sync Data with another table"
}),
!isCompatible ? /*#__PURE__*/ (0,jsx_runtime_.jsxs)("span", {
className: "info warning inline",
children: [
"The selected table is not compatible with",
" ",
/*#__PURE__*/ jsx_runtime_.jsx("b", {
children: table.tableFullName
})
]
}) : /*#__PURE__*/ (0,jsx_runtime_.jsxs)("span", {
className: "info green inline",
children: [
"The selected table matches ",
/*#__PURE__*/ jsx_runtime_.jsx("b", {
children: table.tableFullName
}),
" ",
"schema"
]
}),
dbSchemaData && /*#__PURE__*/ (0,jsx_runtime_.jsxs)("form", {
onSubmit: (e)=>{
syncTableDataFormHandler({
e,
database,
setLoading,
table,
query
});
},
className: "w-full stack gap-2 items-stretch",
children: [
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
className: "stack gap-2 my-2",
children: [
/*#__PURE__*/ jsx_runtime_.jsx(FormRadios/* default */.Z, {
radioValues: [
{
title: "Push",
payload: "Push",
default: true
},
{
title: "Pull",
payload: "Pull"
},
],
name: "paradigm",
smallText: true,
flexRow: true,
onChangeHandler: (e)=>{
setParadigm(e.target.value);
}
}),
/*#__PURE__*/ jsx_runtime_.jsx("span", {
className: "text-xs text-slate-500 dark:text-slate-400",
children: paradigm == "Push" ? /*#__PURE__*/ (0,jsx_runtime_.jsxs)(jsx_runtime_.Fragment, {
children: [
"Sync data from the current table(",
/*#__PURE__*/ jsx_runtime_.jsx("b", {
children: table.tableFullName
}),
") to the selected table below"
]
}) : /*#__PURE__*/ (0,jsx_runtime_.jsxs)(jsx_runtime_.Fragment, {
children: [
"Sync data from the selected table below to the current table(",
/*#__PURE__*/ jsx_runtime_.jsx("b", {
children: table.tableFullName
}),
")"
]
})
})
]
}),
/*#__PURE__*/ jsx_runtime_.jsx(FormSelect/* default */.Z, {
selectOptions: dbSchemaData.filter((dbObj)=>dbObj.dbFullName !== database.db_full_name).map((dbObj)=>({
title: dbObj.dbName,
payload: dbObj.dbSlug
})),
name: "database",
onChangeHandler: (e)=>{
const targetDatabase = dbSchemaData.find((db)=>db.dbSlug == e.target.value);
if (targetDatabase) {
setTargetDb(targetDatabase);
setTables(targetDatabase.tables);
setTargetTable(targetDatabase.tables?.[0]);
}
}
}),
/*#__PURE__*/ jsx_runtime_.jsx(FormSelect/* default */.Z, {
selectOptions: tables.map((tbl)=>({
title: tbl.tableFullName,
payload: tbl.tableName
})),
name: "table",
onChangeHandler: (e)=>{
const findTable = tables.find((tb)=>tb.tableName === e.target.value);
if (findTable) setTargetTable(findTable);
}
}),
/*#__PURE__*/ jsx_runtime_.jsx("button", {
className: isCompatible ? "" : "disabled",
children: "Sync"
})
]
})
]
});
}
/***/ }),
/***/ 6122:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
// EXPORTS
__webpack_require__.d(__webpack_exports__, {
"Z": () => (/* binding */ TableEntriesList)
});
// EXTERNAL MODULE: external "react/jsx-runtime"
var jsx_runtime_ = __webpack_require__(997);
// EXTERNAL MODULE: external "react"
var external_react_ = __webpack_require__(6689);
var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_);
// EXTERNAL MODULE: ./components/admin/databases/UpdateEntryForm.jsx + 1 modules
var UpdateEntryForm = __webpack_require__(1985);
// EXTERNAL MODULE: ./pages/admin/[user_id]/databases/[single]/tables/[single_table]/entries/index.jsx + 1 modules
var _single_table_entries = __webpack_require__(7722);
// EXTERNAL MODULE: ./components/form/FormSelect.jsx
var FormSelect = __webpack_require__(4114);
// EXTERNAL MODULE: ./components/form/FormInput.jsx + 2 modules
var FormInput = __webpack_require__(7901);
// EXTERNAL MODULE: ./functions/frontend/fetchApi.js
var fetchApi = __webpack_require__(6729);
// EXTERNAL MODULE: ./components/general/LoadingBlock.jsx
var LoadingBlock = __webpack_require__(5264);
;// CONCATENATED MODULE: ./components/admin/databases/SearchEntriesSection.jsx
// @ts-check
/**
* ==============================================================================
* Imports
* ==============================================================================
*/
/** @type {any} */ let timeout;
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
* ==============================================================================
* Main Component { Functional }
* ==============================================================================
* @param {Object} props - Server props
* @param {any} [props.data]
*/ function SearchEntriesSection({ data }) {
/**
* Get Contexts
*
* @abstract { React.useContext }
*/ const { table , entries , activeEntries , setActiveEntries , confirmedDelegetedUser , database , targetField , searchTerm , } = external_react_default().useContext(_single_table_entries.TableEntriesContext);
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* Javascript Variables
*
* @abstract Non hook variables and functions
*/ const dataTypes = __webpack_require__(9594);
const isDelegated = confirmedDelegetedUser?.delegated;
const isTableEditable = confirmedDelegetedUser?.priviledges?.match(/Edit Tables/i);
const isTableDeletable = confirmedDelegetedUser?.priviledges?.match(/Delete Tables/i);
const isTableCreatable = confirmedDelegetedUser?.priviledges?.match(/Create Tables/i);
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* React Hooks
*
* @abstract { useState, useEffect, useRef, etc ... }
*/ const [loading, setLoading] = external_react_default().useState(false);
/** @type {React.MutableRefObject<HTMLElement | undefined>} */ const searchInputRef = external_react_default().useRef();
external_react_default().useEffect(()=>{
if (searchInputRef.current) searchInputRef.current.focus();
}, []);
const [count, setCount] = external_react_default().useState(null);
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
function search(/** @type {string} */ term) {
setLoading(true);
if (activeEntries) setActiveEntries(null);
if (!term?.toString().match(/./)) {
setTimeout(()=>{
if (setActiveEntries) setActiveEntries(entries || []);
setLoading(false);
}, 500);
return;
}
window.clearTimeout(timeout);
const targetFieldObject = table?.fields.filter((fld)=>fld.fieldName === targetField?.current);
const operator = (()=>{
if (targetFieldObject && targetFieldObject[0]) {
if (targetFieldObject[0].dataType?.match(/int/i)) return "equal";
}
if (targetField?.current?.match(/^id$/)) return "equal";
return "like";
})();
timeout = setTimeout(()=>{
setLoading(false);
(0,fetchApi/* default */.Z)(`/api/queryEntriesSearchTerm?db=${database?.db_full_name}&table=${table?.tableName}&field=${targetField?.current}&term=${term}&operator=${operator}`).then((res)=>{
if (typeof res.count == "number") {
setCount(res.count);
}
if (res.success && setActiveEntries) {
setActiveEntries(res.result);
}
setLoading(false);
});
}, 500);
}
////////////////////////////////////////
/**
* Function Return
*
* @abstract Main Function Return
*/ return /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
className: "w-full flex-col items-stretch",
children: [
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("form", {
onSubmit: (e)=>{
e.preventDefault();
if (searchTerm?.current) search(searchTerm.current);
},
className: "flex flex-row items-stretch gap-4 w-full",
children: [
/*#__PURE__*/ jsx_runtime_.jsx("div", {
className: "max-w-xs",
children: /*#__PURE__*/ jsx_runtime_.jsx(FormSelect/* default */.Z, {
required: true,
selectOptions: table ? table.fields.map((fieldObject)=>{
return {
title: fieldObject.fieldName || "",
payload: fieldObject.fieldName || ""
};
}) : [],
name: "database_tables",
onChangeHandler: (e)=>{
if (targetField) targetField.current = e.target.value;
// setTimeout(() => {
// search(searchTerm);
// }, 500);
},
title: "Select Field",
defaultValue: targetField?.current,
id: "entries-search-field-select"
})
}),
/*#__PURE__*/ jsx_runtime_.jsx("div", {
className: "grow",
children: /*#__PURE__*/ jsx_runtime_.jsx(FormInput/* default */.Z, {
title: "Search Term",
placeholder: "Enter search term that corresponds with the selected field type ...",
onInputHandler: (e)=>{
/** @type {HTMLInputElement} */ // @ts-ignore
const inputEl = e.target;
if (inputEl.value?.match(/./) && searchTerm) {
searchTerm.current = inputEl.value;
} else if (searchTerm) {
searchTerm.current = null;
}
search(inputEl.value);
},
elementRef: searchInputRef,
id: "entries-search-input"
})
}),
loading && /*#__PURE__*/ jsx_runtime_.jsx("div", {
className: "relative items-center justify-center",
children: /*#__PURE__*/ jsx_runtime_.jsx("div", {
className: "relative mt-5 w-6",
children: /*#__PURE__*/ jsx_runtime_.jsx(LoadingBlock/* default */.Z, {
width: "20px"
})
})
})
]
}),
searchTerm?.current?.match(/./) && /*#__PURE__*/ jsx_runtime_.jsx("div", {
className: "py-4",
children: /*#__PURE__*/ (0,jsx_runtime_.jsxs)("span", {
className: "text-lg",
children: [
typeof count == "number" ? count > 0 ? /*#__PURE__*/ (0,jsx_runtime_.jsxs)("b", {
children: [
count,
" "
]
}) : /*#__PURE__*/ jsx_runtime_.jsx(jsx_runtime_.Fragment, {
children: "No "
}) : "... ",
"Search result",
!count || count === 1 ? "" : "s",
" for",
" ",
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("b", {
children: [
'"',
searchTerm.current,
'"'
]
})
]
})
})
]
});
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
} /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */
// EXTERNAL MODULE: external "@mui/icons-material/LibraryAddTwoTone"
var LibraryAddTwoTone_ = __webpack_require__(9438);
var LibraryAddTwoTone_default = /*#__PURE__*/__webpack_require__.n(LibraryAddTwoTone_);
// EXTERNAL MODULE: ./components/admin/databases/ImportExportEntries.jsx + 1 modules
var ImportExportEntries = __webpack_require__(2943);
// EXTERNAL MODULE: ./components/admin/databases/MoreTableOptions.jsx
var MoreTableOptions = __webpack_require__(3684);
// EXTERNAL MODULE: ./components/admin/databases/SyncDataButton.jsx + 1 modules
var SyncDataButton = __webpack_require__(436);
;// CONCATENATED MODULE: ./components/admin/databases/TableEntriesList.jsx
// @ts-check
/**
* ==============================================================================
* Imports
* ==============================================================================
*/
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
* ==============================================================================
* Main Component { Functional }
* ==============================================================================
* @param {Object} props - Server props
* @param {import("@/package-shared/types").UserType} props.user
* @param {any[] | null} props.entries
* @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} props.database
* @param {import("@/package-shared/types").DSQL_TableSchemaType} props.table
* @param {React.Dispatch<React.SetStateAction<any>>} [props.setTargetEntry]
* @param {import("@/package-shared/types").DSQL_DatabaseSchemaType[]} props.dbSchemaData
* @param {React.MutableRefObject<import("@/package-shared/types").RichTextEditorsRefArray[]>} props.richTextEditors
* @param {React.MutableRefObject<import("@/package-shared/types").JSONTextEditorsRefArray[]>} props.jsonTextEditors
* @param {any[]} props.dataTypes
* @param {string} [props.title]
* @param {any} [props.confirmedDelegetedUser]
* @param {any} [props.query]
* @param {any} [props.search]
* @param {number} [props.entriesCount]
*/ function TableEntriesList({ user , entries , database , table , setTargetEntry , dbSchemaData , richTextEditors , jsonTextEditors , dataTypes , title , confirmedDelegetedUser , query , search , entriesCount , }) {
/**
* Get Contexts
*
* @abstract { React.useContext }
*/ ////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* Javascript Variables
*
* @abstract Non hook variables and functions
*/ const isDelegated = confirmedDelegetedUser?.delegated;
const isTableEditable = confirmedDelegetedUser?.priviledges?.match(/Edit Tables/i);
const isTableDeletable = confirmedDelegetedUser?.priviledges?.match(/Delete Tables/i);
const isTableCreatable = confirmedDelegetedUser?.priviledges?.match(/Create Tables/i);
const areEntriesEditable = confirmedDelegetedUser?.priviledges?.match(/Edit Entries/i);
const areEntriesDeletable = confirmedDelegetedUser?.priviledges?.match(/Delete Entries/i);
const { active_clone , active_clone_parent_db , remote_connected } = database;
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* React Hooks
*
* @abstract { useState, useEffect, useRef, etc ... }
*/ ////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* Function Return
*
* @abstract Main Function Return
*/ return /*#__PURE__*/ jsx_runtime_.jsx((external_react_default()).Fragment, {
children: /*#__PURE__*/ (0,jsx_runtime_.jsxs)("section", {
className: "paper gray gray-bg",
children: [
title && /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
className: "justify-between w-full flex-wrap px-4 sm:px-0 pt-4 sm:pt-0",
children: [
/*#__PURE__*/ jsx_runtime_.jsx("h2", {
className: "text-xl m-0",
children: title
}),
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
children: [
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("a", {
className: "button flex gap-2 items-center",
href: `/admin/${user?.id}/databases/${database.db_slug}/tables/${table.tableName}/entries/add-entry`,
children: [
/*#__PURE__*/ jsx_runtime_.jsx("span", {
className: "symbol",
children: "+"
}),
/*#__PURE__*/ jsx_runtime_.jsx("span", {
children: "Add New Entry"
})
]
}),
/*#__PURE__*/ jsx_runtime_.jsx(ImportExportEntries/* default */.Z, {
database,
table
}),
/*#__PURE__*/ jsx_runtime_.jsx(MoreTableOptions/* default */.Z, {
database,
table,
dbSchemaData,
query
})
]
})
]
}),
search && /*#__PURE__*/ jsx_runtime_.jsx(SearchEntriesSection, {}),
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
className: "w-full flex-col gap-6",
children: [
entries?.[0] && entries.map((entry)=>{
return /*#__PURE__*/ jsx_runtime_.jsx((external_react_default()).Fragment, {
children: /*#__PURE__*/ jsx_runtime_.jsx(UpdateEntryForm/* default */.Z, {
user: user,
database: database,
table: table,
dbSchemaData: dbSchemaData,
richTextEditors: richTextEditors,
dataTypes: dataTypes,
entry: entry,
query: query,
confirmedDelegetedUser: confirmedDelegetedUser,
jsonTextEditors: jsonTextEditors
})
}, entry.id);
}),
!entries && /*#__PURE__*/ jsx_runtime_.jsx("div", {
className: "w-full h-[300px]",
children: /*#__PURE__*/ jsx_runtime_.jsx(LoadingBlock/* default */.Z, {
position: "relative"
})
}),
entries && !entries?.[0] && /*#__PURE__*/ (0,jsx_runtime_.jsxs)("a", {
href: `/admin/${user?.id}/databases/${database.db_slug}/tables/${table.tableName}/entries/add-entry`,
className: "border-dotted border-slate-200 border-2 p-4 w-full flex-col rounded flex items-center hover:border-primary/50 gap-2",
children: [
/*#__PURE__*/ jsx_runtime_.jsx("span", {
className: "text-slate-400 text-center",
children: "No Entries Added Yet."
}),
/*#__PURE__*/ jsx_runtime_.jsx((LibraryAddTwoTone_default()), {
className: "opacity-20 my-4",
sx: {
fontSize: 80
}
}),
/*#__PURE__*/ jsx_runtime_.jsx("span", {
className: "text-center",
children: "Add an Entry to this Table"
})
]
}),
entriesCount && entriesCount > 10 ? /*#__PURE__*/ jsx_runtime_.jsx("a", {
href: `/admin/${user?.id}/databases/${database.db_slug}/tables/${table.tableName}/entries`,
className: "button outlined gray w-full -mb-4",
children: /*#__PURE__*/ jsx_runtime_.jsx("span", {
children: "See All Entries"
})
}) : null,
entries?.[0] && title && /*#__PURE__*/ (0,jsx_runtime_.jsxs)("a", {
className: "button flex gap-2 items-center w-full justify-center mt-2 more-padding",
href: `/admin/${user?.id}/databases/${database.db_slug}/tables/${table.tableName}/entries/add-entry`,
style: {
borderStyle: "dotted",
borderWidth: "2px"
},
children: [
/*#__PURE__*/ jsx_runtime_.jsx("span", {
className: "symbol",
children: "+"
}),
/*#__PURE__*/ jsx_runtime_.jsx("span", {
children: "Add New Entry"
})
]
})
]
})
]
})
});
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
} /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */
/***/ }),
/***/ 1985:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
// EXPORTS
__webpack_require__.d(__webpack_exports__, {
"Z": () => (/* binding */ UpdateEntryForm)
});
// EXTERNAL MODULE: external "react/jsx-runtime"
var jsx_runtime_ = __webpack_require__(997);
// EXTERNAL MODULE: external "react"
var external_react_ = __webpack_require__(6689);
var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_);
// EXTERNAL MODULE: ./functions/frontend/defaultFieldsRegexp.js
var defaultFieldsRegexp = __webpack_require__(3907);
// EXTERNAL MODULE: ./functions/frontend/fetchApi.js
var fetchApi = __webpack_require__(6729);
// EXTERNAL MODULE: ./functions/frontend/updateDiskUsage.js
var updateDiskUsage = __webpack_require__(1069);
// EXTERNAL MODULE: ./components/general/ExpandBlock.jsx
var ExpandBlock = __webpack_require__(6169);
// EXTERNAL MODULE: ./components/general/LoadingBlock.jsx
var LoadingBlock = __webpack_require__(5264);
// EXTERNAL MODULE: ./components/admin/databases/TableEntryField.jsx + 11 modules
var TableEntryField = __webpack_require__(4559);
// EXTERNAL MODULE: external "@mui/material"
var material_ = __webpack_require__(5692);
// EXTERNAL MODULE: external "@mui/icons-material/MoreHoriz"
var MoreHoriz_ = __webpack_require__(5453);
// EXTERNAL MODULE: external "lodash"
var external_lodash_ = __webpack_require__(6517);
var external_lodash_default = /*#__PURE__*/__webpack_require__.n(external_lodash_);
// EXTERNAL MODULE: external "lucide-react"
var external_lucide_react_ = __webpack_require__(2423);
// EXTERNAL MODULE: ./components/admin/databases/functions/generateTypeDefinition.js
var generateTypeDefinition = __webpack_require__(5753);
// EXTERNAL MODULE: external "react-tiny-popover"
var external_react_tiny_popover_ = __webpack_require__(7076);
;// CONCATENATED MODULE: ./components/admin/databases/UpdateEntryMoreOptions.jsx
// @ts-check
/**
* ==============================================================================
* Imports
* ==============================================================================
*/
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
* ==============================================================================
* Main Component { Functional }
* ==============================================================================
* @param {Object} props - Server props
* @param {import("@/package-shared/types").UserType} props.user
* @param {import("@/package-shared/types").DSQL_TableSchemaType} props.table
* @param {any} [props.entry]
* @param {string} [props.url]
* @param {any} [props.query]
*/ function UpdateEntryMoreOptions({ user , table , entry , url , query , }) {
/**
* Get Contexts
*
* @abstract { React.useContext }
*/ ////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* Javascript Variables
*
* @abstract Non hook variables and functions
*/ ////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* React Hooks
*
* @abstract { useState, useEffect, useRef, etc ... }
*/ const [openMore, setOpenMore] = external_react_default().useState(false);
const openMoreButtonRef = external_react_default().useRef(null);
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* Function Return
*
* @abstract Main Function Return
*/ return /*#__PURE__*/ jsx_runtime_.jsx("div", {
className: "relative z-[1000]",
children: /*#__PURE__*/ jsx_runtime_.jsx(external_react_tiny_popover_.Popover, {
isOpen: openMore,
onClickOutside: ()=>setOpenMore(false),
containerClassName: "z-[1000]",
positions: [
"bottom"
],
align: "end",
content: /*#__PURE__*/ jsx_runtime_.jsx("div", {
className: "bg-white dark:bg-slate-900 rounded shadow-md cancel-link",
children: /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
className: "flex-col min-w-[200px] items-stretch gap-0",
children: [
/*#__PURE__*/ jsx_runtime_.jsx("button", {
className: "plain-text justify-start py-3",
onClick: ()=>{
navigator.clipboard.writeText(JSON.stringify(entry)).then(()=>{
window.alert("Post Copied");
setOpenMore(false);
});
},
children: "Copy Object"
}),
/*#__PURE__*/ jsx_runtime_.jsx("hr", {
className: "m-0"
}),
/*#__PURE__*/ jsx_runtime_.jsx("button", {
className: "plain-text justify-start py-3",
onClick: ()=>{
const txt = (0,generateTypeDefinition/* default */.Z)({
paradigm: "JavaScript",
table,
query,
user
});
navigator.clipboard.writeText(txt || "").then(()=>{
window.alert("JavaScript Type Definition Copied");
setOpenMore(false);
});
},
children: "Copy JS Type Definition"
}),
/*#__PURE__*/ jsx_runtime_.jsx("hr", {
className: "m-0"
}),
/*#__PURE__*/ jsx_runtime_.jsx("button", {
className: "plain-text justify-start py-3",
onClick: ()=>{
const txt = (0,generateTypeDefinition/* default */.Z)({
paradigm: "TypeScript",
table,
query,
user
});
navigator.clipboard.writeText(txt || "").then(()=>{
window.alert("TypeScript Type Definition Copied");
setOpenMore(false);
});
},
children: "Copy TS Type Definition"
}),
/*#__PURE__*/ jsx_runtime_.jsx("hr", {
className: "m-0"
}),
/*#__PURE__*/ jsx_runtime_.jsx("a", {
href: url,
className: "button plain-text justify-start py-3",
children: /*#__PURE__*/ jsx_runtime_.jsx("span", {
children: "View Entry"
})
})
]
})
}),
children: /*#__PURE__*/ jsx_runtime_.jsx("button", {
onClick: ()=>{
setOpenMore(!openMore);
},
ref: openMoreButtonRef,
className: "ghost p-2",
children: /*#__PURE__*/ jsx_runtime_.jsx(external_lucide_react_.Ellipsis, {})
})
})
});
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
} /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */
;// CONCATENATED MODULE: ./components/admin/databases/UpdateEntryForm.jsx
// @ts-check
/**
* ==============================================================================
* Imports
* ==============================================================================
*/
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
* ==============================================================================
* Main Component { Functional }
* ==============================================================================
* @param {Object} props - Server props
* @param {import("@/package-shared/types").UserType} props.user
* @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} props.database
* @param {import("@/package-shared/types").DSQL_TableSchemaType} props.table
* @param {import("@/package-shared/types").DSQL_DatabaseSchemaType[]} [props.dbSchemaData]
* @param {React.MutableRefObject<any[]>} props.richTextEditors
* @param {React.MutableRefObject<any[]>} props.jsonTextEditors
* @param {any[]} props.dataTypes
* @param {any} [props.entry]
* @param {boolean} [props.entryPage]
* @param {any} [props.confirmedDelegetedUser]
* @param {any} [props.query]
*/ function UpdateEntryForm({ user , database , table , dbSchemaData , richTextEditors , jsonTextEditors , dataTypes , entry , entryPage , confirmedDelegetedUser , query , }) {
/**
* Get Contexts
*
* @abstract { React.useContext }
*/ ////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* Javascript Variables
*
* @abstract Non hook variables and functions
*/ const filteredFields = table.fields.filter((field)=>field.fieldName && !field.fieldName.match(defaultFieldsRegexp/* default */.Z));
const isUUID = table.fields.find((field)=>field.fieldName === "uuid");
const isDelegated = confirmedDelegetedUser?.delegated;
const isTableEditable = confirmedDelegetedUser?.priviledges?.match(/Edit Tables/i);
const isTableDeletable = confirmedDelegetedUser?.priviledges?.match(/Delete Tables/i);
const isTableCreatable = confirmedDelegetedUser?.priviledges?.match(/Create Tables/i);
const areEntriesEditable = confirmedDelegetedUser?.priviledges?.match(/Edit Entries/i);
const areEntriesDeletable = confirmedDelegetedUser?.priviledges?.match(/Delete Entries/i);
////////////////////////////////////////
if (isUUID) {
filteredFields.unshift({
dataType: "UUID",
fieldName: "uuid",
defaultField: true
});
}
filteredFields.unshift({
dataType: "BIGINT",
fieldName: "id",
defaultField: true
});
filteredFields.push({
dataType: "VARCHAR(250)",
fieldName: "date_created",
defaultField: true
});
filteredFields.push({
dataType: "BIGINT",
fieldName: "date_created_code",
defaultField: true
});
filteredFields.push({
dataType: "TIMESTAMP",
fieldName: "date_created_timestamp",
defaultField: true
});
filteredFields.push({
dataType: "VARCHAR(250)",
fieldName: "date_updated",
defaultField: true
});
filteredFields.push({
dataType: "BIGINT",
fieldName: "date_updated_code",
defaultField: true
});
filteredFields.push({
dataType: "TIMESTAMP",
fieldName: "date_updated_timestamp",
defaultField: true
});
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* React Hooks
*
* @abstract { useState, useEffect, useRef, etc ... }
*/ const [loading, setLoading] = external_react_default().useState(false);
const [collapse, setCollapse] = external_react_default().useState(true);
const [activeEntry, setActiveEntry] = external_react_default().useState(entry);
const [openMore, setOpenMore] = external_react_default().useState(false);
const openMoreButtonRef = external_react_default().useRef(null);
/** @type {React.MutableRefObject<import("@/package-shared/types").RichTextEditorsRefArray[]>} */ const currentRichTextEditorForms = external_react_default().useRef([]);
const [url, setUrl] = external_react_default().useState(`/admin/${user?.id}/databases/${database.db_slug}/tables/${table.tableName}/entries/${activeEntry.id}`);
external_react_default().useEffect(()=>{
if (confirmedDelegetedUser?.dbUserId && Number(user.id) !== Number(confirmedDelegetedUser.dbUserId)) {
setUrl(`/admin/${user?.id}/databases/${database.db_slug}/tables/${table.tableName}/entries/${activeEntry.id}` + window.location.search);
}
}, []);
const formButtonId = `${database.db_slug}-${table.tableName}-${activeEntry.id}-submit-button`;
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* Function Return
*
* @abstract Main Function Return
*/ return /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
className: "card col w-full overflow-hidden",
children: [
/*#__PURE__*/ jsx_runtime_.jsx("a", {
href: url,
onClick: (e)=>{
/** @type {HTMLElement} */ // @ts-ignore
const targetEl = e.target;
if (targetEl.closest(".cancel-link") || targetEl.closest(".MuiPopover-root")) {
e.preventDefault();
}
},
className: "w-full",
children: /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
className: "w-full bg-slate-700 text-white py-2 px-4 rounded justify-between flex-wrap hover:bg-slate-800 cursor-pointer relative z-[1000] ",
onClick: (e)=>{
/** @type {HTMLDivElement} */ // @ts-ignore
const divEl = e.target;
if (divEl.closest(".cancel-link") || divEl.closest(".MuiPopover-root")) return;
if (e.ctrlKey) {
window.open(url, "__blank");
} else {
window.location.href = url;
}
},
children: [
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("span", {
children: [
"Entry #",
activeEntry.id
]
}),
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
className: "flex-wrap cancel-link",
children: [
(!isDelegated || isDelegated && areEntriesDeletable) && /*#__PURE__*/ jsx_runtime_.jsx("span", {
className: "text-slate-300 hover:text-fuchsia-200 cursor-pointer" + (loading ? " pointer-events-none opacity-40" : ""),
onClick: (e)=>{
if (window.confirm(`Delete Entry #${activeEntry.id}?`)) {
setLoading(true);
(0,fetchApi/* default */.Z)("/api/deleteTableEntry" + window.location.search, {
method: "post",
body: {
dbFullName: database.db_full_name,
tableName: table.tableName,
entryId: activeEntry.id,
dbSlug: database.db_slug,
dbId: database.id,
delegated: query?.delegated,
confirmedDelegetedUser
}
}, true).then((res)=>{
if (res.success) {
(0,updateDiskUsage/* default */.Z)().then(()=>{
window.location.reload();
});
} else {
window.alert(res.msg);
setTimeout(()=>{
setLoading(false);
}, 500);
}
});
}
},
children: "Delete Entry"
}),
!entryPage && /*#__PURE__*/ (0,jsx_runtime_.jsxs)((external_react_default()).Fragment, {
children: [
/*#__PURE__*/ jsx_runtime_.jsx("span", {
className: "opacity-20",
children: "|"
}),
/*#__PURE__*/ jsx_runtime_.jsx("span", {
className: "text-slate-300 hover:text-fuchsia-200 cursor-pointer",
onClick: (e)=>{
if (collapse) {
setCollapse(false);
} else {
setCollapse(true);
}
},
children: collapse ? /*#__PURE__*/ jsx_runtime_.jsx("span", {
children: "Expand"
}) : /*#__PURE__*/ jsx_runtime_.jsx("span", {
children: "Collapse"
})
})
]
}),
/*#__PURE__*/ jsx_runtime_.jsx("span", {
className: "opacity-20",
children: "|"
}),
/*#__PURE__*/ jsx_runtime_.jsx("div", {
className: "button ghost px-0",
onClick: (e)=>{
let duplicateEntry = external_lodash_default().cloneDeep(entry);
delete duplicateEntry["date_created"];
delete duplicateEntry["date_created_code"];
delete duplicateEntry["date_created_timestamp"];
delete duplicateEntry["date_updated"];
delete duplicateEntry["date_updated_code"];
delete duplicateEntry["date_updated_timestamp"];
delete duplicateEntry["id"];
delete duplicateEntry["uuid"];
localStorage.setItem("duplicate_entry", JSON.stringify(duplicateEntry));
window.location.href = `/admin/${user?.id}/databases/${database.db_slug}/tables/${table.tableName}/entries/add-entry?duplicate=true&id=${entry.id}`;
},
children: /*#__PURE__*/ jsx_runtime_.jsx("span", {
className: "text-slate-300",
children: "Duplicate"
})
}),
/*#__PURE__*/ jsx_runtime_.jsx("span", {
className: "opacity-20",
children: "|"
}),
/*#__PURE__*/ jsx_runtime_.jsx(UpdateEntryMoreOptions, {
table,
user,
entry,
query,
url
})
]
})
]
})
}),
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("form", {
className: "w-full flex flex-col items-stretch gap-8 minimal-scrollbars relative",
style: !entryPage ? {
maxHeight: collapse ? "300px" : "none",
paddingTop: "10px",
paddingBottom: "10px",
overflow: "hidden"
} : {},
onSubmit: (e)=>{
e.preventDefault();
setLoading(true);
/** @type {any} */ let payload = {};
/** @type {HTMLFormElement} */ // @ts-ignore
const formEl = e.target;
filteredFields.forEach((field)=>{
if (!field.fieldName) return;
if (!formEl[field.fieldName]) return;
const isString = typeof formEl[field.fieldName].value !== "string";
const isNumber = typeof formEl[field.fieldName].value !== "number";
if (!isString && !isNumber && !formEl[field.fieldName].value) return;
if (formEl[field.fieldName]?.dataset.default) return;
payload[field.fieldName] = formEl[field.fieldName].value;
});
if (currentRichTextEditorForms.current[0]) {
currentRichTextEditorForms.current.forEach((/** @type {any} */ richTextObject)=>{
if (!richTextObject?.fieldName || !richTextObject?.ref?.current) return;
payload[richTextObject.fieldName] = richTextObject.ref.current.getContent();
});
}
if (jsonTextEditors.current[0]) {
jsonTextEditors.current.forEach((jsonEditor)=>{
if (!jsonEditor?.fieldName || !jsonEditor?.ref?.current) return;
payload[jsonEditor.fieldName] = jsonEditor.ref.current.getValue();
});
}
(0,fetchApi/* default */.Z)("/api/updateTableEntry", {
method: "post",
body: {
dbFullName: database.db_full_name,
dbSlug: database.db_slug,
dbId: database.id,
tableName: table.tableName,
entryId: activeEntry.id,
payload: payload,
tableSchema: table,
delegated: query?.delegated,
confirmedDelegetedUser
}
}, true).then((res)=>{
if (res.success) {
(0,fetchApi/* default */.Z)(`/api/refreshEntry?table=${table.tableName}&db=${database.db_full_name}&id=${activeEntry.id}&schema=${JSON.stringify(table)}`).then((_res)=>{
if (_res.success) {
setActiveEntry(_res.entry);
setTimeout(()=>{
setLoading(false);
}, 500);
}
});
} else {
window.alert(res.msg + "\n" + (res.err || ""));
setTimeout(()=>{
setLoading(false);
}, 500);
}
});
},
onKeyUp: (e)=>{
if (e.ctrlKey && e.key == "Enter") {
const confirm = window.confirm("Update this Form?");
if (!confirm) return;
document.getElementById(formButtonId)?.click();
}
},
children: [
loading && /*#__PURE__*/ jsx_runtime_.jsx(LoadingBlock/* default */.Z, {}),
(collapse && !entryPage ? filteredFields.slice(0, 3) : filteredFields).map((field, index)=>{
let dataTypeSchema = dataTypes.filter((type)=>type.name === field.dataType?.replace(/\d|\(|\)/g, ""));
return /*#__PURE__*/ jsx_runtime_.jsx(TableEntryField/* default */.Z, {
fieldObject: field,
dataTypeSchema: dataTypeSchema[0],
richTextEditors: richTextEditors,
currentRichTextEditorForms: currentRichTextEditorForms,
entry: activeEntry,
query: query,
entryPage: entryPage,
confirmedDelegetedUser: confirmedDelegetedUser,
jsonTextEditors: jsonTextEditors,
formButtonId: formButtonId
}, index + 1);
}),
/*#__PURE__*/ jsx_runtime_.jsx("button", {
type: "submit",
className: "" + (loading ? " pointer-events-none opacity-40" : ""),
id: formButtonId,
children: "Update Entry"
})
]
}),
!entryPage && /*#__PURE__*/ jsx_runtime_.jsx(ExpandBlock/* default */.Z, {
collapse: collapse,
setCollapse: setCollapse
})
]
});
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
} /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */
/***/ }),
/***/ 2348:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "Z": () => (/* binding */ FormRadios)
/* 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__);
// @ts-check
/**
* ==============================================================================
* Imports
* ==============================================================================
*/
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
* ==============================================================================
* Main Component { Functional }
* ==============================================================================
* @param {Object} props - Server props
* @param {{
* title: string,
* payload: string | boolean,
* default?: boolean,
* jsx?: React.ReactNode,
* onChangeHandler?: (e: any) => void,
* }[]} props.radioValues - array of objects
* @param {string} props.name - form radios collective name
* @param {(e: any) => void} [props.onChangeHandler] - when radios change
* @param {React.Dispatch<React.SetStateAction<any>>} [props.setAlert] - set an external alert dispatch
* @param {boolean} [props.flexRow] - if the radio and label are stacked on each other or side-by-side
* @param {string} [props.labelColor] - Label color using tailwind syntax
* @param {boolean} [props.baseText] - Font size regular
* @param {boolean} [props.smallText] - Font size smaller
* @param {string} [props.className] - Additional class names for the wrapper
*/ function FormRadios({ radioValues , name , onChangeHandler , setAlert , flexRow , labelColor , baseText , smallText , className , }) {
try {
/**
* Get Contexts
*
* @abstract { React.useContext }
*/ ////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* Javascript Variables
*
* @abstract Non hook variables and functions
*/ ////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* React Hooks
*
* @abstract { useState, useEffect, useRef, etc ... }
*/ ////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* Function Return
*
* @abstract Main Function Return
*/ return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
className: "flex items-start gap-4 flex-wrap " + (flexRow ? "" : " flex-col ") + (className ? className : ""),
children: radioValues.map((value, index)=>{
const { payload , title , jsx } = value;
const radioPayload = payload === false ? payload : payload ? payload : title ? title : null;
return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
className: "flex items-center gap-2",
children: [
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("input", {
className: "m-0" + (baseText ? " w-5 h-5" : smallText ? " w-4 h-4" : " w-6 h-6"),
type: "radio",
defaultChecked: value.default ? true : false,
name: name,
id: name + "_" + radioPayload,
onChange: (e)=>{
if (setAlert) setAlert(null);
if (value.onChangeHandler) {
value.onChangeHandler(e);
} else if (onChangeHandler) {
onChangeHandler(e);
}
},
value: typeof radioPayload == "string" ? radioPayload : undefined
}),
jsx ? jsx : /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("label", {
htmlFor: name + "_" + radioPayload,
className: "text-lg m-0 " + (labelColor ? labelColor : "text-slate-800") + (baseText ? " text-base" : smallText ? " text-sm" : " text-lg"),
children: title
})
]
}, index + 1);
})
});
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
} catch (error) {
console.log("ERROR in FormRadio =>", error);
return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
children: "Form Radio Error"
});
}
} /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */
/***/ }),
/***/ 7722:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
// ESM COMPAT FLAG
__webpack_require__.r(__webpack_exports__);
// EXPORTS
__webpack_require__.d(__webpack_exports__, {
"TableEntriesContext": () => (/* binding */ TableEntriesContext),
"default": () => (/* binding */ TableEntries),
"getServerSideProps": () => (/* binding */ getServerSideProps)
});
// EXTERNAL MODULE: external "react/jsx-runtime"
var jsx_runtime_ = __webpack_require__(997);
// EXTERNAL MODULE: external "react"
var external_react_ = __webpack_require__(6689);
var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_);
// EXTERNAL MODULE: ./functions/backend/userAuth.js
var userAuth = __webpack_require__(370);
var userAuth_default = /*#__PURE__*/__webpack_require__.n(userAuth);
// EXTERNAL MODULE: ./layouts/AdminLayout.jsx + 2 modules
var AdminLayout = __webpack_require__(4858);
// EXTERNAL MODULE: ./components/general/BackButton.jsx
var BackButton = __webpack_require__(1781);
// EXTERNAL MODULE: ./components/general/Breadcrumbs.jsx
var Breadcrumbs = __webpack_require__(424);
// EXTERNAL MODULE: ./components/general/CopySlug.jsx
var CopySlug = __webpack_require__(9230);
// EXTERNAL MODULE: ./components/admin/databases/TableEntriesList.jsx + 1 modules
var TableEntriesList = __webpack_require__(6122);
// EXTERNAL MODULE: ./components/general/ActiveCloneDbBanner.jsx
var ActiveCloneDbBanner = __webpack_require__(4986);
// EXTERNAL MODULE: ./components/general/ActiveCloneTableBanner.jsx
var ActiveCloneTableBanner = __webpack_require__(8515);
// EXTERNAL MODULE: ./components/admin/databases/DatabasesTablesList.jsx
var DatabasesTablesList = __webpack_require__(8264);
// EXTERNAL MODULE: ./components/general/LoadingBlock.jsx
var LoadingBlock = __webpack_require__(5264);
// EXTERNAL MODULE: ./functions/frontend/fetchApi.js
var fetchApi = __webpack_require__(6729);
// EXTERNAL MODULE: external "lodash"
var external_lodash_ = __webpack_require__(6517);
// EXTERNAL MODULE: ./components/admin/databases/ImportExportEntries.jsx + 1 modules
var ImportExportEntries = __webpack_require__(2943);
// EXTERNAL MODULE: ./components/admin/databases/MoreTableOptions.jsx
var MoreTableOptions = __webpack_require__(3684);
;// CONCATENATED MODULE: ./components/admin/databases/TableEntriesContent.jsx
// @ts-check
/**
* ==============================================================================
* Imports
* ==============================================================================
*/
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ const BATCH_NO = 20;
/** @type {any} */ let refreshTimeout;
/**
* ==============================================================================
* Main Component { Functional }
* ==============================================================================
* @param {Object} props - Server props
*/ function TableEntriesContent(props) {
/**
* Get Contexts
*
* @abstract { React.useContext }
*/ const { user , database , table , dbSchemaData , setTargetEntry , richTextEditors , jsonTextEditors , query , confirmedDelegetedUser , activeEntries , entriesCount , setActiveEntries , } = external_react_default().useContext(TableEntriesContext);
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* Javascript Variables
*
* @abstract Non hook variables and functions
*/ const dataTypes = __webpack_require__(9594);
const isDelegated = confirmedDelegetedUser?.delegated;
const isTableEditable = confirmedDelegetedUser?.priviledges?.match(/Edit Tables/i);
const isTableDeletable = confirmedDelegetedUser?.priviledges?.match(/Delete Tables/i);
const isTableCreatable = confirmedDelegetedUser?.priviledges?.match(/Create Tables/i);
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* React Hooks
*
* @abstract { useState, useEffect, useRef, etc ... }
*/ ////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* Function Return
*
* @abstract Main Function Return
*/ return /*#__PURE__*/ (0,jsx_runtime_.jsxs)((external_react_default()).Fragment, {
children: [
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
className: "flex-col items-start gap-0 w-full relative z-50",
children: [
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
className: "w-full justify-between flex-wrap",
children: [
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
className: "flex-wrap",
children: [
/*#__PURE__*/ jsx_runtime_.jsx(BackButton/* default */.Z, {}),
/*#__PURE__*/ jsx_runtime_.jsx("h1", {
className: "text-3xl m-0",
children: /*#__PURE__*/ (0,jsx_runtime_.jsxs)("span", {
className: "flex items-center flex-wrap gap-2",
children: [
"All Entries In",
" ",
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("span", {
className: "bg-slate-100 dark:bg-slate-800 px-2 py-1 border border-solid border-slate-400 dark:border-slate-600 rounded relative",
children: [
table.tableFullName,
/*#__PURE__*/ jsx_runtime_.jsx("div", {
className: "absolute -top-5 -right-4",
children: /*#__PURE__*/ jsx_runtime_.jsx(CopySlug/* default */.Z, {
slugText: table.tableName,
justIcon: true
})
})
]
}),
" ",
"Table"
]
})
})
]
}),
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
className: "w-full sm:w-auto",
children: [
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("a", {
href: `/admin/${user?.id}/databases/${database.db_slug}/tables/${table.tableName}/entries/add-entry`,
className: "button flex items-center gap-2 w-full sm:w-auto justify-center",
children: [
/*#__PURE__*/ jsx_runtime_.jsx("span", {
className: "symbol",
children: "+"
}),
/*#__PURE__*/ jsx_runtime_.jsx("span", {
children: "Add New Entry"
})
]
}),
/*#__PURE__*/ jsx_runtime_.jsx(ImportExportEntries/* default */.Z, {
database,
table
}),
/*#__PURE__*/ jsx_runtime_.jsx(MoreTableOptions/* default */.Z, {
database,
table,
dbSchemaData,
query
})
]
})
]
}),
/*#__PURE__*/ jsx_runtime_.jsx(Breadcrumbs/* default */.Z, {
confirmedDelegetedUser: query?.delegated,
user: user
})
]
}),
database.active_clone ? /*#__PURE__*/ jsx_runtime_.jsx(ActiveCloneDbBanner/* default */.Z, {
database: database,
user: user
}) : /*#__PURE__*/ jsx_runtime_.jsx(jsx_runtime_.Fragment, {}),
database.remote_connected ? /*#__PURE__*/ jsx_runtime_.jsx(DatabasesTablesList/* ConnectedDatabaseBanner */.w, {
database: database
}) : /*#__PURE__*/ jsx_runtime_.jsx(jsx_runtime_.Fragment, {}),
/*#__PURE__*/ jsx_runtime_.jsx(ActiveCloneTableBanner/* default */.Z, {
table: table,
database: database,
user: user
}),
/*#__PURE__*/ jsx_runtime_.jsx(TableEntriesList/* default */.Z, {
user: user,
entries: activeEntries,
database: database,
table: table,
setTargetEntry: setTargetEntry,
dbSchemaData: dbSchemaData,
richTextEditors: richTextEditors,
dataTypes: dataTypes,
query: query,
confirmedDelegetedUser: confirmedDelegetedUser,
jsonTextEditors: jsonTextEditors,
search: true
}),
entriesCount > BATCH_NO && /*#__PURE__*/ jsx_runtime_.jsx(InfiniteScroll, {
activeEntries,
setActiveEntries,
database,
table,
entriesCount
})
]
});
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
}
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
*
* @param {object} props
* @param {any[] | null} props.activeEntries
* @param {React.Dispatch<React.SetStateAction<any[] | null>>} props.setActiveEntries
* @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} props.database
* @param {import("@/package-shared/types").DSQL_TableSchemaType} props.table
* @param {number} props.entriesCount
* @returns
*/ function InfiniteScroll({ activeEntries , setActiveEntries , database , table , entriesCount , }) {
const context = external_react_default().useContext(TableEntriesContext);
/** @type {React.RefObject<HTMLDivElement>} */ // @ts-ignore
const infiniteScrollRef = external_react_default().useRef();
const pageRef = external_react_default().useRef(1);
const totalEntriesDisplayed = BATCH_NO * Number(pageRef.current);
const exhausted = Boolean(totalEntriesDisplayed >= entriesCount);
external_react_default().useEffect(()=>{
/** @type {IntersectionObserverCallback} */ function ISObserverCb(entries, observer) {
if (entries?.[0]?.isIntersecting) {
/** @type {HTMLInputElement | null} */ // @ts-ignore
const searchInput = document.getElementById("entries-search-input");
/** @type {HTMLInputElement | null} */ // @ts-ignore
const searchField = document.getElementById("entries-search-field-select");
/** @type {import("@/pages/api/infiniteScroll").InfiniteScrollBodyObject} */ const fetchObject = {
tableName: table.tableName,
dbName: database.db_slug,
page: pageRef.current,
tableSchema: table,
search: searchInput ? searchInput.value : undefined,
searchField: searchField ? searchField.value : undefined,
delegated: Boolean(context.query.delegated)
};
(0,fetchApi/* default */.Z)("/api/infiniteScroll", {
method: "POST",
body: fetchObject
}, true).then((/** @type {import("@/pages/api/infiniteScroll").InfiniteScrollAPIRes} */ res)=>{
if (!res.success) {
return;
}
if (res.page) {
pageRef.current = res.page;
}
window.clearTimeout(refreshTimeout);
refreshTimeout = setTimeout(()=>{
if (!res.data?.[0]) return;
if (res.data?.[0]) {
setActiveEntries((prev)=>{
if (!prev) {
return null;
}
return [
...prev,
// @ts-ignore
...res.data,
];
});
}
}, 500);
}).catch((err)=>{
console.log("Infinite Scroll Error =>", err);
}).finally(()=>{
console.log("Infinite Scroll Done. Page", pageRef.current);
});
}
}
/** @type {IntersectionObserverInit} */ const ISObserverOptions = {
rootMargin: "0px 0px 0px 0px"
};
setTimeout(()=>{
requestAnimationFrame(()=>{
const infiniteScrollObserver = new IntersectionObserver(ISObserverCb, ISObserverOptions);
if (infiniteScrollRef.current) infiniteScrollObserver.observe(infiniteScrollRef.current);
});
}, 1000);
}, []);
if (exhausted) {
return /*#__PURE__*/ jsx_runtime_.jsx((external_react_default()).Fragment, {});
}
return /*#__PURE__*/ jsx_runtime_.jsx("div", {
className: "w-full flex items-center justify-center",
ref: infiniteScrollRef,
children: /*#__PURE__*/ jsx_runtime_.jsx(LoadingBlock/* default */.Z, {
position: "relative",
style: {
backgroundColor: "transparent"
},
width: "20px"
})
});
}
// EXTERNAL MODULE: ./components/general/ExtraContentDatabase.jsx
var ExtraContentDatabase = __webpack_require__(4941);
// EXTERNAL MODULE: ./package-shared/functions/backend/varDatabaseDbHandler.js
var varDatabaseDbHandler = __webpack_require__(1206);
var varDatabaseDbHandler_default = /*#__PURE__*/__webpack_require__.n(varDatabaseDbHandler);
// EXTERNAL MODULE: ./functions/backend/grabDelegatedUserFromCookie.js
var grabDelegatedUserFromCookie = __webpack_require__(5116);
var grabDelegatedUserFromCookie_default = /*#__PURE__*/__webpack_require__.n(grabDelegatedUserFromCookie);
// EXTERNAL MODULE: ./functions/backend/serverError.js
var serverError = __webpack_require__(2317);
var serverError_default = /*#__PURE__*/__webpack_require__.n(serverError);
// EXTERNAL MODULE: ./package-shared/utils/backend/global-db/DB_HANDLER.js
var DB_HANDLER = __webpack_require__(9395);
var DB_HANDLER_default = /*#__PURE__*/__webpack_require__.n(DB_HANDLER);
// EXTERNAL MODULE: ./layouts/components/GeneralLayout/ScrollToTopButton.jsx
var ScrollToTopButton = __webpack_require__(9360);
;// CONCATENATED MODULE: ./pages/admin/[user_id]/databases/[single]/tables/[single_table]/entries/index.jsx
// @ts-check
/**
* ==============================================================================
* Imports
* ==============================================================================
*/
const fs = __webpack_require__(7147);
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/** ****************************************************************************** */ /** @type {import("@/package-shared/types").TableEntriesContextType} */ // @ts-ignore
const init = {};
const TableEntriesContext = /*#__PURE__*/ external_react_default().createContext(init);
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
* ==============================================================================
* Main Component { Functional }
* ==============================================================================
* @param {Object} props - Server props
* @param {import("@/package-shared/types").UserType} props.user
* @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} props.database
* @param {import("@/package-shared/types").DSQL_TableSchemaType} props.table
* @param {import("@/package-shared/types").DSQL_DatabaseSchemaType[]} props.dbSchemaData
* @param {any[]} props.entries
* @param {any} props.query
* @param {any} props.confirmedDelegetedUser
* @param {number} props.entriesCount
*/ function TableEntries({ user , database , table , dbSchemaData , entries , query , confirmedDelegetedUser , entriesCount , }) {
/**
* Get Contexts
*
* @abstract { React.useContext }
*/ ////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* Javascript Variables
*
* @abstract Non hook variables and functions
*/ const pageTitle = `${table.tableFullName} Table Entries | Datasquirel`;
const pageDescription = "All Entries in table";
let head = /*#__PURE__*/ (0,jsx_runtime_.jsxs)(jsx_runtime_.Fragment, {
children: [
/*#__PURE__*/ jsx_runtime_.jsx("title", {
children: pageTitle
}),
/*#__PURE__*/ jsx_runtime_.jsx("meta", {
name: "description",
content: pageDescription
})
]
});
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* React Hooks
*
* @abstract { useState, useEffect, useRef, etc ... }
*/ const [targetEntry, setTargetEntry] = external_react_default().useState(null);
/** @type {[ state: any[] | null, dispatch: React.Dispatch<React.SetStateAction<any[] | null>> ]} */ // @ts-ignore
const [activeEntries, setActiveEntries] = external_react_default().useState(entries);
const targetField = external_react_default().useRef("title");
const searchTerm = external_react_default().useRef(null);
/** @type {React.MutableRefObject<any[]>} */ const richTextEditors = external_react_default().useRef([]);
/** @type {React.MutableRefObject<any[]>} */ const jsonTextEditors = external_react_default().useRef([]);
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* Function Return
*
* @abstract Main Function Return
*/ return /*#__PURE__*/ jsx_runtime_.jsx(AdminLayout/* default */.Z, {
head: head,
user: user,
extraHeaderContent: /*#__PURE__*/ jsx_runtime_.jsx(ExtraContentDatabase/* default */.Z, {
database: database,
query: query,
confirmedDelegetedUser: confirmedDelegetedUser,
user: user
}),
children: /*#__PURE__*/ (0,jsx_runtime_.jsxs)(TableEntriesContext.Provider, {
value: {
user,
database,
table,
dbSchemaData,
entries,
targetEntry,
setTargetEntry,
richTextEditors,
jsonTextEditors,
query,
confirmedDelegetedUser,
activeEntries,
setActiveEntries,
targetField,
searchTerm,
entriesCount
},
children: [
/*#__PURE__*/ jsx_runtime_.jsx(TableEntriesContent, {}),
/*#__PURE__*/ jsx_runtime_.jsx(ScrollToTopButton/* default */.Z, {
snug: true
})
]
})
});
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
}
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
* ==============================================================================
* Server Side Props or Static Props
* ==============================================================================
* @type {import("next").GetServerSideProps}
*/ async function getServerSideProps({ req , res , query }) {
/**
* User Auth
*
* @description User Auth
*/ const user = await userAuth_default()(req, res);
if (!user?.logged_in_status) {
return {
redirect: {
destination: "/login",
permanent: false
}
};
}
try {
/**
* Check delegated user token
*
* @description Check delegated user token
*/ /** @type {string} */ // @ts-ignore
const slug = query.single;
const dbUserData = await grabDelegatedUserFromCookie_default()({
request: req,
user: user,
databaseSlug: slug,
query
});
const dbUserDataObj = dbUserData;
if (!dbUserDataObj) {
throw new Error("No Db Object Found!");
}
const { dbUserId } = dbUserDataObj;
/**
* Page/Site Data Data Fetching
*
* @description Fetch data on the server before returning
*/ const database = await DB_HANDLER_default()(`SELECT * FROM user_databases WHERE user_id='${dbUserId}' AND db_slug='${query.single}'`);
if (!database || !database[0]) {
return {
redirect: {
destination: `/admin/${user?.id}/databases`,
permanent: false
}
};
}
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* Confirm delegated User
*
* @description Confirm delegated User
*/ let confirmedDelegetedUser = dbUserData;
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* Page/Site Data Data Fetching
*
* @description Fetch data on the server before returning
*/ /** @type {import("@/package-shared/types").DSQL_DatabaseSchemaType[]} */ const dbSchemaData = JSON.parse(fs.readFileSync(`./jsonData/dbSchemas/users/user-${dbUserId}/main.json`, "utf-8"));
const tables = dbSchemaData.filter((db)=>db.dbFullName === database[0].db_full_name)[0]?.tables;
const targetTable = tables.filter((table)=>table.tableName === query.single_table)[0];
const tableEntries = await varDatabaseDbHandler_default()({
database: database[0].db_full_name,
queryString: `SELECT * FROM \`${targetTable.tableName}\` ORDER BY id DESC LIMIT 20`,
tableSchema: targetTable
});
const tableEntriesCount = await varDatabaseDbHandler_default()({
database: database[0].db_full_name,
queryString: `SELECT COUNT(id) AS count FROM ${targetTable.tableName}`,
tableSchema: targetTable
});
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
/**
* Server props return
*
* @description Return data fetched on the server side
*/ return {
props: {
user: user,
database: database[0],
table: targetTable,
dbSchemaData: dbSchemaData,
entries: tableEntries,
query,
confirmedDelegetedUser,
entriesCount: tableEntriesCount?.[0]?.count || 0
}
};
////////////////////////////////////////
////////////////////////////////////////
////////////////////////////////////////
} catch (/** @type {any} */ error) {
serverError_default()({
component: "[single_table]/entries-page-component/getServerSideProps/catch-error",
message: error.message,
user: user
});
return {
// redirect: {
// destination: "/login",
// permanent: false
// },
props: {
user: user,
database: null,
table: null,
entries: []
}
};
}
}
/***/ })
};
;