From 16d1cac733acb698adf01130c22ba1e559ccf20d Mon Sep 17 00:00:00 2001
From: JeonDoGyun <wjsehrbs2632@naver.com>
Date: Sat, 11 Nov 2023 14:28:32 +0900
Subject: [PATCH 1/2] =?UTF-8?q?feat:=20Loading=20=ED=99=94=EB=A9=B4?=
 =?UTF-8?q?=EC=9D=B4=20=ED=95=84=EC=9A=94=ED=95=9C=20lazy=20loading=20?=
 =?UTF-8?q?=EB=B0=A9=EC=8B=9D=EC=9D=98=20=ED=8E=98=EC=9D=B4=EC=A7=80?=
 =?UTF-8?q?=EC=97=90=20Suspense=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/editProfile/EditProfilePage.tsx                | 9 +++++++--
 .../profileList/profileListHome/ProfileListPage.tsx      | 8 +++++++-
 src/pages/update/UpdatePage.tsx                          | 9 ++++++++-
 3 files changed, 22 insertions(+), 4 deletions(-)

diff --git a/src/pages/editProfile/EditProfilePage.tsx b/src/pages/editProfile/EditProfilePage.tsx
index 2673f938..3fd6b7f4 100644
--- a/src/pages/editProfile/EditProfilePage.tsx
+++ b/src/pages/editProfile/EditProfilePage.tsx
@@ -1,11 +1,16 @@
-import React from 'react';
+import { Suspense } from 'react';
 import ErrorBoundary from 'layouts/ErrorBoundary';
+import { ClipLoader } from 'react-spinners';
 import EditProfileTemplate from './components/EditProfileTemplate';
 
 const EditProfilePage = () => {
   return (
     <ErrorBoundary fallback={'Error...'}>
-      <EditProfileTemplate />
+      <Suspense
+        fallback={<ClipLoader className="absolute top-[50%] left-{50%}" />}
+      >
+        <EditProfileTemplate />
+      </Suspense>
     </ErrorBoundary>
   );
 };
diff --git a/src/pages/profileList/profileListHome/ProfileListPage.tsx b/src/pages/profileList/profileListHome/ProfileListPage.tsx
index a1063130..52641ea3 100644
--- a/src/pages/profileList/profileListHome/ProfileListPage.tsx
+++ b/src/pages/profileList/profileListHome/ProfileListPage.tsx
@@ -1,10 +1,16 @@
 import ErrorBoundary from 'layouts/ErrorBoundary';
 import ProfileListHome from './ProfileListHome';
+import { Suspense } from 'react';
+import { ClipLoader } from 'react-spinners';
 
 const ProfileListPage = () => {
   return (
     <ErrorBoundary>
-      <ProfileListHome />
+      <Suspense
+        fallback={<ClipLoader className="absolute top-[50%] left-{50%}" />}
+      >
+        <ProfileListHome />
+      </Suspense>
     </ErrorBoundary>
   );
 };
diff --git a/src/pages/update/UpdatePage.tsx b/src/pages/update/UpdatePage.tsx
index dc651966..82f2b94f 100644
--- a/src/pages/update/UpdatePage.tsx
+++ b/src/pages/update/UpdatePage.tsx
@@ -1,12 +1,19 @@
 import { Suspense } from 'react';
 import ErrorBoundary from 'layouts/ErrorBoundary';
+import { ClipLoader } from 'react-spinners';
 import UpdateTemplate from './components/UpdateTemplate';
 
 const UpdatePage = () => {
   return (
     <>
       <ErrorBoundary fallback={<div className="">권한이 없습니다.</div>}>
-        <Suspense fallback={<div className="h-screen w-screen bg-slate-500" />}>
+        <Suspense
+          fallback={
+            <div className="h-screen w-screen bg-slate-500">
+              <ClipLoader />
+            </div>
+          }
+        >
           <UpdateTemplate />
         </Suspense>
       </ErrorBoundary>

From 97c43620a72b4aa61d7a1550e35da22a67332c0a Mon Sep 17 00:00:00 2001
From: JeonDoGyun <wjsehrbs2632@naver.com>
Date: Sat, 11 Nov 2023 14:33:14 +0900
Subject: [PATCH 2/2] =?UTF-8?q?fix:=20eslint=20import=20error=20=ED=95=B4?=
 =?UTF-8?q?=EA=B2=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/profileList/profileListHome/ProfileListPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/profileList/profileListHome/ProfileListPage.tsx b/src/pages/profileList/profileListHome/ProfileListPage.tsx
index 52641ea3..40d771ab 100644
--- a/src/pages/profileList/profileListHome/ProfileListPage.tsx
+++ b/src/pages/profileList/profileListHome/ProfileListPage.tsx
@@ -1,7 +1,7 @@
 import ErrorBoundary from 'layouts/ErrorBoundary';
-import ProfileListHome from './ProfileListHome';
 import { Suspense } from 'react';
 import { ClipLoader } from 'react-spinners';
+import ProfileListHome from './ProfileListHome';
 
 const ProfileListPage = () => {
   return (