diff --git a/.eslintrc.json b/.eslintrc.json index d9b248b..0adcb43 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -5,7 +5,8 @@ }, "extends": [ "plugin:react/recommended", - "airbnb" + "plugin:import/recommended", + "plugin:import/typescript" ], "globals": { "JSX": true @@ -27,7 +28,8 @@ }, "plugins": [ "react", - "@typescript-eslint" + "@typescript-eslint", + "import" ], "rules": { "brace-style": [ @@ -56,7 +58,26 @@ "devDependencies": true } ], - "import/order": "off", + "import/order": [ + "error", + { + "groups": [ + "builtin", // Built-in imports (come from NodeJS native) go first + "external", // <- External imports + "internal", // <- Absolute imports + ["sibling", "parent"], // <- Relative imports, the sibling and parent types they can be mingled together + "index", // <- index imports + "unknown" + ], + "newlines-between": "never", + "alphabetize": { + /* sort in ascending order. Options: ["ignore", "asc", "desc"] */ + "order": "asc", + /* ignore case. Options: [true, false] */ + "caseInsensitive": true + } + } + ], "max-len": "off", "no-console": "off", "no-constant-condition": "off", @@ -81,10 +102,7 @@ ] } ], - "react/jsx-indent": [ - "error", - 3 - ], + "react/jsx-indent": "off", "react/jsx-indent-props": [ "error", 3 @@ -94,6 +112,15 @@ "quotes": [ "error", "double" + ], + "sort-imports": [ + "error", + { + "ignoreCase": false, + "ignoreDeclarationSort": true, + "ignoreMemberSort": true, + "allowSeparatedGroups": false + } ] }, "settings": { diff --git a/src/App.tsx b/src/App.tsx index 9508ad8..169e7e5 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,56 +1,56 @@ -import React, { - JSXElementConstructor, Key, ReactElement, useEffect, useState, -} from "react"; - -// react-router components -import { - Navigate, Route, Routes, useLocation, -} from "react-router-dom"; +/* + * QQQ - Low-code Application Framework for Engineers. + * Copyright (C) 2021-2022. Kingsrook, LLC + * 651 N Broad St Ste 205 # 6917 | Middletown DE 19709 | United States + * contact@kingsrook.com + * https://github.com/Kingsrook/ + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as + * published by the Free Software Foundation, either version 3 of the + * License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ import {useAuth0} from "@auth0/auth0-react"; - -// @mui material components -import {LicenseInfo} from "@mui/x-license-pro"; -import {ThemeProvider} from "@mui/material/styles"; +import {QAppNodeType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QAppNodeType"; +import {QAppTreeNode} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QAppTreeNode"; +import {QInstance} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QInstance"; import CssBaseline from "@mui/material/CssBaseline"; import Icon from "@mui/material/Icon"; - -// Material Dashboard 2 PRO React TS components -import MDBox from "components/MDBox"; - -// Material Dashboard 2 PRO React TS exampless -import Sidenav from "examples/Sidenav"; -import Configurator from "examples/Configurator"; - -// Material Dashboard 2 PRO React TS themes -import theme from "assets/theme"; - -// Material Dashboard 2 PRO React TS Dark Mode themes -import themeDark from "assets/theme-dark"; - -// Material Dashboard 2 PRO React TS contexts -import {setMiniSidenav, setOpenConfigurator, useMaterialUIController} from "context"; - -// Images -import nfLogo from "assets/images/nutrifresh_one_icon_white.png"; -import {Md5} from "ts-md5/dist/md5"; +import {ThemeProvider} from "@mui/material/styles"; +import {LicenseInfo} from "@mui/x-license-pro"; +import React, {JSXElementConstructor, Key, ReactElement, useEffect, useState,} from "react"; import {useCookies} from "react-cookie"; -import EntityCreate from "./qqq/pages/entity-create"; -import EntityList from "./qqq/pages/entity-list"; -import EntityView from "./qqq/pages/entity-view"; -import EntityEdit from "./qqq/pages/entity-edit"; -import ProcessRun from "./qqq/pages/process-run"; +import {Navigate, Route, Routes, useLocation,} from "react-router-dom"; +import {Md5} from "ts-md5/dist/md5"; +import nfLogo from "assets/images/nutrifresh_one_icon_white.png"; +import theme from "assets/theme"; +import themeDark from "assets/theme-dark"; +import MDBox from "components/MDBox"; +import {setMiniSidenav, setOpenConfigurator, useMaterialUIController} from "context"; +import Configurator from "examples/Configurator"; +import Sidenav from "examples/Sidenav"; import AppHome from "qqq/pages/app-home"; +import QProcessUtils from "qqq/utils/QProcessUtils"; import MDAvatar from "./components/MDAvatar"; -import ProfileOverview from "./layouts/pages/profile/profile-overview"; -import Settings from "./layouts/pages/account/settings"; import Analytics from "./layouts/dashboards/analytics"; import Sales from "./layouts/dashboards/sales"; +import Settings from "./layouts/pages/account/settings"; +import ProfileOverview from "./layouts/pages/profile/profile-overview"; +import EntityCreate from "./qqq/pages/entity-create"; +import EntityEdit from "./qqq/pages/entity-edit"; +import EntityList from "./qqq/pages/entity-list"; +import EntityView from "./qqq/pages/entity-view"; +import ProcessRun from "./qqq/pages/process-run"; import QClient from "./qqq/utils/QClient"; -import {QAppNodeType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QAppNodeType"; -import {QInstance} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QInstance"; -import QProcessUtils from "qqq/utils/QProcessUtils"; -import {QAppTreeNode} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QAppTreeNode"; /////////////////////////////////////////////////////////////////////////////////////////////// // define the parts of the nav that are static - before the qqq tables etc get dynamic added // diff --git a/src/HandleAuthorizationError.tsx b/src/HandleAuthorizationError.tsx index ede41e3..6abbaf0 100644 --- a/src/HandleAuthorizationError.tsx +++ b/src/HandleAuthorizationError.tsx @@ -1,6 +1,27 @@ +/* + * QQQ - Low-code Application Framework for Engineers. + * Copyright (C) 2021-2022. Kingsrook, LLC + * 651 N Broad St Ste 205 # 6917 | Middletown DE 19709 | United States + * contact@kingsrook.com + * https://github.com/Kingsrook/ + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as + * published by the Free Software Foundation, either version 3 of the + * License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ + import React, {useEffect} from "react"; -import {SESSION_ID_COOKIE_NAME} from "App"; import {useCookies} from "react-cookie"; +import {SESSION_ID_COOKIE_NAME} from "App"; interface Props { diff --git a/src/index.tsx b/src/index.tsx index 4f978af..55469ee 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,16 +1,35 @@ +/* + * QQQ - Low-code Application Framework for Engineers. + * Copyright (C) 2021-2022. Kingsrook, LLC + * 651 N Broad St Ste 205 # 6917 | Middletown DE 19709 | United States + * contact@kingsrook.com + * https://github.com/Kingsrook/ + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as + * published by the Free Software Foundation, either version 3 of the + * License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ + +import {Auth0Provider} from "@auth0/auth0-react"; +import React from "react"; import ReactDOM from "react-dom"; import {BrowserRouter, useNavigate, useSearchParams} from "react-router-dom"; -import {Auth0Provider} from "@auth0/auth0-react"; import App from "App"; - -// Material Dashboard 2 PRO React TS Context Provider import {MaterialUIControllerProvider} from "context"; import "./qqq/styles/qqq-override-styles.css"; -import ProtectedRoute from "qqq/auth0/protected-route"; -import React from "react"; import HandleAuthorizationError from "HandleAuthorizationError"; +import ProtectedRoute from "qqq/auth0/protected-route"; + -// Auth0 params from env const domain = process.env.REACT_APP_AUTH0_DOMAIN; const clientId = process.env.REACT_APP_AUTH0_CLIENT_ID; diff --git a/src/qqq/components/BaseLayout/index.tsx b/src/qqq/components/BaseLayout/index.tsx index 8b450b3..1535a15 100644 --- a/src/qqq/components/BaseLayout/index.tsx +++ b/src/qqq/components/BaseLayout/index.tsx @@ -20,14 +20,10 @@ */ import {useState, useEffect, ReactNode} from "react"; - -// Material Dashboard 2 PRO React TS Base Styles import breakpoints from "assets/theme/base/breakpoints"; - -// Material Dashboard 2 PRO React TS examples components import DashboardLayout from "examples/LayoutContainers/DashboardLayout"; -import Navbar from "qqq/components/Navbar"; import Footer from "qqq/components/Footer"; +import Navbar from "qqq/components/Navbar"; import MDBox from "../../../components/MDBox"; // Declaring props types for BaseLayout diff --git a/src/qqq/components/Buttons/AuthenticationButton/index.tsx b/src/qqq/components/Buttons/AuthenticationButton/index.tsx index f8e89f0..d7b27c4 100644 --- a/src/qqq/components/Buttons/AuthenticationButton/index.tsx +++ b/src/qqq/components/Buttons/AuthenticationButton/index.tsx @@ -20,8 +20,8 @@ */ import {useAuth0} from "@auth0/auth0-react"; -import React from "react"; import {Button} from "@mui/material"; +import React from "react"; function AuthenticationButton() { diff --git a/src/qqq/components/EntityForm/index.tsx b/src/qqq/components/EntityForm/index.tsx index 2a2329a..5c950c4 100644 --- a/src/qqq/components/EntityForm/index.tsx +++ b/src/qqq/components/EntityForm/index.tsx @@ -1,36 +1,46 @@ -// react components -import {useParams, useNavigate, useLocation} from "react-router-dom"; -import React, {useReducer, useState} from "react"; +/* + * QQQ - Low-code Application Framework for Engineers. + * Copyright (C) 2021-2022. Kingsrook, LLC + * 651 N Broad St Ste 205 # 6917 | Middletown DE 19709 | United States + * contact@kingsrook.com + * https://github.com/Kingsrook/ + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as + * published by the Free Software Foundation, either version 3 of the + * License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ -// misc components -import * as Yup from "yup"; -import { - Form, Formik, useFormik, useFormikContext, -} from "formik"; - -// qqq components -import DynamicFormUtils from "qqq/components/QDynamicForm/utils/DynamicFormUtils"; -import QDynamicForm from "qqq/components/QDynamicForm"; import {QFieldMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldMetaData"; - -// @material-ui core components +import {QSection} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QSection"; +import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData"; +import {QRecord} from "@kingsrook/qqq-frontend-core/lib/model/QRecord"; +import {Alert} from "@mui/material"; +import Avatar from "@mui/material/Avatar"; import Card from "@mui/material/Card"; import Grid from "@mui/material/Grid"; -import {Alert} from "@mui/material"; - -// Material Dashboard 2 PRO React TS components +import Icon from "@mui/material/Icon"; +import {Form, Formik} from "formik"; +import React, {useReducer, useState} from "react"; +import {useParams, useNavigate, useLocation} from "react-router-dom"; +import * as Yup from "yup"; +import colors from "assets/theme/base/colors"; import MDBox from "components/MDBox"; import MDTypography from "components/MDTypography"; -import QClient from "qqq/utils/QClient"; -import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData"; import {QCancelButton, QSaveButton} from "qqq/components/QButtons"; -import {QRecord} from "@kingsrook/qqq-frontend-core/lib/model/QRecord"; -import Avatar from "@mui/material/Avatar"; -import Icon from "@mui/material/Icon"; +import QDynamicForm from "qqq/components/QDynamicForm"; +import DynamicFormUtils from "qqq/components/QDynamicForm/utils/DynamicFormUtils"; import QRecordSidebar from "qqq/components/QRecordSidebar"; +import QClient from "qqq/utils/QClient"; import QTableUtils from "qqq/utils/QTableUtils"; -import colors from "assets/theme/base/colors"; -import {QSection} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QSection"; interface Props { diff --git a/src/qqq/components/Footer/index.tsx b/src/qqq/components/Footer/index.tsx index e976520..6ebe4c7 100644 --- a/src/qqq/components/Footer/index.tsx +++ b/src/qqq/components/Footer/index.tsx @@ -19,28 +19,25 @@ * along with this program. If not, see . */ -// @mui material components import Link from "@mui/material/Link"; -import Icon from "@mui/material/Icon"; - -// Material Dashboard 2 PRO React TS components +import typography from "assets/theme/base/typography"; import MDBox from "components/MDBox"; import MDTypography from "components/MDTypography"; -// Material Dashboard 2 PRO React TS Base Styles -import typography from "assets/theme/base/typography"; // Declaring props types for Footer -interface Props { - company?: { - href: string; - name: string; - }; - links?: { - href: string; - name: string; - }[]; - [key: string]: any; +interface Props +{ + company?: { + href: string; + name: string; + }; + links?: { + href: string; + name: string; + }[]; + + [key: string]: any; } function Footer({company, links}: Props): JSX.Element @@ -85,9 +82,9 @@ function Footer({company, links}: Props): JSX.Element , -   +   {name} -  +   diff --git a/src/qqq/components/Navbar/index.tsx b/src/qqq/components/Navbar/index.tsx index 3b4ac40..9674fca 100644 --- a/src/qqq/components/Navbar/index.tsx +++ b/src/qqq/components/Navbar/index.tsx @@ -19,45 +19,19 @@ * along with this program. If not, see . */ -import {useState, useEffect} from "react"; - -// react-router components -import {useLocation} from "react-router-dom"; - -// @material-ui core components import AppBar from "@mui/material/AppBar"; -import Toolbar from "@mui/material/Toolbar"; +import Icon from "@mui/material/Icon"; import IconButton from "@mui/material/IconButton"; import Menu from "@mui/material/Menu"; -import Icon from "@mui/material/Icon"; - -// Material Dashboard 2 PRO React TS components +import Toolbar from "@mui/material/Toolbar"; +import {useState, useEffect} from "react"; +import {useLocation} from "react-router-dom"; +import MDBadge from "components/MDBadge"; import MDBox from "components/MDBox"; import MDInput from "components/MDInput"; -import MDBadge from "components/MDBadge"; - -// Material Dashboard 2 PRO React TS examples components +import {useMaterialUIController, setTransparentNavbar, setMiniSidenav, setOpenConfigurator,} from "context"; import NotificationItem from "examples/Items/NotificationItem"; - -// Custom styles for Navbar -import { - navbar, - navbarContainer, - navbarRow, - navbarIconButton, - navbarDesktopMenu, - navbarMobileMenu, -} from "qqq/components/Navbar/styles"; - -// Material Dashboard 2 PRO React context -import { - useMaterialUIController, - setTransparentNavbar, - setMiniSidenav, - setOpenConfigurator, -} from "context"; - -// qqq +import {navbar, navbarContainer, navbarRow, navbarIconButton, navbarDesktopMenu, navbarMobileMenu,} from "qqq/components/Navbar/styles"; import QBreadcrumbs, {routeToLabel} from "qqq/components/QBreadcrumbs"; // Declaring prop types for Navbar diff --git a/src/qqq/components/Navbar/styles.ts b/src/qqq/components/Navbar/styles.ts index 7fa3afc..999c130 100644 --- a/src/qqq/components/Navbar/styles.ts +++ b/src/qqq/components/Navbar/styles.ts @@ -19,7 +19,6 @@ * along with this program. If not, see . */ -// @mui material components import {Theme} from "@mui/material/styles"; function navbar(theme: Theme | any, ownerState: any) diff --git a/src/qqq/components/ProcessLinkCard/index.tsx b/src/qqq/components/ProcessLinkCard/index.tsx index 0be3bd4..c57936f 100644 --- a/src/qqq/components/ProcessLinkCard/index.tsx +++ b/src/qqq/components/ProcessLinkCard/index.tsx @@ -18,14 +18,11 @@ * You should have received a copy of the GNU Affero General Public License * along with this program. If not, see . */ -import {ReactNode} from "react"; -// @mui material components import Card from "@mui/material/Card"; import Divider from "@mui/material/Divider"; import Icon from "@mui/material/Icon"; - -// Material Dashboard 2 PRO React TS components +import {ReactNode} from "react"; import MDBox from "components/MDBox"; import MDTypography from "components/MDTypography"; diff --git a/src/qqq/components/QBreadcrumbs/index.tsx b/src/qqq/components/QBreadcrumbs/index.tsx index 248cfa1..94587e7 100644 --- a/src/qqq/components/QBreadcrumbs/index.tsx +++ b/src/qqq/components/QBreadcrumbs/index.tsx @@ -19,11 +19,10 @@ * along with this program. If not, see . */ -import {ReactNode} from "react"; - -import {Link} from "react-router-dom"; import {Breadcrumbs as MuiBreadcrumbs} from "@mui/material"; import Icon from "@mui/material/Icon"; +import {ReactNode} from "react"; +import {Link} from "react-router-dom"; import MDBox from "components/MDBox"; import MDTypography from "components/MDTypography"; diff --git a/src/qqq/components/QButtons/index.tsx b/src/qqq/components/QButtons/index.tsx index 867ee66..030c827 100644 --- a/src/qqq/components/QButtons/index.tsx +++ b/src/qqq/components/QButtons/index.tsx @@ -19,11 +19,11 @@ * along with this program. If not, see . */ -import MDBox from "components/MDBox"; -import {Link} from "react-router-dom"; -import MDButton from "components/MDButton"; import Icon from "@mui/material/Icon"; import React from "react"; +import {Link} from "react-router-dom"; +import MDBox from "components/MDBox"; +import MDButton from "components/MDButton"; // eslint-disable import/prefer-default-export diff --git a/src/qqq/components/QDynamicForm/index.tsx b/src/qqq/components/QDynamicForm/index.tsx index 71c5d17..3516d30 100644 --- a/src/qqq/components/QDynamicForm/index.tsx +++ b/src/qqq/components/QDynamicForm/index.tsx @@ -19,23 +19,19 @@ * along with this program. If not, see . */ -// @mui material components import Grid from "@mui/material/Grid"; - -// Material Dashboard 2 PRO React TS components -import MDBox from "components/MDBox"; -import MDTypography from "components/MDTypography"; - -// NewUser page components import {useFormikContext} from "formik"; import React from "react"; +import MDBox from "components/MDBox"; +import MDTypography from "components/MDTypography"; import QDynamicFormField from "qqq/components/QDynamicFormField"; -interface Props { - formLabel?: string; - formData: any; - bulkEditMode?: boolean; - bulkEditSwitchChangeHandler?: any +interface Props +{ + formLabel?: string; + formData: any; + bulkEditMode?: boolean; + bulkEditSwitchChangeHandler?: any; } function QDynamicForm(props: Props): JSX.Element @@ -72,55 +68,55 @@ function QDynamicForm(props: Props): JSX.Element {formFields - && Object.keys(formFields).length > 0 - && Object.keys(formFields).map((fieldName: any) => - { - const field = formFields[fieldName]; - if (values[fieldName] === undefined) - { - values[fieldName] = ""; - } + && Object.keys(formFields).length > 0 + && Object.keys(formFields).map((fieldName: any) => + { + const field = formFields[fieldName]; + if (values[fieldName] === undefined) + { + values[fieldName] = ""; + } - if (field.type === "file") - { - return ( - - - + + ) => fileChanged(event, field)} + /> + + + {errors[fieldName] && You must select a file to proceed} + + + + + ); + } + + // todo? inputProps={{ autoComplete: "" }} + // todo? placeholder={password.placeholder} + return ( + + ) => fileChanged(event, field)} + displayFormat={field.displayFormat} + value={values[fieldName]} + error={errors[fieldName] && touched[fieldName]} + bulkEditMode={bulkEditMode} + bulkEditSwitchChangeHandler={bulkEditSwitchChanged} + success={`${values[fieldName]}` !== "" && !errors[fieldName] && touched[fieldName]} /> - - - {errors[fieldName] && You must select a file to proceed} - - - - - ); - } - - // todo? inputProps={{ autoComplete: "" }} - // todo? placeholder={password.placeholder} - return ( - - - - ); - })} + + ); + })} @@ -131,7 +127,8 @@ QDynamicForm.defaultProps = { formLabel: undefined, bulkEditMode: false, bulkEditSwitchChangeHandler: () => - {}, + { + }, }; export default QDynamicForm; diff --git a/src/qqq/components/QDynamicForm/utils/DynamicFormUtils.ts b/src/qqq/components/QDynamicForm/utils/DynamicFormUtils.ts index 812fd77..dbdead7 100644 --- a/src/qqq/components/QDynamicForm/utils/DynamicFormUtils.ts +++ b/src/qqq/components/QDynamicForm/utils/DynamicFormUtils.ts @@ -19,12 +19,9 @@ * along with this program. If not, see . */ -// misc imports -import * as Yup from "yup"; - -// qqq imports import {QFieldMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldMetaData"; import {QFieldType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldType"; +import * as Yup from "yup"; /******************************************************************************* ** Meta-data to represent a single field in a table. diff --git a/src/qqq/components/QDynamicFormField/index.tsx b/src/qqq/components/QDynamicFormField/index.tsx index b521445..9540671 100644 --- a/src/qqq/components/QDynamicFormField/index.tsx +++ b/src/qqq/components/QDynamicFormField/index.tsx @@ -19,17 +19,14 @@ * along with this program. If not, see . */ -// formik components -import {ErrorMessage, Field} from "formik"; - -// Material Dashboard 2 PRO React TS components -import MDBox from "components/MDBox"; -import MDTypography from "components/MDTypography"; -import MDInput from "components/MDInput"; -import React, {useState} from "react"; +import {InputAdornment} from "@mui/material"; import Grid from "@mui/material/Grid"; import Switch from "@mui/material/Switch"; -import {InputAdornment} from "@mui/material"; +import {ErrorMessage, Field} from "formik"; +import React, {useState} from "react"; +import MDBox from "components/MDBox"; +import MDInput from "components/MDInput"; +import MDTypography from "components/MDTypography"; // Declaring props types for FormField interface Props diff --git a/src/qqq/components/QRecordSidebar/index.tsx b/src/qqq/components/QRecordSidebar/index.tsx index 85c5b04..d146825 100644 --- a/src/qqq/components/QRecordSidebar/index.tsx +++ b/src/qqq/components/QRecordSidebar/index.tsx @@ -19,16 +19,15 @@ * along with this program. If not, see . */ -import React, {ReactNode} from "react"; - -import {Link} from "react-router-dom"; +import {QSection} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QSection"; import {Breadcrumbs as MuiBreadcrumbs} from "@mui/material"; +import Card from "@mui/material/Card"; import Icon from "@mui/material/Icon"; +import {Theme} from "@mui/material/styles"; +import React, {ReactNode} from "react"; +import {Link} from "react-router-dom"; import MDBox from "components/MDBox"; import MDTypography from "components/MDTypography"; -import Card from "@mui/material/Card"; -import {Theme} from "@mui/material/styles"; -import {QSection} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QSection"; interface Props { tableSections: QSection[]; diff --git a/src/qqq/pages/app-home/index.tsx b/src/qqq/pages/app-home/index.tsx index cdb68b0..3df1022 100644 --- a/src/qqq/pages/app-home/index.tsx +++ b/src/qqq/pages/app-home/index.tsx @@ -19,28 +19,26 @@ * along with this program. If not, see . */ +import {QAppMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QAppMetaData"; +import {QAppNodeType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QAppNodeType"; +import {QInstance} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QInstance"; +import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData"; +import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData"; +import {Icon} from "@mui/material"; +import Card from "@mui/material/Card"; +import Grid from "@mui/material/Grid"; import React, {useEffect, useState} from "react"; import {Link, useLocation} from "react-router-dom"; - -// Material Dashboard 2 PRO React TS examples components -import QClient from "qqq/utils/QClient"; -import {QInstance} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QInstance"; -import {QAppMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QAppMetaData"; -import BaseLayout from "qqq/components/BaseLayout"; -import MDBox from "components/MDBox"; -import Grid from "@mui/material/Grid"; -import MiniStatisticsCard from "examples/Cards/StatisticsCards/MiniStatisticsCard"; -import {Icon} from "@mui/material"; -import MDTypography from "components/MDTypography"; -import Card from "@mui/material/Card"; -import DefaultLineChart from "examples/Charts/LineCharts/DefaultLineChart"; import MDBadgeDot from "components/MDBadgeDot"; -import ReportsBarChart from "examples/Charts/BarCharts/ReportsBarChart"; -import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData"; -import {QAppNodeType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QAppNodeType"; -import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData"; +import MDBox from "components/MDBox"; +import MDTypography from "components/MDTypography"; import DefaultInfoCard from "examples/Cards/InfoCards/DefaultInfoCard"; +import MiniStatisticsCard from "examples/Cards/StatisticsCards/MiniStatisticsCard"; +import ReportsBarChart from "examples/Charts/BarCharts/ReportsBarChart"; +import DefaultLineChart from "examples/Charts/LineCharts/DefaultLineChart"; +import BaseLayout from "qqq/components/BaseLayout"; import ProcessLinkCard from "qqq/components/ProcessLinkCard"; +import QClient from "qqq/utils/QClient"; const qController = QClient.getInstance(); @@ -55,7 +53,7 @@ function AppHome({app}: Props): JSX.Element const [tables, setTables] = useState([] as QTableMetaData[]); const [processes, setProcesses] = useState([] as QProcessMetaData[]); const [childApps, setChildApps] = useState([] as QAppMetaData[]); - const [tableCounts, setTableCounts] = useState(new Map()); + const [tableCounts, setTableCounts] = useState(new Map()); const [updatedTableCounts, setUpdatedTableCounts] = useState(new Date()); const [widgets, setWidgets] = useState([] as any[]); @@ -104,7 +102,7 @@ function AppHome({app}: Props): JSX.Element setProcesses(newProcesses); setChildApps(newChildApps); - const tableCounts = new Map(); + const tableCounts = new Map(); newTables.forEach((table) => { tableCounts.set(table.name, {isLoading: true, value: null}); diff --git a/src/qqq/pages/entity-create/index.tsx b/src/qqq/pages/entity-create/index.tsx index cef402b..930e41e 100644 --- a/src/qqq/pages/entity-create/index.tsx +++ b/src/qqq/pages/entity-create/index.tsx @@ -19,16 +19,11 @@ * along with this program. If not, see . */ -// @mui material components -import Grid from "@mui/material/Grid"; - -// Material Dashboard 2 PRO React TS components -import MDBox from "components/MDBox"; - -// Settings page components -import EntityForm from "qqq/components/EntityForm"; -import BaseLayout from "qqq/components/BaseLayout"; import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData"; +import Grid from "@mui/material/Grid"; +import MDBox from "components/MDBox"; +import BaseLayout from "qqq/components/BaseLayout"; +import EntityForm from "qqq/components/EntityForm"; interface Props { diff --git a/src/qqq/pages/entity-edit/index.tsx b/src/qqq/pages/entity-edit/index.tsx index e3a672f..96b9bf1 100644 --- a/src/qqq/pages/entity-edit/index.tsx +++ b/src/qqq/pages/entity-edit/index.tsx @@ -19,18 +19,12 @@ * along with this program. If not, see . */ -// @mui material components -import Grid from "@mui/material/Grid"; - -// Material Dashboard 2 PRO React TS components -import MDBox from "components/MDBox"; - -// Settings page components -import BaseLayout from "qqq/components/BaseLayout"; -import {useParams} from "react-router-dom"; -import EntityForm from "qqq/components/EntityForm"; import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData"; -import EntityList from "qqq/pages/entity-list"; +import Grid from "@mui/material/Grid"; +import {useParams} from "react-router-dom"; +import MDBox from "components/MDBox"; +import BaseLayout from "qqq/components/BaseLayout"; +import EntityForm from "qqq/components/EntityForm"; interface Props { diff --git a/src/qqq/pages/entity-list/index.tsx b/src/qqq/pages/entity-list/index.tsx index d184814..0d85039 100644 --- a/src/qqq/pages/entity-list/index.tsx +++ b/src/qqq/pages/entity-list/index.tsx @@ -19,68 +19,33 @@ * along with this program. If not, see . */ -import React, { - SyntheticEvent, - useCallback, - useEffect, useReducer, useRef, useState, -} from "react"; -import { - Link, useNavigate, useParams, useSearchParams, -} from "react-router-dom"; - -// @mui material components -import Card from "@mui/material/Card"; -import Icon from "@mui/material/Icon"; -import Menu from "@mui/material/Menu"; -import MenuItem from "@mui/material/MenuItem"; -import {Alert, Pagination, TablePagination} from "@mui/material"; -import { - DataGridPro, - GridCallbackDetails, - GridColDef, - GridColumnOrderChangeParams, - GridColumnVisibilityModel, - GridFilterModel, - GridRowId, - GridRowParams, - GridRowsProp, - GridSelectionModel, - GridSortItem, - GridSortModel, - GridToolbarColumnsButton, - GridToolbarContainer, - GridToolbarDensitySelector, - GridToolbarExportContainer, - GridToolbarFilterButton, - GridExportMenuItemProps, - MuiEvent, -} from "@mui/x-data-grid-pro"; - -// Material Dashboard 2 PRO React TS components -import DashboardLayout from "examples/LayoutContainers/DashboardLayout"; -import DashboardNavbar from "examples/Navbars/DashboardNavbar"; -import MDBox from "components/MDBox"; -import MDButton from "components/MDButton"; -import MDAlert from "components/MDAlert"; - -// QQQ +import {QFieldType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldType"; import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData"; import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData"; -import {QQueryFilter} from "@kingsrook/qqq-frontend-core/lib/model/query/QQueryFilter"; -import {QFilterOrderBy} from "@kingsrook/qqq-frontend-core/lib/model/query/QFilterOrderBy"; -import {QFilterCriteria} from "@kingsrook/qqq-frontend-core/lib/model/query/QFilterCriteria"; import {QCriteriaOperator} from "@kingsrook/qqq-frontend-core/lib/model/query/QCriteriaOperator"; -import {QFieldType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldType"; -import QClient from "qqq/utils/QClient"; -import Navbar from "qqq/components/Navbar"; +import {QFilterCriteria} from "@kingsrook/qqq-frontend-core/lib/model/query/QFilterCriteria"; +import {QFilterOrderBy} from "@kingsrook/qqq-frontend-core/lib/model/query/QFilterOrderBy"; +import {QQueryFilter} from "@kingsrook/qqq-frontend-core/lib/model/query/QQueryFilter"; +import {Alert, TablePagination} from "@mui/material"; import Button from "@mui/material/Button"; +import Card from "@mui/material/Card"; +import Icon from "@mui/material/Icon"; +import LinearProgress from "@mui/material/LinearProgress"; +import Menu from "@mui/material/Menu"; +import MenuItem from "@mui/material/MenuItem"; +import {DataGridPro, GridCallbackDetails, GridColDef, GridColumnOrderChangeParams, GridColumnVisibilityModel, GridFilterModel, GridRowId, GridRowParams, GridRowsProp, GridSelectionModel, GridSortItem, GridSortModel, GridToolbarColumnsButton, GridToolbarContainer, GridToolbarDensitySelector, GridToolbarExportContainer, GridToolbarFilterButton, GridExportMenuItemProps, MuiEvent,} from "@mui/x-data-grid-pro"; +import React, {useCallback, useEffect, useReducer, useRef, useState,} from "react"; +import {Link, useNavigate, useParams, useSearchParams,} from "react-router-dom"; +import MDAlert from "components/MDAlert"; +import MDBox from "components/MDBox"; +import DashboardLayout from "examples/LayoutContainers/DashboardLayout"; +import Navbar from "qqq/components/Navbar"; +import {QActionsMenuButton, QCreateNewButton} from "qqq/components/QButtons"; +import QClient from "qqq/utils/QClient"; +import QValueUtils from "qqq/utils/QValueUtils"; import Footer from "../../components/Footer"; import QProcessUtils from "../../utils/QProcessUtils"; - import "./styles.css"; -import {QActionsMenuButton, QCreateNewButton} from "qqq/components/QButtons"; -import QValueUtils from "qqq/utils/QValueUtils"; -import LinearProgress from "@mui/material/LinearProgress"; const COLUMN_VISIBILITY_LOCAL_STORAGE_KEY_ROOT = "qqq.columnVisibility"; const COLUMN_SORT_LOCAL_STORAGE_KEY_ROOT = "qqq.columnSort"; diff --git a/src/qqq/pages/entity-view/components/ViewContents/index.tsx b/src/qqq/pages/entity-view/components/ViewContents/index.tsx index 1fec934..9bb62a2 100644 --- a/src/qqq/pages/entity-view/components/ViewContents/index.tsx +++ b/src/qqq/pages/entity-view/components/ViewContents/index.tsx @@ -19,41 +19,34 @@ * along with this program. If not, see . */ -// react components -import {useLocation, useNavigate, useSearchParams} from "react-router-dom"; -import React, {useReducer, useState} from "react"; - -// @material-ui core components +import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData"; +import {QSection} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QSection"; +import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData"; +import {QRecord} from "@kingsrook/qqq-frontend-core/lib/model/QRecord"; +import Avatar from "@mui/material/Avatar"; +import Button from "@mui/material/Button"; import Card from "@mui/material/Card"; -import Grid from "@mui/material/Grid"; import Dialog from "@mui/material/Dialog"; -import DialogTitle from "@mui/material/DialogTitle"; +import DialogActions from "@mui/material/DialogActions"; import DialogContent from "@mui/material/DialogContent"; import DialogContentText from "@mui/material/DialogContentText"; -import DialogActions from "@mui/material/DialogActions"; -import Button from "@mui/material/Button"; - -// qqq imports -import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData"; - -// Material Dashboard 2 PRO React TS components -import MDBox from "components/MDBox"; -import MDTypography from "components/MDTypography"; +import DialogTitle from "@mui/material/DialogTitle"; +import Grid from "@mui/material/Grid"; +import Icon from "@mui/material/Icon"; import Menu from "@mui/material/Menu"; import MenuItem from "@mui/material/MenuItem"; -import MDAlert from "components/MDAlert"; -import QProcessUtils from "../../../../utils/QProcessUtils"; -import QClient from "qqq/utils/QClient"; -import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData"; -import {QActionsMenuButton, QDeleteButton, QEditButton} from "qqq/components/QButtons"; -import QValueUtils from "qqq/utils/QValueUtils"; -import {QRecord} from "@kingsrook/qqq-frontend-core/lib/model/QRecord"; -import Icon from "@mui/material/Icon"; -import Avatar from "@mui/material/Avatar"; -import QRecordSidebar from "qqq/components/QRecordSidebar"; -import QTableUtils from "qqq/utils/QTableUtils"; +import React, {useReducer, useState} from "react"; +import {useLocation, useNavigate, useSearchParams} from "react-router-dom"; import colors from "assets/theme/base/colors"; -import {QSection} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QSection"; +import MDAlert from "components/MDAlert"; +import MDBox from "components/MDBox"; +import MDTypography from "components/MDTypography"; +import {QActionsMenuButton, QDeleteButton, QEditButton} from "qqq/components/QButtons"; +import QRecordSidebar from "qqq/components/QRecordSidebar"; +import QClient from "qqq/utils/QClient"; +import QTableUtils from "qqq/utils/QTableUtils"; +import QValueUtils from "qqq/utils/QValueUtils"; +import QProcessUtils from "../../../../utils/QProcessUtils"; const qController = QClient.getInstance(); diff --git a/src/qqq/pages/entity-view/index.tsx b/src/qqq/pages/entity-view/index.tsx index b2ff022..6313079 100644 --- a/src/qqq/pages/entity-view/index.tsx +++ b/src/qqq/pages/entity-view/index.tsx @@ -19,19 +19,12 @@ * along with this program. If not, see . */ -import {useParams} from "react-router-dom"; - -// @mui material components +import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData"; import Grid from "@mui/material/Grid"; - -// Material Dashboard 2 PRO React TS components +import {useParams} from "react-router-dom"; import MDBox from "components/MDBox"; - -// Settings page components import BaseLayout from "qqq/components/BaseLayout"; import ViewContents from "./components/ViewContents"; -import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData"; -import EntityList from "qqq/pages/entity-list"; interface Props { diff --git a/src/qqq/pages/process-run/index.tsx b/src/qqq/pages/process-run/index.tsx index 8d3137f..c2d7964 100644 --- a/src/qqq/pages/process-run/index.tsx +++ b/src/qqq/pages/process-run/index.tsx @@ -19,46 +19,34 @@ * along with this program. If not, see . */ -import React, {useEffect, useState, Fragment} from "react"; - -// formik components -import {Form, Formik, useFormikContext} from "formik"; - -// @mui material components -import Grid from "@mui/material/Grid"; -import Card from "@mui/material/Card"; -import Stepper from "@mui/material/Stepper"; -import Step from "@mui/material/Step"; -import StepLabel from "@mui/material/StepLabel"; - -// Material Dashboard 2 PRO React TS components -import MDBox from "components/MDBox"; -import MDButton from "components/MDButton"; - -// Material Dashboard 2 PRO React TS examples components -import DashboardLayout from "examples/LayoutContainers/DashboardLayout"; - -import * as Yup from "yup"; +import {QComponentType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QComponentType"; import {QFieldMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldMetaData"; +import {QFrontendComponent} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFrontendComponent"; import {QFrontendStepMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFrontendStepMetaData"; -import {useLocation, useParams} from "react-router-dom"; -import DynamicFormUtils from "qqq/components/QDynamicForm/utils/DynamicFormUtils"; -import {QJobStarted} from "@kingsrook/qqq-frontend-core/lib/model/processes/QJobStarted"; +import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData"; import {QJobComplete} from "@kingsrook/qqq-frontend-core/lib/model/processes/QJobComplete"; import {QJobError} from "@kingsrook/qqq-frontend-core/lib/model/processes/QJobError"; import {QJobRunning} from "@kingsrook/qqq-frontend-core/lib/model/processes/QJobRunning"; -import {DataGridPro, GridColDef} from "@mui/x-data-grid-pro"; -import {QFrontendComponent} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFrontendComponent"; -import {QComponentType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QComponentType"; -import FormData from "form-data"; -import QClient from "qqq/utils/QClient"; +import {QJobStarted} from "@kingsrook/qqq-frontend-core/lib/model/processes/QJobStarted"; import {CircularProgress, TablePagination} from "@mui/material"; -import QDynamicForm from "../../components/QDynamicForm"; -import MDTypography from "../../../components/MDTypography"; -import Footer from "examples/Footer"; -import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData"; -import Navbar from "qqq/components/Navbar"; +import Card from "@mui/material/Card"; +import Grid from "@mui/material/Grid"; +import Step from "@mui/material/Step"; +import StepLabel from "@mui/material/StepLabel"; +import Stepper from "@mui/material/Stepper"; +import {DataGridPro, GridColDef} from "@mui/x-data-grid-pro"; +import FormData from "form-data"; +import {Form, Formik, useFormikContext} from "formik"; +import React, {useEffect, useState, Fragment} from "react"; +import {useLocation, useParams} from "react-router-dom"; +import * as Yup from "yup"; +import MDBox from "components/MDBox"; +import MDButton from "components/MDButton"; import BaseLayout from "qqq/components/BaseLayout"; +import DynamicFormUtils from "qqq/components/QDynamicForm/utils/DynamicFormUtils"; +import QClient from "qqq/utils/QClient"; +import MDTypography from "../../../components/MDTypography"; +import QDynamicForm from "../../components/QDynamicForm"; interface Props { diff --git a/src/qqq/utils/QClient.ts b/src/qqq/utils/QClient.ts index 960595d..f64ee93 100644 --- a/src/qqq/utils/QClient.ts +++ b/src/qqq/utils/QClient.ts @@ -19,9 +19,9 @@ * along with this program. If not, see . */ +import {useAuth0} from "@auth0/auth0-react"; import {QController} from "@kingsrook/qqq-frontend-core/lib/controllers/QController"; import {QException} from "@kingsrook/qqq-frontend-core/lib/exceptions/QException"; -import {useAuth0} from "@auth0/auth0-react"; /******************************************************************************* ** client wrapper of qqq backend diff --git a/src/qqq/utils/QProcessUtils.ts b/src/qqq/utils/QProcessUtils.ts index d706b65..c34a5a1 100644 --- a/src/qqq/utils/QProcessUtils.ts +++ b/src/qqq/utils/QProcessUtils.ts @@ -19,8 +19,8 @@ * along with this program. If not, see . */ -import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData"; import {QInstance} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QInstance"; +import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData"; /******************************************************************************* ** Utility class for working with QQQ Processes diff --git a/src/qqq/utils/QTableUtils.ts b/src/qqq/utils/QTableUtils.ts index d75cc73..ae828c6 100644 --- a/src/qqq/utils/QTableUtils.ts +++ b/src/qqq/utils/QTableUtils.ts @@ -19,8 +19,8 @@ * along with this program. If not, see . */ -import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData"; import {QSection} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QSection"; +import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData"; /******************************************************************************* ** Utility class for working with QQQ Tables diff --git a/src/qqq/utils/QValueUtils.ts b/src/qqq/utils/QValueUtils.ts index 00bdb87..56e5af4 100644 --- a/src/qqq/utils/QValueUtils.ts +++ b/src/qqq/utils/QValueUtils.ts @@ -20,8 +20,8 @@ */ import {QFieldMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldMetaData"; -import {QRecord} from "@kingsrook/qqq-frontend-core/lib/model/QRecord"; import {QFieldType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldType"; +import {QRecord} from "@kingsrook/qqq-frontend-core/lib/model/QRecord"; import "datejs";