Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add the In Progress Filter to Pathology Dashboard and Cytology Dashboard #1369

Merged
merged 16 commits into from
Jan 17, 2025
Merged

Add the In Progress Filter to Pathology Dashboard and Cytology Dashboard #1369

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
16 commits
Select commit Hold shift + click to select a range
d8d5bd9
Add the In Progress Filter to Pathology Dashboard
vsvishalsharma Jan 4, 2025
056fb24
Ran format command
vsvishalsharma Jan 4, 2025
7754a9f
added filter to cytology
vsvishalsharma Jan 6, 2025
88d05e2
Merge branch 'develop' into Add_Filter
vsvishalsharma Jan 6, 2025
e340544
update the statuses to be include in In progress
vsvishalsharma Jan 7, 2025
e90673c
Merge branch 'Add_Filter' of https://github.com/vsvishalsharma/OpenEL…
vsvishalsharma Jan 7, 2025
d2ac666
Merge branch 'develop' into Add_Filter
mozzy11 Jan 8, 2025
1e4e37f
Merge branch 'develop' into Add_Filter
mozzy11 Jan 9, 2025
7e26914
Merge branch 'I-TECH-UW:develop' into Add_Filter
vsvishalsharma Jan 11, 2025
a8a1ebd
Merge branch 'develop' into Add_Filter
vsvishalsharma Jan 13, 2025
b6d09c0
Merge branch 'develop' into Add_Filter
mozzy11 Jan 16, 2025
6a005a2
Corrected the Statuses in Cytology
vsvishalsharma Jan 16, 2025
75c5249
Merge branch 'Add_Filter' of https://github.com/vsvishalsharma/OpenEL…
vsvishalsharma Jan 16, 2025
3552861
Ran format command
vsvishalsharma Jan 16, 2025
dbacaa1
Remove the hardcoded statuses
vsvishalsharma Jan 17, 2025
f58443f
Implement Changes
vsvishalsharma Jan 17, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
101 changes: 54 additions & 47 deletions frontend/src/components/cytology/CytologyDashBoard.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,13 +43,10 @@ function CytologyDashboard() {
const [filters, setFilters] = useState({
searchTerm: "",
myCases: false,
statuses: [
{
id: "PREPARING_SLIDES",
value: "Preparing slides",
},
],
statuses: [{}],
});
const [inProgressStatuses, setInProgressStatuses] = useState([]);

const [counts, setCounts] = useState({
inProgress: 0,
awaitingReview: 0,
Expand All @@ -59,10 +56,31 @@ function CytologyDashboard() {
const [page, setPage] = useState(1);
const [pageSize, setPageSize] = useState(100);
const intl = useIntl();

const [inProgressStatusObjects, setInProgressStatusObjects] = useState(
inProgressStatuses.map((statusId) => ({ id: statusId })),
);
const setStatusList = (statusList) => {
if (componentMounted.current) {
// Set all statuses
setStatuses(statusList);

// Filter out COMPLETED statuses and update the in-progress statuses state
const filteredStatuses = statusList
.filter((status) => status.id !== "COMPLETED")
.map((status) => status.id);

setInProgressStatuses(filteredStatuses);

// Update the inProgressStatusObjects state
setInProgressStatusObjects(
filteredStatuses.map((statusId) => ({ id: statusId })),
);

// Set filters using the updated state
setFilters((prev) => ({
...prev,
statuses: filteredStatuses.map((statusId) => ({ id: statusId })),
}));
}
};

Expand Down Expand Up @@ -149,13 +167,29 @@ function CytologyDashboard() {
};

const setStatusFilter = (event) => {
if (event.target.value === "All") {
const { value } = event.target;

if (value === "All") {
setFilters({ ...filters, statuses: statuses });
} else if (value === "IN_PROGRESS") {
setFilters({ ...filters, statuses: inProgressStatusObjects });
} else {
setFilters({ ...filters, statuses: [{ id: event.target.value }] });
setFilters({ ...filters, statuses: [{ id: value }] });
}
};

const getSelectedValue = () => {
const selectedValue =
filters.statuses.length === inProgressStatuses.length &&
filters.statuses.every((status) => inProgressStatuses.includes(status.id))
? "IN_PROGRESS"
: filters.statuses.length > 1
? "All"
: filters.statuses[0].id;

return selectedValue;
};

const filtersToParameters = () => {
return (
"statuses=" +
Expand Down Expand Up @@ -242,23 +276,6 @@ function CytologyDashboard() {
},
];

useEffect(() => {
componentMounted.current = true;
setFilters({
...filters,
statuses: [
{
id: "PREPARING_SLIDES",
value: "Preparing slides",
},
],
});

return () => {
componentMounted.current = false;
};
}, [statuses]);

useEffect(() => {
componentMounted.current = true;
refreshItems();
Expand Down Expand Up @@ -329,30 +346,20 @@ function CytologyDashboard() {
id="statusFilter"
name="statusFilter"
labelText={intl.formatMessage({ id: "label.filters.status" })}
value={
filters.statuses.length > 1 ? "All" : filters.statuses[0].id
}
value={getSelectedValue()}
onChange={setStatusFilter}
noLabel
>
<SelectItem
disabled
value="placeholder"
text={intl.formatMessage({ id: "label.filters.status" })}
/>
<SelectItem
text={intl.formatMessage({ id: "all.label" })}
value="All"
/>
{statuses.map((status, index) => {
return (
<SelectItem
key={index}
text={status.value}
value={status.id}
/>
);
})}
<SelectItem disabled value="placeholder" text="Status" />
<SelectItem text="All" value="All" />
<SelectItem text="In Progress" value="IN_PROGRESS" />
{statuses.map((status, index) => (
<SelectItem
key={index}
text={status.value}
value={status.id}
/>
))}
</Select>
</div>
</Column>
Expand Down
92 changes: 53 additions & 39 deletions frontend/src/components/pathology/PathologyDashboard.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,24 +48,43 @@ function PathologyDashboard() {
const [filters, setFilters] = useState({
searchTerm: "",
myCases: false,
statuses: [
{
id: "GROSSING",
value: "Grossing",
},
],
statuses: [{}],
});

const [inProgressStatuses, setInProgressStatuses] = useState([]);

const [counts, setCounts] = useState({
inProgress: 0,
awaitingReview: 0,
additionalRequests: 0,
complete: 0,
});
const [loading, setLoading] = useState(true);

const [inProgressStatusObjects, setInProgressStatusObjects] = useState(
inProgressStatuses.map((statusId) => ({ id: statusId })),
);
const setStatusList = (statusList) => {
if (componentMounted.current) {
// Set all statuses
setStatuses(statusList);

// Filter out COMPLETED statuses and update the in-progress statuses state
const filteredStatuses = statusList
.filter((status) => status.id !== "COMPLETED")
.map((status) => status.id);

setInProgressStatuses(filteredStatuses);

// Update the inProgressStatusObjects state
setInProgressStatusObjects(
filteredStatuses.map((statusId) => ({ id: statusId })),
);

// Set filters using the updated state
setFilters((prev) => ({
...prev,
statuses: filteredStatuses.map((statusId) => ({ id: statusId })),
}));
}
};

Expand Down Expand Up @@ -153,13 +172,29 @@ function PathologyDashboard() {
};

const setStatusFilter = (event) => {
if (event.target.value === "All") {
const { value } = event.target;

if (value === "All") {
setFilters({ ...filters, statuses: statuses });
} else if (value === "IN_PROGRESS") {
setFilters({ ...filters, statuses: inProgressStatusObjects });
} else {
setFilters({ ...filters, statuses: [{ id: event.target.value }] });
setFilters({ ...filters, statuses: [{ id: value }] });
}
};

const getSelectedValue = () => {
const selectedValue =
filters.statuses.length === inProgressStatuses.length &&
filters.statuses.every((status) => inProgressStatuses.includes(status.id))
? "IN_PROGRESS"
: filters.statuses.length > 1
? "All"
: filters.statuses[0].id;

return selectedValue;
};

const filtersToParameters = () => {
return (
"statuses=" +
Expand Down Expand Up @@ -250,23 +285,6 @@ function PathologyDashboard() {
},
];

useEffect(() => {
componentMounted.current = true;
setFilters({
...filters,
statuses: [
{
id: "GROSSING",
value: "Grossing",
},
],
});

return () => {
componentMounted.current = false;
};
}, [statuses]);

useEffect(() => {
componentMounted.current = true;
refreshItems();
Expand Down Expand Up @@ -334,24 +352,20 @@ function PathologyDashboard() {
id="statusFilter"
name="statusFilter"
labelText={intl.formatMessage({ id: "label.filters.status" })}
defaultValue="placeholder"
value={
filters.statuses.length > 1 ? "All" : filters.statuses[0].id
}
value={getSelectedValue()}
onChange={setStatusFilter}
noLabel
>
<SelectItem disabled value="placeholder" text="Status" />
<SelectItem text="All" value="All" />
{statuses.map((status, index) => {
return (
<SelectItem
key={index}
text={status.value}
value={status.id}
/>
);
})}
<SelectItem text="In Progress" value="IN_PROGRESS" />
{statuses.map((status, index) => (
<SelectItem
key={index}
text={status.value}
value={status.id}
/>
))}
</Select>
</div>
</Column>
Expand Down
Loading