upload

frontend/src/services/api.ts

@@ -0,0 +1,86 @@
+import axios, { AxiosInstance, AxiosResponse, InternalAxiosRequestConfig } from 'axios';
+import { getToken } from '../utils/auth';
+
+// Resolve API URL. Some code uses REACT_APP_API_URL (full api path including /api/v1),
+// others set REACT_APP_API_BASE_URL (backend origin). Normalize so baseURL always points to API root.
+const envApiUrl = process.env.REACT_APP_API_URL || process.env.REACT_APP_API_BASE_URL;
+let API_URL = envApiUrl || 'http://localhost:8080/api/v1';
+
+// If the provided base looks like a backend origin (no /api/), append /api/v1
+try {
+  const maybe = new URL(API_URL);
+  if (!/\/api\//.test(maybe.pathname)) {
+    // ensure single trailing slash then append api/v1
+    maybe.pathname = maybe.pathname.replace(/\/$/, '') + '/api/v1';
+    API_URL = maybe.toString();
+  }
+} catch {
+  // If URL parsing fails, keep API_URL as-is
+}
+
+export const api: AxiosInstance = axios.create({
+  baseURL: API_URL,
+  headers: {
+    // If admin token provided at build time, include it only in non-production env
+    ...((process.env.NODE_ENV !== 'production' && process.env.REACT_APP_ADMIN_TOKEN)
+      ? { 'X-Admin-Token': process.env.REACT_APP_ADMIN_TOKEN }
+      : {}),
+    // Dev bypass header to allow protected calls in non-production (middleware DevBypass)
+    ...((process.env.NODE_ENV !== 'production') ? { 'X-Dev-Admin': 'true' } : {}),
+  },
+  // Send cookies for same-site or allowed CORS origins
+  withCredentials: true,
+  // Prevent infinite loading spinners if backend is down or unreachable
+  timeout: 20000, // 20 seconds to better tolerate slower endpoints
+});
+
+// Request interceptor - attach bearer token when available
+api.interceptors.request.use(
+  (config: InternalAxiosRequestConfig) => {
+    const token = getToken();
+    if (token) {
+      config.headers = config.headers || {};
+      (config.headers as any).Authorization = `Bearer ${token}`;
+    }
+    return config;
+  },
+  (error) => {
+    return Promise.reject(error);
+  }
+);
+
+// Response interceptor
+api.interceptors.response.use(
+  (response: AxiosResponse) => response,
+  (error) => {
+    if (error.response?.status === 401) {
+      // Avoid redirect loop on the login call itself
+      const reqUrl: string = error.config?.url || '';
+      const isLoginEndpoint = reqUrl.endsWith('/auth/login') || reqUrl.includes('/auth/login');
+      // Do not force redirect for public endpoints like file uploads; let the caller handle it.
+      const isUploadEndpoint = reqUrl.endsWith('/upload') || reqUrl.includes('/upload');
+      if (!isLoginEndpoint) {
+        // Redirect to login unless already there and not an exempt endpoint
+        if (!isUploadEndpoint) {
+          if (window.location.pathname !== '/login') {
+            window.location.href = '/login';
+          }
+        }
+      }
+    }
+    return Promise.reject(error);
+  }
+);
+
+// Upload image helper
+export const uploadImage = async (formData: FormData): Promise<{ url: string }> => {
+  const res = await api.post('/upload', formData, {
+    headers: {
+      'Content-Type': 'multipart/form-data',
+    },
+  });
+  return res.data;
+};
+
+export { API_URL };
+export default api;