Skip to content
New issue

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

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

Already on GitHub? # to your account

UHM-7439, add queue table metrics #1118

Merged
merged 7 commits into from
May 7, 2024
Merged

UHM-7439, add queue table metrics #1118

merged 7 commits into from
May 7, 2024

Conversation

cioan
Copy link
Member

@cioan cioan commented Apr 30, 2024

@chibongho and @mseaton , before I go and implement all those configurable statuses and the number of patients in each table, just wanted to make sure if the following components are the right components to implement? Thanks!

Screenshot 2024-04-30 at 10 27 11 AM

@cioan cioan requested a review from chibongho April 30, 2024 14:46
Copy link
Contributor

github-actions bot commented Apr 30, 2024

Size Change: -49.3 kB (-1%)

Total Size: 3.53 MB

Filename Size Change
packages/esm-service-queues-app/dist/339.js 0 B -50.3 kB (removed) 🏆
ℹ️ View Unchanged
Filename Size Change
packages/esm-active-visits-app/dist/130.js 220 kB 0 B
packages/esm-active-visits-app/dist/255.js 2.21 kB 0 B
packages/esm-active-visits-app/dist/271.js 762 B 0 B
packages/esm-active-visits-app/dist/277.js 13.5 kB 0 B
packages/esm-active-visits-app/dist/316.js 42.9 kB 0 B
packages/esm-active-visits-app/dist/319.js 683 B 0 B
packages/esm-active-visits-app/dist/382.js 1.15 kB 0 B
packages/esm-active-visits-app/dist/410.js 50.1 kB 0 B
packages/esm-active-visits-app/dist/460.js 784 B 0 B
packages/esm-active-visits-app/dist/574.js 588 B 0 B
packages/esm-active-visits-app/dist/588.js 6.66 kB 0 B
packages/esm-active-visits-app/dist/635.js 1.15 kB 0 B
packages/esm-active-visits-app/dist/644.js 762 B 0 B
packages/esm-active-visits-app/dist/729.js 3.1 kB 0 B
packages/esm-active-visits-app/dist/757.js 694 B 0 B
packages/esm-active-visits-app/dist/784.js 2.63 kB 0 B
packages/esm-active-visits-app/dist/788.js 586 B 0 B
packages/esm-active-visits-app/dist/807.js 918 B 0 B
packages/esm-active-visits-app/dist/833.js 732 B 0 B
packages/esm-active-visits-app/dist/879.js 2.94 kB 0 B
packages/esm-active-visits-app/dist/main.js 68 kB 0 B
packages/esm-active-visits-app/dist/openmrs-esm-active-visits-app.js 3.34 kB 0 B
packages/esm-appointments-app/dist/130.js 220 kB 0 B
packages/esm-appointments-app/dist/152.js 257 B 0 B
packages/esm-appointments-app/dist/255.js 2.22 kB 0 B
packages/esm-appointments-app/dist/271.js 1.97 kB 0 B
packages/esm-appointments-app/dist/303.js 258 B 0 B
packages/esm-appointments-app/dist/309.js 867 B 0 B
packages/esm-appointments-app/dist/319.js 1.89 kB 0 B
packages/esm-appointments-app/dist/390.js 26.1 kB 0 B
packages/esm-appointments-app/dist/4.js 1.77 kB 0 B
packages/esm-appointments-app/dist/460.js 2.07 kB 0 B
packages/esm-appointments-app/dist/520.js 46.5 kB 0 B
packages/esm-appointments-app/dist/574.js 2 kB 0 B
packages/esm-appointments-app/dist/588.js 6.65 kB 0 B
packages/esm-appointments-app/dist/591.js 16.9 kB 0 B
packages/esm-appointments-app/dist/592.js 9.5 kB 0 B
packages/esm-appointments-app/dist/644.js 1.97 kB 0 B
packages/esm-appointments-app/dist/729.js 3.1 kB 0 B
packages/esm-appointments-app/dist/757.js 1.74 kB 0 B
packages/esm-appointments-app/dist/776.js 255 kB 0 B
packages/esm-appointments-app/dist/784.js 2.63 kB 0 B
packages/esm-appointments-app/dist/788.js 1.68 kB 0 B
packages/esm-appointments-app/dist/807.js 2.31 kB 0 B
packages/esm-appointments-app/dist/833.js 1.97 kB 0 B
packages/esm-appointments-app/dist/main.js 313 kB 0 B
packages/esm-appointments-app/dist/openmrs-esm-appointments-app.js 3.43 kB 0 B
packages/esm-patient-list-management-app/dist/130.js 220 kB 0 B
packages/esm-patient-list-management-app/dist/255.js 2.21 kB 0 B
packages/esm-patient-list-management-app/dist/271.js 1.55 kB 0 B
packages/esm-patient-list-management-app/dist/319.js 1.52 kB 0 B
packages/esm-patient-list-management-app/dist/382.js 1.15 kB 0 B
packages/esm-patient-list-management-app/dist/460.js 1.7 kB 0 B
packages/esm-patient-list-management-app/dist/574.js 1.34 kB 0 B
packages/esm-patient-list-management-app/dist/588.js 6.66 kB 0 B
packages/esm-patient-list-management-app/dist/591.js 16.9 kB 0 B
packages/esm-patient-list-management-app/dist/635.js 1.15 kB 0 B
packages/esm-patient-list-management-app/dist/644.js 1.55 kB 0 B
packages/esm-patient-list-management-app/dist/716.js 4.75 kB 0 B
packages/esm-patient-list-management-app/dist/729.js 3.1 kB 0 B
packages/esm-patient-list-management-app/dist/740.js 97.6 kB 0 B
packages/esm-patient-list-management-app/dist/757.js 1.5 kB 0 B
packages/esm-patient-list-management-app/dist/784.js 2.64 kB 0 B
packages/esm-patient-list-management-app/dist/788.js 1.34 kB 0 B
packages/esm-patient-list-management-app/dist/807.js 1.84 kB 0 B
packages/esm-patient-list-management-app/dist/833.js 1.58 kB 0 B
packages/esm-patient-list-management-app/dist/995.js 22 kB 0 B
packages/esm-patient-list-management-app/dist/main.js 124 kB 0 B
packages/esm-patient-list-management-app/dist/openmrs-esm-patient-list-management-app.js 3.3 kB 0 B
packages/esm-patient-registration-app/dist/130.js 220 kB 0 B
packages/esm-patient-registration-app/dist/152.js 262 B 0 B
packages/esm-patient-registration-app/dist/255.js 2.21 kB 0 B
packages/esm-patient-registration-app/dist/271.js 2.01 kB 0 B
packages/esm-patient-registration-app/dist/303.js 260 B 0 B
packages/esm-patient-registration-app/dist/319.js 1.99 kB 0 B
packages/esm-patient-registration-app/dist/460.js 2.12 kB 0 B
packages/esm-patient-registration-app/dist/481.js 6.75 kB 0 B
packages/esm-patient-registration-app/dist/537.js 2.43 kB 0 B
packages/esm-patient-registration-app/dist/574.js 1.7 kB 0 B
packages/esm-patient-registration-app/dist/591.js 16.9 kB 0 B
packages/esm-patient-registration-app/dist/644.js 2.01 kB 0 B
packages/esm-patient-registration-app/dist/676.js 6.59 kB 0 B
packages/esm-patient-registration-app/dist/686.js 92 kB 0 B
packages/esm-patient-registration-app/dist/729.js 3.1 kB 0 B
packages/esm-patient-registration-app/dist/735.js 464 B 0 B
packages/esm-patient-registration-app/dist/757.js 2.07 kB 0 B
packages/esm-patient-registration-app/dist/783.js 36.4 kB 0 B
packages/esm-patient-registration-app/dist/784.js 2.64 kB 0 B
packages/esm-patient-registration-app/dist/788.js 1.7 kB 0 B
packages/esm-patient-registration-app/dist/807.js 2.43 kB 0 B
packages/esm-patient-registration-app/dist/833.js 1.97 kB 0 B
packages/esm-patient-registration-app/dist/879.js 2.94 kB 0 B
packages/esm-patient-registration-app/dist/main.js 130 kB 0 B
packages/esm-patient-registration-app/dist/openmrs-esm-patient-registration-app.js 3.34 kB 0 B
packages/esm-patient-search-app/dist/130.js 220 kB 0 B
packages/esm-patient-search-app/dist/255.js 2.21 kB 0 B
packages/esm-patient-search-app/dist/271.js 899 B 0 B
packages/esm-patient-search-app/dist/319.js 857 B 0 B
packages/esm-patient-search-app/dist/382.js 1.15 kB 0 B
packages/esm-patient-search-app/dist/460.js 924 B 0 B
packages/esm-patient-search-app/dist/574.js 732 B 0 B
packages/esm-patient-search-app/dist/584.js 21.7 kB 0 B
packages/esm-patient-search-app/dist/588.js 6.66 kB 0 B
packages/esm-patient-search-app/dist/591.js 16.9 kB 0 B
packages/esm-patient-search-app/dist/635.js 1.15 kB 0 B
packages/esm-patient-search-app/dist/644.js 899 B 0 B
packages/esm-patient-search-app/dist/729.js 3.1 kB 0 B
packages/esm-patient-search-app/dist/757.js 864 B 0 B
packages/esm-patient-search-app/dist/778.js 23.3 kB 0 B
packages/esm-patient-search-app/dist/784.js 2.63 kB 0 B
packages/esm-patient-search-app/dist/788.js 726 B 0 B
packages/esm-patient-search-app/dist/807.js 1.03 kB 0 B
packages/esm-patient-search-app/dist/833.js 867 B 0 B
packages/esm-patient-search-app/dist/main.js 48.2 kB 0 B
packages/esm-patient-search-app/dist/openmrs-esm-patient-search-app.js 3.3 kB 0 B
packages/esm-service-queues-app/dist/130.js 220 kB 0 B
packages/esm-service-queues-app/dist/152.js 262 B 0 B
packages/esm-service-queues-app/dist/233.js 1.73 kB 0 B
packages/esm-service-queues-app/dist/255.js 2.22 kB 0 B
packages/esm-service-queues-app/dist/258.js 2.32 kB 0 B
packages/esm-service-queues-app/dist/263.js 3.54 kB 0 B
packages/esm-service-queues-app/dist/271.js 4.12 kB 0 B
packages/esm-service-queues-app/dist/303.js 261 B 0 B
packages/esm-service-queues-app/dist/319.js 3.54 kB 0 B
packages/esm-service-queues-app/dist/328.js 2.99 kB 0 B
packages/esm-service-queues-app/dist/349.js 51.3 kB 0 B
packages/esm-service-queues-app/dist/389.js 1.89 kB 0 B
packages/esm-service-queues-app/dist/425.js 2.09 kB 0 B
packages/esm-service-queues-app/dist/460.js 4.4 kB 0 B
packages/esm-service-queues-app/dist/50.js 3.13 kB 0 B
packages/esm-service-queues-app/dist/574.js 3.57 kB +13 B (0%)
packages/esm-service-queues-app/dist/588.js 6.66 kB 0 B
packages/esm-service-queues-app/dist/591.js 16.9 kB 0 B
packages/esm-service-queues-app/dist/644.js 4.12 kB 0 B
packages/esm-service-queues-app/dist/694.js 2.74 kB 0 B
packages/esm-service-queues-app/dist/696.js 570 B 0 B
packages/esm-service-queues-app/dist/729.js 3.1 kB 0 B
packages/esm-service-queues-app/dist/738.js 554 B 0 B
packages/esm-service-queues-app/dist/757.js 3.54 kB 0 B
packages/esm-service-queues-app/dist/784.js 2.63 kB 0 B
packages/esm-service-queues-app/dist/788.js 3.54 kB 0 B
packages/esm-service-queues-app/dist/806.js 1.6 kB 0 B
packages/esm-service-queues-app/dist/807.js 4.83 kB 0 B
packages/esm-service-queues-app/dist/833.js 4.09 kB 0 B
packages/esm-service-queues-app/dist/940.js 21.4 kB 0 B
packages/esm-service-queues-app/dist/981.js 3.03 kB 0 B
packages/esm-service-queues-app/dist/983.js 157 kB 0 B
packages/esm-service-queues-app/dist/main.js 211 kB +962 B (0%)
packages/esm-service-queues-app/dist/openmrs-esm-service-queues-app.js 3.31 kB -1 B (0%)

compressed-size-action

@chibongho
Copy link
Contributor

Overall idea looks good to me.

@cioan
Copy link
Member Author

cioan commented Apr 30, 2024

Thanks @mseaton and @chibongho ! I've got the queue statuses to render dynamically along with the number of queue entries for each status:
Screenshot 2024-04-30 at 5 13 46 PM

Screenshot 2024-04-30 at 5 13 33 PM

Next, I will work on the styling to see if I could get it to look close to the designs. Thanks!

@cioan
Copy link
Member Author

cioan commented May 2, 2024

@mseaton , can I merge in this PR? Thanks!


return (
<div className={styles.metricsBorder}>
<QueueTableMetricsCard value={queueEntries.length} headerLabel={t('totalPatients', 'Total Patients')} />
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

use totalCount returned from useQueueEntries() instead. queueEntries.length is technically incorrect because the REST endpoint limits the max returned result count to 50 by default.

This also means the per-status metrics are not calculated correctly as is, but I don't really know what's the best solution to that. We have a related ticket regarding this.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks @chibongho ! I have updated the PR to use totalCount. Thanks!

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If the same totalCount can't be applied to the per-status counts @cioan , then one way to solve this would be via multiple calls to the queue-entry-metrics endpoint that is here: https://github.com/openmrs/openmrs-module-queue/blob/main/omod/src/main/java/org/openmrs/module/queue/web/QueueEntryMetricRestController.java . Not sure if this will be too much overhead with the multiple calls, but it would provide the most accurate data.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks @mseaton ! I was able to use the queue-entry-metrics REST API to provide an accurate count of the queue entries by status. Please review the updated PR. Thanks!

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looking pretty good @cioan . A few additional comments to address

const { t } = useTranslation();

const allowedStatuses = selectedQueue.allowedStatuses;
const { totalCount } = useQueueEntries({ queue: selectedQueue.uuid, isEnded: false });
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should this also use the metric endpoint for consistency?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sure, np. I have updated the PR.

<QueueTableMetricsCard
queueUuid={selectedQueue.uuid}
serviceUuid={selectedQueue.service.uuid}
status={status.display}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why are you passing in the status display name here? This should be status.uuid

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Changed to status.uuid. Thanks!

return (
<QueueTableMetricsCard
queueUuid={selectedQueue.uuid}
serviceUuid={selectedQueue.service.uuid}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

serviceUuid is totally unnecessary - you are already passing in the queue, the service is redundant.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OK, I removed it.

@cioan cioan merged commit b06a2a8 into main May 7, 2024
6 checks passed
@cioan cioan deleted the UHM-7439 branch May 7, 2024 16:18
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants