feature: A usable, yet ugly browser extension

2 files changed, 35 insertions, 1 deletions

diff --git a/packages/web/app/api/trpc/[trpc]/route.ts b/packages/web/app/api/trpc/[trpc]/route.ts
index e04539a9..aea9bc70 100644
--- a/packages/web/app/api/trpc/[trpc]/route.ts
+++ b/packages/web/app/api/trpc/[trpc]/route.ts
@@ -8,6 +8,13 @@ const handler = (req: Request) =>
     endpoint: "/api/trpc",
     req,
     router: appRouter,
+    onError: ({ path, error }) => {
+      if (process.env.NODE_ENV === "development") {
+        console.error(`❌ tRPC failed on ${path}`);
+      }
+      console.error(error);
+    },
+
     createContext: async (opts) => {
       // TODO: This is a hack until we offer a proper REST API instead of the trpc based one.
       // Check if the request has an Authorization token, if it does, assume that API key authentication is requested.
diff --git a/packages/web/next.config.mjs b/packages/web/next.config.mjs
index 4678774e..f2ed7754 100644
--- a/packages/web/next.config.mjs
+++ b/packages/web/next.config.mjs
@@ -1,4 +1,31 @@
 /** @type {import('next').NextConfig} */
-const nextConfig = {};
+const nextConfig = {
+  async headers() {
+    return [
+      {
+        // Routes this applies to
+        source: "/api/(.*)",
+        // Headers
+        headers: [
+          // Allow for specific domains to have access or * for all
+          {
+            key: "Access-Control-Allow-Origin",
+            value: "*",
+          },
+          // Allows for specific methods accepted
+          {
+            key: "Access-Control-Allow-Methods",
+            value: "GET, POST, PUT, DELETE, OPTIONS",
+          },
+          // Allows for specific headers accepted (These are a few standard ones)
+          {
+            key: "Access-Control-Allow-Headers",
+            value: "Content-Type, Authorization",
+          },
+        ],
+      },
+    ];
+  },
+};
 
 export default nextConfig;