From 1de9c778ffadac801501c6861f9b3786064aa3e4 Mon Sep 17 00:00:00 2001
From: Penguin-71630 <ginow514sm@gmail.com>
Date: Sat, 13 Dec 2025 07:22:46 +0800
Subject: [PATCH] Fix: Remove all hard-coded URL in every component.

---
 webpage/.env.example        | 5 +++++
 webpage/src/api.ts          | 2 +-
 webpage/src/pages/Login.tsx | 4 +++-
 3 files changed, 9 insertions(+), 2 deletions(-)
 create mode 100644 webpage/.env.example

diff --git a/webpage/.env.example b/webpage/.env.example
new file mode 100644
index 0000000..65767c9
--- /dev/null
+++ b/webpage/.env.example
@@ -0,0 +1,5 @@
+# API Base URL for backend services
+# For production deployment, set this to your backend API URL
+# Example: EXTERNAL_URL=https://api.yourdomain.com
+# Example: EXTERNAL_URL=http://your-server-ip:8080
+EXTERNAL_URL=http://localhost:8080
diff --git a/webpage/src/api.ts b/webpage/src/api.ts
index 86e777f..3495f35 100644
--- a/webpage/src/api.ts
+++ b/webpage/src/api.ts
@@ -1,6 +1,6 @@
 import type { Image, Alias } from './types';
 
-const API_BASE_URL = 'http://localhost:8080';
+const API_BASE_URL = import.meta.env.EXTERNAL_URL || 'http://localhost:8080';
 
 // Pagination configuration
 export const ALIASES_PER_PAGE = 10; // Number of aliases to show per page
diff --git a/webpage/src/pages/Login.tsx b/webpage/src/pages/Login.tsx
index 2188b4e..21a07ec 100644
--- a/webpage/src/pages/Login.tsx
+++ b/webpage/src/pages/Login.tsx
@@ -1,6 +1,8 @@
 // src/pages/Login.tsx
 import { useEffect, useState } from 'react';
 
+const API_BASE_URL = import.meta.env.EXTERNAL_URL || 'http://localhost:8080';
+
 interface LoginProps {
   onLoginSuccess: () => void;
 }
@@ -20,7 +22,7 @@ export default function Login({ onLoginSuccess }: LoginProps) {
     }
 
     // Call backend login endpoint
-    fetch('http://localhost:8080/auth/login', {
+    fetch(`${API_BASE_URL}/auth/login`, {
       method: 'POST',
       headers: {
         'Content-Type': 'application/json',