Add Monitor Tab #2632
Add Monitor Tab #2632
Conversation
Previously the data catalog collection would be initialized in the data catalog controller, which was appropriate since that was the only place it would be used. However, since now we'll need to use it in at least one more place, namely the upcoming Monitor tab, we move it to App, using the same pattern as for Analyze Collection. This is a pure refactor, and does not affect BiG-CZ behavior at all.
Adds a tab selection header to the top of the analyze sidebar, and a placeholder for where the monitor contents will go. Adjusts styling to better match the mockup by making the top tab bar grey and everything else white, and accounts for it when calculating the tab content height so that scrolling works correctly.
|
Talked to @mmcfarland about this a little bit. The conclusion from that conversation was:
Given this, I think it will be reasonable to reuse as many of the data_catalog views as possible (such as search card, search details, etc), and just style them differently. The parent view will have to be different to accommodate the new tab header and such, but all the inner views should be reused. |
|
Taking a look now |
src/mmw/sass/pages/_monitor.scss
Outdated
| @@ -0,0 +1,34 @@ | |||
| .monitor-window { | |||
| padding: 15px; | |||
There was a problem hiding this comment.
Consider setting this to 1rem so it lines up with the AOI title
Yes, to be addressed in #2621. |
|
Looks good! |
This matches the mockup and demos the tab switching correctly. It currently has no behavior. In order to not affect BiG-CZ, it is better to create a new set of views under /monitor rather than reuse and change the ones under /data_catalog. We will use the same models though, and much of the functionality will be copied over, so it is not going to be a completely new effort. All the styling uses flexbox.
rajadain
force-pushed
the
tt/monitor-add-monitor-tab
branch
from
e71780a
to
669c405
Compare
|
Thank you for taking a look! Amended the padding. Will merge when green. |
|
Jenkins is failing all builds for unrelated reasons (that are being worked on separately). Going to merge this in so that downstream work is unblocked. |
Overview
Adds Monitor tab to the Analyze stage. Updates styling to match the mockup. The Monitor tab currently has no behavior, which will be added in #2622, mostly by reusing the models and copying a lot of the views from BiG-CZ.
Connects #2620
Demo
Notes
As part of an earlier attempt I had the full search available in the monitor tab (see #2620 (comment)), I ultimately decided against using the BiG-CZ views as is for this. This decision is motivated by two constraints:
There are things we'll need to do for 2 which would contradict 1. For example, in BiG-CZ when switching between the Data and Analyze tabs the map state does not change. Whereas in MMW it will. Another issue is that much of BiG-CZ's search UI is absolutely positioned, which does not readily fit in with the altered sizes in MMW. We should create a UI using flexbox and other more modern methods so that the contents fit and work nicely.
Thus, I created a
/monitorpackage in the JavaScript source folder, to be populated with views and templates used in the monitor tab in MMW, and will leave BiG-CZ untouched.Testing Instructions
bundle