Better supabase error message (#336)

package.json

@@ -134,6 +134,7 @@
     "react-markdown": "^10.1.0",
     "react-resizable-panels": "^2.1.7",
     "react-shiki": "^0.5.2",
+    "remark-gfm": "^4.0.1",
     "shell-env": "^4.0.1",
     "shiki": "^3.2.1",
     "sonner": "^2.0.3",

src/components/chat/ChatErrorBox.tsx

 import { IpcClient } from "@/ipc/ipc_client";
 import { X } from "lucide-react";
+import ReactMarkdown from "react-markdown";
+import remarkGfm from "remark-gfm";
+
 export function ChatErrorBox({
   onDismiss,
   error,
@@ -88,7 +91,7 @@ function ChatErrorContainer({
   children,
 }: {
   onDismiss: () => void;
-  children: React.ReactNode;
+  children: React.ReactNode | string;
 }) {
   return (
     <div className="relative mt-2 bg-red-50 border border-red-200 rounded-md shadow-sm p-2 mx-4">
@@ -99,7 +102,33 @@ function ChatErrorContainer({
         <X size={14} className="text-red-500" />
       </button>
       <div className="px-6 py-1 text-sm">
-        <div className="text-red-700 text-wrap">{children}</div>
+        <div className="text-red-700 text-wrap">
+          {typeof children === "string" ? (
+            <ReactMarkdown
+              remarkPlugins={[remarkGfm]}
+              components={{
+                a: ({ children: linkChildren, ...props }) => (
+                  <a
+                    {...props}
+                    onClick={(e) => {
+                      e.preventDefault();
+                      if (props.href) {
+                        IpcClient.getInstance().openExternalUrl(props.href);
+                      }
+                    }}
+                    className="text-blue-500 hover:text-blue-700"
+                  >
+                    {linkChildren}
+                  </a>
+                ),
+              }}
+            >
+              {children}
+            </ReactMarkdown>
+          ) : (
+            children
+          )}
+        </div>
       </div>
     </div>
   );

src/supabase_admin/supabase_context.ts

@@ -13,7 +13,9 @@ async function getPublishableKey({ projectId }: { projectId: string }) {
   );
 
   if (!publishableKey) {
-    throw new Error("No publishable key found for project");
+    throw new Error(
+      "No publishable key found for project. Make sure you are connected to the correct Supabase account and project. See https://dyad.sh/docs/integrations/supabase#no-publishable-keys",
+    );
   }
   return publishableKey.api_key;
 }