feat : overwite buzz.sudloh.com/guide

components/deployment-update-notifier.tsx

@@ -7,6 +7,7 @@ import {
   hasDeploymentChanged,
   normalizeDeploymentId,
 } from "@/lib/deployment/version";
+import { withBasePath } from "@/lib/base-path";
 
 const UPDATE_TOAST_ID = "deployment-update";
 
@@ -19,7 +20,7 @@ export function DeploymentUpdateNotifier({
   const updateAvailable = useRef(false);
 
   useEffect(() => {
-    const source = new EventSource("/api/active");
+    const source = new EventSource(withBasePath("/api/active"));
     const receiveDeployment = (event: Event) => {
       if (
         updateAvailable.current ||

components/live-refresh.tsx

@@ -5,13 +5,14 @@ import { useEffect } from "react";
 
 import { parseInvalidationEvent } from "@/lib/events/invalidation";
 import { createRefreshScheduler } from "@/lib/events/refresh";
+import { withBasePath } from "@/lib/base-path";
 
 export function LiveRefresh({ endpoint }: { endpoint: string }) {
   const router = useRouter();
 
   useEffect(() => {
     const scheduler = createRefreshScheduler(() => router.refresh());
-    const source = new EventSource(endpoint);
+    const source = new EventSource(withBasePath(endpoint));
     const connected = () => scheduler.connected();
     const notified = (message: Event) => {
       if (!(message instanceof MessageEvent) || typeof message.data !== "string") {

components/public/constellation-image.tsx

@@ -1,4 +1,5 @@
 import Image from "next/image";
+import { withBasePath } from "@/lib/base-path";
 
 import { GuideExportBranding } from "@/components/public/guide-export-branding";
 import { ExportText } from "@/components/public/export-language";
@@ -27,7 +28,7 @@ export function ConstellationImage({
 
       <div className="absolute inset-x-20 top-7 z-10 flex items-start justify-center gap-5">
         <Image
-          src="/icon/nav/Constellations.webp"
+          src={withBasePath("/icon/nav/Constellations.webp")}
           alt=""
           width={112}
           height={112}

components/public/guide-export-branding.tsx

@@ -1,4 +1,5 @@
 import Image from "next/image";
+import { withBasePath } from "@/lib/base-path";
 
 export function GuideExportBranding({
   backgroundUrl,
@@ -21,7 +22,7 @@ export function GuideExportBranding({
       />
       <div className="absolute inset-0 bg-[#050817]/65" />
       <Image
-        src="/icon/Watermark.png"
+        src={withBasePath("/icon/Watermark.png")}
         alt=""
         width={constellation ? 280 : 180}
         height={constellation ? 158 : 101}

components/public/material-poster.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import Image from "next/image";
+import { withBasePath } from "@/lib/base-path";
 import Link from "next/link";
 import { useRef, type PointerEvent } from "react";
 
@@ -170,7 +171,7 @@ export function MaterialPoster({
         </div>
       ) : null}
       <Image
-        src="/img/mat/fade.png"
+        src={withBasePath("/img/mat/fade.png")}
         alt=""
         fill
         sizes={`${POSTER_EXPORT_WIDTH}px`}

components/public/site-header.tsx

@@ -5,8 +5,10 @@ import { Suspense } from "react";
 import { Button } from "@/components/ui/button";
 import { VisitorPresence } from "@/components/public/visitor-presence";
 import { getAdminSession } from "@/lib/auth/server";
+import { withBasePath } from "@/lib/base-path";
 
 async function AdminEditLink({ editHref }: { editHref: string }) {
+  if (process.env.PUBLIC_MIRROR === "true") return null;
   const isAdmin = Boolean(await getAdminSession());
 
   return isAdmin ? (
@@ -29,7 +31,7 @@ export function SiteHeader({ editHref = "/admin", guideId }: { editHref?: string
           href="/"
           className="mr-auto flex min-h-11 items-center gap-3 rounded-lg font-heading font-semibold focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
         >
-          <Image src="/icon.png" alt="" width={36} height={36} className="size-9 object-contain" />
+          <Image src={withBasePath("/icon.png")} alt="" width={36} height={36} className="size-9 object-contain" />
           <span className="hidden sm:inline">ไกด์เกนชินไม่ใช่เกมมือถือ</span>
         </Link>
         <nav aria-label="Public navigation" className="flex items-center gap-1">

components/public/structured-guide.tsx

@@ -43,6 +43,7 @@ import { elementIconFilter } from "@/lib/catalog/element";
 import type { PublicGuide } from "@/lib/guides/queries";
 import { artifactTierCount } from "@/lib/guides/artifacts";
 import { navigationIconPath } from "@/lib/navigation";
+import { withBasePath } from "@/lib/base-path";
 import {
   normalizeTargetStat,
   recommendedStatElement,
@@ -419,7 +420,7 @@ function WeaponSectionContent({
           </p>
           <div className="flex items-center justify-center gap-3">
             <Image
-              src="/icon/nav/Weapon.png"
+              src={withBasePath("/icon/nav/Weapon.png")}
               alt=""
               width={56}
               height={56}
@@ -656,21 +657,21 @@ function ArtifactSectionContent({
           </CardHeader>
           <CardContent className="grid grid-cols-3 p-0">
             <ArtifactStat
-              iconSrc="/icon/Icon_Sands_of_Eon.webp"
+              iconSrc={withBasePath("/icon/Icon_Sands_of_Eon.webp")}
               label={exportLabel(exporting, "นาฬิกา", "Sands")}
               values={condition.sands}
               exporting={exporting}
               elementIconUrls={guide.elementIconUrls}
             />
             <ArtifactStat
-              iconSrc="/icon/Icon_Goblet_of_Eonothem.webp"
+              iconSrc={withBasePath("/icon/Icon_Goblet_of_Eonothem.webp")}
               label={exportLabel(exporting, "ถ้วย", "Goblet")}
               values={condition.goblet}
               exporting={exporting}
               elementIconUrls={guide.elementIconUrls}
             />
             <ArtifactStat
-              iconSrc="/icon/Icon_Circlet_of_Logos.webp"
+              iconSrc={withBasePath("/icon/Icon_Circlet_of_Logos.webp")}
               label={exportLabel(exporting, "หัว", "Circlet")}
               values={condition.circlet}
               exporting={exporting}
@@ -721,7 +722,7 @@ function ArtifactSectionContent({
           </p>
           <div className="flex items-center justify-center gap-3">
             <Image
-              src="/icon/nav/Artifact.webp"
+              src={withBasePath("/icon/nav/Artifact.webp")}
               alt=""
               width={56}
               height={56}
@@ -1155,7 +1156,7 @@ function ConstellationSection({ guide }: { guide: PublicGuide }) {
         </p>
         <div className="flex items-center justify-center gap-3">
           <Image
-            src="/icon/nav/Constellations.webp"
+            src={withBasePath("/icon/nav/Constellations.webp")}
             alt=""
             width={56}
             height={56}