feat: add Vue.js frontend with JWT auth, Pinia store, and Docker

src/services/api.js

@@ -0,0 +1,61 @@
+import axios from 'axios'
+
+const API_BASE_URL = process.env.VUE_APP_API_URL || 'http://127.0.0.1:5000'
+
+const api = axios.create({
+  baseURL: API_BASE_URL,
+  headers: {
+    'Content-Type': 'application/json',
+  },
+})
+
+// Request interceptor - add auth token
+api.interceptors.request.use(
+  (config) => {
+    const token = localStorage.getItem('access_token')
+    if (token) {
+      config.headers.Authorization = `Bearer ${token}`
+    }
+    return config
+  },
+  (error) => Promise.reject(error)
+)
+
+// Response interceptor - handle token refresh
+api.interceptors.response.use(
+  (response) => response,
+  async (error) => {
+    const originalRequest = error.config
+
+    if (error.response?.status === 401 && !originalRequest._retry) {
+      originalRequest._retry = true
+
+      try {
+        const refreshToken = localStorage.getItem('refresh_token')
+        if (!refreshToken) {
+          throw new Error('No refresh token')
+        }
+
+        // Note: You'll need to implement this endpoint on the backend
+        const { data } = await axios.post(
+          `${API_BASE_URL}/api/refresh-token`,
+          { refresh_token: refreshToken }
+        )
+
+        localStorage.setItem('access_token', data.access_token)
+        originalRequest.headers.Authorization = `Bearer ${data.access_token}`
+
+        return api(originalRequest)
+      } catch (refreshError) {
+        localStorage.removeItem('access_token')
+        localStorage.removeItem('refresh_token')
+        window.location.href = '/login'
+        return Promise.reject(refreshError)
+      }
+    }
+
+    return Promise.reject(error)
+  }
+)
+
+export default api