// ...
// isRefreshing: 현재 앞서 토큰 리프레싱 요청을 보낸 적이 있는지를 기록하는 부울 변수
let isRefreshing = false;
// failedQueue: 401 에러로 인해 처리하지 못한 요청들을 담아두는 Queue
let failedQueue: Array<{
  resolve: (token: string) => void;
  reject: (err: unknown) => void;
}> = [];

// failedQueue에 쌓여있던 '실패했던 요청'들을, 인자로 받은 새 Access Token을 주입하여 처리하는 함수
const processQueue = (error: unknown, token: string | null = null) => {
  failedQueue.forEach(({ resolve, reject }) => {
    if (token) resolve(token);
    else reject(error);
  });
  failedQueue = [];
};

apiClient.interceptors.response.use(
  (response) => response,
  async (error: AxiosError) => {
    // 실패한 요청의 원래 설정
    const original = error.config as RetryableRequest;

    // 401이 아닌 에러 || _retry(이전(또는 동시)요청에서 refresh 처리중인 경우) -> 에러
    if (error.response?.status !== 401 || original?._retry) {
      return Promise.reject(error);
    }

    // 동시에 401 코드를 받은 여러 요청 중, 한 요청이 먼저 Refresh를 시작하여
    // 이미 Refresh 요청이 처리중일 경우, 나머지 동시 요청들은 failedQueue에 넣어 대기
    if (isRefreshing) {
      return new Promise((resolve, reject) => {
        failedQueue.push({
          resolve: (token) => {
            original.headers.Authorization = `Bearer ${token}`;
            resolve(apiClient(original));
          },
          reject,
        });
      });
    }

    // refresh 시도했음 + 진행중임을 기록
    original._retry = true;
    isRefreshing = true;

    try {
      // refresh 요청 후 받아온 토큰 store에 세팅
      const { data } = await apiClient.post<{ accessToken: string }>("/oauth2/token/refresh");
      const { accessToken } = data;
      useAuthStore.getState().setAccessToken(accessToken);
      // 큐에 대기중인 요청들에게 새 토큰 resolve
      processQueue(null, accessToken);
      // 원래 요청(original)도 새 토큰으로 재 시도
      original.headers.Authorization = `Bearer ${accessToken}`;
      return apiClient(original);
    } catch (refreshError) {
      // Refresh 실패시
      // 대기중인 요청 모두 reject
      processQueue(refreshError, null);
      // store의 인증 상태 초기화
      useAuthStore.getState().clearAuth();
      // 로그인 페이지로 이동
      window.location.href = "/login";
      return Promise.reject(refreshError);
    } finally {
      // 결과에 상관 없이 isRefreshing는 항상 해제
      isRefreshing = false;
    }
  }
);

// ...
// 별도 인터셉터를 설정하지 않은 AxiosInstance
const refreshClient = axios.create({
  baseURL: process.env.NEXT_PUBLIC_API_URL || "http://localhost:8080",
  withCredentials: true,
});
// ...
  const { data } = await refreshClient.post<{ accessToken: string }>("/oauth2/token/refresh");

// 진행 중인 재발급 요청을 나타내는 Promise.
// 값이 있다는 것을 통해 "지금 갱신 중"임을 의미
let refreshPromise: Promise<string> | null = null;

/**
 * 새 access token 을 받아 store 에 반영한다.
 *
 * 401을 받은 요청들이 모두 이 함수를 호출하지만, 이미 진행 중인 `Promise`가 있으면
 * (즉, `refreshPromise`가 유효한 값이면)
 * 해당 Promise를 그대로 반환하므로 `refresh` 요청은 한 번만 전송됨이 보장된다.
 */
const refreshAccessToken = (): Promise<string> => {
  // 이미 기록된 Promise가 없는 경우(즉, 왼쪽 피연산자가 null 또는 undefined인 경우),
  // 오른쪽 피연산자(즉, RefreshClient를 사용한 Refresh 요청 Promise)가 할당된다.
  refreshPromise ??= refreshClient
    .post<{ accessToken: string }>("/oauth2/token/refresh")
    .then(({ data }) => {
      useAuthStore.getState().setAccessToken(data.accessToken);
      return data.accessToken;
    })
    .finally(() => {
      // 성공이든 실패든 Promise 변수를 비운다. 
      // 실패한 Promise 를 남겨두면, 이후 모든 401 에러가 죽은 Promise 를 재사용해 재로그인 후에도 복구되지 않는다.
      refreshPromise = null;
    });

  return refreshPromise;
};

// 예시 1)
const foo = null ?? "default string";
console.log(foo); // "default string"
// 예시 2)
const baz = 0 ?? 42;
console.log(baz); // 0
// short-circuits을 수행하기 때문에, 아래와 같은 코드도 에러가 발생하지 않음
// (왼쪽 피연산자가 nullish하지 않기 때문에, 할당 자체가 수행되지 않음)
const x = 1;
x ??= 2;