From b8316bba334aaee4e5f9b9c728cc3825759be023 Mon Sep 17 00:00:00 2001
From: "web@ppanel" <web@ppanel.dev>
Date: Fri, 14 Mar 2025 13:40:56 +0700
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat(loading):=20Replace=20loading?=
 =?UTF-8?q?=20animation=20with=20a=20simpler=20spinner=20and=20loading=20t?=
 =?UTF-8?q?ext?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/user/components/loading.tsx | 19 ++++---------------
 1 file changed, 4 insertions(+), 15 deletions(-)

diff --git a/apps/user/components/loading.tsx b/apps/user/components/loading.tsx
index dd194e1..914807c 100644
--- a/apps/user/components/loading.tsx
+++ b/apps/user/components/loading.tsx
@@ -11,21 +11,10 @@ export default function Loading({ loading = true }: LoadingProps) {
           : 'pointer-events-none bg-transparent opacity-0 backdrop-blur-0'
       }`}
     >
-      <div
-        className={`transform-gpu transition-all duration-500 ${
-          loading ? 'scale-100 opacity-100' : 'scale-50 opacity-0'
-        }`}
-      >
-        <div className='relative h-32 w-32 animate-[spin_3s_linear_infinite] overflow-hidden rounded-full shadow-[0_0_15px_rgba(0,0,0,0.1)] dark:shadow-[0_0_15px_rgba(255,255,255,0.1)]'>
-          <div className='absolute inset-0 h-full w-full rounded-full bg-black shadow-inner dark:bg-white'>
-            <div className='absolute right-0 top-0 h-full w-1/2 rounded-r-full bg-white shadow-sm dark:bg-black' />
-            <div className='absolute left-1/2 top-0 h-1/2 w-1/2 -translate-x-1/2 rounded-full bg-white shadow-sm dark:bg-black'>
-              <div className='absolute left-1/2 top-1/2 h-1/4 w-1/4 -translate-x-1/2 -translate-y-1/2 rounded-full bg-black shadow-inner dark:bg-white' />
-            </div>
-            <div className='absolute bottom-0 left-1/2 h-1/2 w-1/2 -translate-x-1/2 rounded-full bg-black shadow-sm dark:bg-white'>
-              <div className='absolute left-1/2 top-1/2 h-1/4 w-1/4 -translate-x-1/2 -translate-y-1/2 rounded-full bg-white shadow-inner dark:bg-black' />
-            </div>
-          </div>
+      <div className='flex min-h-screen items-center justify-center'>
+        <div className='text-center'>
+          <div className='border-primary mx-auto mb-4 h-12 w-12 animate-spin rounded-full border-b-2 border-t-2'></div>
+          <p className='text-muted-foreground text-lg'>Loading...</p>
         </div>
       </div>
     </div>