From faa359e2fb7de46dbf39e36d707c8160f9b4ce05 Mon Sep 17 00:00:00 2001
From: Maciek <maciek@vegaprotocol.io>
Date: Tue, 21 Mar 2023 16:19:54 +0100
Subject: [PATCH] chore(trading): 2764 link to mainnet incident reports (#3235)

---
 apps/trading/.env.devnet                      |  1 +
 apps/trading/.env.mainnet                     |  1 +
 apps/trading/.env.mirror                      |  1 +
 apps/trading/.env.sandbox                     |  1 +
 apps/trading/.env.stagnet1                    |  1 +
 apps/trading/.env.stagnet3                    |  1 +
 apps/trading/.env.testnet                     |  1 +
 apps/trading/.env.validator-testnet           |  2 +-
 .../trading/components/footer/footer.spec.tsx | 14 ++++-
 apps/trading/components/footer/footer.tsx     | 56 +++++++++++++------
 libs/environment/src/hooks/use-environment.ts |  1 +
 .../src/utils/validate-environment.ts         |  1 +
 12 files changed, 61 insertions(+), 20 deletions(-)

diff --git a/apps/trading/.env.devnet b/apps/trading/.env.devnet
index d6d453fbe..0786c55e0 100644
--- a/apps/trading/.env.devnet
+++ b/apps/trading/.env.devnet
@@ -9,3 +9,4 @@ NX_VEGA_TOKEN_URL=https://token.fairground.wtf
 NX_VEGA_WALLET_URL=http://localhost:1789
 NX_VEGA_DOCS_URL=https://docs.vega.xyz/testnet
 NX_VEGA_REPO_URL=https://github.com/vegaprotocol/vega-dev-releases/releases
+NX_VEGA_INCIDENT_URL=https://blog.vega.xyz/tagged/vega-incident-reports
diff --git a/apps/trading/.env.mainnet b/apps/trading/.env.mainnet
index 2d6769a8d..f80b3e53a 100644
--- a/apps/trading/.env.mainnet
+++ b/apps/trading/.env.mainnet
@@ -8,3 +8,4 @@ NX_VEGA_TOKEN_URL=https://token.vega.xyz
 NX_VEGA_WALLET_URL=http://localhost:1789
 NX_VEGA_DOCS_URL=https://docs.vega.xyz/mainnet
 NX_VEGA_REPO_URL=https://github.com/vegaprotocol/vega/releases
+NX_VEGA_INCIDENT_URL=https://blog.vega.xyz/tagged/vega-incident-reports
diff --git a/apps/trading/.env.mirror b/apps/trading/.env.mirror
index ab8d0bc47..31fb1e70d 100644
--- a/apps/trading/.env.mirror
+++ b/apps/trading/.env.mirror
@@ -9,3 +9,4 @@ NX_VEGA_TOKEN_URL=https://mainnet-mirror.token.vega.xyz
 NX_VEGA_WALLET_URL=http://localhost:1789
 NX_VEGA_DOCS_URL=https://docs.vega.xyz/mainnet
 NX_VEGA_REPO_URL=https://github.com/vegaprotocol/vega/releases
+NX_VEGA_INCIDENT_URL=https://blog.vega.xyz/tagged/vega-incident-reports
diff --git a/apps/trading/.env.sandbox b/apps/trading/.env.sandbox
index 51d102e8d..f871ccd01 100644
--- a/apps/trading/.env.sandbox
+++ b/apps/trading/.env.sandbox
@@ -7,3 +7,4 @@ NX_VEGA_NETWORKS={\"DEVNET\":\"https://dev.token.vega.xyz\",\"STAGNET3\":\"https
 NX_VEGA_EXPLORER_URL=https://sandbox.explorer.vega.xyz
 NX_VEGA_DOCS_URL=https://docs.vega.xyz/testnet
 NX_VEGA_REPO_URL=https://github.com/vegaprotocol/vega/releases
+NX_VEGA_INCIDENT_URL=https://blog.vega.xyz/tagged/vega-incident-reports
diff --git a/apps/trading/.env.stagnet1 b/apps/trading/.env.stagnet1
index 8ba1958a8..4f04db569 100644
--- a/apps/trading/.env.stagnet1
+++ b/apps/trading/.env.stagnet1
@@ -9,3 +9,4 @@ NX_VEGA_TOKEN_URL=https://stagnet1.token.vega.xyz
 NX_VEGA_WALLET_URL=http://localhost:1789
 NX_VEGA_DOCS_URL=https://docs.vega.xyz/testnet
 NX_VEGA_REPO_URL=https://github.com/vegaprotocol/vega/releases
+NX_VEGA_INCIDENT_URL=https://blog.vega.xyz/tagged/vega-incident-reports
diff --git a/apps/trading/.env.stagnet3 b/apps/trading/.env.stagnet3
index 4fa62908e..6ebcdc38f 100644
--- a/apps/trading/.env.stagnet3
+++ b/apps/trading/.env.stagnet3
@@ -9,3 +9,4 @@ NX_VEGA_TOKEN_URL=https://token.fairground.wtf
 NX_VEGA_WALLET_URL=http://localhost:1789
 NX_VEGA_DOCS_URL=https://docs.vega.xyz/testnet
 NX_VEGA_REPO_URL=https://github.com/vegaprotocol/vega-dev-releases/releases
+NX_VEGA_INCIDENT_URL=https://blog.vega.xyz/tagged/vega-incident-reports
diff --git a/apps/trading/.env.testnet b/apps/trading/.env.testnet
index 65dd44bc4..96a6d398c 100644
--- a/apps/trading/.env.testnet
+++ b/apps/trading/.env.testnet
@@ -9,3 +9,4 @@ NX_VEGA_TOKEN_URL=https://token.fairground.wtf
 NX_VEGA_WALLET_URL=http://localhost:1789
 NX_VEGA_DOCS_URL=https://docs.vega.xyz/testnet
 NX_VEGA_REPO_URL=https://github.com/vegaprotocol/vega/releases
+NX_VEGA_INCIDENT_URL=https://blog.vega.xyz/tagged/vega-incident-reports
diff --git a/apps/trading/.env.validator-testnet b/apps/trading/.env.validator-testnet
index d8bf44b47..ad7eb694d 100644
--- a/apps/trading/.env.validator-testnet
+++ b/apps/trading/.env.validator-testnet
@@ -9,4 +9,4 @@ NX_VEGA_TOKEN_URL=https://validator-testnet.governance.fairground.wtf
 NX_VEGA_WALLET_URL=http://localhost:1789
 NX_VEGA_DOCS_URL=https://docs.vega.xyz/testnet
 NX_VEGA_REPO_URL=https://github.com/vegaprotocol/vega/releases
-
+NX_VEGA_INCIDENT_URL=https://blog.vega.xyz/tagged/vega-incident-reports
diff --git a/apps/trading/components/footer/footer.spec.tsx b/apps/trading/components/footer/footer.spec.tsx
index 0e9c5553e..4ddfbbd0c 100644
--- a/apps/trading/components/footer/footer.spec.tsx
+++ b/apps/trading/components/footer/footer.spec.tsx
@@ -6,9 +6,10 @@ import { Intent } from '@vegaprotocol/ui-toolkit';
 
 jest.mock('@vegaprotocol/environment', () => ({
   ...jest.requireActual('@vegaprotocol/environment'),
-  useEnvironment: jest
-    .fn()
-    .mockImplementation(() => ({ VEGA_URL: 'https://vega-url.wtf' })),
+  useEnvironment: jest.fn().mockImplementation(() => ({
+    VEGA_URL: 'https://vega-url.wtf',
+    VEGA_INCIDENT_URL: 'https://blog.vega.community',
+  })),
 }));
 
 const mockSetNodeSwitcher = jest.fn();
@@ -26,6 +27,13 @@ describe('NodeHealth', () => {
     await userEvent.click(screen.getByRole('button'));
     expect(mockSetNodeSwitcher).toHaveBeenCalled();
   });
+
+  it('External link to blog should be present', () => {
+    render(<NodeHealth />, { wrapper: MockedProvider });
+    expect(
+      screen.getByRole('link', { name: /^Mainnet status & incidents/ })
+    ).toBeInTheDocument();
+  });
 });
 
 describe('NodeUrl', () => {
diff --git a/apps/trading/components/footer/footer.tsx b/apps/trading/components/footer/footer.tsx
index a2b41a67c..8fdaa7f08 100644
--- a/apps/trading/components/footer/footer.tsx
+++ b/apps/trading/components/footer/footer.tsx
@@ -2,7 +2,7 @@ import { useCallback } from 'react';
 import { useEnvironment, useNodeHealth } from '@vegaprotocol/environment';
 import { t } from '@vegaprotocol/i18n';
 import type { Intent } from '@vegaprotocol/ui-toolkit';
-import { Indicator } from '@vegaprotocol/ui-toolkit';
+import { Indicator, ExternalLink } from '@vegaprotocol/ui-toolkit';
 import classNames from 'classnames';
 import type { ButtonHTMLAttributes, ReactNode } from 'react';
 import { useGlobalStore } from '../../stores';
@@ -19,7 +19,7 @@ export const Footer = () => {
 };
 
 export const NodeHealth = () => {
-  const { VEGA_URL } = useEnvironment();
+  const { VEGA_URL, VEGA_INCIDENT_URL } = useEnvironment();
   const setNodeSwitcher = useGlobalStore(
     (store) => (open: boolean) => store.update({ nodeSwitcherDialog: open })
   );
@@ -27,19 +27,36 @@ export const NodeHealth = () => {
   const onClick = useCallback(() => {
     setNodeSwitcher(true);
   }, [setNodeSwitcher]);
-  return VEGA_URL ? (
-    <FooterButton onClick={onClick} data-testid="node-health">
-      <FooterButtonPart>
-        <HealthIndicator text={text} intent={intent} />
-      </FooterButtonPart>
-      <FooterButtonPart>
-        <NodeUrl url={VEGA_URL} />
-      </FooterButtonPart>
-      <FooterButtonPart>
-        <span title={t('Block height')}>{datanodeBlockHeight}</span>
-      </FooterButtonPart>
-    </FooterButton>
-  ) : null;
+  const incidentsLink = VEGA_INCIDENT_URL && (
+    <ExternalLink className="ml-1" href={VEGA_INCIDENT_URL}>
+      {t('Mainnet status & incidents')}
+    </ExternalLink>
+  );
+  return (
+    <>
+      {VEGA_URL && (
+        <FooterButton onClick={onClick} data-testid="node-health">
+          <FooterButtonPart>
+            <HealthIndicator text={text} intent={intent} />
+          </FooterButtonPart>
+          <FooterButtonPart>
+            <NodeUrl url={VEGA_URL} />
+          </FooterButtonPart>
+          {/* create a monospace effect - avoiding jumps of width */}
+          <FooterButtonPart
+            width={`${
+              datanodeBlockHeight
+                ? String(datanodeBlockHeight).length + 'ch'
+                : 'auto'
+            }`}
+          >
+            <span title={t('Block height')}>{datanodeBlockHeight}</span>
+          </FooterButtonPart>
+        </FooterButton>
+      )}
+      {incidentsLink}
+    </>
+  );
 };
 
 interface NodeUrlProps {
@@ -78,9 +95,16 @@ const FooterButton = (props: FooterButtonProps) => {
   return <button {...props} className={buttonClasses} />;
 };
 
-const FooterButtonPart = ({ children }: { children: ReactNode }) => {
+const FooterButtonPart = ({
+  width = 'auto',
+  children,
+}: {
+  children: ReactNode;
+  width?: string;
+}) => {
   return (
     <span
+      style={{ width }}
       className={classNames(
         'relative inline-block mr-2 last:mr-0 pr-2 last:pr-0',
         'last:after:hidden',
diff --git a/libs/environment/src/hooks/use-environment.ts b/libs/environment/src/hooks/use-environment.ts
index aa3fc1b14..505f40f54 100644
--- a/libs/environment/src/hooks/use-environment.ts
+++ b/libs/environment/src/hooks/use-environment.ts
@@ -285,6 +285,7 @@ function compileEnvVars() {
     GIT_BRANCH: process.env['GIT_COMMIT_BRANCH'],
     GIT_COMMIT_HASH: process.env['GIT_COMMIT_HASH'],
     GIT_ORIGIN_URL: process.env['GIT_ORIGIN_URL'],
+    VEGA_INCIDENT_URL: process.env['NX_VEGA_INCIDENT_URL'],
   };
 
   return env;
diff --git a/libs/environment/src/utils/validate-environment.ts b/libs/environment/src/utils/validate-environment.ts
index 907b7a0ce..90f0cefb7 100644
--- a/libs/environment/src/utils/validate-environment.ts
+++ b/libs/environment/src/utils/validate-environment.ts
@@ -50,6 +50,7 @@ const schemaObject = {
   MAINTENANCE_PAGE: z.optional(z.boolean()),
   ETH_LOCAL_PROVIDER_URL: z.optional(z.string()),
   ETH_WALLET_MNEMONIC: z.optional(z.string()),
+  VEGA_INCIDENT_URL: z.optional(z.string()),
 };
 
 // combine schema above with custom rule to ensure either