From 3d7b67ed049ac837c5f7fb423740ed292472b890 Mon Sep 17 00:00:00 2001
From: JaehongDev <println@kakao.com>
Date: Thu, 4 Jul 2024 15:07:16 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EC=B5=9C=EC=86=8C=20=EC=A7=80=EC=97=B0?=
 =?UTF-8?q?=20=EC=84=A4=EC=A0=95=20=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/api/AxiosInstance.ts |  5 +++--
 frontend/src/api/Interceptors.ts  | 26 +++++++++++++++++++++++++-
 frontend/src/api/index.d.ts       |  4 ++++
 3 files changed, 32 insertions(+), 3 deletions(-)

diff --git a/frontend/src/api/AxiosInstance.ts b/frontend/src/api/AxiosInstance.ts
index 56f81d2..27d276e 100644
--- a/frontend/src/api/AxiosInstance.ts
+++ b/frontend/src/api/AxiosInstance.ts
@@ -1,6 +1,6 @@
 import axios from "axios";
 import {NETWORK} from "@/constants/api";
-import {checkAndSetToken, handleTokenError} from "@/api/Interceptors";
+import {checkAndSetToken, delayFulfilled, handleTokenError, waitingFulfilled} from "@/api/Interceptors";
 
 export const axiosInstance = axios.create({
   baseURL: `${import.meta.env.VITE_API}/api`,
@@ -10,4 +10,5 @@ export const axiosInstance = axios.create({
 })
 
 axiosInstance.interceptors.request.use(checkAndSetToken);
-axiosInstance.interceptors.response.use(response => response, handleTokenError);
+axiosInstance.interceptors.request.use(delayFulfilled);
+axiosInstance.interceptors.response.use(waitingFulfilled, handleTokenError);
diff --git a/frontend/src/api/Interceptors.ts b/frontend/src/api/Interceptors.ts
index 14210bc..b4553d4 100644
--- a/frontend/src/api/Interceptors.ts
+++ b/frontend/src/api/Interceptors.ts
@@ -1,4 +1,4 @@
-import {AxiosError, InternalAxiosRequestConfig} from "axios";
+import {AxiosError, AxiosResponse, InternalAxiosRequestConfig} from "axios";
 import {TOKEN} from "@/constants/api";
 import {PATH} from "@/constants/path";
 import {reIssueToken} from "@/api/auth/ReIssueToken";
@@ -54,3 +54,27 @@ export const handleTokenError = async(error: AxiosError<ErrorResponseData>) => {
   throw new HTTPError(status, data.message, data.code);
 
 }
+
+
+export const delayFulfilled = (config: InternalAxiosRequestConfig )=> ({
+  ...config,
+  p0: performance.now(),
+});
+
+export const waitingFulfilled = async (response: AxiosResponse) => {
+  const minimumDelay = 1000;
+  const latency = performance.now() - response.config.p0;
+  const shouldNotDelay = minimumDelay < latency;
+
+  if (shouldNotDelay) {
+    return response;
+  }
+
+  const remainder = minimumDelay - latency;
+  const [responseWithDelay] = await Promise.all([
+    response,
+    new Promise((resolve) => setTimeout(resolve, remainder)),
+  ]);
+  return responseWithDelay;
+}
+
diff --git a/frontend/src/api/index.d.ts b/frontend/src/api/index.d.ts
index d70da11..f7c5cbb 100644
--- a/frontend/src/api/index.d.ts
+++ b/frontend/src/api/index.d.ts
@@ -4,4 +4,8 @@ declare module 'axios' {
   export interface AxiosRequestConfig {
     useAuth: boolean;
   }
+
+  export interface InternalAxiosRequestConfig {
+    p0: number;
+  }
 }