feat: add spinner

src/app/[locale]/doc/page.tsx

@@ -21,7 +21,6 @@
 
 //   return (
 //     <div className="p-6">
-//       <h1>About</h1>
 
 //       {loading && <p>Loading...</p>}
 
@@ -31,3 +30,39 @@
 //     </div>
 //   )
 // }
+
+'use client'
+
+import { useEffect, useState } from 'react'
+import Spinner from '@/components/spinner'
+
+export default function AboutPage() {
+  const [data, setData] = useState<any>(null)
+  const [loading, setLoading] = useState(true)
+
+  useEffect(() => {
+    fetch((process.env.NEXT_PUBLIC_API_URL as string) + '/docs.json')
+      .then((res) => res.json())
+      .then((result) => {
+        setData(result)
+        setLoading(false)
+      })
+      .catch(() => {
+        setLoading(false)
+      })
+  }, [])
+
+  if (loading) {
+    return (
+      <div className="flex items-center justify-center min-h-screen">
+        <div className="h-12 w-12 rounded-full border-4 border-gray-300 border-t-blue-600 animate-spin" />
+      </div>
+    )
+  }
+
+  return (
+    <div className="flex items-center justify-center min-h-screen bg-primary text-primary transition-theme">
+        <Spinner/>
+      </div>
+  )
+}