CE-798 - Update to not change the criteria in the query (e.g., not fire a new query) until user clicks out of menu

This commit is contained in:
2024-02-15 20:24:05 -06:00
parent 967c557a58
commit 63479ba282

View File

@ -30,7 +30,7 @@ import Box from "@mui/material/Box";
import Button from "@mui/material/Button"; import Button from "@mui/material/Button";
import Menu from "@mui/material/Menu"; import Menu from "@mui/material/Menu";
import TextField from "@mui/material/TextField"; import TextField from "@mui/material/TextField";
import React, {SyntheticEvent, useContext, useState} from "react"; import React, {SyntheticEvent, useContext, useReducer, useState} from "react";
import QContext from "QContext"; import QContext from "QContext";
import {QFilterCriteriaWithId} from "qqq/components/query/CustomFilterPanel"; import {QFilterCriteriaWithId} from "qqq/components/query/CustomFilterPanel";
import {getDefaultCriteriaValue, getOperatorOptions, getValueModeRequiredCount, OperatorOption, validateCriteria} from "qqq/components/query/FilterCriteriaRow"; import {getDefaultCriteriaValue, getOperatorOptions, getValueModeRequiredCount, OperatorOption, validateCriteria} from "qqq/components/query/FilterCriteriaRow";
@ -148,7 +148,10 @@ export default function QuickFilter({tableMetaData, fullFieldName, fieldMetaData
const [anchorEl, setAnchorEl] = useState(null); const [anchorEl, setAnchorEl] = useState(null);
const [isMouseOver, setIsMouseOver] = useState(false); const [isMouseOver, setIsMouseOver] = useState(false);
const [criteria, setCriteria] = useState(criteriaParamIsCriteria(criteriaParam) ? criteriaParam as QFilterCriteriaWithId : null); ////////////////////////////////////////////////////////////////////////////////////////////////////////
// copy the criteriaParam to a new object in here - so changes won't apply until user closes the menu //
////////////////////////////////////////////////////////////////////////////////////////////////////////
const [criteria, setCriteria] = useState(criteriaParamIsCriteria(criteriaParam) ? Object.assign({}, criteriaParam) as QFilterCriteriaWithId : null);
const [id, setId] = useState(criteriaParamIsCriteria(criteriaParam) ? (criteriaParam as QFilterCriteriaWithId).id : ++seedId); const [id, setId] = useState(criteriaParamIsCriteria(criteriaParam) ? (criteriaParam as QFilterCriteriaWithId).id : ++seedId);
const [operatorSelectedValue, setOperatorSelectedValue] = useState(getOperatorSelectedValue(operatorOptions, criteria, defaultOperator)); const [operatorSelectedValue, setOperatorSelectedValue] = useState(getOperatorSelectedValue(operatorOptions, criteria, defaultOperator));
@ -158,6 +161,11 @@ export default function QuickFilter({tableMetaData, fullFieldName, fieldMetaData
const {accentColor} = useContext(QContext); const {accentColor} = useContext(QContext);
//////////////////////
// ole' faithful... //
//////////////////////
const [, forceUpdate] = useReducer((x) => x + 1, 0);
/******************************************************************************* /*******************************************************************************
** **
@ -182,7 +190,10 @@ export default function QuickFilter({tableMetaData, fullFieldName, fieldMetaData
////////////////////////////////////////////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////////////////////////////////////////////
if (criteriaParamIsCriteria(criteriaParam) && JSON.stringify(criteriaParam) !== JSON.stringify(criteria)) if (criteriaParamIsCriteria(criteriaParam) && JSON.stringify(criteriaParam) !== JSON.stringify(criteria))
{ {
const newCriteria = criteriaParam as QFilterCriteriaWithId; ////////////////////////////////////////////////////////////////////////////////////////////////////////
// copy the criteriaParam to a new object in here - so changes won't apply until user closes the menu //
////////////////////////////////////////////////////////////////////////////////////////////////////////
const newCriteria = Object.assign({}, criteriaParam) as QFilterCriteriaWithId;
setCriteria(newCriteria); setCriteria(newCriteria);
const operatorOption = operatorOptions.filter(o => o.value == newCriteria.operator)[0]; const operatorOption = operatorOptions.filter(o => o.value == newCriteria.operator)[0];
setOperatorSelectedValue(operatorOption); setOperatorSelectedValue(operatorOption);
@ -191,6 +202,8 @@ export default function QuickFilter({tableMetaData, fullFieldName, fieldMetaData
/******************************************************************************* /*******************************************************************************
** Test if we need to construct a new criteria object ** Test if we need to construct a new criteria object
** This is (at least for some cases) for when the criteria gets changed
** from outside of this component - e.g., a reset on the query screen
*******************************************************************************/ *******************************************************************************/
const criteriaNeedsReset = (): boolean => const criteriaNeedsReset = (): boolean =>
{ {
@ -199,6 +212,15 @@ export default function QuickFilter({tableMetaData, fullFieldName, fieldMetaData
const defaultOperatorOption = operatorOptions.filter(o => o.value == defaultOperator)[0]; const defaultOperatorOption = operatorOptions.filter(o => o.value == defaultOperator)[0];
if(criteria.operator !== defaultOperatorOption?.value || JSON.stringify(criteria.values) !== JSON.stringify(getDefaultCriteriaValue())) if(criteria.operator !== defaultOperatorOption?.value || JSON.stringify(criteria.values) !== JSON.stringify(getDefaultCriteriaValue()))
{ {
if(isOpen)
{
//////////////////////////////////////////////////////////////////////////////////
// this was firing too-often for case where: there was no criteria originally, //
// so, by adding this is-open check, we eliminated those. //
//////////////////////////////////////////////////////////////////////////////////
return (false);
}
return (true); return (true);
} }
} }
@ -207,7 +229,7 @@ export default function QuickFilter({tableMetaData, fullFieldName, fieldMetaData
} }
/******************************************************************************* /*******************************************************************************
** Construct a new criteria object - resetting the values tied to the oprator ** Construct a new criteria object - resetting the values tied to the operator
** autocomplete at the same time. ** autocomplete at the same time.
*******************************************************************************/ *******************************************************************************/
const makeNewCriteria = (): QFilterCriteria => const makeNewCriteria = (): QFilterCriteria =>
@ -241,6 +263,11 @@ export default function QuickFilter({tableMetaData, fullFieldName, fieldMetaData
*******************************************************************************/ *******************************************************************************/
const closeMenu = () => const closeMenu = () =>
{ {
//////////////////////////////////////////////////////////////////////////////////
// when closing the menu, that's when we'll update the criteria from the caller //
//////////////////////////////////////////////////////////////////////////////////
updateCriteria(criteria, false, false);
setIsOpen(false); setIsOpen(false);
setAnchorEl(null); setAnchorEl(null);
}; };
@ -285,8 +312,6 @@ export default function QuickFilter({tableMetaData, fullFieldName, fieldMetaData
setOperatorSelectedValue(null); setOperatorSelectedValue(null);
setOperatorInputValue(""); setOperatorInputValue("");
} }
updateCriteria(criteria, false, false);
}; };
/******************************************************************************* /*******************************************************************************
@ -320,7 +345,8 @@ export default function QuickFilter({tableMetaData, fullFieldName, fieldMetaData
criteria.values[valueIndex] = value; criteria.values[valueIndex] = value;
} }
updateCriteria(criteria, true, false); setCriteria(criteria);
forceUpdate();
}; };
/******************************************************************************* /*******************************************************************************