Send the API_BASE from env to the client during hydration (#89)

StractOrg · Sep 4, 2023 · 2ae8151 · 2ae8151
1 parent 6fa3ac8
commit 2ae8151
Show file tree

Hide file tree

Showing 5 changed files with 51 additions and 38 deletions.
diff --git a/frontend/fresh.gen.ts b/frontend/fresh.gen.ts
@@ -16,21 +16,22 @@ import * as $10 from "./routes/settings/optics.tsx";
 import * as $11 from "./routes/settings/privacy.tsx";
 import * as $12 from "./routes/settings/sites.tsx";
 import * as $13 from "./routes/webmasters.tsx";
-import * as $$0 from "./islands/Discussions.tsx";
-import * as $$1 from "./islands/ExploreSites.tsx";
-import * as $$2 from "./islands/Improvements.tsx";
-import * as $$3 from "./islands/ManageOptics.tsx";
-import * as $$4 from "./islands/OpticsSelector.tsx";
-import * as $$5 from "./islands/PrivacySelector.tsx";
-import * as $$6 from "./islands/RegionSelector.tsx";
-import * as $$7 from "./islands/SafeSearchSettings.tsx";
-import * as $$8 from "./islands/SearchResultAdjust.tsx";
-import * as $$9 from "./islands/Searchbar.tsx";
-import * as $$10 from "./islands/SiteRanking.tsx";
-import * as $$11 from "./islands/Snippet.tsx";
-import * as $$12 from "./islands/chat/Chat.tsx";
-import * as $$13 from "./islands/chat/state.ts";
-import * as $$14 from "./islands/chat/traces.ts";
+import * as $$0 from "./islands/ApiClient.tsx";
+import * as $$1 from "./islands/Discussions.tsx";
+import * as $$2 from "./islands/ExploreSites.tsx";
+import * as $$3 from "./islands/Improvements.tsx";
+import * as $$4 from "./islands/ManageOptics.tsx";
+import * as $$5 from "./islands/OpticsSelector.tsx";
+import * as $$6 from "./islands/PrivacySelector.tsx";
+import * as $$7 from "./islands/RegionSelector.tsx";
+import * as $$8 from "./islands/SafeSearchSettings.tsx";
+import * as $$9 from "./islands/SearchResultAdjust.tsx";
+import * as $$10 from "./islands/Searchbar.tsx";
+import * as $$11 from "./islands/SiteRanking.tsx";
+import * as $$12 from "./islands/Snippet.tsx";
+import * as $$13 from "./islands/chat/Chat.tsx";
+import * as $$14 from "./islands/chat/state.ts";
+import * as $$15 from "./islands/chat/traces.ts";
 
 const manifest = {
   routes: {
@@ -50,21 +51,22 @@ const manifest = {
     "./routes/webmasters.tsx": $13,
   },
   islands: {
-    "./islands/Discussions.tsx": $$0,
-    "./islands/ExploreSites.tsx": $$1,
-    "./islands/Improvements.tsx": $$2,
-    "./islands/ManageOptics.tsx": $$3,
-    "./islands/OpticsSelector.tsx": $$4,
-    "./islands/PrivacySelector.tsx": $$5,
-    "./islands/RegionSelector.tsx": $$6,
-    "./islands/SafeSearchSettings.tsx": $$7,
-    "./islands/SearchResultAdjust.tsx": $$8,
-    "./islands/Searchbar.tsx": $$9,
-    "./islands/SiteRanking.tsx": $$10,
-    "./islands/Snippet.tsx": $$11,
-    "./islands/chat/Chat.tsx": $$12,
-    "./islands/chat/state.ts": $$13,
-    "./islands/chat/traces.ts": $$14,
+    "./islands/ApiClient.tsx": $$0,
+    "./islands/Discussions.tsx": $$1,
+    "./islands/ExploreSites.tsx": $$2,
+    "./islands/Improvements.tsx": $$3,
+    "./islands/ManageOptics.tsx": $$4,
+    "./islands/OpticsSelector.tsx": $$5,
+    "./islands/PrivacySelector.tsx": $$6,
+    "./islands/RegionSelector.tsx": $$7,
+    "./islands/SafeSearchSettings.tsx": $$8,
+    "./islands/SearchResultAdjust.tsx": $$9,
+    "./islands/Searchbar.tsx": $$10,
+    "./islands/SiteRanking.tsx": $$11,
+    "./islands/Snippet.tsx": $$12,
+    "./islands/chat/Chat.tsx": $$13,
+    "./islands/chat/state.ts": $$14,
+    "./islands/chat/traces.ts": $$15,
   },
   baseUrl: import.meta.url,
 };

diff --git a/frontend/islands/ApiClient.tsx b/frontend/islands/ApiClient.tsx
@@ -0,0 +1,9 @@
+import { useEffect } from "preact/hooks";
+import { API_BASE } from "../search/index.ts";
+
+export const ApiClient = ({ apiBase }: { apiBase: string }) => {
+  useEffect(() => {
+    API_BASE.value = apiBase;
+  }, [apiBase]);
+  return null;
+};
diff --git a/frontend/routes/_app.tsx b/frontend/routes/_app.tsx
@@ -1,6 +1,8 @@
 import { AppProps } from "$fresh/server.ts";
 import { injectGlobal } from "https://esm.sh/@twind/[email protected]";
 import { DefaultCSP } from "../search/utils.ts";
+import { ApiClient } from "../islands/ApiClient.tsx";
+import { apiBaseFromEnv } from "../search/index.ts";
 
 export default function App({ Component }: AppProps) {
   injectGlobal`
@@ -61,6 +63,7 @@ export default function App({ Component }: AppProps) {
   return (
     <>
       <DefaultCSP />
+      <ApiClient apiBase={apiBaseFromEnv()} />
       <html lang="en" class="h-full">
         <head>
           <meta charSet="UTF-8" />

diff --git a/frontend/routes/search.tsx b/frontend/routes/search.tsx
@@ -43,13 +43,8 @@ type SearchParams = {
 const extractSearchParams = (searchParams: URLSearchParams): SearchParams => {
   const query = searchParams.get("q") ?? "";
   const currentPage = parseInt(searchParams.get("p") ?? "1") || 1;
-  let optic = searchParams.get("optic") ?? void 0;
-
-  if (optic == "") {
-    optic = void 0;
-  }
-
-  const selectedRegion = searchParams.get("gl") ?? void 0;
+  const optic = searchParams.get("optic") || void 0;
+  const selectedRegion = searchParams.get("gl") || void 0;
   const safeSearch = searchParams.get("ss") == "true";
   const siteRankingsParam = searchParams.get("sr");
   const siteRankings = siteRankingsParam

diff --git a/frontend/search/index.ts b/frontend/search/index.ts
@@ -2,6 +2,7 @@
 
 import { match } from "ts-pattern";
 import type { components, paths } from "./schema.d.ts";
+import { signal } from "@preact/signals";
 
 type Values<T> = T[keyof T];
 
@@ -17,7 +18,10 @@ type Produces<P extends keyof paths, M extends keyof paths[P]> =
     }
     : never;
 
-const API_BASE = Deno.env.get("STRACT_API_BASE") ?? "http://localhost:3000";
+export const apiBaseFromEnv = () =>
+  (typeof Deno != "undefined" && Deno.env.get("STRACT_API_BASE")) ||
+  "http://localhost:3000";
+export const API_BASE = signal(apiBaseFromEnv());
 
 export const send = <
   P extends keyof paths,