From 19a63d6956a16dd1e74d4299b96bfd0d0f673de5 Mon Sep 17 00:00:00 2001
From: Darin Kelkhoff <darin.kelkhoff@gmail.com>
Date: Tue, 14 Jan 2025 10:56:07 -0600
Subject: [PATCH 1/3] Read filterFieldName and columnsFieldName from widgetData

---
 .../misc/FilterAndColumnsSetupWidget.tsx       | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/qqq/components/widgets/misc/FilterAndColumnsSetupWidget.tsx b/src/qqq/components/widgets/misc/FilterAndColumnsSetupWidget.tsx
index 960c163..201b4bc 100644
--- a/src/qqq/components/widgets/misc/FilterAndColumnsSetupWidget.tsx
+++ b/src/qqq/components/widgets/misc/FilterAndColumnsSetupWidget.tsx
@@ -86,10 +86,13 @@ const qController = Client.getInstance();
 export default function FilterAndColumnsSetupWidget({isEditable, widgetMetaData, widgetData, recordValues, onSaveCallback}: FilterAndColumnsSetupWidgetProps): JSX.Element
 {
    const [modalOpen, setModalOpen] = useState(false);
-   const [hideColumns, setHideColumns] = useState(widgetData?.hideColumns);
-   const [hidePreview, setHidePreview] = useState(widgetData?.hidePreview);
+   const [hideColumns] = useState(widgetData?.hideColumns);
+   const [hidePreview] = useState(widgetData?.hidePreview);
    const [tableMetaData, setTableMetaData] = useState(null as QTableMetaData);
 
+   const [filterFieldName] = useState(widgetData?.filterFieldName ?? "queryFilterJson")
+   const [columnsFieldName] = useState(widgetData?.columnsFieldName ?? "columnsJson")
+
    const [alertContent, setAlertContent] = useState(null as string);
 
    //////////////////////////////////////////////////////////////////////////////////////////////////
@@ -108,7 +111,7 @@ export default function FilterAndColumnsSetupWidget({isEditable, widgetMetaData,
    /////////////////////////////
    let columns: QQueryColumns = null;
    let usingDefaultEmptyFilter = false;
-   let queryFilter = recordValues["queryFilterJson"] && JSON.parse(recordValues["queryFilterJson"]) as QQueryFilter;
+   let queryFilter = recordValues[filterFieldName] && JSON.parse(recordValues[filterFieldName]) as QQueryFilter;
    const defaultFilterFields = widgetData?.filterDefaultFieldNames;
    if (!queryFilter)
    {
@@ -142,9 +145,9 @@ export default function FilterAndColumnsSetupWidget({isEditable, widgetMetaData,
       });
    }
 
-   if (recordValues["columnsJson"])
+   if (recordValues[columnsFieldName])
    {
-      columns = QQueryColumns.buildFromJSON(recordValues["columnsJson"]);
+      columns = QQueryColumns.buildFromJSON(recordValues[columnsFieldName]);
    }
 
    //////////////////////////////////////////////////////////////////////
@@ -230,7 +233,10 @@ export default function FilterAndColumnsSetupWidget({isEditable, widgetMetaData,
       setFrontendQueryFilter(view.queryFilter);
       const filter = FilterUtils.prepQueryFilterForBackend(tableMetaData, view.queryFilter);
 
-      onSaveCallback({queryFilterJson: JSON.stringify(filter), columnsJson: JSON.stringify(view.queryColumns)});
+      const rs: {[key: string]: any} = {};
+      rs[filterFieldName] = JSON.stringify(filter);
+      rs[columnsFieldName] = JSON.stringify(view.queryColumns);
+      onSaveCallback(rs);
 
       closeEditor();
    }

From d65c1fb5d8b454d155dadde101db189953d4cb7f Mon Sep 17 00:00:00 2001
From: Darin Kelkhoff <darin.kelkhoff@gmail.com>
Date: Tue, 21 Jan 2025 12:12:03 -0600
Subject: [PATCH 2/3] Padding & margin adjustments for script viewer

---
 src/qqq/components/scripts/ScriptDocsForm.tsx      | 4 ++--
 src/qqq/components/widgets/misc/ScriptViewer.tsx   | 6 +++---
 src/qqq/pages/records/view/RecordDeveloperView.tsx | 2 +-
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/qqq/components/scripts/ScriptDocsForm.tsx b/src/qqq/components/scripts/ScriptDocsForm.tsx
index 8296997..1d4ba82 100644
--- a/src/qqq/components/scripts/ScriptDocsForm.tsx
+++ b/src/qqq/components/scripts/ScriptDocsForm.tsx
@@ -49,7 +49,7 @@ function ScriptDocsForm({helpText, exampleCode, aceEditorHeight}: Props): JSX.El
                <Card sx={{width: "100%", height: "100%"}}>
                   <Typography variant="h6" p={2} pb={1}>{heading}</Typography>
                   <Box className="devDocumentation" height="100%">
-                     <Typography variant="body2" sx={{maxWidth: "1200px", margin: "auto", height: "100%"}}>
+                     <Typography variant="body2" sx={{maxWidth: "1200px", margin: "auto", height: "calc(100% - 0.5rem)"}}>
                         <AceEditor
                            mode={mode}
                            theme="github"
@@ -62,7 +62,7 @@ function ScriptDocsForm({helpText, exampleCode, aceEditorHeight}: Props): JSX.El
                            width="100%"
                            showPrintMargin={false}
                            height="100%"
-                           style={{borderBottomRightRadius: "1rem", borderBottomLeftRadius: "1rem"}}
+                           style={{borderBottomRightRadius: "0.75rem", borderBottomLeftRadius: "0.75rem"}}
                         />
                      </Typography>
                   </Box>
diff --git a/src/qqq/components/widgets/misc/ScriptViewer.tsx b/src/qqq/components/widgets/misc/ScriptViewer.tsx
index e754d7c..4505466 100644
--- a/src/qqq/components/widgets/misc/ScriptViewer.tsx
+++ b/src/qqq/components/widgets/misc/ScriptViewer.tsx
@@ -393,7 +393,7 @@ export default function ScriptViewer({scriptId, associatedScriptTableName, assoc
    }
 
    return (
-      <Grid container className="scriptViewer" m={-2} pt={4} width={"calc(100% + 2rem)"}>
+      <Grid container className="scriptViewer" my={-3} mx={-3} pt={4} width={"calc(100% + 3rem)"}>
          <Grid item xs={12}>
             <Box>
                {
@@ -530,7 +530,7 @@ export default function ScriptViewer({scriptId, associatedScriptTableName, assoc
                                  </TabPanel>
 
                                  <TabPanel index={2} value={selectedTab}>
-                                    <Box sx={{height: "455px"}} px={2} pb={1}>
+                                    <Box sx={{height: "455px"}} px={2} pt={1}>
                                        <ScriptTestForm scriptId={scriptId}
                                           scriptType={scriptTypeRecord}
                                           tableName={associatedScriptTableName}
@@ -543,7 +543,7 @@ export default function ScriptViewer({scriptId, associatedScriptTableName, assoc
                                  </TabPanel>
 
                                  <TabPanel index={3} value={selectedTab}>
-                                    <Box sx={{height: "455px"}} px={2} pb={1}>
+                                    <Box sx={{height: "455px"}} px={2} pt={1}>
                                        <ScriptDocsForm helpText={scriptTypeRecord?.values.get("helpText")} exampleCode={scriptTypeRecord?.values.get("sampleCode")} />
                                     </Box>
                                  </TabPanel>
diff --git a/src/qqq/pages/records/view/RecordDeveloperView.tsx b/src/qqq/pages/records/view/RecordDeveloperView.tsx
index 0567542..647ac4e 100644
--- a/src/qqq/pages/records/view/RecordDeveloperView.tsx
+++ b/src/qqq/pages/records/view/RecordDeveloperView.tsx
@@ -191,7 +191,7 @@ function RecordDeveloperView({table}: Props): JSX.Element
                                                 <Card sx={{mb: 3}}>
                                                    <Typography variant="h6" p={2} pl={3} pb={3}>{field?.label}</Typography>
 
-                                                   <Box display="flex" alignItems="center" justifyContent="space-between" gap={2}>
+                                                   <Box display="flex" alignItems="center" justifyContent="space-between" gap={2} mx={3} mb={3} mt={0}>
                                                       {scriptId ?
                                                          <ScriptViewer
                                                             scriptId={scriptId}

From 5c3ddb7dec1b9cd4edcbde97020fda14bb802321 Mon Sep 17 00:00:00 2001
From: Darin Kelkhoff <darin.kelkhoff@gmail.com>
Date: Tue, 21 Jan 2025 12:18:21 -0600
Subject: [PATCH 3/3] Take label (e.g., of the field) as parameter

---
 src/qqq/components/forms/EntityForm.tsx       |  1 +
 .../misc/FilterAndColumnsSetupWidget.tsx      | 21 ++++++++++---------
 2 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/src/qqq/components/forms/EntityForm.tsx b/src/qqq/components/forms/EntityForm.tsx
index 1e08a00..bf41afd 100644
--- a/src/qqq/components/forms/EntityForm.tsx
+++ b/src/qqq/components/forms/EntityForm.tsx
@@ -407,6 +407,7 @@ function EntityForm(props: Props): JSX.Element
             widgetMetaData={widgetMetaData}
             widgetData={widgetData}
             recordValues={formValues}
+            label={tableMetaData?.fields.get(widgetData?.filterFieldName ?? "queryFilterJson")?.label}
             onSaveCallback={setFormFieldValuesFromWidget}
          />;
       }
diff --git a/src/qqq/components/widgets/misc/FilterAndColumnsSetupWidget.tsx b/src/qqq/components/widgets/misc/FilterAndColumnsSetupWidget.tsx
index 201b4bc..b58da82 100644
--- a/src/qqq/components/widgets/misc/FilterAndColumnsSetupWidget.tsx
+++ b/src/qqq/components/widgets/misc/FilterAndColumnsSetupWidget.tsx
@@ -46,11 +46,12 @@ import React, {useContext, useEffect, useRef, useState} from "react";
 
 interface FilterAndColumnsSetupWidgetProps
 {
-   isEditable: boolean;
-   widgetMetaData: QWidgetMetaData;
-   widgetData: any;
-   recordValues: { [name: string]: any };
-   onSaveCallback?: (values: { [name: string]: any }) => void;
+   isEditable: boolean,
+   widgetMetaData: QWidgetMetaData,
+   widgetData: any,
+   recordValues: { [name: string]: any },
+   onSaveCallback?: (values: { [name: string]: any }) => void,
+   label?: string
 }
 
 FilterAndColumnsSetupWidget.defaultProps = {
@@ -83,15 +84,15 @@ const qController = Client.getInstance();
 /*******************************************************************************
  ** Component for editing the main setup of a report - that is: filter & columns
  *******************************************************************************/
-export default function FilterAndColumnsSetupWidget({isEditable, widgetMetaData, widgetData, recordValues, onSaveCallback}: FilterAndColumnsSetupWidgetProps): JSX.Element
+export default function FilterAndColumnsSetupWidget({isEditable, widgetMetaData, widgetData, recordValues, onSaveCallback, label}: FilterAndColumnsSetupWidgetProps): JSX.Element
 {
    const [modalOpen, setModalOpen] = useState(false);
    const [hideColumns] = useState(widgetData?.hideColumns);
    const [hidePreview] = useState(widgetData?.hidePreview);
    const [tableMetaData, setTableMetaData] = useState(null as QTableMetaData);
 
-   const [filterFieldName] = useState(widgetData?.filterFieldName ?? "queryFilterJson")
-   const [columnsFieldName] = useState(widgetData?.columnsFieldName ?? "columnsJson")
+   const [filterFieldName] = useState(widgetData?.filterFieldName ?? "queryFilterJson");
+   const [columnsFieldName] = useState(widgetData?.columnsFieldName ?? "columnsJson");
 
    const [alertContent, setAlertContent] = useState(null as string);
 
@@ -233,7 +234,7 @@ export default function FilterAndColumnsSetupWidget({isEditable, widgetMetaData,
       setFrontendQueryFilter(view.queryFilter);
       const filter = FilterUtils.prepQueryFilterForBackend(tableMetaData, view.queryFilter);
 
-      const rs: {[key: string]: any} = {};
+      const rs: { [key: string]: any } = {};
       rs[filterFieldName] = JSON.stringify(filter);
       rs[columnsFieldName] = JSON.stringify(view.queryColumns);
       onSaveCallback(rs);
@@ -362,7 +363,7 @@ export default function FilterAndColumnsSetupWidget({isEditable, widgetMetaData,
          </Collapse>
          <Box pt="0.5rem">
             <Box display="flex" justifyContent="space-between" alignItems="center">
-               <h5>Query Filter</h5>
+               <h5>{label ?? "Query Filter"}</h5>
                <Box fontSize="0.75rem" fontWeight="700">{mayShowQuery() && getCurrentSortIndicator(frontendQueryFilter, tableMetaData, null)}</Box>
             </Box>
             {