727 lines
38 KiB
JavaScript
727 lines
38 KiB
JavaScript
"use strict";
|
|
exports.id = 8264;
|
|
exports.ids = [8264];
|
|
exports.modules = {
|
|
|
|
/***/ 8264:
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
/* harmony export */ "Z": () => (/* binding */ DatabasesTablesList),
|
|
/* harmony export */ "w": () => (/* binding */ ConnectedDatabaseBanner)
|
|
/* 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 _TablesList__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(6734);
|
|
/* harmony import */ var _general_ActiveCloneDbBanner__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(4986);
|
|
// @ts-check
|
|
/**
|
|
* ==============================================================================
|
|
* Imports
|
|
* ==============================================================================
|
|
*/
|
|
|
|
|
|
|
|
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
|
|
* ==============================================================================
|
|
* Main Component { Functional }
|
|
* ==============================================================================
|
|
* @param {Object} props - Server props
|
|
* @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} props.database
|
|
* @param {import("@/package-shared/types").MYSQL_user_database_tables_table_def[]} props.tables
|
|
* @param {React.Dispatch<React.SetStateAction<import("@/package-shared/types").MYSQL_user_database_tables_table_def | null>>} props.setTargetTable
|
|
* @param {any} props.confirmedDelegetedUser
|
|
* @param {any} props.query
|
|
* @param {import("@/package-shared/types").UserType} [props.user]
|
|
*/ function DatabasesTablesList({ database , tables , setTargetTable , confirmedDelegetedUser , query , user , }) {
|
|
/**
|
|
* 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);
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
/**
|
|
* React Hooks
|
|
*
|
|
* @abstract { useState, useEffect, useRef, etc ... }
|
|
*/ ////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
/**
|
|
* Function Return
|
|
*
|
|
* @abstract Main Function Return
|
|
*/ return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)((react__WEBPACK_IMPORTED_MODULE_1___default().Fragment), {
|
|
children: [
|
|
database.active_clone && user ? /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_general_ActiveCloneDbBanner__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z, {
|
|
database: database,
|
|
user: user
|
|
}) : /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {}),
|
|
database.remote_connected ? /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(ConnectedDatabaseBanner, {
|
|
database: database
|
|
}) : /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {}),
|
|
/*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("section", {
|
|
className: "paper gray",
|
|
children: [
|
|
tables && tables[0] ? /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
|
|
className: "flex-wrap gap-4 justify-between w-full",
|
|
children: [
|
|
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("h2", {
|
|
className: "text-xl m-0",
|
|
children: "Tables"
|
|
}),
|
|
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("a", {
|
|
href: `/admin/${user?.id}/databases/${database.db_slug}/tables`,
|
|
className: "button outlined gray small-text",
|
|
children: "See All Tables"
|
|
})
|
|
]
|
|
}) : /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("h2", {
|
|
className: "text-xl m-0",
|
|
children: "This Database is empty"
|
|
}),
|
|
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("hr", {}),
|
|
user ? /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_TablesList__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .Z, {
|
|
database: database,
|
|
tables: tables,
|
|
setTargetTable: setTargetTable,
|
|
confirmedDelegetedUser: confirmedDelegetedUser,
|
|
query: query,
|
|
user: user
|
|
}) : null
|
|
]
|
|
})
|
|
]
|
|
});
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
}
|
|
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
|
|
* ## Connected Database Banner
|
|
* @param {object} props - Server props
|
|
* @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} props.database
|
|
*/ function ConnectedDatabaseBanner({ database }) {
|
|
/**
|
|
* Function Return
|
|
*
|
|
* @abstract Main Function Return
|
|
*/ return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
|
|
className: "info green",
|
|
children: /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("span", {
|
|
className: "text font-normal",
|
|
children: [
|
|
"This database is an active clone of",
|
|
" ",
|
|
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("b", {
|
|
children: database.remote_db_full_name?.replace(/datasquirel_user_\d+_/, "")
|
|
}),
|
|
" ",
|
|
"on",
|
|
" ",
|
|
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("a", {
|
|
className: "font-bold text-inherit",
|
|
href: database.remote_connection_host,
|
|
target: "_blank",
|
|
children: database.remote_connection_host
|
|
}),
|
|
" ",
|
|
"Host"
|
|
]
|
|
})
|
|
});
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ 6734:
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
// EXPORTS
|
|
__webpack_require__.d(__webpack_exports__, {
|
|
"Z": () => (/* binding */ TablesList)
|
|
});
|
|
|
|
// 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/CopySlug.jsx
|
|
var CopySlug = __webpack_require__(9230);
|
|
// EXTERNAL MODULE: ./components/general/GeneralPopup.jsx
|
|
var GeneralPopup = __webpack_require__(5472);
|
|
// EXTERNAL MODULE: ./components/general/ui/ButtonGroup.jsx
|
|
var ButtonGroup = __webpack_require__(5449);
|
|
// EXTERNAL MODULE: external "@mui/icons-material/BackupTableTwoTone"
|
|
var BackupTableTwoTone_ = __webpack_require__(1522);
|
|
var BackupTableTwoTone_default = /*#__PURE__*/__webpack_require__.n(BackupTableTwoTone_);
|
|
// EXTERNAL MODULE: external "lucide-react"
|
|
var external_lucide_react_ = __webpack_require__(2423);
|
|
;// CONCATENATED MODULE: ./components/admin/databases/TableListCard.jsx
|
|
// @ts-check
|
|
/**
|
|
* ==============================================================================
|
|
* Imports
|
|
* ==============================================================================
|
|
*/
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
|
|
* ==============================================================================
|
|
* Main Component { Functional }
|
|
* ==============================================================================
|
|
* @param {Object} props - Server props
|
|
* @param {import("@/package-shared/types").MYSQL_user_database_tables_table_def} props.table
|
|
* @param {React.Dispatch<React.SetStateAction<import("@/package-shared/types").MYSQL_user_database_tables_table_def | null>>} props.setTargetTable
|
|
* @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} props.database
|
|
* @param {any} [props.confirmedDelegetedUser]
|
|
* @param {any} [props.query]
|
|
* @param {any} [props.icons]
|
|
* @param {import("@/package-shared/types").UserType} props.user
|
|
*/ function TableListCard({ table , setTargetTable , database , confirmedDelegetedUser , query , icons , user , }) {
|
|
/**
|
|
* 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 Table/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__*/ (0,jsx_runtime_.jsxs)("a", {
|
|
href: `/admin/${user?.id}/databases/${database.db_slug}/tables/${table.table_slug}`,
|
|
className: "card w-full items-center justify-between py-4" + (table?.child_table ? " green" : ""),
|
|
onClick: (e)=>{
|
|
/** @type {HTMLAnchorElement} */ // @ts-ignore
|
|
const linkEl = e.target;
|
|
if (linkEl.closest(".db-list-item-actions-block")) {
|
|
e.preventDefault();
|
|
}
|
|
},
|
|
children: [
|
|
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
|
|
className: "flex-wrap items-center flex",
|
|
children: [
|
|
/*#__PURE__*/ jsx_runtime_.jsx((BackupTableTwoTone_default()), {
|
|
fontSize: "small",
|
|
className: "opacity-50",
|
|
color: "action"
|
|
}),
|
|
/*#__PURE__*/ jsx_runtime_.jsx("span", {
|
|
className: "title",
|
|
style: {
|
|
fontSize: "16px"
|
|
},
|
|
children: table.table_name
|
|
}),
|
|
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("span", {
|
|
className: "text-sm text-slate-400",
|
|
children: [
|
|
"Created: ",
|
|
table.date_created?.substring(0, 21)
|
|
]
|
|
})
|
|
]
|
|
}),
|
|
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
|
|
className: "flex-wrap",
|
|
children: [
|
|
/*#__PURE__*/ jsx_runtime_.jsx("div", {
|
|
className: "db-list-item-actions-block flex-wrap",
|
|
children: /*#__PURE__*/ (0,jsx_runtime_.jsxs)(ButtonGroup/* default */.Z, {
|
|
children: [
|
|
/*#__PURE__*/ jsx_runtime_.jsx(CopySlug/* default */.Z, {
|
|
slugText: table.table_slug || "",
|
|
outlined: true
|
|
}),
|
|
(!isDelegated || isDelegated && isTableEditable) && !active_clone_parent_db && !remote_connected && /*#__PURE__*/ jsx_runtime_.jsx((external_react_default()).Fragment, {
|
|
children: /*#__PURE__*/ jsx_runtime_.jsx("div", {
|
|
className: "button outlined light-gray small-text",
|
|
onClick: (e)=>{
|
|
window.location.pathname = `/admin/${user?.id}/databases/${database.db_slug}/tables/${table.table_slug}/edit-table`;
|
|
},
|
|
children: /*#__PURE__*/ jsx_runtime_.jsx("span", {
|
|
children: "Edit"
|
|
})
|
|
})
|
|
}),
|
|
!active_clone_parent_db && !table.child_table && /*#__PURE__*/ jsx_runtime_.jsx("div", {
|
|
className: "button outlined light-gray small-text",
|
|
onClick: (e)=>{
|
|
window.location.href = `/admin/${user?.id}/databases/${database.db_slug}/tables/add-table?clone=true&clone_db=${database.db_slug}&clone_table=${table.table_slug}`;
|
|
},
|
|
children: /*#__PURE__*/ jsx_runtime_.jsx("span", {
|
|
children: "Clone"
|
|
})
|
|
}),
|
|
(!isDelegated || isDelegated && isTableDeletable) && !active_clone_parent_db && !remote_connected && /*#__PURE__*/ jsx_runtime_.jsx("div", {
|
|
className: "button outlined light-gray small-text",
|
|
onClick: (e)=>{
|
|
setTargetTable(table);
|
|
(0,GeneralPopup/* openPopup */.Mw)("delete-table-confirmation");
|
|
},
|
|
children: /*#__PURE__*/ jsx_runtime_.jsx("span", {
|
|
children: "Delete"
|
|
})
|
|
})
|
|
]
|
|
})
|
|
}),
|
|
/*#__PURE__*/ jsx_runtime_.jsx(external_lucide_react_.ChevronRight, {
|
|
className: "text-slate-600",
|
|
size: 20
|
|
})
|
|
]
|
|
})
|
|
]
|
|
});
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
} /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */
|
|
|
|
// EXTERNAL MODULE: external "@mui/icons-material/DriveFileRenameOutlineTwoTone"
|
|
var DriveFileRenameOutlineTwoTone_ = __webpack_require__(8193);
|
|
var DriveFileRenameOutlineTwoTone_default = /*#__PURE__*/__webpack_require__.n(DriveFileRenameOutlineTwoTone_);
|
|
// EXTERNAL MODULE: external "@mui/icons-material/StorageTwoTone"
|
|
var StorageTwoTone_ = __webpack_require__(4063);
|
|
var StorageTwoTone_default = /*#__PURE__*/__webpack_require__.n(StorageTwoTone_);
|
|
// EXTERNAL MODULE: external "@mui/icons-material/DifferenceTwoTone"
|
|
var DifferenceTwoTone_ = __webpack_require__(930);
|
|
var DifferenceTwoTone_default = /*#__PURE__*/__webpack_require__.n(DifferenceTwoTone_);
|
|
// EXTERNAL MODULE: external "@mui/icons-material/DeleteForeverTwoTone"
|
|
var DeleteForeverTwoTone_ = __webpack_require__(7039);
|
|
var DeleteForeverTwoTone_default = /*#__PURE__*/__webpack_require__.n(DeleteForeverTwoTone_);
|
|
// EXTERNAL MODULE: external "@mui/icons-material/CopyAllTwoTone"
|
|
var CopyAllTwoTone_ = __webpack_require__(5050);
|
|
var CopyAllTwoTone_default = /*#__PURE__*/__webpack_require__.n(CopyAllTwoTone_);
|
|
// EXTERNAL MODULE: external "@mui/icons-material/TableViewTwoTone"
|
|
var TableViewTwoTone_ = __webpack_require__(3851);
|
|
var TableViewTwoTone_default = /*#__PURE__*/__webpack_require__.n(TableViewTwoTone_);
|
|
// EXTERNAL MODULE: ./functions/frontend/fetchApi.js
|
|
var fetchApi = __webpack_require__(6729);
|
|
// EXTERNAL MODULE: ./functions/frontend/inputFileToBase64.js
|
|
var inputFileToBase64 = __webpack_require__(8345);
|
|
// EXTERNAL MODULE: ./components/general/LoadingBlock.jsx
|
|
var LoadingBlock = __webpack_require__(5264);
|
|
;// CONCATENATED MODULE: ./components/admin/databases/ImportDbComponent.jsx
|
|
// @ts-check
|
|
/**
|
|
* ==============================================================================
|
|
* Imports
|
|
* ==============================================================================
|
|
*/
|
|
|
|
|
|
|
|
|
|
|
|
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
|
|
* ==============================================================================
|
|
* Main Component { Functional }
|
|
* ==============================================================================
|
|
* @param {Object} props - Server props
|
|
* @param {Object} props.database
|
|
*/ function ImportDbComponent({ database }) {
|
|
/**
|
|
* Get Contexts
|
|
*
|
|
* @abstract { React.useContext }
|
|
*/ ////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
/**
|
|
* Javascript Variables
|
|
*
|
|
* @abstract Non hook variables and functions
|
|
*/ ////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
/**
|
|
* React Hooks
|
|
*
|
|
* @abstract { useState, useEffect, useRef, etc ... }
|
|
*/ /** @type {React.LegacyRef<HTMLInputElement | undefined>} */ const fileRef = external_react_default().useRef();
|
|
const [loading, setLoading] = external_react_default().useState(false);
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
/**
|
|
* Function Return
|
|
*
|
|
* @abstract Main Function Return
|
|
*/ return /*#__PURE__*/ (0,jsx_runtime_.jsxs)((external_react_default()).Fragment, {
|
|
children: [
|
|
/*#__PURE__*/ jsx_runtime_.jsx("input", {
|
|
type: "file",
|
|
name: "sql-file-input",
|
|
id: "sql-file-input",
|
|
accept: ".sql",
|
|
className: "hidden",
|
|
// @ts-ignore
|
|
ref: fileRef
|
|
}),
|
|
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("button", {
|
|
className: "flex-col normal-weight outlined gray dashed w-full p-8 relative",
|
|
onClick: (e)=>{
|
|
fileRef.current?.addEventListener("change", (e)=>{
|
|
/** @type {HTMLInputElement} */ // @ts-ignore
|
|
const inputEl = e.target;
|
|
if (!inputEl.files?.[0]) {
|
|
window.alert("No FIles selected");
|
|
return;
|
|
}
|
|
(0,inputFileToBase64/* default */.Z)({
|
|
inputFile: inputEl.files[0]
|
|
}).then((fileObject)=>{
|
|
if (window.confirm(`Use this file '${fileObject.fileName}' as your import file?`)) {
|
|
setLoading(true);
|
|
(0,fetchApi/* default */.Z)("/api/importDatabase", {
|
|
method: "post",
|
|
body: {
|
|
database: database,
|
|
fileBase64: fileObject.fileBase64
|
|
}
|
|
}, true).then((res)=>{
|
|
if (res.success) {
|
|
window.location.reload();
|
|
} else {
|
|
window.alert("Import Failed!");
|
|
}
|
|
setTimeout(()=>{
|
|
setLoading(false);
|
|
}, 1000);
|
|
});
|
|
}
|
|
});
|
|
});
|
|
fileRef.current?.click();
|
|
},
|
|
children: [
|
|
loading && /*#__PURE__*/ jsx_runtime_.jsx(LoadingBlock/* default */.Z, {}),
|
|
/*#__PURE__*/ jsx_runtime_.jsx("span", {
|
|
className: "text-slate-400",
|
|
children: "Do you have an SQL file already?"
|
|
}),
|
|
/*#__PURE__*/ jsx_runtime_.jsx((StorageTwoTone_default()), {
|
|
sx: {
|
|
fontSize: 80
|
|
},
|
|
className: "opacity-20"
|
|
}),
|
|
/*#__PURE__*/ jsx_runtime_.jsx("span", {
|
|
className: "",
|
|
children: "Import Database"
|
|
})
|
|
]
|
|
})
|
|
]
|
|
});
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
} /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */
|
|
|
|
// EXTERNAL MODULE: external "@mui/icons-material/SummarizeTwoTone"
|
|
var SummarizeTwoTone_ = __webpack_require__(7428);
|
|
var SummarizeTwoTone_default = /*#__PURE__*/__webpack_require__.n(SummarizeTwoTone_);
|
|
;// CONCATENATED MODULE: ./components/admin/databases/ImportSchemaComponent.jsx
|
|
// @ts-check
|
|
/**
|
|
* ==============================================================================
|
|
* Imports
|
|
* ==============================================================================
|
|
*/
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
|
|
* ==============================================================================
|
|
* Main Component { Functional }
|
|
* ==============================================================================
|
|
* @param {Object} props - Server props
|
|
* @param {Object} props.database
|
|
*/ function ImportSchemaComponent({ database }) {
|
|
/**
|
|
* Get Contexts
|
|
*
|
|
* @abstract { React.useContext }
|
|
*/ ////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
/**
|
|
* Javascript Variables
|
|
*
|
|
* @abstract Non hook variables and functions
|
|
*/ ////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
/**
|
|
* React Hooks
|
|
*
|
|
* @abstract { useState, useEffect, useRef, etc ... }
|
|
*/ /** @type {React.LegacyRef<HTMLInputElement | undefined>} */ const fileRef = external_react_default().useRef();
|
|
const [loading, setLoading] = external_react_default().useState(false);
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
/**
|
|
* Function Return
|
|
*
|
|
* @abstract Main Function Return
|
|
*/ return /*#__PURE__*/ (0,jsx_runtime_.jsxs)((external_react_default()).Fragment, {
|
|
children: [
|
|
/*#__PURE__*/ jsx_runtime_.jsx("input", {
|
|
type: "file",
|
|
name: "json_file_input",
|
|
id: "json_file_input",
|
|
accept: ".json",
|
|
className: "hidden",
|
|
// @ts-ignore
|
|
ref: fileRef
|
|
}),
|
|
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("button", {
|
|
className: "flex-col normal-weight outlined gray dashed w-full p-8 relative",
|
|
onClick: (e)=>{
|
|
fileRef.current?.addEventListener("change", (e)=>{
|
|
/** @type {HTMLInputElement} */ // @ts-ignore
|
|
const inputEl = e.target;
|
|
if (!inputEl.files?.[0]) {
|
|
window.alert("No FIles selected");
|
|
return;
|
|
}
|
|
(0,inputFileToBase64/* default */.Z)({
|
|
inputFile: inputEl.files[0]
|
|
}).then((fileObject)=>{
|
|
if (window.confirm(`Use this file '${fileObject.fileName}' as your import file?`)) {
|
|
setLoading(true);
|
|
(0,fetchApi/* default */.Z)("/api/importDatabaseSchema", {
|
|
method: "post",
|
|
body: {
|
|
database: database,
|
|
fileBase64: fileObject.fileBase64
|
|
}
|
|
}, true).then((res)=>{
|
|
if (res.success) {
|
|
window.location.reload();
|
|
} else {
|
|
window.alert("Import Failed!");
|
|
}
|
|
setTimeout(()=>{
|
|
setLoading(false);
|
|
}, 1000);
|
|
});
|
|
}
|
|
});
|
|
});
|
|
fileRef.current?.click();
|
|
},
|
|
children: [
|
|
loading && /*#__PURE__*/ jsx_runtime_.jsx(LoadingBlock/* default */.Z, {}),
|
|
/*#__PURE__*/ jsx_runtime_.jsx("span", {
|
|
className: "text-slate-400",
|
|
children: "Do you have a JSON schema?"
|
|
}),
|
|
/*#__PURE__*/ jsx_runtime_.jsx((SummarizeTwoTone_default()), {
|
|
sx: {
|
|
fontSize: 80
|
|
},
|
|
className: "opacity-20"
|
|
}),
|
|
/*#__PURE__*/ jsx_runtime_.jsx("span", {
|
|
className: "",
|
|
children: "Import JSON schema"
|
|
})
|
|
]
|
|
})
|
|
]
|
|
});
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
} /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */
|
|
|
|
;// CONCATENATED MODULE: ./components/admin/databases/TablesList.jsx
|
|
// @ts-check
|
|
/**
|
|
* ==============================================================================
|
|
* Imports
|
|
* ==============================================================================
|
|
*/
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
|
|
* ==============================================================================
|
|
* Main Component { Functional }
|
|
* ==============================================================================
|
|
* @param {Object} props - Server props
|
|
* @param {import("@/package-shared/types").DSQL_MYSQL_user_databases_Type} props.database
|
|
* @param {import("@/package-shared/types").MYSQL_user_database_tables_table_def[]} props.tables
|
|
* @param {React.Dispatch<React.SetStateAction<import("@/package-shared/types").MYSQL_user_database_tables_table_def | null>>} props.setTargetTable
|
|
* @param {any} props.confirmedDelegetedUser
|
|
* @param {any} props.query
|
|
* @param {import("@/package-shared/types").UserType} props.user
|
|
*/ function TablesList({ database , tables , setTargetTable , confirmedDelegetedUser , query , user , }) {
|
|
/**
|
|
* 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 Table/i);
|
|
const addTablePlaceholder = (()=>{
|
|
if ((!tables || !tables[0]) && !isDelegated) return true;
|
|
if ((!tables || !tables[0]) && isDelegated && isTableCreatable) return true;
|
|
return false;
|
|
})();
|
|
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)("div", {
|
|
className: "w-full flex-col",
|
|
children: [
|
|
tables && tables[0] && tables.map((table)=>{
|
|
return /*#__PURE__*/ jsx_runtime_.jsx(TableListCard, {
|
|
table: table,
|
|
setTargetTable: setTargetTable,
|
|
database: database,
|
|
confirmedDelegetedUser: confirmedDelegetedUser,
|
|
query: query,
|
|
icons: {
|
|
edit: (DriveFileRenameOutlineTwoTone_default()),
|
|
duplicate: (DifferenceTwoTone_default()),
|
|
delete: (DeleteForeverTwoTone_default()),
|
|
copy: (CopyAllTwoTone_default())
|
|
},
|
|
user: user
|
|
}, table.id);
|
|
}),
|
|
addTablePlaceholder && !active_clone_parent_db && !remote_connected && /*#__PURE__*/ jsx_runtime_.jsx((external_react_default()).Fragment, {
|
|
children: /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
|
|
className: "w-full grid grid-cols-1 xl:grid-cols-2 items-stretch gap-6",
|
|
children: [
|
|
/*#__PURE__*/ (0,jsx_runtime_.jsxs)("a", {
|
|
href: `/admin/${user?.id}/databases/${database.db_slug}/tables/add-table`,
|
|
className: "button flex-col normal-weight outlined gray dashed border-dotted w-full p-8",
|
|
children: [
|
|
/*#__PURE__*/ jsx_runtime_.jsx("span", {
|
|
className: "text-slate-400",
|
|
children: "No Tables Created."
|
|
}),
|
|
/*#__PURE__*/ jsx_runtime_.jsx((TableViewTwoTone_default()), {
|
|
sx: {
|
|
fontSize: 100
|
|
},
|
|
className: "opacity-20"
|
|
}),
|
|
/*#__PURE__*/ jsx_runtime_.jsx("span", {
|
|
className: "",
|
|
children: "Add Table"
|
|
})
|
|
]
|
|
}),
|
|
/*#__PURE__*/ jsx_runtime_.jsx(ImportDbComponent, {
|
|
database: database
|
|
}),
|
|
/*#__PURE__*/ jsx_runtime_.jsx(ImportSchemaComponent, {
|
|
database: database
|
|
})
|
|
]
|
|
})
|
|
}),
|
|
(!tables || !tables[0]) && isDelegated && /*#__PURE__*/ jsx_runtime_.jsx("span", {
|
|
className: "text-sm bg-slate-100 px-3 py-2 rounded w-full flex items-center justify-center text-slate-400",
|
|
children: "Tables will show here once the owner of the database adds one"
|
|
})
|
|
]
|
|
})
|
|
});
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
////////////////////////////////////////
|
|
} /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */
|
|
|
|
|
|
/***/ })
|
|
|
|
};
|
|
; |