// 이 파일이 하는 일: 백엔드 API를 호출하는 axios 인스턴스를 하나만 만들어 공유한다.
// 모든 페이지가 이 client를 import해서 쓰므로 baseURL·인증 설정이 한 곳에 모인다.
import axios from 'axios';

const client = axios.create({
  // vite dev 서버의 proxy 설정(vite.config.js)이 '/api'를 백엔드로 넘겨준다.
  baseURL: '/api',
  // 학습 포인트: 세션 쿠키 인증은 브라우저가 쿠키를 자동으로 실어 보내야 동작한다.
  // withCredentials: true가 없으면 로그인해도 다음 요청부터 401이 난다.
  // 원리: 로그인 성공 시 서버가 Set-Cookie 헤더로 세션 ID를 심어 주고,
  // 이후 요청마다 브라우저가 그 쿠키를 도로 보내면 서버가 "아, 아까 그 사람"을 알아본다.
  // withCredentials는 "이 요청에 쿠키를 포함해도 된다"는 axios 쪽 허락 스위치다.
  withCredentials: true,
});

// 학습 포인트: 응답 인터셉터 — 모든 API 응답이 여기를 한 번 거친다.
// 세션이 만료되어 401이 오면 페이지마다 처리 코드를 두는 대신
// 여기서 한 번에 로그인 화면으로 보낸다.
client.interceptors.response.use(
  (response) => response,
  (error) => {
    const status = error.response?.status;
    const url = error.config?.url || '';
    // 예외: /auth/** 의 401은 "세션 만료"가 아니라 그 기능 자체의 결과다 —
    //   로그인 실패(비밀번호 틀림), /auth/me(비로그인 확인),
    //   비밀번호 변경(현재 비밀번호 틀림) 모두 각 페이지가 직접 안내한다.
    // ⚠️ 실제로 났던 버그: 처음엔 login/me만 예외로 뒀더니, 비밀번호 변경에서
    // 현재 비밀번호를 틀리면 이 인터셉터가 "세션 만료"로 오인해 /login으로 튕겨 버려
    // 사용자가 에러 안내를 영영 못 봤다. 인터셉터처럼 "전역으로 가로채는" 코드는
    // 예외 목록이 좁으면 멀쩡한 기능을 잡아먹는다 — 의미 단위(/auth/ 전체)로 묶는 이유.
    const isAuthEndpoint = url.includes('/auth/');
    if (status === 401 && !isAuthEndpoint && window.location.pathname !== '/login') {
      window.location.href = '/login';
    }
    return Promise.reject(error);
  }
);

export default client;
