SPRINT-17: added tablename in widgets

src/qqq/components/DashboardWidgets.tsx

@@ -31,6 +31,7 @@ import MDBadgeDot from "qqq/components/Temporary/MDBadgeDot";
 import MDBox from "qqq/components/Temporary/MDBox";
 import MDTypography from "qqq/components/Temporary/MDTypography";
 import BarChart from "qqq/pages/dashboards/Widgets/BarChart";
+import DividerWidget from "qqq/pages/dashboards/Widgets/Data/Divider";
 import DefaultLineChart from "qqq/pages/dashboards/Widgets/DefaultLineChart";
 import FieldValueListWidget from "qqq/pages/dashboards/Widgets/FieldValueListWidget";
 import HorizontalBarChart from "qqq/pages/dashboards/Widgets/HorizontalBarChart";
@@ -51,6 +52,7 @@ const qController = QClient.getInstance();
 interface Props
 {
    widgetMetaDataList: QWidgetMetaData[];
+   tableName?: string;
    entityPrimaryKey?: string;
    omitWrappingGridContainer: boolean;
    areChildren?: boolean
@@ -59,13 +61,14 @@ interface Props
 
 DashboardWidgets.defaultProps = {
    widgetMetaDataList: null,
+   tableName: null,
    entityPrimaryKey: null,
    omitWrappingGridContainer: false,
    areChildren: false,
    childUrlParams: ""
 };
 
-function DashboardWidgets({widgetMetaDataList, entityPrimaryKey, omitWrappingGridContainer, areChildren, childUrlParams}: Props): JSX.Element
+function DashboardWidgets({widgetMetaDataList, tableName, entityPrimaryKey, omitWrappingGridContainer, areChildren, childUrlParams}: Props): JSX.Element
 {
    const location = useLocation();
    const [qInstance, setQInstance] = useState(null as QInstance);
@@ -95,7 +98,8 @@ function DashboardWidgets({widgetMetaDataList, entityPrimaryKey, omitWrappingGri
          widgetData[i] = {};
          (async () =>
          {
-            widgetData[i] = await qController.widget(widgetMetaDataList[i].name, `id=${entityPrimaryKey}&${childUrlParams}`);
+            console.log(`widgets: ${getQueryParams(null)}`)
+            widgetData[i] = await qController.widget(widgetMetaDataList[i].name, getQueryParams(null));
             setWidgetCounter(widgetCounter + 1);
             forceUpdate();
          })();
@@ -112,11 +116,39 @@ function DashboardWidgets({widgetMetaDataList, entityPrimaryKey, omitWrappingGri
    {
       setTimeout(async () =>
       {
-         widgetData[index] = await qController.widget(widgetMetaDataList[index].name, `id=${entityPrimaryKey}&${data}`);
+         widgetData[index] = await qController.widget(widgetMetaDataList[index].name, getQueryParams(data));
          setWidgetCounter(widgetCounter + 1);
       }, 1);
    };
 
+   function getQueryParams(extraParams: string): string
+   {
+      let ampersand = "";
+      let params = "";
+      let foundParam = false;
+      if(entityPrimaryKey)
+      {
+         params += `${ampersand}id=${entityPrimaryKey}`;
+         ampersand = "&";
+      }
+      if(tableName)
+      {
+         params += `${ampersand}tableName=${tableName}`;
+         ampersand = "&";
+      }
+      if(extraParams)
+      {
+         params += `${ampersand}${extraParams}`;
+         ampersand = "&";
+      }
+      if(childUrlParams)
+      {
+         params += `${ampersand}${childUrlParams}`;
+      }
+
+      return params;
+   };
+
    const widgetCount = widgetMetaDataList ? widgetMetaDataList.length : 0;
 
    const renderWidget = (widgetMetaData: QWidgetMetaData, i: number): JSX.Element =>
@@ -127,6 +159,7 @@ function DashboardWidgets({widgetMetaDataList, entityPrimaryKey, omitWrappingGri
                widgetMetaData.type === "parentWidget" && (
                   <ParentWidget
                      entityPrimaryKey={entityPrimaryKey}
+                     tableName={tableName}
                      widgetIndex={i}
                      label={widgetMetaData.label}
                      data={widgetData[i]}
@@ -221,6 +254,13 @@ function DashboardWidgets({widgetMetaDataList, entityPrimaryKey, omitWrappingGri
                   />
                )
             }
+            {
+               widgetMetaData.type === "divider" && (
+                  <Box>
+                     <DividerWidget />
+                  </Box>
+               )
+            }
             {
                widgetMetaData.type === "horizontalBarChart" && (
                   widgetData && widgetData[i] && widgetData[i].chartData && (

src/qqq/pages/dashboards/Widgets/Data/Divider.tsx

@@ -0,0 +1,32 @@
+/*
+ * 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 <https://www.gnu.org/licenses/>.
+ */
+
+import Divider from "@mui/material/Divider";
+
+
+function DividerWidget(): JSX.Element
+{
+   return (
+      <Divider sx={{padding: "1px", background: "red"}}/>
+   );
+}
+
+export default DividerWidget;

src/qqq/pages/dashboards/Widgets/HorizontalBarChart.tsx

@@ -38,7 +38,7 @@ const options = {
    maintainAspectRatio: false,
    plugins: {
       legend: {
-         display: false,
+         display: true,
       },
       tooltip: {
          enabled: true,

src/qqq/pages/dashboards/Widgets/ParentWidget.tsx

@@ -42,6 +42,7 @@ export interface ParentWidgetData
       label: string
    }[][];
    childWidgetNameList: string[];
+   dropdownNeedsSelectedText?: string;
 }
 
 
@@ -55,11 +56,12 @@ interface Props
    data: ParentWidgetData;
    reloadWidgetCallback?: (widgetIndex: number, params: string) => void;
    entityPrimaryKey?: string;
+   tableName?: string;
 }
 
 
 const qController = QClient.getInstance();
-function ParentWidget({widgetIndex, label, data, reloadWidgetCallback, entityPrimaryKey}: Props, ): JSX.Element
+function ParentWidget({widgetIndex, label, data, reloadWidgetCallback, entityPrimaryKey, tableName}: Props, ): JSX.Element
 {
    const [childUrlParams, setChildUrlParams] = useState("");
    const [qInstance, setQInstance] = useState(null as QInstance);
@@ -86,15 +88,9 @@ function ParentWidget({widgetIndex, label, data, reloadWidgetCallback, entityPri
             widgetMetaDataList.push(qInstance.widgets.get(widgetName));
          })
          setWidgets(widgetMetaDataList);
-         console.log(`SETTINGWIDGETS...${widgetMetaDataList.length}`)
       }
    }, [qInstance, data]);
 
-   function doit()
-   {
-      reloadWidgetCallback(0, "ok");
-   }
-
    function handleDataChange(dropdownLabel: string, changedData: any)
    {
       if(dropdownData)
@@ -128,8 +124,6 @@ function ParentWidget({widgetIndex, label, data, reloadWidgetCallback, entityPri
    {
       if(dropdownData)
       {
-         console.log(JSON.stringify(data));
-
          let params = "";
          for (let i = 0; i < dropdownData.length; i++)
          {
@@ -144,7 +138,6 @@ function ParentWidget({widgetIndex, label, data, reloadWidgetCallback, entityPri
 
             }
          }
-         console.log(params);
          reloadWidgetCallback(widgetIndex, params);
          setChildUrlParams(params)
       }
@@ -173,7 +166,7 @@ function ParentWidget({widgetIndex, label, data, reloadWidgetCallback, entityPri
                         <DropdownMenu
                            key={`dropdown-${data.dropdownLabelList[index]}-${index}`}
                            label={`Select ${data.dropdownLabelList[index]}`}
-                           sx={{width: 200, marginLeft: "15px", float: "right"}}
+                           sx={{width: 250, marginLeft: "15px", float: "right"}}
                            dropdownOptions={dropdownData}
                            onChangeCallback={handleDataChange}
                         />
@@ -183,7 +176,17 @@ function ParentWidget({widgetIndex, label, data, reloadWidgetCallback, entityPri
             </Grid>
          </Grid>
          <Box pr={3} pl={3}>
-            <DashboardWidgets widgetMetaDataList={widgets} entityPrimaryKey={entityPrimaryKey} childUrlParams={childUrlParams} areChildren={true}/>
+            {
+               data?.dropdownNeedsSelectedText ? (
+                  <Box pb={3} sx={{width: "100%", textAlign: "right"}}>
+                     <Typography variant="body2">
+                        {data.dropdownNeedsSelectedText}
+                     </Typography>
+                  </Box>
+               ) :(
+                  <DashboardWidgets widgetMetaDataList={widgets} entityPrimaryKey={entityPrimaryKey} tableName={tableName} childUrlParams={childUrlParams} areChildren={true}/>
+               )
+            }
          </Box>
       </Card>
    );

src/qqq/pages/entity-view/EntityView.tsx

@@ -316,7 +316,7 @@ function EntityView({table, launchProcess}: Props): JSX.Element
                sectionFieldElements.set(section.name,
                   <Grid id={section.name} key={section.name} item lg={widgetMetaData.gridColumns ? widgetMetaData.gridColumns : 12} xs={12} sx={{display: "flex", alignItems: "stretch", flexGrow: 1, scrollMarginTop: "100px"}}>
                      <Box width="100%" flexGrow={1} alignItems="stretch">
-                        <DashboardWidgets key={section.name} widgetMetaDataList={[widgetMetaData]} entityPrimaryKey={record.values.get(tableMetaData.primaryKeyField)} omitWrappingGridContainer={true} />
+                        <DashboardWidgets key={section.name} tableName={tableMetaData.name} widgetMetaDataList={[widgetMetaData]} entityPrimaryKey={record.values.get(tableMetaData.primaryKeyField)} omitWrappingGridContainer={true} />
                      </Box>
                   </Grid>
                );