From 8e7292783906daab9aa2ddea4661314186d1ee91 Mon Sep 17 00:00:00 2001
From: karooolis <hello@karolisram.com>
Date: Tue, 3 Sep 2024 18:52:34 +0300
Subject: [PATCH 1/4] show error

---
 packages/explorer/src/app/(explorer)/error.tsx   |  8 +++++++-
 .../[worldAddress]/explorer/DataExplorer.tsx     | 16 ++++++++++++++--
 .../explorer/src/app/api/utils/getDatabase.ts    |  6 ++++--
 3 files changed, 25 insertions(+), 5 deletions(-)

diff --git a/packages/explorer/src/app/(explorer)/error.tsx b/packages/explorer/src/app/(explorer)/error.tsx
index 08c77d587a..be9de6768c 100644
--- a/packages/explorer/src/app/(explorer)/error.tsx
+++ b/packages/explorer/src/app/(explorer)/error.tsx
@@ -10,13 +10,19 @@ type Props = {
   reset: () => void;
 };
 
-export default function Error({ reset }: Props) {
+export default function Error({ reset, error }: Props) {
   const getUrl = useWorldUrl();
   return (
     <main className="px-6 py-24 text-center">
       <p className="text-3xl font-semibold text-orange-600">400</p>
       <h1 className="mt-4 text-3xl font-bold tracking-tight text-white sm:text-5xl">Something went wrong :(</h1>
 
+      {error.message && (
+        <pre className="mt-8 inline-block w-[580px] whitespace-normal rounded-md border border-red-500 bg-red-50 p-4 text-left font-mono text-sm leading-6 text-red-500">
+          {error.message}
+        </pre>
+      )}
+
       <div className="mt-10 flex items-center justify-center gap-x-6">
         <Button asChild>
           <Link href={getUrl("explorer")}>Go back to explorer</Link>
diff --git a/packages/explorer/src/app/(explorer)/worlds/[worldAddress]/explorer/DataExplorer.tsx b/packages/explorer/src/app/(explorer)/worlds/[worldAddress]/explorer/DataExplorer.tsx
index b2f728990d..ff7bce4fd3 100644
--- a/packages/explorer/src/app/(explorer)/worlds/[worldAddress]/explorer/DataExplorer.tsx
+++ b/packages/explorer/src/app/(explorer)/worlds/[worldAddress]/explorer/DataExplorer.tsx
@@ -1,5 +1,6 @@
 "use client";
 
+import { Loader } from "lucide-react";
 import { useSearchParams } from "next/navigation";
 import { useQuery } from "@tanstack/react-query";
 import { TableSelector } from "./TableSelector";
@@ -7,17 +8,28 @@ import { TablesViewer } from "./TablesViewer";
 
 export function DataExplorer() {
   const searchParams = useSearchParams();
-  const { data: tables } = useQuery({
+  const { data: tables, isLoading } = useQuery({
     queryKey: ["tables"],
     queryFn: async () => {
       const response = await fetch("/api/tables");
-      return response.json();
+      const json = await response.json();
+      if (!response.ok) {
+        throw new Error(json.error);
+      }
+
+      return json;
     },
     select: (data) => data.tables.map((table: { name: string }) => table.name),
     refetchInterval: 15000,
+    throwOnError: true,
+    retry: false,
   });
   const selectedTable = searchParams.get("table") || (tables?.length > 0 ? tables[0] : null);
 
+  if (isLoading) {
+    return <Loader className="animate-spin" />;
+  }
+
   return (
     <>
       <TableSelector value={selectedTable} options={tables} />
diff --git a/packages/explorer/src/app/api/utils/getDatabase.ts b/packages/explorer/src/app/api/utils/getDatabase.ts
index b819af85e8..a27cf23d3e 100644
--- a/packages/explorer/src/app/api/utils/getDatabase.ts
+++ b/packages/explorer/src/app/api/utils/getDatabase.ts
@@ -4,12 +4,14 @@ import fs from "fs";
 export function getDatabase(): Database | null {
   const dbPath = process.env.INDEXER_DATABASE as string;
   if (!fs.existsSync(dbPath)) {
-    return null;
+    throw new Error(
+      "Database cannot be found. Make sure --indexerDatabase flag or INDEXER_DATABASE environment variable are set, and the indexer is running.",
+    );
   }
 
   const db = new sqliteDB(dbPath);
   if (!db) {
-    return null;
+    throw new Error("Database path found but failed to initialize.");
   }
 
   return db;

From 8b0b63f7f6a6a3b5e03b955622caf64eaef1ea9e Mon Sep 17 00:00:00 2001
From: Karolis Ramanauskas <hello@karolisram.com>
Date: Tue, 3 Sep 2024 18:56:08 +0300
Subject: [PATCH 2/4] Create lazy-ties-double.md

---
 .changeset/lazy-ties-double.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/lazy-ties-double.md

diff --git a/.changeset/lazy-ties-double.md b/.changeset/lazy-ties-double.md
new file mode 100644
index 0000000000..fa2e047e6b
--- /dev/null
+++ b/.changeset/lazy-ties-double.md
@@ -0,0 +1,5 @@
+---
+"@latticexyz/explorer": patch
+---
+
+Added optional error messages to error pages to facilitate easier troubleshooting.

From fff9a1164b3318e1881a63d16834594a5a746397 Mon Sep 17 00:00:00 2001
From: karooolis <hello@karolisram.com>
Date: Tue, 3 Sep 2024 21:24:53 +0300
Subject: [PATCH 3/4] update coloring

---
 packages/explorer/src/app/(explorer)/error.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/explorer/src/app/(explorer)/error.tsx b/packages/explorer/src/app/(explorer)/error.tsx
index be9de6768c..2c1604616b 100644
--- a/packages/explorer/src/app/(explorer)/error.tsx
+++ b/packages/explorer/src/app/(explorer)/error.tsx
@@ -18,7 +18,7 @@ export default function Error({ reset, error }: Props) {
       <h1 className="mt-4 text-3xl font-bold tracking-tight text-white sm:text-5xl">Something went wrong :(</h1>
 
       {error.message && (
-        <pre className="mt-8 inline-block w-[580px] whitespace-normal rounded-md border border-red-500 bg-red-50 p-4 text-left font-mono text-sm leading-6 text-red-500">
+        <pre className="mt-8 inline-block w-[580px] whitespace-normal rounded-md border border-white/15 bg-secondary p-4 text-left font-mono text-sm leading-6 text-white">
           {error.message}
         </pre>
       )}

From cb2675dc6b02aaa8add3d5319180395d8c21d7d4 Mon Sep 17 00:00:00 2001
From: Karolis Ramanauskas <hello@karolisram.com>
Date: Tue, 3 Sep 2024 21:33:57 +0300
Subject: [PATCH 4/4] Update lazy-ties-double.md

---
 .changeset/lazy-ties-double.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.changeset/lazy-ties-double.md b/.changeset/lazy-ties-double.md
index fa2e047e6b..56c7381bbe 100644
--- a/.changeset/lazy-ties-double.md
+++ b/.changeset/lazy-ties-double.md
@@ -2,4 +2,4 @@
 "@latticexyz/explorer": patch
 ---
 
-Added optional error messages to error pages to facilitate easier troubleshooting.
+Added error messages to error page to facilitate easier troubleshooting.