29 lines
1014 B
TypeScript
29 lines
1014 B
TypeScript
"use client"
|
|
|
|
import React, { Suspense, lazy } from "react";
|
|
|
|
// Use lazy loading for the form component
|
|
const LoginForm = lazy(() => import('./components/LoginForm'));
|
|
|
|
// Simple loading state for the Suspense boundary
|
|
function LoginLoading() {
|
|
return (
|
|
<div className="flex items-center justify-center min-h-screen bg-gray-100 dark:bg-[#0F0F12]">
|
|
<div className="w-full max-w-md p-8 space-y-8 bg-white dark:bg-[#1F1F23] rounded-xl shadow-lg text-center">
|
|
<div className="mt-6 flex flex-col items-center justify-center">
|
|
<div className="w-12 h-12 border-4 border-t-blue-500 border-b-transparent border-l-transparent border-r-transparent rounded-full animate-spin"></div>
|
|
<p className="mt-4 text-gray-600 dark:text-gray-400">Loading login form...</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
// Main page component that uses Suspense
|
|
export default function LoginPage() {
|
|
return (
|
|
<Suspense fallback={<LoginLoading />}>
|
|
<LoginForm />
|
|
</Suspense>
|
|
);
|
|
} |