explorer: add fetch polyfill and clean up / message change (#15505)

explorer/package-lock.json

@@ -5790,6 +5790,14 @@
         "sha.js": "^2.4.8"
       }
     },
+    "cross-fetch": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/cross-fetch/-/cross-fetch-3.0.6.tgz",
+      "integrity": "sha512-KBPUbqgFjzWlVcURG+Svp9TlhA5uliYtiNx/0r8nv0pdypeQCRJ9IaSIc3q/x3q8t3F75cHuwxVql1HFGHCNJQ==",
+      "requires": {
+        "node-fetch": "2.6.1"
+      }
+    },
     "cross-spawn": {
       "version": "6.0.5",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",

explorer/package.json

@@ -29,6 +29,7 @@
     "chai": "^4.3.0",
     "chart.js": "^2.9.4",
     "classnames": "2.2.6",
+    "cross-fetch": "^3.0.6",
     "humanize-duration-ts": "^2.1.1",
     "node-sass": "^4.14.1",
     "prettier": "^2.2.1",

explorer/src/pages/AccountDetailsPage.tsx

@@ -162,8 +162,8 @@ function DetailsSections({ pubkey, tab }: { pubkey: PublicKey; tab?: string }) {
     <>
       {flaggedAccounts.has(address) && (
         <div className="alert alert-danger alert-scam" role="alert">
-          Warning! This account has been flagged as a scam account. Please be
-          cautious sending SOL to this account.
+          Warning! This account has been flagged by the community as a scam
+          account. Please be cautious sending SOL to this account.
         </div>
       )}
       {<InfoSection account={account} />}

explorer/src/providers/accounts/flagged-accounts.tsx

@@ -1,20 +1,21 @@
 import React from "react";
+import { fetch } from "cross-fetch";
 
-const initialState = new Map();
-const FlaggedContext = React.createContext<Map<string, boolean>>(initialState);
+const FLAGGED_REGISTRY =
+  "https://solana-labs.github.io/solana-flagged-accounts/flagged.txt";
 
+type FlaggedMap = Map<string, boolean>;
 type ProviderProps = { children: React.ReactNode };
 
+const FlaggedContext = React.createContext<FlaggedMap>(new Map());
+
 export function FlaggedAccountsProvider({ children }: ProviderProps) {
-  const [flaggedAccounts, setFlaggedAccounts] = React.useState<
-    Map<string, boolean>
-  >(initialState);
+  const [flaggedAccounts, setFlaggedAccounts] = React.useState<FlaggedMap>(
+    new Map()
+  );
 
   React.useEffect(() => {
-    window
-      .fetch(
-        "https://solana-labs.github.io/solana-flagged-accounts/flagged.txt"
-      )
+    fetch(FLAGGED_REGISTRY)
       .then((res) => {
         return res.text();
       })