feat: csr에서만 loadProductDetail

Author: ldhldh07

packages/react/src/entities/products/components/hooks/useLoadProductDetail.ts

@@ -1,17 +1,11 @@
 import { useEffect } from "react";
 import { loadProductDetailForPage } from "../../productUseCase";
-import { BASE_URL } from "../../../../constants";
+import { useRouterParams } from "../../../../router";
 
 export const useLoadProductDetail = () => {
+  const productId = useRouterParams((params) => params.id);
   useEffect(() => {
-    if (typeof window === "undefined") return;
-    const rawPath = window.location.pathname;
-    const base = BASE_URL.replace(/\/$/, "");
-    const normalizedPath = base && rawPath.startsWith(base) ? rawPath.slice(base.length) || "/" : rawPath;
-    const match = normalizedPath.match(/^\/product\/(\d+)(?:\/?|\?|$)/);
-    const productId = match ? match[1] : undefined;
-    if (productId) {
-      loadProductDetailForPage(productId);
-    }
-  }, []);
+    if (!productId) return;
+    loadProductDetailForPage(productId);
+  }, [productId]);
 };

packages/react/src/router/router.ts

@@ -3,4 +3,17 @@ import { Router } from "@hanghae-plus/lib";
 import { BASE_URL } from "../constants";
 import type { FunctionComponent } from "react";
 
-export const router = new Router<FunctionComponent>(BASE_URL);
+const createRouter = () => ({
+  push: () => {},
+  addRoute: () => {},
+  start: () => {},
+  subscribe: () => () => {},
+  get route() {
+    return { path: "/" } as const;
+  },
+  get query() {
+    return {} as const;
+  },
+});
+
+export const router = typeof window !== "undefined" ? new Router<FunctionComponent>(BASE_URL) : createRouter();