docker composed

frontend/Dockerfile

@@ -0,0 +1,9 @@
+FROM nginx:alpine
+
+# Копируем конфиг
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+
+# Копируем статику
+COPY . /usr/share/nginx/html
+
+EXPOSE 80

frontend/index.html

@@ -3,7 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
-    <title>Gym Tracker</title>
+    <title>Gym Bro 😈</title>
     <link rel="stylesheet" href="styles/main.css">
     <link rel="stylesheet" href="styles/components.css">
     <link rel="stylesheet" href="styles/workout.css">

frontend/js/api.js

@@ -1,8 +1,12 @@
-// Базовый URL API. Если фронт и бэк на одном домене, можно использовать '' или '/api'
-const API_BASE = 'http://localhost:8000';
+// frontend/js/api.js
+import { apiFetch } from "./auth.js";
+import { API_BASE } from "./config.js"; // <-- Добавили импорт
+
+// УДАЛИТЬ эти строки из начала api.js:
+// export const API_BASE = ...
 
 export async function fetchWorkoutTypes() {
-    const res = await fetch(`${API_BASE}/workout-types/`);
+    const res = await apiFetch("/workout-types/");
     if (!res.ok) throw new Error('Failed to fetch workout types');
     return await res.json();
 }

frontend/js/auth.js

@@ -0,0 +1,148 @@
+// frontend/js/auth.js
+
+import { API_BASE } from "./config.js";
+
+const TOKEN_KEY = "gym_auth_token";
+const USER_KEY = "gym_auth_user";
+
+/**
+ * Получить сохранённый токен
+ */
+export function getToken() {
+    return localStorage.getItem(TOKEN_KEY);
+}
+
+/**
+ * Получить сохранённого пользователя
+ */
+export function getStoredUser() {
+    try {
+        const raw = localStorage.getItem(USER_KEY);
+        return raw ? JSON.parse(raw) : null;
+    } catch {
+        return null;
+    }
+}
+
+/**
+ * Сохранить сессию (токен + данные пользователя)
+ */
+export function setSession(token, user) {
+    localStorage.setItem(TOKEN_KEY, token);
+    localStorage.setItem(USER_KEY, JSON.stringify(user));
+}
+
+/**
+ * Очистить сессию (Logout)
+ */
+export function clearSession() {
+    localStorage.removeItem(TOKEN_KEY);
+    localStorage.removeItem(USER_KEY);
+}
+
+/**
+ * Защищённый Fetch wrapper.
+ * Автоматически добавляет Authorization header.
+ * При получении 401 очищает сессию и вызывает событие 'auth:unauthorized'.
+ */
+export async function apiFetch(path, options = {}) {
+    const token = getToken();
+
+    const headers = new Headers(options.headers || {});
+
+    if (token) {
+        headers.set("Authorization", `Bearer ${token}`);
+    }
+
+    // Если есть тело запроса и Content-Type не задан явно — ставим JSON
+    if (options.body && !headers.has("Content-Type")) {
+        headers.set("Content-Type", "application/json");
+    }
+
+    let res;
+    try {
+        res = await fetch(`${API_BASE}${path}`, {
+            ...options,
+            headers,
+        });
+    } catch (e) {
+        // Сеть недоступна или другая ошибка транспорта
+        // Не логаутим автоматически, просто пробрасываем ошибку
+        throw e;
+    }
+
+    // Если сервер ответил 401 Unauthorized — токен протух или неверный
+    if (res.status === 401) {
+        clearSession();
+        window.dispatchEvent(new Event("auth:unauthorized"));
+    }
+
+    return res;
+}
+
+/**
+ * Логин пользователя
+ */
+export async function login(username, password) {
+    const res = await fetch(`${API_BASE}/auth/login`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ username, password }),
+    });
+
+    if (!res.ok) {
+        const err = await parseError(res, "Login failed");
+        throw new Error(err);
+    }
+
+    const data = await res.json();
+    setSession(data.access_token, data.user);
+    return data.user;
+}
+
+/**
+ * Регистрация нового пользователя
+ */
+export async function register(username, password, role = "personal") {
+    const res = await fetch(`${API_BASE}/auth/register`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ username, password, role }),
+    });
+
+    if (!res.ok) {
+        const err = await parseError(res, "Register failed");
+        throw new Error(err);
+    }
+
+    const data = await res.json();
+    setSession(data.access_token, data.user);
+    return data.user;
+}
+
+/**
+ * Проверка токена / получение текущего пользователя
+ */
+export async function me() {
+    const res = await apiFetch("/auth/me");
+    if (!res.ok) return null;
+    return await res.json();
+}
+
+/**
+ * Хелпер для парсинга ошибок FastAPI/Pydantic
+ */
+async function parseError(res, fallbackMessage) {
+    try {
+        const err = await res.json();
+        if (typeof err.detail === "string") return err.detail;
+        if (Array.isArray(err.detail)) {
+            return err.detail
+                .map((d) => `${d.loc?.join(".") || ""}: ${d.msg || ""}`.trim())
+                .join("; ");
+        }
+        return JSON.stringify(err.detail || err);
+    } catch {
+        return fallbackMessage || res.statusText;
+    }
+}

frontend/js/config.js

@@ -0,0 +1,5 @@
+// frontend/js/config.js
+export const API_BASE =
+    window.GYM_API_BASE ||
+    localStorage.getItem("gym_api_base") ||
+    "/api";

frontend/nginx.conf

@@ -0,0 +1,24 @@
+server {
+    listen 80;
+    server_name localhost;
+
+    # Статика фронтенда
+    location / {
+        root /usr/share/nginx/html;
+        index index.html;
+        try_files $uri $uri/ /index.html; # Для SPA роутинга (если понадобится)
+    }
+
+    # Проксирование API на бэкенд
+    location /api/ {
+        proxy_pass http://backend:8000/;
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection 'upgrade';
+        proxy_set_header Host $host;
+        proxy_cache_bypass $http_upgrade;
+
+        # Важно: убираем префикс /api, так как бэк ожидает пути вроде /auth/login
+        rewrite ^/api/(.*)$ /$1 break;
+    }
+}