Merge pull request #944 from nasa/develop

merging v5.0.0 into master

CHANGELOG.md

@@ -7,8 +7,56 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 ## [Unreleased]
 
+## [v5.0.0] - 2021-03-23
+
+## Breaking Changes
+
+This version of the dashboard requires Cumulus API 7.0.0
+
+### Fixed
+
+- **CUMULUS-bugfix**
+  - Fixes typos in version compatibility tests
+
+- **CUMULUS-2310**
+  - Allow slash in reconciliation report name
+
+- **CUMULUS-2349**
+  - Stop scrolling of checkboxes in tables
+  - Other tweaks to prevent unexpected horizontal scrolling in tables
+
+- **CUMULUS-2415**
+  - Fixes issue with executions not always displaying the graph corresponding to the current execution
+
+- **CUMULUS-2419**
+  - Fixes log viewer query for cloud metrics log
+  - Requires @cumulus/api@7.0.0
+
+### Changed
+
+- **CUMULUS-bugfix**
+  - replaced deprecated node-sass with sass
+
+- **CUMULUS-2321**
+  - Updated reconciliation report to work with the API endpoint changes
+  - Requires @cumulus/api@5.0.2-alpha.0
+
+- **CUMULUS-2366**
+  - Removes logs from dashboard display when metrics is not setup
+
+### Added
+
+- **CUMULUS-2297**
+  - Add ability to show/hide columns on all tables
+
 ## [v4.0.0] - 2021-01-13
 
+## Breaking Changes
+
+This version of the dashboard requires Cumulus API v5.0.0
+
+## All Changes
+
 ### Fixed
 - **CUMULUS-1765**
   - Update 'Errors' tile Kibana link to reflect 'failed' granules and datepicker
@@ -23,6 +71,9 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 - **CUMULUS-2073**
   - Update forms with the required indicator and description
 
+- **CUMULUS-2148**
+  - Fix bug on Report deletion where the report wouldn't be removed from the table
+
 - **CUMULUS-2263**
   - Update Pagination input to show possible page options in dropdown
 
@@ -790,7 +841,8 @@ Fix for serving the dashboard through the Cumulus API.
 
 - Versioning and changelog [CUMULUS-197] by @kkelly51
 
-[Unreleased]: https://github.com/nasa/cumulus-dashboard/compare/v4.0.0...HEAD
+[Unreleased]: https://github.com/nasa/cumulus-dashboard/compare/v5.0.0...HEAD
+[v5.0.0]: https://github.com/nasa/cumulus-dashboard/compare/v4.0.0...v5.0.0
 [v4.0.0]: https://github.com/nasa/cumulus-dashboard/compare/v3.0.0...v4.0.0
 [v3.0.0]: https://github.com/nasa/cumulus-dashboard/compare/v2.0.0...v3.0.0
 [v2.0.0]: https://github.com/nasa/cumulus-dashboard/compare/v1.10.0...v2.0.0

README.md

@@ -72,18 +72,18 @@ Set the environment and build the dashboard with these commands:
   $ source production.env && ./bin/build_dashboard_via_docker.sh
 ```
 
-This creates the compiled dashboard in the `./dist` directory. You can now deploy this directory to AWS behind [CloudFront](https://aws.amazon.com/cloudfront/).  If you are in NGAP, follow the instructions for "Request Public or Protected Access to the APIs and Dashboard" on the earthdata wiki page [Using Cumulus with Private APIs](https://wiki.earthdata.nasa.gov/display/CUMULUS/Cumulus+Deployments+in+NGAP).
+This script uses Docker Compose to build and copy the a compiled dashboard into the `./dist` directory. You can now deploy this directory to AWS behind [CloudFront](https://aws.amazon.com/cloudfront/).  If you are in NGAP, follow the instructions for "Request Public or Protected Access to the APIs and Dashboard" on the earthdata wiki page [Using Cumulus with Private APIs](https://wiki.earthdata.nasa.gov/display/CUMULUS/Cumulus+Deployments+in+NGAP).
 
 
 ### Run the dashboard locally via Docker Image
 
-Once you have a built a dashboard and the contents are in the `./dist` directory, you can create a Docker container that will serve the dashboard behind a simple nginx configuration. Having a runnable Docker image is useful for testing a build before deployment or for NGAP Sandbox environments, where if you configure your computer to [access Cumulus APIs via SSM](https://wiki.earthdata.nasa.gov/display/CUMULUS/Accessing+Cumulus+APIs+via+SSM), you can run the dashboard container locally against the live Sandbox Cumulus API.
+You can also create a Docker container that will serve the dashboard behind a simple nginx configuration. Having a runnable Docker image is useful for testing a build before deployment or for NGAP Sandbox environments, where if you configure your computer to [access Cumulus APIs via SSM](https://wiki.earthdata.nasa.gov/display/CUMULUS/Accessing+Cumulus+APIs+via+SSM), you can run the dashboard container locally against the live Sandbox Cumulus API.
 
-The script `./bin/build_dashboard_image.sh` takes a pre-built dashboard in the `./dist` directly and packages it in a Docker container behind a basic nginx configuration. The script takes one optional parameter, the tag to name the generated image which defaults to cumulus-dashboard:latest.
+The script `./bin/build_dashboard_image.sh` will build a docker image containing the dashboard bundle served behind a basic [nginx](https://www.nginx.com/) configuration. The script takes one optional parameter, the tag to name the generated image which defaults to cumulus-dashboard:latest.  The same customizations as described in the [previous section](#build-the-dashboard-using-docker-and-docker-compose) are available to configure your dashboard.
 
 Example of building and running the project in Docker:
 ```bash
-  $ ./bin/build_dashboard_image.sh cumulus-dashboard:production-1
+  $ source production.env && ./bin/build_dashboard_image.sh cumulus-dashboard:production-1
 ```
 
 That command builds a Docker image with the name `cumulus-dashboard` and tag `production-1`. This image can be run in Docker to serve the Dashboard.
@@ -349,6 +349,8 @@ Update the CHANGELOG.md. Put a header under the 'Unreleased' section with the ne
 
 Add a link reference for the GitHub "compare" view at the bottom of the CHANGELOG.md, following the existing pattern. This link reference should create a link in the CHANGELOG's release header to changes in the corresponding release.
 
+Check to make sure there are `Breaking Changes` and `All Changes` section for the release if there are breaking changes. e.g. a new version of Cumulus API is required.
+
 ### 6. Update the version of the Cumulus API
 
 If this release corresponds to a Cumulus Core package release, update the version of `@cumulus/api` to the latest package version so that the integration tests will run against that version.
@@ -381,4 +383,8 @@ Create and push a new git tag:
 
 Follow the [Github documentation to create a new release](https://help.github.com/articles/creating-releases/) for the dashboard using the tag that you just pushed. Make sure to use the content from the CHANGELOG for this release as the description of the release on GitHub.
 
+### 12. Create PR of master back into develop
+
+Create a PR for the `master` branch back into `develop` to bring the merge commit back into develop.
+
 <a name="bundlefootnote">1</a>: A dashboard bundle is just a ready-to-deploy compiled version of the dashboard and environment.

app/src/css/modules/_table.scss

@@ -23,14 +23,15 @@
   .thead, .tbody {
     width: fit-content;
     min-width: 100%;
+    overflow: hidden;
   }
 
   .thead {
     background-color: $ocean-blue;
     .th {
       color: $white;
       font-weight: $base-font-semibold;
-      padding: 1em 2em;
+      padding: 1em 1.5em;
       font-size: .86em;
 
       &.no-resize {
@@ -52,6 +53,10 @@
           overflow: auto;
         }
 
+        &.table__checkbox {
+          padding: 1em 1.5em;
+        }
+
         /*
          * From https://stackoverflow.com/questions/7492062/css-overflow-scroll-always-show-vertical-scroll-bar/10100209#10100209
          * The horizontal scrollbar does not always show, depending on the user's OS settings.
@@ -110,16 +115,13 @@
 }
 
 .list__filters {
-  margin: 1.5em 0 2em;
+  margin: 1.5em 0 .5em;
+  display: flex;
   @extend .clearfix;
   label {
     font-size: .86em;
   }
 
-  &--flex {
-    display: flex;
-  }
-
   &--item {
     display: inline-block;
     vertical-align: bottom;
@@ -146,8 +148,7 @@
     background: $white;
     padding: 2em;
     margin: 1em 0;
-    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.08);
-    border-radius: 8px;
+    box-shadow: $shadow__default;
   }
 
   &--filter {
@@ -165,9 +166,8 @@
   padding: 1em 1em .4em 1em;
   border: 1px solid $border-grey;
   box-shadow: $shadow__default;
-  width: 100%;
 
-  h {
+  h4 {
     font-size: .86em;
   }
 
@@ -178,14 +178,14 @@
 }
 
 .list-action-wrapper {
-  padding-top: 1.5em;
   display: flex;
   flex-wrap: wrap;
-  align-items: flex-end;
 
-  &.no-actions {
-    align-items: center;
+  &:not(.no-actions) {
+    align-items: flex-start;
+  }
 
+  &.no-actions {
     .filters {
       margin: 1em 0;
     }
@@ -194,11 +194,14 @@
 
 .list-actions {
   display: flex;
+  align-items: flex-start;
   justify-content: space-around;
   flex-grow: 1;
+  margin-top: 3em;
 
   .form--controls {
     flex-grow: 1;
+    margin-bottom: 1em;
   }
 }
 
@@ -506,24 +509,21 @@
 // Table Progress Feature //
 
 .table__progress {
-  min-width: 160px;
-  padding-right: 60px;
+  width: 100%;
 }
 
 .table__progress--name {
   font-weight: $base-font-regular;
 }
 
 .table__progress--outer {
-  position: relative;
-  height: 6px;
+  display: flex;
+  align-items: center;
 }
 
 .table__progress--bar {
   display: inline-block;
   background-color: $ocean-blue;
-  position: absolute;
-  left: 0;
   height: 6px;
 }
 
@@ -534,9 +534,7 @@
 
 .table__progress--text {
   font-size: 0.8em;
-  position: absolute;
   margin-left: 6px;
-  top: -4px;
 }
 
 .table__error {

app/src/js/actions/index.js

@@ -894,7 +894,7 @@ export const getReconciliationReport = (reconciliationName) => ({
     id: reconciliationName,
     type: types.RECONCILIATION,
     method: 'GET',
-    path: `reconciliationReports/${reconciliationName}`
+    path: `reconciliationReports/${encodeURIComponent(reconciliationName)}`
   }
 });
 
@@ -913,7 +913,7 @@ export const deleteReconciliationReport = (reconciliationName) => ({
     id: reconciliationName,
     type: types.RECONCILIATION_DELETE,
     method: 'DELETE',
-    path: `reconciliationReports/${reconciliationName}`
+    path: `reconciliationReports/${encodeURIComponent(reconciliationName)}`
   }
 });
 

app/src/js/components/Collections/index.js

@@ -17,10 +17,11 @@ import DatePickerHeader from '../DatePickerHeader/DatePickerHeader';
 import { listCollections } from '../../actions';
 import { filterQueryParams } from '../../utils/url-helper';
 
-const Collections = ({ dispatch, location, queryParams }) => {
+const Collections = ({ dispatch, location, logs, queryParams }) => {
   const { pathname } = location;
   const existingCollection = pathname !== '/collections/add';
   const filteredQueryParams = filterQueryParams(queryParams);
+  const { metricsNotConfigured } = logs;
 
   function query() {
     dispatch(listCollections(filteredQueryParams));
@@ -129,11 +130,11 @@ const Collections = ({ dispatch, location, queryParams }) => {
                 path="/collections/collection/:name/:version/definition"
                 component={CollectionIngest}
               />
-              <Route
+              {!metricsNotConfigured && <Route
                 exact
                 path="/collections/collection/:name/:version/logs"
                 component={CollectionLogs}
-              />
+              />}
             </Switch>
           </div>
         </div>
@@ -147,7 +148,8 @@ Collections.displayName = strings.collection;
 Collections.propTypes = {
   dispatch: PropTypes.func,
   location: PropTypes.object,
+  logs: PropTypes.object,
   queryParams: PropTypes.object,
 };
 
-export default withRouter(withQueryParams()(connect()(Collections)));
+export default withRouter(withQueryParams()(connect((state) => ({ logs: state.logs }))(Collections)));