Skip to content

Commit 88ef184

Browse files
authored
COMP-635: Sorting/filtering bug on Case Files/Inspections etc (#513)
* COMP-635: Sorting/filtering bug on Case Files/Inspections etc * my files toggle filter by current logged in user only * filter Open case files during first load * complaints my files changes * code optimization for table handlers
1 parent b742830 commit 88ef184

File tree

9 files changed

+541
-508
lines changed

9 files changed

+541
-508
lines changed

compliance-web/src/components/App/CaseFiles/CaseFileGrid/CaseFileGridUtils.tsx

Lines changed: 0 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -70,21 +70,6 @@ export const useConvertFiltersToQueryParams = (
7070
? value.join(",")
7171
: value;
7272
break;
73-
case "project_ids":
74-
params.project_ids = Array.isArray(value)
75-
? value.join(",")
76-
: value;
77-
break;
78-
case "initiation_ids":
79-
params.initiation_ids = Array.isArray(value)
80-
? value.join(",")
81-
: value;
82-
break;
83-
case "statuses":
84-
params.statuses = Array.isArray(value)
85-
? value.join(",")
86-
: value;
87-
break;
8873
}
8974
}
9075
});

compliance-web/src/components/App/CaseFiles/CaseFileGrid/ShowOnlyMyCaseFilesSwitch.tsx

Lines changed: 21 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -1,80 +1,59 @@
11
import { FormControlLabel, Typography, CircularProgress } from "@mui/material";
22
import CustomSwitch from "@/components/Shared/Controlled/CustomSwitch";
33
import { useAuth } from "react-oidc-context";
4-
import { useStaffUsersData } from "@/hooks/useStaff";
54
import { useMemo, useCallback, useState, useEffect } from "react";
65
import { MRT_TableState } from "material-react-table";
76
import { CaseFile } from "@/models/CaseFile";
7+
import { StaffUser } from "@/models/Staff";
88

99
interface ShowOnlyMyCaseFilesSwitchProps {
1010
disabled?: boolean;
11+
staffUsers: StaffUser[];
1112
onFiltersChange?: (filters: {
1213
checked: boolean;
1314
externalFilters: Record<string, string[] | string>;
1415
columnFilters?: MRT_TableState<CaseFile>["columnFilters"];
1516
}) => void;
1617
initialChecked?: boolean;
17-
onColumnFiltersChange?: (
18-
updater:
19-
| MRT_TableState<CaseFile>["columnFilters"]
20-
| ((
21-
old: MRT_TableState<CaseFile>["columnFilters"]
22-
) => MRT_TableState<CaseFile>["columnFilters"])
23-
) => void;
2418
}
2519

26-
const ShowOnlyMyCaseFilesSwitch: React.FC<
27-
ShowOnlyMyCaseFilesSwitchProps
28-
> = ({
20+
const ShowOnlyMyCaseFilesSwitch: React.FC<ShowOnlyMyCaseFilesSwitchProps> = ({
2921
disabled = false,
22+
staffUsers,
3023
onFiltersChange,
31-
initialChecked = false,
32-
onColumnFiltersChange,
24+
initialChecked = true,
3325
}) => {
3426
const { user: currentUser, isLoading: authLoading } = useAuth();
35-
const { data: staffUsers, isLoading: staffLoading } = useStaffUsersData();
3627

3728
// Internal state management
3829
const [checked, setChecked] = useState(initialChecked);
3930

40-
// Update internal state when initialChecked changes (for restoration)
41-
useEffect(() => {
42-
setChecked(initialChecked);
43-
}, [initialChecked]);
44-
4531
// Find current user in staff list
4632
const currentStaff = useMemo(() => {
47-
if (!currentUser?.profile?.preferred_username || !staffUsers)
48-
return undefined;
33+
if (!currentUser?.profile?.preferred_username || !staffUsers) return undefined;
4934
return staffUsers.find(
5035
(staff) => staff.auth_user_guid === currentUser.profile.preferred_username
5136
);
5237
}, [currentUser?.profile?.preferred_username, staffUsers]);
5338

5439
// Determine if switch should be disabled
5540
const isSwitchDisabled = useMemo(() => {
56-
return disabled || authLoading || staffLoading || !currentStaff;
57-
}, [disabled, authLoading, staffLoading, currentStaff]);
41+
return disabled || authLoading || !currentStaff;
42+
}, [disabled, authLoading, currentStaff]);
5843

5944
// Get the appropriate label
60-
const getSwitchLabel = useMemo(() => {
61-
return `${currentUser?.profile?.given_name}'s Files`;
45+
const switchLabel = useMemo(() => {
46+
return `${currentUser?.profile?.given_name || 'My'} Files`;
6247
}, [currentUser?.profile?.given_name]);
6348

64-
// Generate external filters based on current state
49+
// Generate external filters for API calls
6550
const generateExternalFilters = useCallback(
6651
(isChecked: boolean): Record<string, string[] | string> => {
6752
if (!isChecked || !currentStaff?.id) {
68-
return {
69-
primary_officer_ids: [],
70-
statuses: [],
71-
};
53+
return {};
7254
}
73-
74-
// For regular users, filter by primary officer and status 'open'
7555
return {
7656
primary_officer_ids: [currentStaff.id.toString()],
77-
statuses: ["Open"],
7857
};
7958
},
8059
[currentStaff?.id]
@@ -86,22 +65,14 @@ const ShowOnlyMyCaseFilesSwitch: React.FC<
8665
if (!isChecked || !currentStaff) {
8766
return [];
8867
}
89-
90-
const currentUserStaff = staffUsers?.find(
91-
(staff) => staff.id === currentStaff.id
92-
);
9368
return [
9469
{
9570
id: "primary_officer",
96-
value: [currentUserStaff?.name || ""],
97-
},
98-
{
99-
id: "status",
100-
value: ["Open"],
71+
value: [currentStaff.id.toString()],
10172
},
10273
];
10374
},
104-
[currentStaff, staffUsers]
75+
[currentStaff]
10576
);
10677

10778
// Handle switch change
@@ -118,36 +89,20 @@ const ShowOnlyMyCaseFilesSwitch: React.FC<
11889
externalFilters,
11990
columnFilters,
12091
});
121-
122-
// Update column filters for UI display if callback provided
123-
if (onColumnFiltersChange) {
124-
if (newChecked) {
125-
// Remove existing user-specific filters and add new ones
126-
const filteredFilters = columnFilters.filter(
127-
(filter) => filter.id !== "primary_officer"
128-
);
129-
onColumnFiltersChange([
130-
...filteredFilters,
131-
...generateColumnFilters(true),
132-
]);
133-
} else {
134-
// Remove user-specific filters when turning off
135-
const filteredFilters = columnFilters.filter(
136-
(filter) => filter.id !== "primary_officer"
137-
);
138-
onColumnFiltersChange(filteredFilters);
139-
}
140-
}
14192
},
14293
[
14394
generateExternalFilters,
14495
generateColumnFilters,
14596
onFiltersChange,
146-
onColumnFiltersChange,
14797
]
14898
);
14999

150-
if (authLoading || staffLoading) {
100+
// Update internal state when initialChecked changes (for restoration)
101+
useEffect(() => {
102+
setChecked(initialChecked);
103+
}, [initialChecked]);
104+
105+
if (authLoading) {
151106
return <CircularProgress size={24} />;
152107
}
153108

@@ -163,7 +118,7 @@ const ShowOnlyMyCaseFilesSwitch: React.FC<
163118
}
164119
label={
165120
<Typography variant="body1" mr={1}>
166-
<strong>{getSwitchLabel}</strong>
121+
<strong>{switchLabel}</strong>
167122
</Typography>
168123
}
169124
labelPlacement="start"

compliance-web/src/components/App/Complaints/ComplaintsGrid/ShowOnlyMyComplaintsSwitch.tsx

Lines changed: 20 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -1,76 +1,59 @@
11
import { FormControlLabel, Typography, CircularProgress } from "@mui/material";
22
import CustomSwitch from "@/components/Shared/Controlled/CustomSwitch";
33
import { useAuth } from "react-oidc-context";
4-
import { useStaffUsersData } from "@/hooks/useStaff";
54
import { useMemo, useCallback, useState, useEffect } from "react";
65
import { MRT_TableState } from "material-react-table";
76
import { Complaint } from "@/models/Complaint";
7+
import { StaffUser } from "@/models/Staff";
88

99
interface ShowOnlyMyComplaintsSwitchProps {
1010
disabled?: boolean;
11+
staffUsers: StaffUser[];
1112
onFiltersChange?: (filters: {
1213
checked: boolean;
1314
externalFilters: Record<string, string[] | string>;
1415
columnFilters?: MRT_TableState<Complaint>["columnFilters"];
1516
}) => void;
1617
initialChecked?: boolean;
17-
onColumnFiltersChange?: (
18-
updater:
19-
| MRT_TableState<Complaint>["columnFilters"]
20-
| ((
21-
old: MRT_TableState<Complaint>["columnFilters"]
22-
) => MRT_TableState<Complaint>["columnFilters"])
23-
) => void;
2418
}
2519

2620
const ShowOnlyMyComplaintsSwitch: React.FC<
2721
ShowOnlyMyComplaintsSwitchProps
2822
> = ({
2923
disabled = false,
24+
staffUsers,
3025
onFiltersChange,
31-
initialChecked = false,
32-
onColumnFiltersChange,
26+
initialChecked = true, // Default to true for first-time users
3327
}) => {
3428
const { user: currentUser, isLoading: authLoading } = useAuth();
35-
const { data: staffUsers, isLoading: staffLoading } = useStaffUsersData();
3629

3730
// Internal state management
3831
const [checked, setChecked] = useState(initialChecked);
3932

40-
// Update internal state when initialChecked changes (for restoration)
41-
useEffect(() => {
42-
setChecked(initialChecked);
43-
}, [initialChecked]);
44-
4533
// Find current user in staff list
4634
const currentStaff = useMemo(() => {
47-
if (!currentUser?.profile?.preferred_username || !staffUsers)
48-
return undefined;
35+
if (!currentUser?.profile?.preferred_username || !staffUsers) return undefined;
4936
return staffUsers.find(
5037
(staff) => staff.auth_user_guid === currentUser.profile.preferred_username
5138
);
5239
}, [currentUser?.profile?.preferred_username, staffUsers]);
5340

5441
// Determine if switch should be disabled
5542
const isSwitchDisabled = useMemo(() => {
56-
return disabled || authLoading || staffLoading || !currentStaff;
57-
}, [disabled, authLoading, staffLoading, currentStaff]);
43+
return disabled || authLoading || !currentStaff;
44+
}, [disabled, authLoading, currentStaff]);
5845

5946
// Get the appropriate label
60-
const getSwitchLabel = useMemo(() => {
61-
return `${currentUser?.profile?.given_name}'s Files`;
47+
const switchLabel = useMemo(() => {
48+
return `${currentUser?.profile?.given_name || 'My'} Complaints`;
6249
}, [currentUser?.profile?.given_name]);
6350

64-
// Generate external filters based on current state
51+
// Generate external filters for API calls
6552
const generateExternalFilters = useCallback(
6653
(isChecked: boolean): Record<string, string[] | string> => {
6754
if (!isChecked || !currentStaff?.id) {
68-
return {
69-
primary_officer_ids: [],
70-
};
55+
return {};
7156
}
72-
73-
// For regular users, filter by primary officer
7457
return {
7558
primary_officer_ids: [currentStaff.id.toString()],
7659
};
@@ -84,18 +67,14 @@ const ShowOnlyMyComplaintsSwitch: React.FC<
8467
if (!isChecked || !currentStaff) {
8568
return [];
8669
}
87-
88-
const currentUserStaff = staffUsers?.find(
89-
(staff) => staff.id === currentStaff.id
90-
);
9170
return [
9271
{
9372
id: "primary_officer_ids",
94-
value: [currentUserStaff?.name || ""],
73+
value: [currentStaff.id.toString()],
9574
},
9675
];
9776
},
98-
[currentStaff, staffUsers]
77+
[currentStaff]
9978
);
10079

10180
// Handle switch change
@@ -112,36 +91,20 @@ const ShowOnlyMyComplaintsSwitch: React.FC<
11291
externalFilters,
11392
columnFilters,
11493
});
115-
116-
// Update column filters for UI display if callback provided
117-
if (onColumnFiltersChange) {
118-
if (newChecked) {
119-
// Remove existing user-specific filters and add new ones
120-
const filteredFilters = columnFilters.filter(
121-
(filter) => filter.id !== "primary_officer_ids"
122-
);
123-
onColumnFiltersChange([
124-
...filteredFilters,
125-
...generateColumnFilters(true),
126-
]);
127-
} else {
128-
// Remove user-specific filters when turning off
129-
const filteredFilters = columnFilters.filter(
130-
(filter) => filter.id !== "primary_officer_ids"
131-
);
132-
onColumnFiltersChange(filteredFilters);
133-
}
134-
}
13594
},
13695
[
13796
generateExternalFilters,
13897
generateColumnFilters,
13998
onFiltersChange,
140-
onColumnFiltersChange,
14199
]
142100
);
143101

144-
if (authLoading || staffLoading) {
102+
// Update internal state when initialChecked changes (for restoration)
103+
useEffect(() => {
104+
setChecked(initialChecked);
105+
}, [initialChecked]);
106+
107+
if (authLoading) {
145108
return <CircularProgress size={24} />;
146109
}
147110

@@ -157,7 +120,7 @@ const ShowOnlyMyComplaintsSwitch: React.FC<
157120
}
158121
label={
159122
<Typography variant="body1" mr={1}>
160-
<strong>{getSwitchLabel}</strong>
123+
<strong>{switchLabel}</strong>
161124
</Typography>
162125
}
163126
labelPlacement="start"

compliance-web/src/components/Shared/MasterDataTable/MasterDataTable.tsx

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import {
99
MRT_Column,
1010
MRT_Header,
1111
MRT_TableState,
12+
MRT_SortingState,
1213
} from "material-react-table";
1314
import { Box, Button, IconButton, Tooltip, Typography } from "@mui/material";
1415
import { FiltersCache } from "./FiltersCache";
@@ -42,11 +43,7 @@ interface RemoteDataConfig<TData extends MRT_RowData> {
4243
) => MRT_TableState<TData>["pagination"])
4344
) => void;
4445
onSortingChange?: (
45-
updater:
46-
| MRT_TableState<TData>["sorting"]
47-
| ((
48-
old: MRT_TableState<TData>["sorting"]
49-
) => MRT_TableState<TData>["sorting"])
46+
updater: MRT_SortingState | ((old: MRT_SortingState) => MRT_SortingState)
5047
) => void;
5148
onColumnFiltersChange?: (
5249
updater:

0 commit comments

Comments
 (0)