Show more monitors in CNS on very large displays

[rithviknishad]

Describe the bug
When CNS is opened in large 4K displays, 75% of the screen space is wasted.

To Reproduce
Steps to reproduce the behavior:

1. Visit https://deploy-preview-6396--care-net.netlify.app/facility/0c95c7f0-e1d2-4aff-83fa-933cef60d3a8/cns on a 4K display

Expected behavior
On large displays, render more vitals monitors into view per page.

Screenshots

[kshitijv256]

9 monitors if available should be fine in this size screen i guess
or maybe increase the size of monitors to use most of screen with same no. as it is

I would like to work on it.

[github-actions]

Hi, @gigincg, @nihal467, @khavinshankar, @mathew-alex, @aparnacoronasafe, This issue has been automatically marked as stale because it has not had any recent activity.

[ayush-seth]

I can pick this up if still required

[MjStar24]

hey @nihal467 I would like to work on this can you assign this to me

[MjStar24]

hey @rithviknishad when I am clicking on the above it is showing no data found

[rithviknishad]

Try logging in as devdistrictadmin Coronasafe@123 instead.

[MjStar24]

thanks @rithviknishad its working!

[MjStar24]

hey @rithviknishad I have raised the pull request for this issue

what I have done :

-by default 6 monitors will displayed per view page for small screens
-for large screens 9 monitors will be displayed per view page for 4k displays
-for this I have used window.resize and react hooks to check the display size and change number of monitors according to display size

[nihal467]

@MjStar24 Unassigning you from this issue due to inactivity. Feel free to reassign yourself if you are still working on it.