EDSC-3932: Integrate edsc-visualize as a lambda into EDSC remove calls to the browse-scaler API

[eudoroolivares2016]

Overview

What is the feature?

We want to remove the application browse-scaler from CMR and achieve feature parity with that API as a lambda within EDSC. EDSC is the only client to that API and infrastructure, maintenance, and over complication of that API's artifacts can be significantly reduced this way.

What is the Solution?

We pulled in an existing application which was never deployed edsc-visaulize (https://git.earthdata.nasa.gov/projects/EDSC/repos/edsc-visualize/browse/src/scaleImage) updated it to be able to integrate with EDSC and updated remaining EDSC modules to utilize this API in the from of a new AWS lambda. This also utilizes the infrastructure that browse-scaler previously used (a redis cache deployed as an elasticache) to cache images found to improve performance. Additionally due to limitations around API-gateway instances not allowing for binary media to be returned unless specific Accept headers get passed image/png in our case. Because we cannot predict the order or the type of Accept header that a browser is going to sent via the src prop of an img element. We must request the image ourselves while supplying that Accept header. As a result we needed to add modules and refactor state of the EDSCImage component so that we could ensure that thumbnails are rendered correctly. One additional point of contention was around the granule browse imagery cells on the granule table view. That component is wrapping around the react-table NPM component. Either that component (the NPM) or our implementation of the component has issues where table cells and columns are re-rendering often (this also occurs in prod but, is masked by browser-caching). We are significantly behind in versions and there was evidence that others experienced similar issues on their issues page. Memoization on those cells was not successful which appears to be because of the react-table package. The v7 that we are using has reported issues where memoization was not possible for individual cells or columns. Due to this and the addition of the imagery modal popover which was added last year, and replaces much of that functionality, as well as the image size being small such that its use to discern granules is limited, we have elected to hide the cell for now and either delete it or restore it pending an update to the table component for its updated version.

What areas of the application does this impact?

Serverless, cloud-formation, adds a new lambda, and alters collection/granule request modules

Testing

Reproduction steps

• Any Environment but, Prod has by far the greatest variety and number of browsable-imagry
• Collection to test with:

1. From the top level /search page we can see the thumbnails for the various collections and these should fill in as we scroll down for collections which have images. The rest should get the no image found default image instead.

2. Click into a collection with a thumbnail to see the granule images once the granule images load we can scroll down to browse all of the granule images within a collection

3. Click on a specific granule i.e. make it a focused granule to get the image viewer modal to pop up. For granules with multiple images we can see all the images on that specific granule.

4. View the cache keys to ensure that values are in fact getting cached. To do so locally you need to enable the useCache feature toggle and utilize some redis cache either the service itself or through a docker container

Attachments

Please include relevant screenshots or files that would be helpful in reviewing and verifying this change.

Checklist

• I have added automated tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation
• My changes generate no new warnings
• I have updated other documentation pertaining to EDSC architecture to include the redis cache

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 92.00%. Comparing base (16b266d) to head (e5f8c47).
Report is 1 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1716      +/-   ##
==========================================
+ Coverage   91.95%   92.00%   +0.04%     
==========================================
  Files         725      739      +14     
  Lines       19383    19638     +255     
  Branches     4585     4653      +68     
==========================================
+ Hits        17824    18067     +243     
- Misses       1423     1434      +11     
- Partials      136      137       +1     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[eudoroolivares2016]

This PR is still ongoing; the issue is that during some feature branch testing we came to find a dependency we have with our AWS infrastructure which requires NGAP to configure an additional API_GWY layer outside of our control to allow binary media types in the lambda responses. See ticket comments for accompanying NASD ticket

[codecov-commenter]

Codecov Report

Attention: Patch coverage is 99.56522% with 1 lines in your changes are missing coverage. Please review.

Project coverage is 92.01%. Comparing base (b796613) to head (479b59b).

Files	Patch %	Lines
...erverless/src/scaleImage/utils/cache/cacheImage.js	90.90%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1716      +/-   ##
==========================================
+ Coverage   91.93%   92.01%   +0.08%     
==========================================
  Files         730      744      +14     
  Lines       19568    19769     +201     
  Branches     4647     4700      +53     
==========================================
+ Hits        17989    18190     +201     
  Misses       1441     1441              
  Partials      138      138              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[eudoroolivares2016]

Was not being used

[eudoroolivares2016]

Needed so I could read in an svg into serverless to return unavailable images during failures

[eudoroolivares2016]

This needed to be updated because sharp its latest version, only accepts at least NPM10. Previous docker node image was using <10 so sharp was not being installed correctly see: https://sharp.pixelplumbing.com/install#cross-platform

[bnp26]

I'm still reviewing, but just wanted to get these out for now.