From 96fd5cc35e9ca85aba48670860e6bf2a4a2caaa9 Mon Sep 17 00:00:00 2001
From: Meier Lukas <meierschlumpf@gmail.com>
Date: Thu, 30 Jan 2025 22:14:14 +0100
Subject: [PATCH] fix: use hostname for suspense query url (#2187)

---
 .../src/app/[locale]/_client-providers/trpc.tsx   |  4 ++--
 apps/nextjs/src/app/api/trpc/[trpc]/route.ts      |  3 ++-
 apps/nextjs/src/middleware.ts                     |  4 ++--
 packages/api/src/client.ts                        | 15 +--------------
 packages/api/src/shared.ts                        | 15 +++++++++++++++
 5 files changed, 22 insertions(+), 19 deletions(-)

diff --git a/apps/nextjs/src/app/[locale]/_client-providers/trpc.tsx b/apps/nextjs/src/app/[locale]/_client-providers/trpc.tsx
index 2588cf44a..456c09a99 100644
--- a/apps/nextjs/src/app/[locale]/_client-providers/trpc.tsx
+++ b/apps/nextjs/src/app/[locale]/_client-providers/trpc.tsx
@@ -18,8 +18,8 @@ import superjson from "superjson";
 import type { SuperJSONResult } from "superjson";
 
 import type { AppRouter } from "@homarr/api";
-import { clientApi, getTrpcUrl } from "@homarr/api/client";
-import { createHeadersCallbackForSource } from "@homarr/api/shared";
+import { clientApi } from "@homarr/api/client";
+import { createHeadersCallbackForSource, getTrpcUrl } from "@homarr/api/shared";
 
 import { env } from "~/env";
 
diff --git a/apps/nextjs/src/app/api/trpc/[trpc]/route.ts b/apps/nextjs/src/app/api/trpc/[trpc]/route.ts
index fa7e3ac1b..66aa2ff71 100644
--- a/apps/nextjs/src/app/api/trpc/[trpc]/route.ts
+++ b/apps/nextjs/src/app/api/trpc/[trpc]/route.ts
@@ -1,6 +1,7 @@
 import { fetchRequestHandler } from "@trpc/server/adapters/fetch";
 
 import { appRouter, createTRPCContext } from "@homarr/api";
+import { trpcPath } from "@homarr/api/shared";
 import { auth } from "@homarr/auth/next";
 import { logger } from "@homarr/log";
 
@@ -25,7 +26,7 @@ export function OPTIONS() {
 
 const handler = auth(async (req) => {
   const response = await fetchRequestHandler({
-    endpoint: "/api/trpc",
+    endpoint: trpcPath,
     router: appRouter,
     req,
     createContext: () => createTRPCContext({ session: req.auth, headers: req.headers }),
diff --git a/apps/nextjs/src/middleware.ts b/apps/nextjs/src/middleware.ts
index 8db4c4108..1c988399b 100644
--- a/apps/nextjs/src/middleware.ts
+++ b/apps/nextjs/src/middleware.ts
@@ -4,7 +4,7 @@ import { createTRPCClient, httpLink } from "@trpc/client";
 import SuperJSON from "superjson";
 
 import type { AppRouter } from "@homarr/api";
-import { createHeadersCallbackForSource } from "@homarr/api/shared";
+import { createHeadersCallbackForSource, getTrpcUrl } from "@homarr/api/shared";
 import { createI18nMiddleware } from "@homarr/translation/middleware";
 
 export async function middleware(request: NextRequest) {
@@ -34,7 +34,7 @@ export const config = {
 export const serverFetchApi = createTRPCClient<AppRouter>({
   links: [
     httpLink({
-      url: `http://${process.env.HOSTNAME ?? "localhost"}:3000/api/trpc`,
+      url: getTrpcUrl(),
       transformer: SuperJSON,
       headers: createHeadersCallbackForSource("server-fetch"),
     }),
diff --git a/packages/api/src/client.ts b/packages/api/src/client.ts
index 3bac46dc7..5fe104810 100644
--- a/packages/api/src/client.ts
+++ b/packages/api/src/client.ts
@@ -5,7 +5,7 @@ import { createTRPCReact } from "@trpc/react-query";
 import SuperJSON from "superjson";
 
 import type { AppRouter } from ".";
-import { createHeadersCallbackForSource } from "./shared";
+import { createHeadersCallbackForSource, getTrpcUrl } from "./shared";
 
 export const clientApi = createTRPCReact<AppRouter>();
 export const fetchApi = createTRPCClient<AppRouter>({
@@ -17,16 +17,3 @@ export const fetchApi = createTRPCClient<AppRouter>({
     }),
   ],
 });
-
-function getBaseUrl() {
-  if (typeof window !== "undefined") return window.location.origin;
-  return `http://localhost:${process.env.PORT ?? 3000}`;
-}
-
-/**
- * Creates the full url for the trpc api endpoint
- * @returns
- */
-export function getTrpcUrl() {
-  return `${getBaseUrl()}/api/trpc`;
-}
diff --git a/packages/api/src/shared.ts b/packages/api/src/shared.ts
index b8ebcfcc6..b08f09893 100644
--- a/packages/api/src/shared.ts
+++ b/packages/api/src/shared.ts
@@ -36,3 +36,18 @@ async function importCookiesAsync() {
     .map(({ name, value }) => `${name}=${value}`)
     .join(";");
 }
+
+function getBaseUrl() {
+  if (typeof window !== "undefined") return window.location.origin;
+  return `http://${process.env.HOSTNAME ?? "localhost"}:3000`;
+}
+
+export const trpcPath = "/api/trpc";
+
+/**
+ * Creates the full url for the trpc api endpoint
+ * @returns
+ */
+export function getTrpcUrl() {
+  return `${getBaseUrl()}${trpcPath}`;
+}