From bf3b2b2f5fdfe4d54226b59ce82378e4a77dc700 Mon Sep 17 00:00:00 2001
From: nsfisis <nsfisis@gmail.com>
Date: Thu, 14 Aug 2025 22:31:32 +0900
Subject: feat(backend,frontend): Replace hard-coded base path with environment
 variable

---
 frontend/app/api/client.ts           | 5 +++--
 frontend/app/components/UserIcon.tsx | 6 ++++--
 frontend/app/config.ts               | 2 ++
 frontend/app/root.tsx                | 3 ++-
 frontend/app/routes/_index.tsx       | 3 ++-
 frontend/app/routes/dashboard.tsx    | 5 +++--
 6 files changed, 16 insertions(+), 8 deletions(-)
 create mode 100644 frontend/app/config.ts

(limited to 'frontend/app')

diff --git a/frontend/app/api/client.ts b/frontend/app/api/client.ts
index ee5437d..6fa784f 100644
--- a/frontend/app/api/client.ts
+++ b/frontend/app/api/client.ts
@@ -1,12 +1,13 @@
 import createClient from "openapi-fetch";
 import { createContext } from "react";
+import { API_BASE_PATH } from "../config";
 import type { paths } from "./schema";
 
 const client = createClient<paths>({
 	baseUrl:
 		process.env.NODE_ENV === "development"
-			? "http://localhost:8003/phperkaigi/2025/code-battle/api/"
-			: "https://t.nil.ninja/phperkaigi/2025/code-battle/api/",
+			? `http://localhost:8003${API_BASE_PATH}`
+			: `https://t.nil.ninja${API_BASE_PATH}`,
 });
 
 export async function apiLogin(username: string, password: string) {
diff --git a/frontend/app/components/UserIcon.tsx b/frontend/app/components/UserIcon.tsx
index e14a571..8002c6f 100644
--- a/frontend/app/components/UserIcon.tsx
+++ b/frontend/app/components/UserIcon.tsx
@@ -1,3 +1,5 @@
+import { BASE_PATH } from "../config";
+
 type Props = {
 	iconPath: string;
 	displayName: string;
@@ -9,8 +11,8 @@ export default function UserIcon({ iconPath, displayName, className }: Props) {
 		<img
 			src={
 				process.env.NODE_ENV === "development"
-					? `http://localhost:8003/phperkaigi/2025/code-battle${iconPath}`
-					: `/phperkaigi/2025/code-battle${iconPath}`
+					? `http://localhost:8003${BASE_PATH}${iconPath}`
+					: `${BASE_PATH}${iconPath}`
 			}
 			alt={`${displayName} のアイコン`}
 			className={`rounded-full border-4 border-white ${className}`}
diff --git a/frontend/app/config.ts b/frontend/app/config.ts
new file mode 100644
index 0000000..3e6e642
--- /dev/null
+++ b/frontend/app/config.ts
@@ -0,0 +1,2 @@
+export const BASE_PATH = import.meta.env.VITE_ALBATROSS_BASE_PATH || "/";
+export const API_BASE_PATH = `${BASE_PATH}api/`;
diff --git a/frontend/app/root.tsx b/frontend/app/root.tsx
index f1b5c54..7d08061 100644
--- a/frontend/app/root.tsx
+++ b/frontend/app/root.tsx
@@ -4,11 +4,12 @@ import type { LinksFunction } from "react-router";
 import { Links, Meta, Outlet, Scripts, ScrollRestoration } from "react-router";
 import "./tailwind.css";
 import "./shiki.css";
+import { BASE_PATH } from "./config";
 
 config.autoAddCss = false;
 
 export const links: LinksFunction = () => [
-	{ rel: "icon", href: "/phperkaigi/2025/code-battle/favicon.svg" },
+	{ rel: "icon", href: `${BASE_PATH}code-battle/favicon.svg` },
 ];
 
 export function Layout({ children }: { children: React.ReactNode }) {
diff --git a/frontend/app/routes/_index.tsx b/frontend/app/routes/_index.tsx
index ef54c84..9767985 100644
--- a/frontend/app/routes/_index.tsx
+++ b/frontend/app/routes/_index.tsx
@@ -2,6 +2,7 @@ import type { LoaderFunctionArgs, MetaFunction } from "react-router";
 import { ensureUserNotLoggedIn } from "../.server/auth";
 import BorderedContainer from "../components/BorderedContainer";
 import NavigateLink from "../components/NavigateLink";
+import { BASE_PATH } from "../config";
 
 export const meta: MetaFunction = () => [
 	{ title: "PHPerKaigi 2025 Albatross" },
@@ -16,7 +17,7 @@ export default function Index() {
 	return (
 		<div className="min-h-screen bg-sky-600 flex flex-col items-center justify-center gap-y-6">
 			<img
-				src="/phperkaigi/2025/code-battle/logo.svg"
+				src={`${BASE_PATH}logo.svg`}
 				alt="PHPerKaigi 2025"
 				className="w-64 h-64"
 			/>
diff --git a/frontend/app/routes/dashboard.tsx b/frontend/app/routes/dashboard.tsx
index b7bfb01..75e809b 100644
--- a/frontend/app/routes/dashboard.tsx
+++ b/frontend/app/routes/dashboard.tsx
@@ -5,6 +5,7 @@ import { createApiClient } from "../api/client";
 import BorderedContainerWithCaption from "../components/BorderedContainerWithCaption";
 import NavigateLink from "../components/NavigateLink";
 import UserIcon from "../components/UserIcon";
+import { BASE_PATH } from "../config";
 
 export const meta: MetaFunction = () => [
 	{ title: "Dashboard | PHPerKaigi 2025 Albatross" },
@@ -76,8 +77,8 @@ export default function Dashboard() {
 				<a
 					href={
 						process.env.NODE_ENV === "development"
-							? "http://localhost:8003/phperkaigi/2025/code-battle/admin/dashboard"
-							: "/phperkaigi/2025/code-battle/admin/dashboard"
+							? `http://localhost:8003${BASE_PATH}admin/dashboard`
+							: `${BASE_PATH}admin/dashboard`
 					}
 					className="text-lg text-white bg-sky-600 px-4 py-2 rounded-sm transition duration-300 hover:bg-sky-500 focus:ring-3 focus:ring-sky-400 focus:outline-hidden"
 				>
-- 
cgit v1.2.3-70-g09d2