NR-381373

- Trying to add an actual exception to the front-end
- Add sourcemap upload step to docker build, but only when API_KEY is present, so it won't do it on a normal build, only a publish

Author: Calvin Allen

.github/workflows/publish_image.yml

@@ -50,6 +50,7 @@ jobs:
                       FOSSA_API_KEY=${{ secrets.FOSSA_API_KEY }}
                       NEW_RELIC_METADATA_COMMIT=${{ github.sha }}
                       NEW_RELIC_METADATA_RELEASE_TAG=${{ github.ref_name }}
+                      NEW_RELIC_API_KEY=${{ secrets.NEW_RELIC_API_KEY }}
 
             - name: Generate artifact attestation
               uses: actions/attest-build-provenance@v1

Dockerfile

@@ -30,13 +30,15 @@ ARG BROWSER_TRUST_KEY
 ARG BROWSER_AGENT_ID
 ARG BROWSER_APPLICATION_ID
 ARG FOSSA_API_KEY
+ARG NEW_RELIC_API_KEY
 
 ENV BROWSER_LICENSE_KEY=$BROWSER_LICENSE_KEY
 ENV BROWSER_ACCOUNT_ID=$BROWSER_ACCOUNT_ID
 ENV BROWSER_TRUST_KEY=$BROWSER_TRUST_KEY
 ENV BROWSER_AGENT_ID=$BROWSER_AGENT_ID
 ENV BROWSER_APPLICATION_ID=$BROWSER_APPLICATION_ID
 ENV FOSSA_API_KEY=$FOSSA_API_KEY
+ENV NEW_RELIC_API_KEY=$NEW_RELIC_API_KEY
 
 RUN --mount=type=cache,target=/root/.gradle ./gradlew downloadNewRelicAgent --console=plain --info --no-daemon --no-watch-fs
 RUN --mount=type=cache,target=/root/.gradle ./gradlew build --console=plain --info --no-daemon --no-watch-fs
@@ -52,6 +54,16 @@ RUN if [ -z "$FOSSA_API_KEY" ] ; then \
         fossa analyze; \
     fi
 
+RUN if [ -z "$NEW_RELIC_API_KEY" ] ; then \
+    echo --SKIPPING SOURCE MAP UPLOAD ; \
+    else \
+      filename=$(ls /src/client/dist/assets/*.js | grep -v '.map.js' | xargs -n 1 basename) && \
+      curl -H "Api-Key: $NEW_RELIC_API_KEY" \
+           -F "sourcemap=/src/client/dist/assets/$filename.map" \
+           -F "javascriptUrl=https://petclinic-demogorgon.staging-service.nr-ops.net/react/assets/$filename" \
+           https://sourcemaps.service.newrelic.com/v2/applications/$BROWSER_APPLICATION_ID/sourcemaps ;\
+    fi
+
 FROM base AS final
 WORKDIR /app
 COPY --from=build /src/build/libs/petclinic-backend-1.0.0.jar .

client/src/pages/Error.tsx

@@ -1,20 +1,38 @@
 import pets from '/src/assets/images/pets.png';
 
+const mapping = new Map<number, string>([
+    [1,"Dogs"],
+    [2,"Cats"],
+    [3,"Horses"],
+    [4,"Iguanas"],
+    [5,"Goblin Sharks"]
+])
+
 export const Error = () => {
+    const renderListItem = (index: number) => {
+        const item = mapping.get(index);
 
+        if(!item){
+            // @ts-ignore
+            throw new Error(`No mapping found for index: ${index}`);
+        }
 
-    const numbers = [0,1,2];
-    const theNumber = numbers[10];
+        return (
+            <li>{item}</li>
+        )
+    }
 
-  return (
-    <>
-      <div className="row">
-        <div className="col-md-12">
-          <img className="img-responsive" src={pets} />
-        </div>
-      </div>
-      <h2>Something happened...</h2>
-        <h3>{theNumber}</h3>
-    </>
-  );
+    return (
+        <>
+          <div className="row">
+            <div className="col-md-12">
+              <img className="img-responsive" src={pets} />
+            </div>
+          </div>
+          <h3>We currently work with the following animal species:</h3>
+          <ol>
+              {[1,2,3,4,5,6].map(i => renderListItem(i))}
+          </ol>
+        </>
+    );
 };