diff --git a/src/qqq/pages/components/BaseLayout/index.tsx b/src/qqq/components/BaseLayout/index.tsx
similarity index 95%
rename from src/qqq/pages/components/BaseLayout/index.tsx
rename to src/qqq/components/BaseLayout/index.tsx
index d048077..c00bc40 100644
--- a/src/qqq/pages/components/BaseLayout/index.tsx
+++ b/src/qqq/components/BaseLayout/index.tsx
@@ -21,8 +21,8 @@ import breakpoints from "assets/theme/base/breakpoints";
// Material Dashboard 2 PRO React TS examples components
import DashboardLayout from "examples/LayoutContainers/DashboardLayout";
import DashboardNavbar from "examples/Navbars/DashboardNavbar";
-import Footer from "qqq/pages/components/Footer";
-import MDBox from "../../../../components/MDBox";
+import Footer from "qqq/components/Footer";
+import MDBox from "../../../components/MDBox";
// Declaring props types for BaseLayout
interface Props {
diff --git a/src/qqq/pages/components/EntityForm/data/selectData.ts b/src/qqq/components/EntityForm/data/selectData.ts
similarity index 100%
rename from src/qqq/pages/components/EntityForm/data/selectData.ts
rename to src/qqq/components/EntityForm/data/selectData.ts
diff --git a/src/qqq/components/EntityForm/index.tsx b/src/qqq/components/EntityForm/index.tsx
new file mode 100644
index 0000000..0b80eae
--- /dev/null
+++ b/src/qqq/components/EntityForm/index.tsx
@@ -0,0 +1,177 @@
+/**
+ =========================================================
+ * Material Dashboard 2 PRO React TS - v1.0.0
+ =========================================================
+
+ * Product Page: https://www.creative-tim.com/product/material-dashboard-2-pro-react-ts
+ * Copyright 2022 Creative Tim (https://www.creative-tim.com)
+
+ Coded by www.creative-tim.com
+
+ =========================================================
+
+ * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+ */
+
+/* eslint-disable no-unused-vars */
+/* eslint-disable spaced-comment */
+
+import { useParams } from "react-router-dom";
+
+// @material-ui core components
+import Card from "@mui/material/Card";
+import Grid from "@mui/material/Grid";
+
+// Material Dashboard 2 PRO React TS components
+import MDBox from "components/MDBox";
+import MDTypography from "components/MDTypography";
+
+// Settings page components
+import FormField from "layouts/pages/account/components/FormField";
+
+// qqq imports
+import { QTableMetaData } from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData";
+import { QControllerV3 } from "@kingsrook/qqq-frontend-core/lib/controllers/QControllerV2";
+import { QRecord } from "@kingsrook/qqq-frontend-core/lib/model/QRecord";
+import React, { useState } from "react";
+import { QTableRecord } from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableRecord";
+import MDButton from "../../../components/MDButton";
+
+const qController = new QControllerV3("");
+
+// Declaring props types for EntityForm
+interface Props {
+ id?: string;
+}
+
+function EntityForm({ id }: Props): JSX.Element {
+ const { tableName } = useParams();
+ const [formFields, setFormFields] = useState([] as JSX.Element[]);
+ const defaultValues: { [key: string]: string } = {};
+ const [formValues, setFormValues] = useState(defaultValues);
+ const [loadCounter, setLoadCounter] = useState(0);
+ const [tableMetaData, setTableMetaData] = useState(null);
+
+ const handleInputChange = (e: { target: { name: any; value: any } }) => {
+ console.log("A");
+ const { name, value } = e.target;
+ console.log(name);
+ console.log(value);
+ formValues[name] = value;
+ setFormValues(formValues);
+ };
+
+ if (loadCounter === 0) {
+ setLoadCounter(1);
+
+ (async () => {
+ // await qController.loadTableMetaData(tableName).then((tableMetaData) => {
+ const tableMetaData = await qController.loadTableMetaData(tableName);
+ setTableMetaData(tableMetaData);
+ const formFields = [] as JSX.Element[];
+
+ // make a call to query (just get all for now, and iterate and filter like a caveman)
+ if (id !== null) {
+ const records = await qController.query(tableName, 250);
+ let foundRecord: QRecord;
+ records.forEach((innerRecord) => {
+ const fieldKeys = [...innerRecord.values.keys()];
+ fieldKeys.forEach((key) => {
+ const value = innerRecord.values.get(key);
+ if (key === tableMetaData.primaryKeyField && `${value}` === `${id}`) {
+ foundRecord = innerRecord;
+ }
+ });
+ });
+
+ const sortedKeys = [...tableMetaData.fields.keys()].sort();
+ sortedKeys.forEach((key) => {
+ formValues[key] = foundRecord.values.get(key);
+
+ const fieldMetaData = tableMetaData.fields.get(key);
+ if (fieldMetaData.name !== tableMetaData.primaryKeyField) {
+ if (formValues[fieldMetaData.name] == null) {
+ formValues[fieldMetaData.name] = "";
+ }
+
+ formFields.push(
+
+
+
+ );
+ }
+ });
+
+ setLoadCounter(2);
+ setFormValues(formValues);
+ } else {
+ const sortedKeys = [...tableMetaData.fields.keys()].sort();
+ sortedKeys.forEach((key) => {
+ const fieldMetaData = tableMetaData.fields.get(key);
+ if (fieldMetaData.name !== tableMetaData.primaryKeyField) {
+ formFields.push(
+
+
+
+ );
+ }
+ });
+ }
+
+ setFormFields(formFields);
+ })();
+ }
+
+ const handleSubmit = (event: { preventDefault: () => void }) => {
+ event.preventDefault();
+
+ (async () => {
+ await qController.create(tableName, formValues).then((record) => {
+ window.location.href = `/${tableName}/view/${record.values.get("id")}`; // todo - primaryKeyField
+ });
+ })();
+ };
+
+ const pageTitle = id != null ? `Edit ${tableMetaData?.label}` : `Create ${tableMetaData?.label}`;
+
+ return (
+
+
+ {pageTitle}
+
+
+
+ {formFields}
+
+
+
+
+ save {tableMetaData?.label}
+
+
+
+
+
+ );
+}
+
+// Declaring default props for DefaultCell
+EntityForm.defaultProps = {
+ id: null,
+};
+
+export default EntityForm;
diff --git a/src/qqq/pages/components/Footer/index.tsx b/src/qqq/components/Footer/index.tsx
similarity index 100%
rename from src/qqq/pages/components/Footer/index.tsx
rename to src/qqq/components/Footer/index.tsx
diff --git a/src/qqq/pages/components/EntityForm/index.tsx b/src/qqq/pages/components/EntityForm/index.tsx
deleted file mode 100644
index 64ed98f..0000000
--- a/src/qqq/pages/components/EntityForm/index.tsx
+++ /dev/null
@@ -1,184 +0,0 @@
-/**
- =========================================================
- * Material Dashboard 2 PRO React TS - v1.0.0
- =========================================================
-
- * Product Page: https://www.creative-tim.com/product/material-dashboard-2-pro-react-ts
- * Copyright 2022 Creative Tim (https://www.creative-tim.com)
-
- Coded by www.creative-tim.com
-
- =========================================================
-
- * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
- */
-
-/* eslint-disable no-unused-vars */
-/* eslint-disable spaced-comment */
-
-import { useParams } from "react-router-dom";
-
-// @material-ui core components
-import Card from "@mui/material/Card";
-import Grid from "@mui/material/Grid";
-
-// Material Dashboard 2 PRO React TS components
-import MDBox from "components/MDBox";
-import MDTypography from "components/MDTypography";
-
-// Settings page components
-import FormField from "layouts/pages/account/components/FormField";
-
-// qqq imports
-import { QTableMetaData } from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData";
-import { QController } from "@kingsrook/qqq-frontend-core/lib/controllers/QController";
-import React, { useState } from "react";
-import { QTableRecord } from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableRecord";
-import MDButton from "../../../../components/MDButton";
-
-const qController = new QController("");
-
-// Declaring props types for EntityForm
-interface Props {
- id?: string;
-}
-
-function EntityForm({ id }: Props): JSX.Element {
- const { tableName } = useParams();
- const [formFields, setFormFields] = useState([] as JSX.Element[]);
- const defaultValues: { [key: string]: string } = {};
- const [formValues, setFormValues] = useState(defaultValues);
- const [loadCounter, setLoadCounter] = useState(0);
-
- const handleInputChange = (e: { target: { name: any; value: any } }) => {
- console.log("A");
- const { name, value } = e.target;
- console.log(name);
- console.log(value);
- formValues[name] = value;
- setFormValues(formValues);
- };
-
- const tableMetaData = new QTableMetaData(tableName);
- if (loadCounter === 0) {
- setLoadCounter(1);
-
- (async () => {
- await qController.loadTableMetaData(tableName).then((tableMetaData) => {
- const formFields = [] as JSX.Element[];
-
- // make a call to query (just get all for now, and iterate and filter like a caveman)
- if (id !== null) {
- (async () => {
- await qController.query(tableName, 250).then((results) => {
- let foundRecord: QTableRecord;
- results.forEach((record) => {
- const values = new Map(Object.entries(record.values));
- values.forEach((value, key) => {
- if (key === tableMetaData.primaryKeyField && value.toString() === id) {
- foundRecord = record;
- }
- });
- });
-
- if (id != null) {
- const values = new Map(Object.entries(foundRecord.values));
- values.forEach((value, key) => {
- formValues[key] = value;
- console.log(`key:${key},value:${value}`);
- });
- }
-
- const fields = new Map(Object.entries(tableMetaData.fields));
- const sortedEntries = new Map([...fields.entries()].sort());
- sortedEntries.forEach((fieldMetaData) => {
- if (fieldMetaData.name !== tableMetaData.primaryKeyField) {
- if (formValues[fieldMetaData.name] == null) {
- formValues[fieldMetaData.name] = "";
- }
-
- formFields.push(
-
-
-
- );
- }
- });
-
- setLoadCounter(2);
- setFormValues(formValues);
- });
- })();
- } else {
- const fields = new Map(Object.entries(tableMetaData.fields));
- const sortedEntries = new Map([...fields.entries()].sort());
- sortedEntries.forEach((fieldMetaData) => {
- if (fieldMetaData.name !== tableMetaData.primaryKeyField) {
- formFields.push(
-
-
-
- );
- }
- });
- }
-
- setFormFields(formFields);
- });
- })();
- }
-
- const handleSubmit = (event: { preventDefault: () => void }) => {
- event.preventDefault();
-
- (async () => {
- await qController.create(tableName, formValues).then((recordList) => {
- const values = new Map(Object.entries(recordList[0].values));
- window.location.href = `/${tableName}/view/${values.get("id")}`;
- });
- })();
- };
-
- const pageTitle = id != null ? `Edit ${tableMetaData.label}` : `Create ${tableMetaData.label}`;
-
- return (
-
-
- {pageTitle}
-
-
-
- {formFields}
-
-
-
-
- save {tableMetaData.label}
-
-
-
-
-
- );
-}
-
-// Declaring default props for DefaultCell
-EntityForm.defaultProps = {
- id: null,
-};
-
-export default EntityForm;
diff --git a/src/qqq/pages/entity-create/index.tsx b/src/qqq/pages/entity-create/index.tsx
index e1954cf..c8796b4 100644
--- a/src/qqq/pages/entity-create/index.tsx
+++ b/src/qqq/pages/entity-create/index.tsx
@@ -20,8 +20,8 @@ import Grid from "@mui/material/Grid";
import MDBox from "components/MDBox";
// Settings page components
-import CreateForm from "qqq/pages/components/EntityForm";
-import BaseLayout from "qqq/pages/components/BaseLayout";
+import CreateForm from "qqq/components/EntityForm";
+import BaseLayout from "qqq/components/BaseLayout";
function EntityCreate(): JSX.Element {
return (
diff --git a/src/qqq/pages/entity-edit/index.tsx b/src/qqq/pages/entity-edit/index.tsx
index 4db3893..4e5de62 100644
--- a/src/qqq/pages/entity-edit/index.tsx
+++ b/src/qqq/pages/entity-edit/index.tsx
@@ -20,9 +20,9 @@ import Grid from "@mui/material/Grid";
import MDBox from "components/MDBox";
// Settings page components
-import BaseLayout from "qqq/pages/components/BaseLayout";
+import BaseLayout from "qqq/components/BaseLayout";
import { useParams } from "react-router-dom";
-import EntityForm from "qqq/pages/components/EntityForm";
+import EntityForm from "qqq/components/EntityForm";
function EntityEdit(): JSX.Element {
const { id } = useParams();
diff --git a/src/qqq/pages/entity-list/index.tsx b/src/qqq/pages/entity-list/index.tsx
index 9cbe11c..7a41527 100644
--- a/src/qqq/pages/entity-list/index.tsx
+++ b/src/qqq/pages/entity-list/index.tsx
@@ -34,13 +34,13 @@ import DashboardNavbar from "examples/Navbars/DashboardNavbar";
import DataTable from "examples/Tables/DataTable";
// Data
-import { QController } from "@kingsrook/qqq-frontend-core/lib/controllers/QController";
+import { QControllerV3 } from "@kingsrook/qqq-frontend-core/lib/controllers/QControllerV2";
import Link from "@mui/material/Link";
import { QTableMetaData } from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData";
import IdCell from "./components/IdCell";
-import Footer from "../components/Footer";
+import Footer from "../../components/Footer";
-const qController = new QController("");
+const qController = new QControllerV3("");
console.log(qController);
// Declaring props types for DefaultCell
@@ -65,44 +65,35 @@ function EntityList({ table }: Props): JSX.Element {
const createPath = `/${table.name}/create`;
(async () => {
- await qController.loadTableMetaData(table.name).then((tableMetaData) => {
- (async () => {
- await qController.query(table.name, 250).then((results) => {
- dataTableData = {
- columns: [],
- rows: [],
- };
+ const tableMetaData = await qController.loadTableMetaData(table.name);
+ const results = await qController.query(table.name, 250);
+ dataTableData = {
+ columns: [],
+ rows: [],
+ };
- const fields = new Map(Object.entries(tableMetaData.fields));
- const sortedEntries = new Map([...fields.entries()].sort());
- sortedEntries.forEach((value, key) => {
- if (key === tableMetaData.primaryKeyField) {
- dataTableData.columns.splice(0, 0, {
- Header: key,
- accessor: key,
- Cell: ({ value }: any) => ,
- });
- } else {
- dataTableData.columns.push({
- Header: key,
- accessor: key,
- });
- }
- });
-
- results.forEach((record) => {
- const row = new Map();
- const values = new Map(Object.entries(record.values));
- values.forEach((value, key) => {
- row.set(key, value);
- });
- dataTableData.rows.push(Object.fromEntries(row));
- });
-
- setTableState(table.name);
+ const sortedKeys = [...tableMetaData.fields.keys()].sort();
+ sortedKeys.forEach((key) => {
+ const field = tableMetaData.fields.get(key);
+ if (key === tableMetaData.primaryKeyField) {
+ dataTableData.columns.splice(0, 0, {
+ Header: field.label,
+ accessor: key,
+ Cell: ({ value }: any) => ,
});
- })();
+ } else {
+ dataTableData.columns.push({
+ Header: field.label,
+ accessor: key,
+ });
+ }
});
+
+ results.forEach((record) => {
+ dataTableData.rows.push(Object.fromEntries(record.values.entries()));
+ });
+
+ setTableState(table.name);
})();
const renderMenu = (
diff --git a/src/qqq/pages/entity-view/components/ViewContents/index.tsx b/src/qqq/pages/entity-view/components/ViewContents/index.tsx
index 14fa493..0e87b38 100644
--- a/src/qqq/pages/entity-view/components/ViewContents/index.tsx
+++ b/src/qqq/pages/entity-view/components/ViewContents/index.tsx
@@ -30,8 +30,8 @@ import MDTypography from "components/MDTypography";
// Settings page components
// qqq imports
-import { QController } from "@kingsrook/qqq-frontend-core/lib/controllers/QController";
-import { QTableRecord } from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableRecord";
+import { QControllerV3 } from "@kingsrook/qqq-frontend-core/lib/controllers/QControllerV2";
+import { QRecord } from "@kingsrook/qqq-frontend-core/lib/model/QRecord";
import React, { useState } from "react";
import Link from "@mui/material/Link";
@@ -45,7 +45,7 @@ import Button from "@mui/material/Button";
import { QTableMetaData } from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData";
import MDButton from "../../../../../components/MDButton";
-const qController = new QController("");
+const qController = new QControllerV3("");
console.log(qController);
// Declaring props types for ViewForm
@@ -58,6 +58,8 @@ function ViewContents({ id }: Props): JSX.Element {
const [nameValues, setNameValues] = useState([] as JSX.Element[]);
const [loadCounter, setLoadCounter] = useState(0);
const [open, setOpen] = useState(false);
+ const [tableMetaData, setTableMetaData] = useState(null);
+ const [record, setRecord] = useState(null);
const handleConfirmDelete = (event: { preventDefault: () => void }) => {
event.preventDefault();
@@ -69,59 +71,57 @@ function ViewContents({ id }: Props): JSX.Element {
})();
};
- const tableMetaData = new QTableMetaData(tableName);
if (loadCounter === 0) {
setLoadCounter(1);
+
(async () => {
- await qController.loadTableMetaData(tableName).then((tableMetaData) => {
- const formFields = [] as JSX.Element[];
- const fields = new Map(Object.entries(tableMetaData.fields));
+ const tableMetaData = await qController.loadTableMetaData(tableName);
+ console.log("@dk: table meta data");
+ console.log(tableMetaData);
+ setTableMetaData(tableMetaData);
- // make a call to query (just get all for now, and iterate and filter like a caveman)
- (async () => {
- await qController.query(tableName, 250).then((results) => {
- let foundRecord: QTableRecord;
- results.forEach((record) => {
- const values = new Map(Object.entries(record.values));
- values.forEach((value, key) => {
- if (key === tableMetaData.primaryKeyField && value.toString() === id) {
- foundRecord = record;
- }
- });
- });
-
- nameValues.push(
-
-
- {tableMetaData.primaryKeyField}:
-
-
- {id}
-
-
- );
-
- const values = new Map(Object.entries(foundRecord.values));
- const sortedEntries = new Map([...values.entries()].sort());
- sortedEntries.forEach((value, key) => {
- if (key !== tableMetaData.primaryKeyField) {
- nameValues.push(
-
-
- {key}:
-
-
- {value}
-
-
- );
- }
- });
-
- setLoadCounter(2);
- });
- })();
+ // make a call to query (just get all for now, and iterate and filter like a caveman)
+ const records = await qController.query(tableName, 250);
+ let foundRecord: QRecord;
+ records.forEach((innerRecord) => {
+ const fieldKeys = [...innerRecord.values.keys()];
+ fieldKeys.forEach((key) => {
+ const value = innerRecord.values.get(key);
+ if (key === tableMetaData.primaryKeyField && `${value}` === `${id}`) {
+ foundRecord = innerRecord;
+ setRecord(innerRecord);
+ }
+ });
});
+
+ nameValues.push(
+
+
+ {tableMetaData.primaryKeyField}:
+
+
+ {id}
+
+
+ );
+
+ const sortedKeys = [...foundRecord.values.keys()].sort();
+ sortedKeys.forEach((key) => {
+ if (key !== tableMetaData.primaryKeyField) {
+ nameValues.push(
+
+
+ {tableMetaData.fields.get(key).label}:
+
+
+ {foundRecord.values.get(key)}
+
+
+ );
+ }
+ });
+
+ setLoadCounter(2);
})();
}
@@ -139,7 +139,7 @@ function ViewContents({ id }: Props): JSX.Element {
- Viewing {tableMetaData.label} ({id})
+ Viewing {tableMetaData?.label} ({id})
{nameValues}
@@ -153,7 +153,7 @@ function ViewContents({ id }: Props): JSX.Element {
size="small"
onClick={handleConfirmDelete}
>
- delete {tableMetaData.label}
+ delete {tableMetaData?.label}
- edit {tableMetaData.label}
+ edit {tableMetaData?.label}
diff --git a/src/qqq/pages/entity-view/index.tsx b/src/qqq/pages/entity-view/index.tsx
index e48ec87..60212ea 100644
--- a/src/qqq/pages/entity-view/index.tsx
+++ b/src/qqq/pages/entity-view/index.tsx
@@ -23,7 +23,7 @@ import MDBox from "components/MDBox";
// Settings page components
// import CreateForm from "qqq/pages/entity-create/components/CreateForm";
-import BaseLayout from "qqq/pages/components/BaseLayout";
+import BaseLayout from "qqq/components/BaseLayout";
import ViewContents from "./components/ViewContents";
function EntityView(): JSX.Element {
diff --git a/src/qqq/qqqRoutes.tsx b/src/qqq/qqqRoutes.tsx
index c3acd86..8cbbe68 100644
--- a/src/qqq/qqqRoutes.tsx
+++ b/src/qqq/qqqRoutes.tsx
@@ -75,7 +75,7 @@ import Icon from "@mui/material/Icon";
import profilePicture from "assets/images/team-3.jpg";
// QQQ
-import { QController } from "@kingsrook/qqq-frontend-core/lib/controllers/QController";
+import { QControllerV3 } from "@kingsrook/qqq-frontend-core/lib/controllers/QControllerV2";
import EntityList from "./pages/entity-list";
@@ -386,36 +386,34 @@ const qqqRoutes = [
{ type: "title", title: "Tables", key: "title-docs" },
];
-const qController = new QController("");
+const qController = new QControllerV3("");
console.log(qController);
(async () => {
- await qController.loadMetaData().then((metaData) => {
- console.log(`metaData: ${metaData}`);
+ const metaData = await qController.loadMetaData();
+ console.log(`metaData: ${metaData}`);
- // get the keys sorted
- const keys = new Map([...metaData.entries()].sort());
-
- const tableList = [] as any[];
- keys.forEach((value, key) => {
- const table = metaData.get(key);
- tableList.push({
- name: table.label,
- key: table.name,
- route: `/${table.name}/list`,
- component: ,
- });
+ // get the keys sorted
+ const keys = [...metaData.keys()].sort();
+ const tableList = [] as any[];
+ keys.forEach((key) => {
+ const table = metaData.get(key);
+ tableList.push({
+ name: table.label,
+ key: table.name,
+ route: `/${table.name}/list`,
+ component: ,
});
-
- const tables = {
- type: "collapse",
- name: "Tables",
- key: "tables",
- icon: dashboard,
- collapse: tableList,
- };
- qqqRoutes.push(tables);
});
+
+ const tables = {
+ type: "collapse",
+ name: "Tables",
+ key: "tables",
+ icon: dashboard,
+ collapse: tableList,
+ };
+ qqqRoutes.push(tables);
})();
export default qqqRoutes;