some fixes and refactors

frontend/app/api.ts

@@ -0,0 +1,75 @@
+import { API_URL } from "./config";
+
+/**
+ * Simple API client that centralizes fetch configuration.
+ * All requests include credentials and proper headers.
+ */
+
+export class ApiError extends Error {
+  constructor(
+    message: string,
+    public status: number,
+    public data?: unknown
+  ) {
+    super(message);
+    this.name = "ApiError";
+  }
+}
+
+async function request<T>(
+  endpoint: string,
+  options: RequestInit = {}
+): Promise<T> {
+  const url = `${API_URL}${endpoint}`;
+  
+  const headers: HeadersInit = {
+    ...options.headers,
+  };
+  
+  if (options.body && typeof options.body === "string") {
+    headers["Content-Type"] = "application/json";
+  }
+  
+  const res = await fetch(url, {
+    ...options,
+    headers,
+    credentials: "include",
+  });
+  
+  if (!res.ok) {
+    let data: unknown;
+    try {
+      data = await res.json();
+    } catch {
+      // Response wasn't JSON
+    }
+    throw new ApiError(
+      `Request failed: ${res.status}`,
+      res.status,
+      data
+    );
+  }
+  
+  return res.json();
+}
+
+export const api = {
+  get<T>(endpoint: string): Promise<T> {
+    return request<T>(endpoint);
+  },
+  
+  post<T>(endpoint: string, body?: unknown): Promise<T> {
+    return request<T>(endpoint, {
+      method: "POST",
+      body: body ? JSON.stringify(body) : undefined,
+    });
+  },
+  
+  put<T>(endpoint: string, body?: unknown): Promise<T> {
+    return request<T>(endpoint, {
+      method: "PUT",
+      body: body ? JSON.stringify(body) : undefined,
+    });
+  },
+};
+