add id to each query

This commit is contained in:
Manmeet
2023-06-14 02:07:24 +05:30
committed by il3ven
parent f7fdf57c36
commit 48dd018b32
4 changed files with 20 additions and 12 deletions

View File

@@ -44,8 +44,8 @@ export default function FilterInputsCollection({
{queries.map((query, index) => {
return (
<Draggable
key={query.key}
draggableId={query.key}
key={query.id}
draggableId={query.id.toString()}
index={index}
>
{(provided) => (
@@ -58,7 +58,7 @@ export default function FilterInputsCollection({
filterColumns={filterColumns}
selectedColumn={selectedColumns[index]}
handleChangeColumn={(key: string) => {
handleColumnChange(query.key, key);
handleColumnChange(query.id, key);
}}
availableFilters={
availableFiltersForEachSelectedColumn[index]
@@ -103,16 +103,19 @@ export default function FilterInputsCollection({
return !find(selectedColumns, { key: column.key });
});
const id = Math.random();
setQueries((prevQueries) => [
...prevQueries,
{
key: "",
operator: "",
value: "",
id,
},
]);
handleColumnChange("", column?.key ?? filterColumns[0].key);
handleColumnChange(id, column?.key ?? filterColumns[0].key);
}}
startIcon={<AddIcon />}
>

View File

@@ -189,7 +189,7 @@ export default function Filters() {
tableSchema.joinOperator === "AND" ? "AND" : "OR"
);
}
}, [userSettings.tables?.[tableId]?.joinOperator]);
}, [userSettings.tables?.[tableId]?.joinOperator, tableSchema.joinOperator]);
useEffect(() => {
if (tableFiltersOverridable && (hasUserFilters || userFilters === null)) {

View File

@@ -44,13 +44,14 @@ export const useFilterInputs = (
value:
getFieldProp("filter", getFieldType(filterColumns[0]))
.defaultValue ?? "",
id: Math.random(),
},
]
: [];
// State for filter inputs
const [queries, setQueries] = useState<TableFilter[]>(
defaultQuery ? [defaultQuery] : INITIAL_QUERY
defaultQuery ? [{ ...defaultQuery, id: Math.random() }] : INITIAL_QUERY
);
const resetQuery = () => setQueries([]);
@@ -58,11 +59,11 @@ export const useFilterInputs = (
const [joinOperator, setJoinOperator] = useState<"AND" | "OR">("AND");
// When the user sets a new column, automatically set the operator and value
const handleColumnChange = (oldKey: string, newKey: string) => {
const handleColumnChange = (oldId: number, newKey: string) => {
if (newKey === "_rowy_ref.id") {
setQueries((prevQueries) => {
const newQueries = [...prevQueries];
const query = find(newQueries, ["key", oldKey]);
const query = find(newQueries, ["id", oldId]);
if (query) {
query.key = newKey;
query.operator = "id-equal";
@@ -79,7 +80,7 @@ export const useFilterInputs = (
const filter = getFieldProp("filter", getFieldType(column));
setQueries((prevQueries) => {
const newQueries = [...prevQueries];
const query = find(newQueries, ["key", oldKey]);
const query = find(newQueries, ["id", oldId]);
if (query) {
query.key = newKey;
query.operator = filter.operators[0].value;
@@ -98,9 +99,12 @@ export const useFilterInputs = (
}
const availableFiltersForEachSelectedColumn: IFieldConfig["filter"][] =
selectedColumns.map((column) =>
getFieldProp("filter", getFieldType(column))
);
selectedColumns.map((column) => {
if (column.key === "_rowy_ref.id") {
return { operators: [{ value: "id-equal", label: "is" }] };
}
return getFieldProp("filter", getFieldType(column));
});
return {
filterColumns,

View File

@@ -198,6 +198,7 @@ export type TableFilter = {
| "color-not-equal"
| "";
value: any;
id: number;
};
export const TableTools = [