food-market/src/food-market.web/src/lib/api.ts

import axios, { AxiosError, type InternalAxiosRequestConfig } from 'axios'
import { getAccessToken, refreshTokens, clearTokens } from './auth'

export const api = axios.create({
  baseURL: '',
  headers: { 'Content-Type': 'application/json' },
})

api.interceptors.request.use((config: InternalAxiosRequestConfig) => {
  const token = getAccessToken()
  if (token) {
    config.headers.set('Authorization', `Bearer ${token}`)
  }
  return config
})

let refreshing: Promise<string | null> | null = null

api.interceptors.response.use(
  (res) => res,
  async (error: AxiosError) => {
    const original = error.config as InternalAxiosRequestConfig & { __retried?: boolean }
    if (error.response?.status === 401 && !original.__retried) {
      original.__retried = true
      refreshing ??= refreshTokens().finally(() => { refreshing = null })
      const newToken = await refreshing
      if (newToken) {
        original.headers.set('Authorization', `Bearer ${newToken}`)
        return api(original)
      }
      clearTokens()
    }
    return Promise.reject(error)
  },
)