From 92dc291c981aa78dcc000b690bc5a9b64f46f100 Mon Sep 17 00:00:00 2001
From: Nick Scialli <7538045+nas5w@users.noreply.github.com>
Date: Thu, 16 Jan 2025 21:45:02 -0500
Subject: [PATCH] Add Canada domains and handle errors better in web app

---
 projects/config/index.ts | 16 ++++++++++------
 projects/web/src/App.tsx | 34 +++++++++++++++++++++-------------
 2 files changed, 31 insertions(+), 19 deletions(-)

diff --git a/projects/config/index.ts b/projects/config/index.ts
index 2289ff3..6b37ee4 100644
--- a/projects/config/index.ts
+++ b/projects/config/index.ts
@@ -1,15 +1,19 @@
 export const config = {
-  us: {
-    name: "United States",
-    domains: [".gov", ".mil"],
+  br: {
+    name: "Brazil",
+    domains: [".gov.br"],
+  },
+  ca: {
+    name: "Canada",
+    domains: [".gc.ca", ".canada.ca"],
   },
   uk: {
     name: "United Kingdom",
     domains: [".gov.uk"],
   },
-  br: {
-    name: "Brazil",
-    domains: [".gov.br"],
+  us: {
+    name: "United States",
+    domains: [".gov", ".mil"],
   },
 } as const;
 
diff --git a/projects/web/src/App.tsx b/projects/web/src/App.tsx
index 41e4f10..9e02c79 100644
--- a/projects/web/src/App.tsx
+++ b/projects/web/src/App.tsx
@@ -15,6 +15,7 @@ function App() {
   const { country } = useParams<"country">();
   const [allHandles, setAllHandles] = useState<DomainHandles[]>();
   const [domains, setDomains] = useState<AllowedDomains>();
+  const [error, setError] = useState(false);
   const [term, setTerm] = useState("");
   const navigate = useNavigate();
 
@@ -29,17 +30,20 @@ function App() {
 
       setDomains(domains);
 
-      const results = (
-        await Promise.all(
-          domains.map(async (domain) => {
-            const res = await fetch(`https://govsky.fly.dev/api/${domain}`);
-            const { data } = await res.json();
-            return { domain, data: data as ApiUser[] };
-          })
-        )
-      ).flat();
-
-      setAllHandles(results);
+      try {
+        const results = (
+          await Promise.all(
+            domains.map(async (domain) => {
+              const res = await fetch(`https://govsky.fly.dev/api/${domain}`);
+              const { data } = await res.json();
+              return { domain, data: (data || []) as ApiUser[] };
+            })
+          )
+        ).flat();
+        setAllHandles(results);
+      } catch {
+        setError(true);
+      }
     }
     load();
   }, [country, navigate]);
@@ -97,8 +101,12 @@ function App() {
       </div>
 
       {!data ? (
-        <p className="no-results">Loading...</p>
-      ) : !data.length ? (
+        <p className="no-results">
+          {error
+            ? "There was an error loading this page. Please try again. If the problem persists, report an issue on GitHub."
+            : "Loading..."}
+        </p>
+      ) : data.length <= 1 ? (
         <p className="no-results">No results.</p>
       ) : (
         <TreeView