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

Jump to bottom

(feat) - O3-4044 - Ward App - add support for vertical tiling of cards #1331

Merged
merged 1 commit into from
Sep 30, 2024
Merged

(feat) - O3-4044 - Ward App - add support for vertical tiling of cards #1331

merged 1 commit into from
Sep 30, 2024

Conversation

chibongho
Copy link
Contributor

Requirements

  • This PR has a title that briefly describes the work done including the ticket number. If there is a ticket, make sure your PR title includes a conventional commit label. See existing PR titles for inspiration.
  • My work conforms to the OpenMRS 3.0 Styleguide and design documentation.
  • My work includes tests or is validated by existing tests.

Summary

https://openmrs.atlassian.net/browse/O3-4044

Current way of tiling bed cards horizontally in the ward view wastes a lot of space. This PR introduces experimental vertical tiling, which can be enabled with a feature flag.

To enable: localStorage.setItem("openmrs:feature-flag:ward-view-vertical-tiling", "true")
To disable: localStorage.removeItem("openmrs:feature-flag:ward-view-vertical-tiling")

Screenshots

Before:
Untitled

After:
image

Related Issue

Other

As the elements within the bed cards load, the height of each card can change (sometimes drastically). This can make the vertical tiling look jarring. We can fix that in a separate PR if we decide to go with vertical tiling.

Video:

OpenMRS.Mozilla.Firefox.2024-09-30.10-16-43.mp4

@github-actions GitHub Actions
Copy link
Contributor

Size Change: +1.03 kB (+0.02%)

Total Size: 6.1 MB

ℹ️ View Unchanged
Filename Size Change
packages/esm-active-visits-app/dist/106.js 8.63 kB 0 B
packages/esm-active-visits-app/dist/130.js 345 kB 0 B
packages/esm-active-visits-app/dist/233.js 3.37 kB 0 B
packages/esm-active-visits-app/dist/271.js 800 B 0 B
packages/esm-active-visits-app/dist/316.js 42.9 kB 0 B
packages/esm-active-visits-app/dist/319.js 712 B 0 B
packages/esm-active-visits-app/dist/325.js 3.09 kB 0 B
packages/esm-active-visits-app/dist/443.js 6.98 kB 0 B
packages/esm-active-visits-app/dist/460.js 824 B 0 B
packages/esm-active-visits-app/dist/574.js 615 B 0 B
packages/esm-active-visits-app/dist/586.js 53.5 kB 0 B
packages/esm-active-visits-app/dist/6.js 26.2 kB 0 B
packages/esm-active-visits-app/dist/644.js 800 B 0 B
packages/esm-active-visits-app/dist/725.js 643 B 0 B
packages/esm-active-visits-app/dist/757.js 731 B 0 B
packages/esm-active-visits-app/dist/784.js 2.63 kB 0 B
packages/esm-active-visits-app/dist/788.js 628 B 0 B
packages/esm-active-visits-app/dist/807.js 959 B 0 B
packages/esm-active-visits-app/dist/814.js 3.04 kB 0 B
packages/esm-active-visits-app/dist/833.js 765 B 0 B
packages/esm-active-visits-app/dist/879.js 3.02 kB 0 B
packages/esm-active-visits-app/dist/967.js 611 B 0 B
packages/esm-active-visits-app/dist/main.js 81.9 kB 0 B
packages/esm-active-visits-app/dist/openmrs-esm-active-visits-app.js 3.32 kB 0 B
packages/esm-appointments-app/dist/130.js 345 kB 0 B
packages/esm-appointments-app/dist/171.js 223 B 0 B
packages/esm-appointments-app/dist/198.js 250 kB 0 B
packages/esm-appointments-app/dist/2.js 2.23 kB 0 B
packages/esm-appointments-app/dist/265.js 1.79 kB 0 B
packages/esm-appointments-app/dist/269.js 7.38 kB 0 B
packages/esm-appointments-app/dist/271.js 2.41 kB 0 B
packages/esm-appointments-app/dist/319.js 2.27 kB 0 B
packages/esm-appointments-app/dist/325.js 3.08 kB 0 B
packages/esm-appointments-app/dist/372.js 2.57 kB 0 B
packages/esm-appointments-app/dist/385.js 31.1 kB 0 B
packages/esm-appointments-app/dist/440.js 16.6 kB 0 B
packages/esm-appointments-app/dist/460.js 2.46 kB 0 B
packages/esm-appointments-app/dist/501.js 7.02 kB 0 B
packages/esm-appointments-app/dist/574.js 2.02 kB 0 B
packages/esm-appointments-app/dist/581.js 9.03 kB 0 B
packages/esm-appointments-app/dist/591.js 16.8 kB 0 B
packages/esm-appointments-app/dist/644.js 2.41 kB 0 B
packages/esm-appointments-app/dist/711.js 129 kB 0 B
packages/esm-appointments-app/dist/757.js 2.39 kB 0 B
packages/esm-appointments-app/dist/784.js 2.62 kB 0 B
packages/esm-appointments-app/dist/788.js 2.02 kB 0 B
packages/esm-appointments-app/dist/807.js 2.65 kB 0 B
packages/esm-appointments-app/dist/833.js 2.37 kB 0 B
packages/esm-appointments-app/dist/903.js 879 B 0 B
packages/esm-appointments-app/dist/main.js 396 kB 0 B
packages/esm-appointments-app/dist/openmrs-esm-appointments-app.js 3.56 kB 0 B
packages/esm-bed-management-app/dist/130.js 345 kB 0 B
packages/esm-bed-management-app/dist/148.js 1.22 kB 0 B
packages/esm-bed-management-app/dist/169.js 6.98 kB 0 B
packages/esm-bed-management-app/dist/271.js 671 B 0 B
packages/esm-bed-management-app/dist/319.js 786 B 0 B
packages/esm-bed-management-app/dist/325.js 3.09 kB 0 B
packages/esm-bed-management-app/dist/339.js 50.2 kB 0 B
packages/esm-bed-management-app/dist/455.js 26.5 kB 0 B
packages/esm-bed-management-app/dist/460.js 671 B 0 B
packages/esm-bed-management-app/dist/501.js 7.03 kB 0 B
packages/esm-bed-management-app/dist/542.js 395 B 0 B
packages/esm-bed-management-app/dist/574.js 672 B 0 B
packages/esm-bed-management-app/dist/591.js 16.8 kB 0 B
packages/esm-bed-management-app/dist/644.js 671 B 0 B
packages/esm-bed-management-app/dist/757.js 814 B 0 B
packages/esm-bed-management-app/dist/766.js 113 kB 0 B
packages/esm-bed-management-app/dist/784.js 2.63 kB 0 B
packages/esm-bed-management-app/dist/788.js 671 B 0 B
packages/esm-bed-management-app/dist/807.js 671 B 0 B
packages/esm-bed-management-app/dist/833.js 671 B 0 B
packages/esm-bed-management-app/dist/main.js 3.87 kB 0 B
packages/esm-bed-management-app/dist/openmrs-esm-bed-management-app.js 3.25 kB 0 B
packages/esm-patient-list-management-app/dist/130.js 345 kB 0 B
packages/esm-patient-list-management-app/dist/233.js 3.38 kB 0 B
packages/esm-patient-list-management-app/dist/271.js 1.57 kB 0 B
packages/esm-patient-list-management-app/dist/319.js 1.51 kB 0 B
packages/esm-patient-list-management-app/dist/325.js 3.09 kB 0 B
packages/esm-patient-list-management-app/dist/37.js 8.38 kB 0 B
packages/esm-patient-list-management-app/dist/443.js 6.98 kB 0 B
packages/esm-patient-list-management-app/dist/455.js 57.7 kB 0 B
packages/esm-patient-list-management-app/dist/460.js 1.71 kB 0 B
packages/esm-patient-list-management-app/dist/574.js 1.33 kB 0 B
packages/esm-patient-list-management-app/dist/591.js 16.9 kB 0 B
packages/esm-patient-list-management-app/dist/644.js 1.57 kB 0 B
packages/esm-patient-list-management-app/dist/658.js 102 kB 0 B
packages/esm-patient-list-management-app/dist/757.js 1.62 kB 0 B
packages/esm-patient-list-management-app/dist/784.js 2.63 kB 0 B
packages/esm-patient-list-management-app/dist/788.js 1.33 kB 0 B
packages/esm-patient-list-management-app/dist/807.js 1.84 kB 0 B
packages/esm-patient-list-management-app/dist/814.js 3.05 kB 0 B
packages/esm-patient-list-management-app/dist/833.js 1.59 kB 0 B
packages/esm-patient-list-management-app/dist/main.js 162 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 344 kB 0 B
packages/esm-patient-registration-app/dist/169.js 6.71 kB 0 B
packages/esm-patient-registration-app/dist/2.js 2.24 kB 0 B
packages/esm-patient-registration-app/dist/250.js 526 B 0 B
packages/esm-patient-registration-app/dist/271.js 2.48 kB 0 B
packages/esm-patient-registration-app/dist/319.js 2.38 kB 0 B
packages/esm-patient-registration-app/dist/325.js 3.09 kB 0 B
packages/esm-patient-registration-app/dist/371.js 547 B 0 B
packages/esm-patient-registration-app/dist/372.js 2.57 kB 0 B
packages/esm-patient-registration-app/dist/460.js 2.46 kB 0 B
packages/esm-patient-registration-app/dist/501.js 7.03 kB 0 B
packages/esm-patient-registration-app/dist/574.js 2.09 kB 0 B
packages/esm-patient-registration-app/dist/591.js 16.8 kB 0 B
packages/esm-patient-registration-app/dist/644.js 2.48 kB 0 B
packages/esm-patient-registration-app/dist/662.js 453 B 0 B
packages/esm-patient-registration-app/dist/700.js 69.8 kB 0 B
packages/esm-patient-registration-app/dist/757.js 2.51 kB 0 B
packages/esm-patient-registration-app/dist/784.js 2.63 kB 0 B
packages/esm-patient-registration-app/dist/788.js 2.09 kB 0 B
packages/esm-patient-registration-app/dist/807.js 2.71 kB 0 B
packages/esm-patient-registration-app/dist/833.js 2.36 kB 0 B
packages/esm-patient-registration-app/dist/879.js 3.03 kB 0 B
packages/esm-patient-registration-app/dist/998.js 67.2 kB 0 B
packages/esm-patient-registration-app/dist/main.js 137 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 345 kB 0 B
packages/esm-patient-search-app/dist/233.js 3.37 kB 0 B
packages/esm-patient-search-app/dist/271.js 920 B 0 B
packages/esm-patient-search-app/dist/319.js 861 B 0 B
packages/esm-patient-search-app/dist/325.js 3.09 kB 0 B
packages/esm-patient-search-app/dist/334.js 24.6 kB 0 B
packages/esm-patient-search-app/dist/443.js 6.98 kB 0 B
packages/esm-patient-search-app/dist/460.js 939 B 0 B
packages/esm-patient-search-app/dist/574.js 742 B 0 B
packages/esm-patient-search-app/dist/591.js 16.8 kB 0 B
packages/esm-patient-search-app/dist/634.js 52 kB 0 B
packages/esm-patient-search-app/dist/644.js 920 B 0 B
packages/esm-patient-search-app/dist/757.js 888 B 0 B
packages/esm-patient-search-app/dist/784.js 2.63 kB 0 B
packages/esm-patient-search-app/dist/788.js 736 B 0 B
packages/esm-patient-search-app/dist/807.js 1.04 kB 0 B
packages/esm-patient-search-app/dist/814.js 3.05 kB 0 B
packages/esm-patient-search-app/dist/833.js 877 B 0 B
packages/esm-patient-search-app/dist/main.js 77.4 kB 0 B
packages/esm-patient-search-app/dist/openmrs-esm-patient-search-app.js 3.29 kB 0 B
packages/esm-service-queues-app/dist/130.js 345 kB 0 B
packages/esm-service-queues-app/dist/169.js 6.98 kB 0 B
packages/esm-service-queues-app/dist/199.js 1.36 kB 0 B
packages/esm-service-queues-app/dist/2.js 2.23 kB 0 B
packages/esm-service-queues-app/dist/236.js 5.84 kB 0 B
packages/esm-service-queues-app/dist/271.js 4.6 kB 0 B
packages/esm-service-queues-app/dist/282.js 8.97 kB 0 B
packages/esm-service-queues-app/dist/319.js 4.35 kB 0 B
packages/esm-service-queues-app/dist/325.js 3.09 kB 0 B
packages/esm-service-queues-app/dist/366.js 7.86 kB 0 B
packages/esm-service-queues-app/dist/372.js 2.57 kB 0 B
packages/esm-service-queues-app/dist/392.js 7.85 kB 0 B
packages/esm-service-queues-app/dist/460.js 4.82 kB 0 B
packages/esm-service-queues-app/dist/501.js 7.03 kB 0 B
packages/esm-service-queues-app/dist/574.js 3.88 kB 0 B
packages/esm-service-queues-app/dist/591.js 16.8 kB 0 B
packages/esm-service-queues-app/dist/6.js 1.75 kB 0 B
packages/esm-service-queues-app/dist/60.js 1.82 kB 0 B
packages/esm-service-queues-app/dist/604.js 6.96 kB 0 B
packages/esm-service-queues-app/dist/644.js 4.6 kB 0 B
packages/esm-service-queues-app/dist/665.js 160 kB 0 B
packages/esm-service-queues-app/dist/670.js 10.1 kB 0 B
packages/esm-service-queues-app/dist/727.js 8.1 kB 0 B
packages/esm-service-queues-app/dist/748.js 116 kB 0 B
packages/esm-service-queues-app/dist/752.js 1.62 kB 0 B
packages/esm-service-queues-app/dist/757.js 4.74 kB 0 B
packages/esm-service-queues-app/dist/760.js 7.13 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.89 kB 0 B
packages/esm-service-queues-app/dist/800.js 1.68 kB 0 B
packages/esm-service-queues-app/dist/807.js 5.17 kB 0 B
packages/esm-service-queues-app/dist/818.js 2.55 kB 0 B
packages/esm-service-queues-app/dist/828.js 1.39 kB 0 B
packages/esm-service-queues-app/dist/833.js 4.5 kB 0 B
packages/esm-service-queues-app/dist/911.js 7.76 kB 0 B
packages/esm-service-queues-app/dist/940.js 21.4 kB 0 B
packages/esm-service-queues-app/dist/main.js 276 kB 0 B
packages/esm-service-queues-app/dist/openmrs-esm-service-queues-app.js 3.31 kB 0 B
packages/esm-ward-app/dist/109.js 344 B 0 B
packages/esm-ward-app/dist/125.js 5.68 kB 0 B
packages/esm-ward-app/dist/130.js 345 kB 0 B
packages/esm-ward-app/dist/161.js 35.4 kB 0 B
packages/esm-ward-app/dist/169.js 6.97 kB 0 B
packages/esm-ward-app/dist/2.js 2.23 kB 0 B
packages/esm-ward-app/dist/269.js 829 B 0 B
packages/esm-ward-app/dist/325.js 3.08 kB 0 B
packages/esm-ward-app/dist/348.js 349 B 0 B
packages/esm-ward-app/dist/372.js 2.56 kB 0 B
packages/esm-ward-app/dist/466.js 393 B 0 B
packages/esm-ward-app/dist/500.js 4.99 kB 0 B
packages/esm-ward-app/dist/501.js 7.02 kB 0 B
packages/esm-ward-app/dist/53.js 11.3 kB 0 B
packages/esm-ward-app/dist/557.js 486 B 0 B
packages/esm-ward-app/dist/559.js 342 B 0 B
packages/esm-ward-app/dist/574.js 1.46 kB 0 B
packages/esm-ward-app/dist/577.js 18 kB 0 B
packages/esm-ward-app/dist/591.js 16.8 kB 0 B
packages/esm-ward-app/dist/659.js 9.95 kB 0 B
packages/esm-ward-app/dist/701.js 3.49 kB 0 B
packages/esm-ward-app/dist/749.js 8.18 kB 0 B
packages/esm-ward-app/dist/767.js 648 B 0 B
packages/esm-ward-app/dist/784.js 2.62 kB 0 B
packages/esm-ward-app/dist/908.js 1.97 kB 0 B
packages/esm-ward-app/dist/922.js 9.3 kB 0 B
packages/esm-ward-app/dist/940.js 21.4 kB 0 B
packages/esm-ward-app/dist/969.js 202 B 0 B
packages/esm-ward-app/dist/998.js 32.7 kB +516 B (+1.6%)
packages/esm-ward-app/dist/main.js 68.6 kB +512 B (+0.75%)
packages/esm-ward-app/dist/openmrs-esm-ward-app.js 3.29 kB 0 B

compressed-size-action

mogoodrich
mogoodrich approved these changes Sep 30, 2024
View reviewed changes
Copy link
Member

@mogoodrich mogoodrich left a comment

Choose a reason for hiding this comment

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

Well, that was easy, thanks @chibongho !

Let's make sure once we argue :) and decide what we want we remove this feature flag and either have it always be the way we want it, or make this be a config parameter instead of a feature flag?

mseaton
mseaton approved these changes Sep 30, 2024
View reviewed changes
Copy link
Member

@mseaton mseaton left a comment

Choose a reason for hiding this comment

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

I don't really understand how this works to change from horizontal -> vertical, but works for me :)

usamaidrsk
usamaidrsk approved these changes Sep 30, 2024
View reviewed changes
Copy link
Member

@usamaidrsk usamaidrsk left a comment

Choose a reason for hiding this comment

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

Thanks @chibongho , LGTM!

@chibongho chibongho changed the title (fix) - O3-4044 - Ward App - add support for vertical tiling of cards (feat) - O3-4044 - Ward App - add support for vertical tiling of cards Sep 30, 2024
@chibongho chibongho merged commit be1f84c into main Sep 30, 2024
6 checks passed
@chibongho chibongho deleted the O3-4044 branch September 30, 2024 16:58
@denniskigen denniskigen mentioned this pull request Dec 17, 2024
Merged
3 tasks
# for free to join this conversation on GitHub. Already have an account? # to comment
Reviewers

@mseaton mseaton mseaton approved these changes

@mogoodrich mogoodrich mogoodrich approved these changes

@usamaidrsk usamaidrsk usamaidrsk approved these changes

@vasharma05 vasharma05 Awaiting requested review from vasharma05

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
4 participants
@chibongho @mseaton @mogoodrich @usamaidrsk