CE-969: added basic support for 'too complex' subfilters

This commit is contained in:
Tim Chamberlain
2024-03-12 17:40:56 -05:00
parent 626ada3507
commit c36dfb5683
10 changed files with 4126 additions and 3378 deletions

View File

@ -28,8 +28,7 @@
},
"plugins": [
"react",
"@typescript-eslint",
"import"
"@typescript-eslint"
],
"rules": {
"brace-style": [
@ -43,41 +42,6 @@
"SwitchCase": 1
}
],
"import/extensions": [
"error",
"ignorePackages",
{
"ts": "never",
"tsx": "never",
"js": "never"
}
],
"import/no-extraneous-dependencies": [
"error",
{
"devDependencies": true
}
],
"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
}
}
],
"jsx-one-expression-per-line": "off",
"max-len": "off",
"no-console": "off",
@ -114,15 +78,6 @@
"quotes": [
"error",
"double"
],
"sort-imports": [
"error",
{
"ignoreCase": false,
"ignoreDeclarationSort": true,
"ignoreMemberSort": true,
"allowSeparatedGroups": false
}
]
},
"settings": {

6723
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -6,7 +6,7 @@
"@auth0/auth0-react": "1.10.2",
"@emotion/react": "11.7.1",
"@emotion/styled": "11.6.0",
"@kingsrook/qqq-frontend-core": "1.0.87",
"@kingsrook/qqq-frontend-core": "1.0.88",
"@mui/icons-material": "5.4.1",
"@mui/material": "5.11.1",
"@mui/styles": "5.11.1",

View File

@ -34,7 +34,7 @@ import ToggleButton from "@mui/material/ToggleButton";
import ToggleButtonGroup from "@mui/material/ToggleButtonGroup";
import Tooltip from "@mui/material/Tooltip";
import Typography from "@mui/material/Typography";
import React, {JSXElementConstructor, useContext, useEffect, useState} from "react";
import React, {useContext, useEffect, useState} from "react";
import QContext from "QContext";
import Client from "qqq/utils/qqq/Client";
import ValueUtils from "qqq/utils/qqq/ValueUtils";
@ -58,19 +58,19 @@ function AuditBody({tableMetaData, recordId, record}: Props): JSX.Element
const [limit, setLimit] = useState(1000);
const [statusString, setStatusString] = useState("Loading audits...");
const [auditsByDate, setAuditsByDate] = useState([] as QRecord[][]);
const [auditDetailMap, setAuditDetailMap] = useState(null as Map<number, JSX.Element[]>)
const [fieldChangeMap, setFieldChangeMap] = useState(null as Map<number, JSX.Element>)
const [auditDetailMap, setAuditDetailMap] = useState(null as Map<number, JSX.Element[]>);
const [fieldChangeMap, setFieldChangeMap] = useState(null as Map<number, JSX.Element>);
const [sortDirection, setSortDirection] = useState(localStorage.getItem("audit.sortDirection") === "true");
const {accentColor} = useContext(QContext);
function wrapValue(value: any): JSX.Element
{
return <span style={{fontWeight: "500", color: " rgb(123, 128, 154)"}}>{value}</span>
return <span style={{fontWeight: "500", color: " rgb(123, 128, 154)"}}>{value}</span>;
}
function wasValue(value: any): JSX.Element
{
return <span style={{fontWeight: "100", color: " rgb(123, 128, 154)"}}>{value}</span>
return <span style={{fontWeight: "100", color: " rgb(123, 128, 154)"}}>{value}</span>;
}
function getAuditDetailFieldChangeRow(qRecord: QRecord): JSX.Element | null
@ -81,8 +81,12 @@ function AuditBody({tableMetaData, recordId, record}: Props): JSX.Element
const newValue = qRecord.values.get("auditDetail.newValue");
if (fieldName && (oldValue !== null || newValue !== null))
{
const fieldLabel = tableMetaData?.fields?.get(fieldName)?.label ?? fieldName
return (<tr><td>{fieldLabel}</td><td>{oldValue}</td><td>{newValue}</td></tr>)
const fieldLabel = tableMetaData?.fields?.get(fieldName)?.label ?? fieldName;
return (<tr>
<td>{fieldLabel}</td>
<td>{oldValue}</td>
<td>{newValue}</td>
</tr>);
}
return (null);
}
@ -198,12 +202,12 @@ function AuditBody({tableMetaData, recordId, record}: Props): JSX.Element
new QFilterOrderBy("timestamp", sortDirection),
new QFilterOrderBy("id", sortDirection),
new QFilterOrderBy("auditDetail.id", true)
], "AND", 0, limit);
], null, "AND", 0, limit);
///////////////////////////////
// fetch audits in try-catch //
///////////////////////////////
let audits = [] as QRecord[]
let audits = [] as QRecord[];
try
{
audits = await qController.query("audit", filter, [new QueryJoin("auditDetail", true, "LEFT")]);
@ -233,7 +237,7 @@ function AuditBody({tableMetaData, recordId, record}: Props): JSX.Element
//////////////////////////////////////////////////////////////////////////////////////////////////////////
// group the audits by auditId (e.g., this is a list that joined audit & auditDetail, so un-flatten it) //
//////////////////////////////////////////////////////////////////////////////////////////////////////////
const unflattenedAudits: QRecord[] = []
const unflattenedAudits: QRecord[] = [];
const detailMap: Map<number, JSX.Element[]> = new Map();
const fieldChangeRowsMap: Map<number, JSX.Element[]> = new Map();
for (let i = 0; i < audits.length; i++)
@ -252,7 +256,7 @@ function AuditBody({tableMetaData, recordId, record}: Props): JSX.Element
detailMap.set(id, []);
}
detailMap.get(id).push(auditDetail)
detailMap.get(id).push(auditDetail);
}
// table version, probably not to commit
@ -288,11 +292,11 @@ function AuditBody({tableMetaData, recordId, record}: Props): JSX.Element
{fieldChangeRowsMap.get(id).map((row, key) => <React.Fragment key={key}>{row}</React.Fragment>)}
</tbody>
</table>
)
);
fieldChangeMap.set(id, fieldChangeTable);
}
}
setFieldChangeMap(fieldChangeMap)
setFieldChangeMap(fieldChangeMap);
//////////////////////////////
// group the audits by date //
@ -350,7 +354,7 @@ function AuditBody({tableMetaData, recordId, record}: Props): JSX.Element
const changeSortDirection = () =>
{
setAudits([]);
const newSortDirection = !sortDirection
const newSortDirection = !sortDirection;
setSortDirection(newSortDirection);
localStorage.setItem("audit.sortDirection", String(newSortDirection));
};

View File

@ -71,7 +71,7 @@ function hasGotoFieldNames(tableMetaData: QTableMetaData): boolean
function GotoRecordDialog(props: Props): JSX.Element
{
const fields: QFieldMetaData[] = []
const fields: QFieldMetaData[] = [];
let pkey = props?.tableMetaData?.fields.get(props?.tableMetaData?.primaryKeyField);
let addedPkey = false;
@ -108,7 +108,7 @@ function GotoRecordDialog(props: Props): JSX.Element
const rs = {} as { [field: string]: string };
fields.forEach((field) => rs[field.name] = "");
return (rs);
}
};
const [error, setError] = useState("");
const [values, setValues] = useState(makeInitialValues());
@ -118,14 +118,14 @@ function GotoRecordDialog(props: Props): JSX.Element
{
values[fieldName] = newValue;
setValues(JSON.parse(JSON.stringify(values)));
}
};
const close = () =>
{
setError("");
setValues(makeInitialValues());
props.closeHandler();
}
};
const keyPressed = (e: React.KeyboardEvent<HTMLDivElement>) =>
{
@ -144,7 +144,7 @@ function GotoRecordDialog(props: Props): JSX.Element
const index = targetId?.replaceAll("gotoInput-", "");
document.getElementById("gotoButton-" + index).click();
}
}
};
const closeRequested = () =>
{
@ -152,15 +152,15 @@ function GotoRecordDialog(props: Props): JSX.Element
{
close();
}
}
};
const goClicked = async (fieldName: string) =>
{
setError("");
const filter = new QQueryFilter([new QFilterCriteria(fieldName, QCriteriaOperator.EQUALS, [values[fieldName]])], null, "AND", null, 10);
const filter = new QQueryFilter([new QFilterCriteria(fieldName, QCriteriaOperator.EQUALS, [values[fieldName]])], null, null, "AND", null, 10);
try
{
const queryResult = await qController.query(props.tableMetaData.name, filter, null, props.tableVariant)
const queryResult = await qController.query(props.tableMetaData.name, filter, null, props.tableVariant);
if (queryResult.length == 0)
{
setError("Record not found.");
@ -183,13 +183,13 @@ function GotoRecordDialog(props: Props): JSX.Element
setError(`Error: ${(e && e.message) ? e.message : e}`);
setTimeout(() => setError(""), 6000);
}
}
};
if (props.tableMetaData)
{
if (fields.length == 0 && !error)
{
setError("This table is not configured for this feature.")
setError("This table is not configured for this feature.");
}
}
@ -244,7 +244,7 @@ function GotoRecordDialog(props: Props): JSX.Element
: <Box>&nbsp;</Box>
}
</Dialog>
)
);
}
interface GotoRecordButtonProps
@ -266,7 +266,7 @@ GotoRecordButton.defaultProps = {
export function GotoRecordButton(props: GotoRecordButtonProps): JSX.Element
{
const [gotoIsOpen, setGotoIsOpen] = useState(props.autoOpen)
const [gotoIsOpen, setGotoIsOpen] = useState(props.autoOpen);
function openGoto()
{

View File

@ -29,7 +29,7 @@ import {QCriteriaOperator} from "@kingsrook/qqq-frontend-core/lib/model/query/QC
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 {Badge, ToggleButton, ToggleButtonGroup} from "@mui/material";
import {ToggleButton} from "@mui/material";
import Box from "@mui/material/Box";
import Button from "@mui/material/Button";
import Dialog from "@mui/material/Dialog";
@ -38,9 +38,9 @@ import DialogContent from "@mui/material/DialogContent";
import DialogContentText from "@mui/material/DialogContentText";
import DialogTitle from "@mui/material/DialogTitle";
import Icon from "@mui/material/Icon";
import ToggleButtonGroup from "@mui/material/ToggleButtonGroup";
import Tooltip from "@mui/material/Tooltip";
import {GridApiPro} from "@mui/x-data-grid-pro/models/gridApiPro";
import React, {forwardRef, useContext, useImperativeHandle, useReducer, useState} from "react";
import QContext from "QContext";
import colors from "qqq/assets/theme/base/colors";
import {QCancelButton, QSaveButton} from "qqq/components/buttons/DefaultButtons";
@ -51,6 +51,7 @@ import QuickFilter, {quickFilterButtonStyles} from "qqq/components/query/QuickFi
import XIcon from "qqq/components/query/XIcon";
import FilterUtils from "qqq/utils/qqq/FilterUtils";
import TableUtils from "qqq/utils/qqq/TableUtils";
import React, {forwardRef, useContext, useImperativeHandle, useReducer, useState} from "react";
interface BasicAndAdvancedQueryControlsProps
{
@ -89,14 +90,14 @@ let debounceTimeout: string | number | NodeJS.Timeout;
*******************************************************************************/
const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryControlsProps, ref) =>
{
const {metaData, tableMetaData, savedViewsComponent, columnMenuComponent, quickFilterFieldNames, setQuickFilterFieldNames, setQueryFilter, queryFilter, gridApiRef, queryFilterJSON, mode, setMode} = props
const {metaData, tableMetaData, savedViewsComponent, columnMenuComponent, quickFilterFieldNames, setQuickFilterFieldNames, setQueryFilter, queryFilter, gridApiRef, queryFilterJSON, mode, setMode} = props;
/////////////////////
// state variables //
/////////////////////
const [defaultQuickFilterFieldNames, setDefaultQuickFilterFieldNames] = useState(getDefaultQuickFilterFieldNames(tableMetaData));
const [defaultQuickFilterFieldNameMap, setDefaultQuickFilterFieldNameMap] = useState(Object.fromEntries(defaultQuickFilterFieldNames.map(k => [k, true])));
const [addQuickFilterMenu, setAddQuickFilterMenu] = useState(null)
const [addQuickFilterMenu, setAddQuickFilterMenu] = useState(null);
const [addQuickFilterOpenCounter, setAddQuickFilterOpenCounter] = useState(0);
const [showClearFiltersWarning, setShowClearFiltersWarning] = useState(false);
const [mouseOverElement, setMouseOverElement] = useState(null as string);
@ -122,7 +123,7 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
{
return (mode);
}
}
};
});
@ -207,7 +208,7 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
if (found)
{
clearTimeout(debounceTimeout)
clearTimeout(debounceTimeout);
debounceTimeout = setTimeout(() =>
{
setQueryFilter(queryFilter);
@ -254,7 +255,7 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
*******************************************************************************/
const handleRemoveQuickFilterField = (fieldName: string): void =>
{
const index = quickFilterFieldNames.indexOf(fieldName)
const index = quickFilterFieldNames.indexOf(fieldName);
if (index >= 0)
{
//////////////////////////////////////
@ -276,7 +277,7 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
{
setAddQuickFilterMenu(event.currentTarget);
setAddQuickFilterOpenCounter(addQuickFilterOpenCounter + 1);
}
};
/*******************************************************************************
@ -285,7 +286,7 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
const closeAddQuickFilterMenu = () =>
{
setAddQuickFilterMenu(null);
}
};
/*******************************************************************************
@ -352,7 +353,7 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
}
addQuickFilterField({fieldName: fullFieldName}, "selectedFromAddFilterMenu");
}
};
/*******************************************************************************
@ -385,15 +386,16 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
{
queryFilter.criteria.splice(index, 1);
setQueryFilter(queryFilter);
}
};
/*******************************************************************************
** format the current query as a string for showing on-screen as a preview.
*******************************************************************************/
const queryToAdvancedString = () =>
const queryToAdvancedString = (thisQueryFilter: QQueryFilter, isSubFilter: boolean, subFilterOperator: string) =>
{
if(queryFilter == null || !queryFilter.criteria)
const {canFilterWorkAsBasic, canFilterWorkAsAdvanced} = FilterUtils.canFilterWorkAsBasic(tableMetaData, queryFilter);
if (thisQueryFilter == null || !thisQueryFilter.criteria)
{
return (<span></span>);
}
@ -402,7 +404,8 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
return (
<Box display="flex" flexWrap="wrap" fontSize="0.875rem">
{queryFilter.criteria.map((criteria, i) =>
{isSubFilter && (`${subFilterOperator} ( `)}
{thisQueryFilter.criteria.map((criteria, i) =>
{
const {criteriaIsValid} = validateCriteria(criteria, null);
if (criteriaIsValid)
@ -411,9 +414,12 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
return (
<span key={i} style={{marginBottom: "0.125rem"}} onMouseOver={() => handleMouseOverElement(`queryPreview-${i}`)} onMouseOut={() => handleMouseOutElement()}>
{counter > 1 ? <span style={{marginLeft: "0.25rem", marginRight: "0.25rem"}}>{queryFilter.booleanOperator}&nbsp;</span> : <span/>}
{counter > 1 ? <span style={{marginLeft: "0.25rem", marginRight: "0.25rem"}}>{thisQueryFilter.booleanOperator}&nbsp;</span> : <span />}
{FilterUtils.criteriaToHumanString(tableMetaData, criteria, true)}
{mouseOverElement == `queryPreview-${i}` && <span className={`advancedQueryPreviewX-${counter - 1}`}><XIcon position="forAdvancedQueryPreview" onClick={() => removeCriteriaByIndex(i)} /></span>}
{canFilterWorkAsAdvanced && (
mouseOverElement == `queryPreview-${i}` && <span className={`advancedQueryPreviewX-${counter - 1}`}>
<XIcon position="forAdvancedQueryPreview" onClick={() => removeCriteriaByIndex(i)} /></span>
)}
</span>
);
}
@ -422,6 +428,12 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
return (<span />);
}
})}
{thisQueryFilter.subFilters?.length > 0 && (thisQueryFilter.subFilters.map((filter: QQueryFilter, i) =>
{
return (queryToAdvancedString(filter, true, thisQueryFilter.booleanOperator));
}))}
{isSubFilter && (")")}
</Box>
);
};
@ -440,10 +452,15 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
// we're always allowed to go to advanced - //
// but if we're trying to go to basic, make sure the filter isn't too complex //
////////////////////////////////////////////////////////////////////////////////
const {canFilterWorkAsBasic} = FilterUtils.canFilterWorkAsBasic(tableMetaData, queryFilter);
const {canFilterWorkAsBasic, canFilterWorkAsAdvanced} = FilterUtils.canFilterWorkAsBasic(tableMetaData, queryFilter);
if (!canFilterWorkAsBasic)
{
console.log("Query cannot work as basic - so - not allowing toggle to basic.")
console.log("Query cannot work as basic - so - not allowing toggle to basic.");
return;
}
if (!canFilterWorkAsAdvanced)
{
console.log("Query cannot work as advanced - so - not allowing toggle to advanced.");
return;
}
@ -475,14 +492,21 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
return;
}
const {canFilterWorkAsBasic} = FilterUtils.canFilterWorkAsBasic(tableMetaData, queryFilter);
if (!canFilterWorkAsBasic)
const {canFilterWorkAsBasic, canFilterWorkAsAdvanced} = FilterUtils.canFilterWorkAsBasic(tableMetaData, queryFilter);
if (!canFilterWorkAsBasic && canFilterWorkAsAdvanced)
{
console.log("query is too complex for basic - so - switching to advanced");
modeToggleClicked("advanced");
forceUpdate();
return;
}
if (!canFilterWorkAsAdvanced)
{
console.log("query is too complex for advanced - so disabling buttons");
modeToggleClicked("tooComplex");
forceUpdate();
return;
}
const modeToUse = newMode ?? mode;
if (modeToUse == "basic")
@ -496,7 +520,7 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
}
}
}
}
};
/*******************************************************************************
@ -514,7 +538,7 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
}
}
return count;
}
};
/*******************************************************************************
@ -523,11 +547,11 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
const handleSetSort = (field: QFieldMetaData, table: QTableMetaData, isAscending: boolean = true): void =>
{
const fullFieldName = table && table.name != tableMetaData.name ? `${table.name}.${field.name}` : field.name;
queryFilter.orderBys = [new QFilterOrderBy(fullFieldName, isAscending)]
queryFilter.orderBys = [new QFilterOrderBy(fullFieldName, isAscending)];
setQueryFilter(queryFilter);
forceUpdate();
}
};
/*******************************************************************************
@ -546,7 +570,7 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
{
handleSetSort(field, table, isAscending);
}
}
};
/*******************************************************************************
@ -563,21 +587,21 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
}
catch (e)
{
console.log(`Error toggling sort: ${e}`)
console.log(`Error toggling sort: ${e}`);
}
}
/////////////////////////////////
// set up the sort menu button //
/////////////////////////////////
let sortButtonContents = <>Sort...</>
let sortButtonContents = <>Sort...</>;
if (queryFilter && queryFilter.orderBys && queryFilter.orderBys.length > 0)
{
const orderBy = queryFilter.orderBys[0];
const orderByFieldName = orderBy.fieldName;
const [field, fieldTable] = TableUtils.getFieldAndTable(tableMetaData, orderByFieldName);
const fieldLabel = fieldTable.name == tableMetaData.name ? field.label : `${fieldTable.label}: ${field.label}`;
sortButtonContents = <>Sort: {fieldLabel} <Icon onClick={toggleSortDirection} sx={{ml: "0.5rem"}}>{orderBy.isAscending ? "arrow_upward" : "arrow_downward"}</Icon></>
sortButtonContents = <>Sort: {fieldLabel} <Icon onClick={toggleSortDirection} sx={{ml: "0.5rem"}}>{orderBy.isAscending ? "arrow_upward" : "arrow_downward"}</Icon></>;
}
////////////////////////////////////////////////////////////////////////////////////////////////////////////
@ -594,16 +618,25 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
// set some status flags based on current filter //
///////////////////////////////////////////////////
const hasValidFilters = queryFilter && countValidCriteria(queryFilter) > 0;
const {canFilterWorkAsBasic, reasonsWhyItCannot} = FilterUtils.canFilterWorkAsBasic(tableMetaData, queryFilter);
const {canFilterWorkAsBasic, canFilterWorkAsAdvanced, reasonsWhyItCannot} = FilterUtils.canFilterWorkAsBasic(tableMetaData, queryFilter);
let reasonWhyBasicIsDisabled = null;
if(reasonsWhyItCannot && reasonsWhyItCannot.length > 0)
if (canFilterWorkAsAdvanced && reasonsWhyItCannot && reasonsWhyItCannot.length > 0)
{
reasonWhyBasicIsDisabled = <>
Your current Filter cannot be managed using Basic mode because:
<ul style={{marginLeft: "1rem"}}>
{reasonsWhyItCannot.map((reason, i) => <li key={i}>{reason}</li>)}
</ul>
</>
</>;
}
if (!canFilterWorkAsAdvanced && reasonsWhyItCannot && reasonsWhyItCannot.length > 0)
{
reasonWhyBasicIsDisabled = <>
Your current Filter is too complex to modify because:
<ul style={{marginLeft: "1rem"}}>
{reasonsWhyItCannot.map((reason, i) => <li key={i}>{reason}</li>)}
</ul>
</>;
}
const borderGray = colors.grayLines.main;
@ -646,7 +679,7 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
sx={{pl: 0.5, width: "10rem"}}
>
<ToggleButton value="basic" disabled={!canFilterWorkAsBasic}>Basic</ToggleButton>
<ToggleButton value="advanced">Advanced</ToggleButton>
<ToggleButton value="advanced" disabled={!canFilterWorkAsAdvanced}>Advanced</ToggleButton>
</ToggleButtonGroup>
</Tooltip>
</Box>
@ -722,9 +755,9 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
//////////////////////////////////////////////////////////////////////////////////////////////////////////////
// advanced mode - 2 rows - one for Filter Builder button & sort control, 2nd row for the filter-detail box //
//////////////////////////////////////////////////////////////////////////////////////////////////////////////
metaData && tableMetaData && mode == "advanced" &&
metaData && tableMetaData && (mode == "advanced" || mode == "tooComplex") &&
<Box borderRadius="0.75rem" border={`1px solid ${borderGray}`}>
<Box display="flex" justifyContent="space-between" alignItems="center">
{mode == "advanced" && (<Box display="flex" justifyContent="space-between" alignItems="center">
<Box p="0.5rem">
<Tooltip enterDelay={500} title="Build an advanced Filter" placement="top">
<>
@ -763,6 +796,7 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
{sortMenuComponent}
</Box>
</Box>
)}
<Box whiteSpace="nowrap" display="flex" flexShrink={1} flexGrow={1} alignItems="center">
{
<Box
@ -777,7 +811,7 @@ const BasicAndAdvancedQueryControls = forwardRef((props: BasicAndAdvancedQueryCo
pb={"0.125rem"}
boxShadow={"inset 0px 0px 4px 2px #EFEFED"}
>
{queryToAdvancedString()}
{queryToAdvancedString(queryFilter, false, null)}
</Box>
}
</Box>

View File

@ -25,14 +25,13 @@ import {QCriteriaOperator} from "@kingsrook/qqq-frontend-core/lib/model/query/QC
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 {Chip} from "@mui/material";
import Alert from "@mui/material/Alert";
import Avatar from "@mui/material/Avatar";
import Box from "@mui/material/Box";
import Button from "@mui/material/Button";
import Chip from "@mui/material/Chip";
import Divider from "@mui/material/Divider";
import Grid from "@mui/material/Grid";
import Icon from "@mui/material/Icon";
import List from "@mui/material/List";
import ListItem from "@mui/material/ListItem";
import ListItemAvatar from "@mui/material/ListItemAvatar";
@ -42,8 +41,6 @@ import Snackbar from "@mui/material/Snackbar";
import Tab from "@mui/material/Tab";
import Tabs from "@mui/material/Tabs";
import Typography from "@mui/material/Typography";
import React, {useReducer, useState} from "react";
import AceEditor from "react-ace";
import DataBagDataEditor, {DataBagDataEditorProps} from "qqq/components/databags/DataBagDataEditor";
import DataBagPreview from "qqq/components/databags/DataBagPreview";
import TabPanel from "qqq/components/misc/TabPanel";
@ -57,6 +54,8 @@ import "ace-builds/src-noconflict/mode-java";
import "ace-builds/src-noconflict/mode-javascript";
import "ace-builds/src-noconflict/mode-json";
import "ace-builds/src-noconflict/theme-github";
import React, {useReducer, useState} from "react";
import AceEditor from "react-ace";
import "ace-builds/src-noconflict/ext-language_tools";
const qController = Client.getInstance();
@ -64,12 +63,11 @@ const qController = Client.getInstance();
// Declaring props types for ViewForm
interface Props
{
dataBagId: number
dataBagId: number;
}
DataBagViewer.defaultProps =
{
};
{};
export default function DataBagViewer({dataBagId}: Props): JSX.Element
{
@ -82,7 +80,7 @@ export default function DataBagViewer({dataBagId}: Props): JSX.Element
const [selectedTab, setSelectedTab] = useState(0);
const [editorProps, setEditorProps] = useState(null as DataBagDataEditorProps);
const [successText, setSuccessText] = useState(null as string);
const [failText, setFailText] = useState(null as string)
const [failText, setFailText] = useState(null as string);
const [, forceUpdate] = useReducer((x) => x + 1, 0);
const [loadingSelectedVersion, _] = useState(new LoadingState(forceUpdate, "loading"));
@ -100,7 +98,7 @@ export default function DataBagViewer({dataBagId}: Props): JSX.Element
const criteria = [new QFilterCriteria("dataBagId", QCriteriaOperator.EQUALS, [dataBagId])];
const orderBys = [new QFilterOrderBy("sequenceNo", false)];
const filter = new QQueryFilter(criteria, orderBys, "AND", 0, 25);
const filter = new QQueryFilter(criteria, orderBys, null, "AND", 0, 25);
const versions = await qController.query("dataBagVersion", filter);
console.log("Fetched versions:");
console.log(versions);

View File

@ -46,9 +46,6 @@ import Snackbar from "@mui/material/Snackbar";
import Tab from "@mui/material/Tab";
import Tabs from "@mui/material/Tabs";
import Typography from "@mui/material/Typography";
import React, {useReducer, useState} from "react";
import AceEditor from "react-ace";
import {Link} from "react-router-dom";
import TabPanel from "qqq/components/misc/TabPanel";
import ScriptDocsForm from "qqq/components/scripts/ScriptDocsForm";
import ScriptEditor, {ScriptEditorProps} from "qqq/components/scripts/ScriptEditor";
@ -65,6 +62,9 @@ import "ace-builds/src-noconflict/mode-javascript";
import "ace-builds/src-noconflict/mode-velocity";
import "ace-builds/src-noconflict/mode-json";
import "ace-builds/src-noconflict/theme-github";
import React, {useReducer, useState} from "react";
import AceEditor from "react-ace";
import {Link} from "react-router-dom";
import "ace-builds/src-noconflict/ext-language_tools";
const qController = Client.getInstance();
@ -97,8 +97,8 @@ export default function ScriptViewer({scriptId, associatedScriptTableName, assoc
const [versionRecordList, setVersionRecordList] = useState(null as QRecord[]);
const [selectedVersionRecord, setSelectedVersionRecord] = useState(null as QRecord);
const [scriptLogs, setScriptLogs] = useState({} as any);
const [scriptTypeRecord, setScriptTypeRecord] = useState(null as QRecord)
const [scriptTypeFileSchemaList, setScriptTypeFileSchemaList] = useState(null as QRecord[])
const [scriptTypeRecord, setScriptTypeRecord] = useState(null as QRecord);
const [scriptTypeFileSchemaList, setScriptTypeFileSchemaList] = useState(null as QRecord[]);
const [availableFileNames, setAvailableFileNames] = useState([] as string[]);
const [selectedFileName, setSelectedFileName] = useState("");
const [currentVersionId, setCurrentVersionId] = useState(null as number);
@ -106,7 +106,7 @@ export default function ScriptViewer({scriptId, associatedScriptTableName, assoc
const [selectedTab, setSelectedTab] = useState(0);
const [editorProps, setEditorProps] = useState(null as ScriptEditorProps);
const [successText, setSuccessText] = useState(null as string);
const [failText, setFailText] = useState(null as string)
const [failText, setFailText] = useState(null as string);
const [, forceUpdate] = useReducer((x) => x + 1, 0);
const [loadingSelectedVersion, _] = useState(new LoadingState(forceUpdate, "loading"));
@ -135,7 +135,7 @@ export default function ScriptViewer({scriptId, associatedScriptTableName, assoc
}
else if (fileMode == 2) // MULTI_PRE_DEFINED
{
const filter = new QQueryFilter([new QFilterCriteria("scriptTypeId", QCriteriaOperator.EQUALS, [scriptRecord.values.get("scriptTypeId")])], [new QFilterOrderBy("id")])
const filter = new QQueryFilter([new QFilterCriteria("scriptTypeId", QCriteriaOperator.EQUALS, [scriptRecord.values.get("scriptTypeId")])], [new QFilterOrderBy("id")]);
scriptTypeFileSchemaList = await qController.query("scriptTypeFileSchema", filter);
}
else // MULTI AD_HOC
@ -147,14 +147,14 @@ export default function ScriptViewer({scriptId, associatedScriptTableName, assoc
setScriptTypeFileSchemaList(scriptTypeFileSchemaList);
if (scriptTypeFileSchemaList)
{
const availableFileNames = scriptTypeFileSchemaList.map((fileSchemaRecord) => fileSchemaRecord.values.get("name"))
const availableFileNames = scriptTypeFileSchemaList.map((fileSchemaRecord) => fileSchemaRecord.values.get("name"));
setAvailableFileNames(availableFileNames);
setSelectedFileName(availableFileNames[0])
setSelectedFileName(availableFileNames[0]);
}
const criteria = [new QFilterCriteria("scriptId", QCriteriaOperator.EQUALS, [scriptId])];
const orderBys = [new QFilterOrderBy("sequenceNo", false)];
const filter = new QQueryFilter(criteria, orderBys, "AND", 0, 25);
const filter = new QQueryFilter(criteria, orderBys, null, "AND", 0, 25);
const versions = await qController.query("scriptRevision", filter);
console.log("Fetched versions:");
console.log(versions);
@ -253,12 +253,12 @@ export default function ScriptViewer({scriptId, associatedScriptTableName, assoc
const handleSelectFile = (event: SelectChangeEvent) =>
{
setSelectedFileName(event.target.value);
}
};
const getSelectedFileCode = (): string =>
{
return (getSelectedVersionCode()[selectedFileName] ?? "");
}
};
const getSelectedFileType = (): string =>
{
@ -272,12 +272,12 @@ export default function ScriptViewer({scriptId, associatedScriptTableName, assoc
}
return ("javascript"); // have some default...
}
};
const getSelectedVersionCode = (): { [name: string]: string } =>
{
let rs: {[name: string]: string} = {}
let files = selectedVersionRecord?.associatedRecords?.get("files")
let rs: { [name: string]: string } = {};
let files = selectedVersionRecord?.associatedRecords?.get("files");
for (let j = 0; j < files?.length; j++)
{
@ -286,7 +286,7 @@ export default function ScriptViewer({scriptId, associatedScriptTableName, assoc
}
return (rs);
}
};
function getVersionsList(versionRecordList: QRecord[], selectedVersionRecord: QRecord)
{
@ -348,7 +348,7 @@ export default function ScriptViewer({scriptId, associatedScriptTableName, assoc
{
(async () =>
{
let filter = new QQueryFilter([new QFilterCriteria("scriptRevisionId", QCriteriaOperator.EQUALS, [scriptRevisionId])], [new QFilterOrderBy("id", false)], "AND", 0, 100);
let filter = new QQueryFilter([new QFilterCriteria("scriptRevisionId", QCriteriaOperator.EQUALS, [scriptRevisionId])], [new QFilterOrderBy("id", false)], null, "AND", 0, 100);
scriptLogs[scriptRevisionId] = await qController.query("scriptLog", filter);
setScriptLogs(scriptLogs);
forceUpdate();
@ -368,7 +368,7 @@ export default function ScriptViewer({scriptId, associatedScriptTableName, assoc
}
return (<ScriptLogsView logs={logs} />);
}
};
let editButtonTooltip = "";
let editButtonText = "Create New Version";

View File

@ -44,11 +44,9 @@ import LinearProgress from "@mui/material/LinearProgress";
import MenuItem from "@mui/material/MenuItem";
import Modal from "@mui/material/Modal";
import Tooltip from "@mui/material/Tooltip";
import {ColumnHeaderFilterIconButtonProps, DataGridPro, GridCallbackDetails, GridColDef, GridColumnHeaderParams, GridColumnMenuContainer, GridColumnMenuProps, GridColumnOrderChangeParams, GridColumnPinningMenuItems, GridColumnResizeParams, GridColumnsMenuItem, GridColumnVisibilityModel, GridDensity, GridEventListener, GridFilterMenuItem, GridPinnedColumns, gridPreferencePanelStateSelector, GridPreferencePanelsValue, GridRowId, GridRowParams, GridRowsProp, GridSelectionModel, GridSortItem, GridSortModel, GridState, GridToolbarColumnsButton, GridToolbarContainer, GridToolbarDensitySelector, GridToolbarExportContainer, HideGridColMenuItem, MuiEvent, SortGridMenuItems, useGridApiContext, useGridApiEventHandler, useGridApiRef, useGridSelector} from "@mui/x-data-grid-pro";
import {ColumnHeaderFilterIconButtonProps, DataGridPro, GridCallbackDetails, GridColDef, GridColumnHeaderParams, GridColumnMenuContainer, GridColumnMenuProps, GridColumnOrderChangeParams, GridColumnPinningMenuItems, GridColumnResizeParams, GridColumnVisibilityModel, GridDensity, GridEventListener, GridPinnedColumns, gridPreferencePanelStateSelector, GridPreferencePanelsValue, GridRowId, GridRowParams, GridRowsProp, GridSelectionModel, GridSortItem, GridSortModel, GridState, GridToolbarContainer, GridToolbarDensitySelector, HideGridColMenuItem, MuiEvent, SortGridMenuItems, useGridApiContext, useGridApiEventHandler, useGridApiRef, useGridSelector} from "@mui/x-data-grid-pro";
import {GridRowModel} from "@mui/x-data-grid/models/gridRows";
import FormData from "form-data";
import React, {forwardRef, useContext, useEffect, useReducer, useRef, useState} from "react";
import {useLocation, useNavigate, useSearchParams} from "react-router-dom";
import QContext from "QContext";
import colors from "qqq/assets/theme/base/colors";
import {QCancelButton, QCreateNewButton} from "qqq/components/buttons/DefaultButtons";
@ -78,6 +76,8 @@ import ProcessUtils from "qqq/utils/qqq/ProcessUtils";
import {SavedViewUtils} from "qqq/utils/qqq/SavedViewUtils";
import TableUtils from "qqq/utils/qqq/TableUtils";
import ValueUtils from "qqq/utils/qqq/ValueUtils";
import React, {forwardRef, useContext, useEffect, useReducer, useRef, useState} from "react";
import {useLocation, useNavigate, useSearchParams} from "react-router-dom";
const CURRENT_SAVED_VIEW_ID_LOCAL_STORAGE_KEY_ROOT = "qqq.currentSavedViewId";
const DENSITY_LOCAL_STORAGE_KEY_ROOT = "qqq.density";
@ -112,7 +112,7 @@ const getLoadingScreen = () =>
return (<BaseLayout>
&nbsp;
</BaseLayout>);
}
};
/*******************************************************************************
@ -246,7 +246,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// state of the page - e.g., have we loaded meta data? what about the initial view? or are we ready to render records. //
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
const [pageState, setPageState] = useState("initial" as PageState)
const [pageState, setPageState] = useState("initial" as PageState);
/////////////////////////////////
// meta-data and derived state //
@ -260,8 +260,8 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
///////////////////////////////////////////
// state of the view of the query screen //
///////////////////////////////////////////
const [view, setView] = useState(defaultView)
const [viewAsJson, setViewAsJson] = useState(JSON.stringify(defaultView))
const [view, setView] = useState(defaultView);
const [viewAsJson, setViewAsJson] = useState(JSON.stringify(defaultView));
const [queryFilter, setQueryFilter] = useState(defaultView.queryFilter);
const [queryColumns, setQueryColumns] = useState(defaultView.queryColumns);
const [lastFetchedQFilterJSON, setLastFetchedQFilterJSON] = useState("");
@ -309,7 +309,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
/////////////////////////////////////////
const [columnStatsFieldName, setColumnStatsFieldName] = useState(null as string);
const [columnStatsField, setColumnStatsField] = useState(null as QFieldMetaData);
const [columnStatsFieldTableName, setColumnStatsFieldTableName] = useState(null as string)
const [columnStatsFieldTableName, setColumnStatsFieldTableName] = useState(null as string);
const [filterForColumnStats, setFilterForColumnStats] = useState(null as QQueryFilter);
///////////////////////////////////////////////////
@ -353,14 +353,14 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
///////////////////////////////////////////////////////////////////////////////////////////
// add a LoadingState object, in case the initial loads (of meta data and view) are slow //
///////////////////////////////////////////////////////////////////////////////////////////
const [pageLoadingState, _] = useState(new LoadingState(forceUpdate))
const [pageLoadingState, _] = useState(new LoadingState(forceUpdate));
if (isFirstRenderAfterChangingTables)
{
setIsFirstRenderAfterChangingTables(false);
console.log("This is the first render after changing tables - so - setting state based on 'defaults' from localStorage");
setView(defaultView)
setView(defaultView);
}
/*******************************************************************************
@ -415,7 +415,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
}
}
return (false);
}
};
/*******************************************************************************
@ -423,7 +423,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
*******************************************************************************/
const prepQueryFilterForBackend = (sourceFilter: QQueryFilter) =>
{
const filterForBackend = new QQueryFilter([], sourceFilter.orderBys, sourceFilter.booleanOperator);
const filterForBackend = new QQueryFilter([], sourceFilter.orderBys, sourceFilter.subFilters, sourceFilter.booleanOperator);
for (let i = 0; i < sourceFilter?.criteria?.length; i++)
{
const criteria = sourceFilter.criteria[i];
@ -442,7 +442,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
///////////////////////////////////////////////////////////////////////////////////////////////////////////////
// else push a clone of the criteria - since it may get manipulated below (convertFilterPossibleValuesToIds) //
///////////////////////////////////////////////////////////////////////////////////////////////////////////////
const [field] = FilterUtils.getField(tableMetaData, criteria.fieldName)
const [field] = FilterUtils.getField(tableMetaData, criteria.fieldName);
filterForBackend.criteria.push(new QFilterCriteria(criteria.fieldName, criteria.operator, FilterUtils.cleanseCriteriaValueForQQQ(criteria.values, field)));
}
}
@ -451,7 +451,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
filterForBackend.limit = rowsPerPage;
return filterForBackend;
}
};
/*******************************************************************************
@ -475,7 +475,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
///////////////////////////////////////////
// build the export menu, for the header //
///////////////////////////////////////////
let exportMenu = <></>
let exportMenu = <></>;
try
{
const exportMenuItemRestProps =
@ -485,7 +485,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
columnsModel: columnsModel,
columnVisibilityModel: columnVisibilityModel,
queryFilter: prepQueryFilterForBackend(queryFilter)
}
};
exportMenu = (<>
<IconButton sx={{p: 0, fontSize: "0.75rem", mb: 1, color: colors.secondary.main, fontVariationSettings: "'wght' 100"}} onClick={openExportMenu}><Icon fontSize="small">save_alt</Icon></IconButton>
@ -552,7 +552,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
<ul style={{marginLeft: "1rem"}}>
{joinLabels.map((name) => <li key={name}>{name}</li>)}
</ul>
</div>
</div>;
return (
<div>
@ -586,7 +586,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
</Tooltip>
</Typography>
);
}
};
///////////////////////
// Keyboard handling //
@ -602,12 +602,12 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
{
if (!e.metaKey && e.key === "n" && table.capabilities.has(Capability.TABLE_INSERT) && table.insertPermission)
{
e.preventDefault()
e.preventDefault();
navigate(`${metaData?.getTablePathByName(tableName)}/create`);
}
else if (!e.metaKey && e.key === "r")
{
e.preventDefault()
e.preventDefault();
updateTable("'r' keyboard event");
}
/*
@ -620,23 +620,23 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
*/
else if (!e.metaKey && e.key === "f")
{
e.preventDefault()
e.preventDefault();
// @ts-ignore
if (basicAndAdvancedQueryControlsRef?.current?.getCurrentMode() == "advanced")
{
gridApiRef.current.showFilterPanel()
}
gridApiRef.current.showFilterPanel();
}
}
}
};
document.addEventListener("keydown", down)
document.addEventListener("keydown", down);
return () =>
{
document.removeEventListener("keydown", down)
}
}, [dotMenuOpen, keyboardHelpOpen, metaData, activeModalProcess])
document.removeEventListener("keydown", down);
};
}, [dotMenuOpen, keyboardHelpOpen, metaData, activeModalProcess]);
/*******************************************************************************
@ -645,7 +645,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
const urlLooksLikeProcess = (): boolean =>
{
return (pathParts[pathParts.length - 2] === tableName);
}
};
//////////////////////////////////////////////////////////////////////////////////////////////
// monitor location changes - if our url looks like a savedView, then load that view, kinda //
@ -703,7 +703,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
setView(view);
setViewAsJson(JSON.stringify(view));
localStorage.setItem(viewLocalStorageKey, JSON.stringify(view));
}
};
/*******************************************************************************
@ -712,10 +712,10 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
const handleColumnVisibilityChange = (columnVisibilityModel: GridColumnVisibilityModel) =>
{
setColumnVisibilityModel(columnVisibilityModel);
queryColumns.updateVisibility(columnVisibilityModel)
queryColumns.updateVisibility(columnVisibilityModel);
view.queryColumns = queryColumns;
doSetView(view)
doSetView(view);
forceUpdate();
};
@ -735,7 +735,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
fieldName = `${table.name}.${field.name}`;
}
view.queryColumns.setIsVisible(fieldName, newValue)
view.queryColumns.setIsVisible(fieldName, newValue);
/////////////////////
// update the grid //
@ -745,13 +745,13 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
/////////////////////////////////////////////////
// update the view (e.g., write local storage) //
/////////////////////////////////////////////////
doSetView(view)
doSetView(view);
///////////////////
// ole' faithful //
///////////////////
forceUpdate();
}
};
/*******************************************************************************
@ -790,7 +790,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
setPinnedColumns(queryColumns.toGridPinnedColumns());
setColumnVisibilityModel(queryColumns.toColumnVisibilityModel());
setColumnsModel(columns);
}
};
/*******************************************************************************
@ -799,7 +799,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
const promptForTableVariantSelection = () =>
{
setTableVariantPromptOpen(true);
}
};
/*******************************************************************************
@ -826,7 +826,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
}
return (rs);
}
};
/*******************************************************************************
@ -1055,7 +1055,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
setRowsPerPage(size);
view.rowsPerPage = size;
doSetView(view)
doSetView(view);
};
/*******************************************************************************
@ -1064,11 +1064,11 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
const handlePinnedColumnsChange = (pinnedColumns: GridPinnedColumns) =>
{
setPinnedColumns(pinnedColumns);
queryColumns.setPinnedLeftColumns(pinnedColumns.left)
queryColumns.setPinnedRightColumns(pinnedColumns.right)
queryColumns.setPinnedLeftColumns(pinnedColumns.left);
queryColumns.setPinnedRightColumns(pinnedColumns.right);
view.queryColumns = queryColumns;
doSetView(view)
doSetView(view);
};
/*******************************************************************************
@ -1121,7 +1121,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
let selectedPrimaryKeys = new Set<string>();
selectionModel.forEach((value: GridRowId, index: number) =>
{
checkboxesChecked++
checkboxesChecked++;
const valueToPush = latestQueryResults[value as number].values.get(tableMetaData.primaryKeyField);
selectedPrimaryKeys.add(valueToPush as string);
});
@ -1150,7 +1150,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
queryColumns.updateColumnOrder(columnOrdering);
view.queryColumns = queryColumns;
doSetView(view)
doSetView(view);
};
@ -1162,7 +1162,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
queryColumns.updateColumnWidth(params.colDef.field, params.width);
view.queryColumns = queryColumns;
doSetView(view)
doSetView(view);
};
@ -1185,7 +1185,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
{
const fieldName = gridSort[i].field;
const isAscending = gridSort[i].sort == "asc";
queryFilter.orderBys.push(new QFilterOrderBy(fieldName, isAscending))
queryFilter.orderBys.push(new QFilterOrderBy(fieldName, isAscending));
}
//////////////////////////////////////////////////////////
@ -1209,7 +1209,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
const handleColumnHeaderClick = (params: GridColumnHeaderParams, event: MuiEvent, details: GridCallbackDetails): void =>
{
event.defaultMuiPrevented = true;
}
};
/*******************************************************************************
@ -1227,7 +1227,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
setRowsPerPage(view.rowsPerPage ?? defaultRowsPerPage);
setMode(view.mode ?? defaultMode);
setQuickFilterFieldNames(view.quickFilterFieldNames ?? []) // todo not i think ?? getDefaultQuickFilterFieldNames(tableMetaData));
setQuickFilterFieldNames(view.quickFilterFieldNames ?? []); // todo not i think ?? getDefaultQuickFilterFieldNames(tableMetaData));
//////////////////////////////////////////////////////////////////////////////////////////////////
// do this last - in case anything in the view got modified in any of those other doSet methods //
@ -1240,7 +1240,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
///////////////////////////////////////////////////////////////////////////////////////////////////////
// @ts-ignore
setTimeout(() => basicAndAdvancedQueryControlsRef?.current?.ensureAllFilterCriteriaAreActiveQuickFilters(view.queryFilter, "activatedView"));
}
};
/*******************************************************************************
@ -1287,14 +1287,14 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
if (!isFromActivateView)
{
view.queryFilter = queryFilter;
doSetView(view)
doSetView(view);
}
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// this force-update causes a re-render that'll see the changed filter hash/json string, and make an updateTable run (if appropriate) //
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
forceUpdate();
}
};
/*******************************************************************************
** Wrapper around setQueryColumns that also sets column models for the grid, puts
@ -1327,9 +1327,9 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
if (!isFromActivateView)
{
view.queryColumns = queryColumns;
doSetView(view)
}
doSetView(view);
}
};
/*******************************************************************************
@ -1341,7 +1341,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
setQuickFilterFieldNames([...(names ?? [])]);
view.quickFilterFieldNames = names;
doSetView(view)
doSetView(view);
};
@ -1354,7 +1354,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
view.mode = newValue;
doSetView(view);
}
};
/*******************************************************************************
@ -1372,7 +1372,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
}
return (selectedIds.length);
}
};
/*******************************************************************************
@ -1403,7 +1403,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
}
return "";
}
};
/*******************************************************************************
@ -1568,7 +1568,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
setCurrentSavedView(savedViewRecord);
const viewJson = savedViewRecord.values.get("viewJson")
const viewJson = savedViewRecord.values.get("viewJson");
const newView = RecordQueryView.buildFromJSON(viewJson);
activateView(newView);
@ -1577,7 +1577,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
// todo can/should/does this move into the view's "identity"? //
////////////////////////////////////////////////////////////////
localStorage.setItem(currentSavedViewLocalStorageKey, `${savedViewRecord.values.get("id")}`);
}
};
/*******************************************************************************
@ -1587,7 +1587,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
{
setCurrentSavedView(null);
localStorage.removeItem(currentSavedViewLocalStorageKey);
}
};
/*******************************************************************************
@ -1603,7 +1603,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
newDefaultView.quickFilterFieldNames = [];
newDefaultView.mode = defaultMode;
return newDefaultView;
}
};
/*******************************************************************************
** event handler for SavedViews component, to handle user selecting a view
@ -1638,9 +1638,9 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
///////////////////////////////////////////////
// activate a new default view for the table //
///////////////////////////////////////////////
activateView(buildTableDefaultView(tableMetaData))
}
activateView(buildTableDefaultView(tableMetaData));
}
};
/*******************************************************************************
** utility function to fetch a saved view from the backend.
@ -1668,7 +1668,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
// such as, making values be what they'd be in the UI (not necessarily //
// what they're like in the backend); similarly, set anything that's unset. //
//////////////////////////////////////////////////////////////////////////////
const viewJson = qRecord.values.get("viewJson")
const viewJson = qRecord.values.get("viewJson");
const newView = RecordQueryView.buildFromJSON(viewJson);
setWarningAlert(null);
@ -1689,11 +1689,11 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
newView.queryColumns = QQueryColumns.buildDefaultForTable(tableMetaData);
}
qRecord.values.set("viewJson", JSON.stringify(newView))
qRecord.values.set("viewJson", JSON.stringify(newView));
}
return (qRecord);
}
};
/*******************************************************************************
@ -1798,7 +1798,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
const plural = removedFieldCount > 1;
setWarningAlert(`${removedFieldCount} field${plural ? "s" : ""} that ${plural ? "were" : "was"} part of this view ${plural ? "are" : "is"} no longer in this table, and ${plural ? "were" : "was"} removed from this view (${[...removedFieldNames.values()].join(", ")}).`);
}
}
};
/*******************************************************************************
@ -1834,8 +1834,8 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
///////////////////////////
// open the filter panel //
///////////////////////////
gridApiRef.current.showPreferences(GridPreferencePanelsValue.filters)
}
gridApiRef.current.showPreferences(GridPreferencePanelsValue.filters);
};
/*******************************************************************************
@ -2006,7 +2006,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
}
else
{
gridApiRef.current.showPreferences(GridPreferencePanelsValue.filters)
gridApiRef.current.showPreferences(GridPreferencePanelsValue.filters);
}
event.stopPropagation();
@ -2116,7 +2116,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
// this page //
///////////////
programmaticallySelectSomeOrAllRows();
setSelectFullFilterState("checked")
setSelectFullFilterState("checked");
}
else if (selectedIndex == 1)
{
@ -2124,7 +2124,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
// full query result //
///////////////////////
programmaticallySelectSomeOrAllRows();
setSelectFullFilterState("filter")
setSelectFullFilterState("filter");
}
else if (selectedIndex == 2)
{
@ -2138,7 +2138,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
/////////////////////
// clear selection //
/////////////////////
setSelectFullFilterState("n/a")
setSelectFullFilterState("n/a");
setRowSelectionModel([]);
setSelectedIds([]);
}
@ -2166,7 +2166,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
{
programmaticallySelectSomeOrAllRows(value);
setSelectionSubsetSize(value);
setSelectFullFilterState("filterSubset")
setSelectFullFilterState("filterSubset");
}
else
{
@ -2453,7 +2453,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
// so the useEffect that monitors location will see the change, and will set viewIdInLocation //
// so upon a re-render we'll hit this block again. //
/////////////////////////////////////////////////////////////////////////////////////////////////////
setPageState("loadedMetaData")
setPageState("loadedMetaData");
return;
}
@ -2487,7 +2487,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
setTimeout(() =>
{
// @ts-ignore
basicAndAdvancedQueryControlsRef?.current?.ensureAllFilterCriteriaAreActiveQuickFilters(view.queryFilter, "defaultFilterLoaded")
basicAndAdvancedQueryControlsRef?.current?.ensureAllFilterCriteriaAreActiveQuickFilters(view.queryFilter, "defaultFilterLoaded");
});
console.log("finished preparing grid, going to page state ready");
@ -2511,11 +2511,11 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
{
if (pageState == "ready")
{
pageLoadingState.setNotLoading()
pageLoadingState.setNotLoading();
if (!tableVariantPromptOpen)
{
updateTable("pageState is now ready")
updateTable("pageState is now ready");
}
}
}, [pageState, tableVariantPromptOpen]);
@ -2563,7 +2563,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
let gotoVariantSubHeader = <></>;
if (tableMetaData?.usesVariants)
{
gotoVariantSubHeader = <Box mb={2}>{getTableVariantHeader(tableVariant)}</Box>
gotoVariantSubHeader = <Box mb={2}>{getTableVariantHeader(tableVariant)}</Box>;
}
return (
@ -2615,7 +2615,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
////////////////////////////////////////////////////////////////////////////////////////////////////////////
const baseView = currentSavedView ? JSON.parse(currentSavedView.values.get("viewJson")) as RecordQueryView : tableDefaultView;
const viewDiffs: string[] = [];
SavedViewUtils.diffColumns(tableMetaData, baseView, view, viewDiffs)
SavedViewUtils.diffColumns(tableMetaData, baseView, view, viewDiffs);
if (viewDiffs.length == 0 && currentSavedView)
{
@ -2653,7 +2653,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
color: buttonColor,
backgroundColor: buttonBackground,
}
}
};
return (<Box order="2">
<FieldListMenu
@ -2668,7 +2668,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
handleToggleField={handleChangeOneColumnVisibility}
/>
</Box>);
}
};
//////////////////////////////////////////////////////////////////////////////////////////////////////////
// these numbers help set the height of the grid (so page won't scroll) based on spcae above & below it //

View File

@ -263,18 +263,24 @@ class FilterUtils
/*******************************************************************************
**
*******************************************************************************/
public static canFilterWorkAsBasic(tableMetaData: QTableMetaData, filter: QQueryFilter): { canFilterWorkAsBasic: boolean; reasonsWhyItCannot?: string[] }
public static canFilterWorkAsBasic(tableMetaData: QTableMetaData, filter: QQueryFilter): { canFilterWorkAsBasic: boolean; canFilterWorkAsAdvanced: boolean, reasonsWhyItCannot?: string[] }
{
const reasonsWhyItCannot: string[] = [];
if (filter == null)
{
return ({canFilterWorkAsBasic: true});
return ({canFilterWorkAsBasic: true, canFilterWorkAsAdvanced: true});
}
if (filter.booleanOperator == "OR")
{
reasonsWhyItCannot.push("Filter uses the 'OR' operator.")
reasonsWhyItCannot.push("Filter uses the 'OR' operator.");
}
if (filter.subFilters?.length > 0)
{
reasonsWhyItCannot.push("Filter contains sub-filters.");
return ({canFilterWorkAsBasic: false, canFilterWorkAsAdvanced: false, reasonsWhyItCannot: reasonsWhyItCannot});
}
if (filter.criteria)
@ -309,11 +315,11 @@ class FilterUtils
if (reasonsWhyItCannot.length == 0)
{
return ({canFilterWorkAsBasic: true});
return ({canFilterWorkAsBasic: true, canFilterWorkAsAdvanced: true});
}
else
{
return ({canFilterWorkAsBasic: false, reasonsWhyItCannot: reasonsWhyItCannot});
return ({canFilterWorkAsBasic: false, canFilterWorkAsAdvanced: true, reasonsWhyItCannot: reasonsWhyItCannot});
}
}
@ -372,7 +378,7 @@ class FilterUtils
}
else if (fieldMetaData.type == QFieldType.BOOLEAN)
{
labels.push(value == true ? "yes" : "no")
labels.push(value == true ? "yes" : "no");
}
else if (fieldMetaData.type == QFieldType.DATE_TIME)
{
@ -450,7 +456,7 @@ class FilterUtils
for (let i = 0; i < queryFilter?.orderBys?.length; i++)
{
const orderBy = queryFilter.orderBys[i];
gridSortModel.push({field: orderBy.fieldName, sort: orderBy.isAscending ? "asc" : "desc"})
gridSortModel.push({field: orderBy.fieldName, sort: orderBy.isAscending ? "asc" : "desc"});
}
return (gridSortModel);
}
@ -497,33 +503,33 @@ class FilterUtils
case QCriteriaOperator.LESS_THAN:
if (isDate || isDateTime)
{
return ("is before")
return ("is before");
}
return ("less than");
case QCriteriaOperator.LESS_THAN_OR_EQUALS:
if (isDate)
{
return ("is on or before")
return ("is on or before");
}
if (isDateTime)
{
return ("is at or before")
return ("is at or before");
}
return ("less than or equals");
case QCriteriaOperator.GREATER_THAN:
if (isDate || isDateTime)
{
return ("is after")
return ("is after");
}
return ("greater than or equals");
case QCriteriaOperator.GREATER_THAN_OR_EQUALS:
if (isDate)
{
return ("is on or after")
return ("is on or after");
}
if (isDateTime)
{
return ("is at or after")
return ("is at or after");
}
return ("greater than or equals");
case QCriteriaOperator.IS_BLANK:
@ -539,7 +545,7 @@ class FilterUtils
catch (e)
{
console.log(`Error getting operator human string for ${JSON.stringify(criteria)}: ${e}`);
return criteria?.operator
return criteria?.operator;
}
}
@ -567,7 +573,7 @@ class FilterUtils
{valuesString && <Box display="inline" p="0.125rem" pr="0.5rem" sx={{background: "#009971"}} borderRadius="0 0.5rem 0.5rem 0"> {valuesString}</Box>}
&nbsp;
</Box>
)
);
}
else
{