NeahFront7/components/email.tsx
2025-04-13 21:52:18 +02:00

61 lines
2.2 KiB
TypeScript

"use client";
import { useEffect, useState } from "react";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import { RefreshCw, Mail } from "lucide-react";
import { useSession, signIn } from "next-auth/react";
export function Email() {
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
const { status } = useSession();
useEffect(() => {
if (status === 'authenticated') {
setLoading(false);
} else if (status === 'unauthenticated') {
signIn();
}
}, [status]);
if (status === 'loading' || loading) {
return (
<Card className="transition-transform duration-500 ease-in-out transform hover:scale-105 bg-white/95 backdrop-blur-sm border-0 shadow-lg h-full">
<CardHeader className="flex flex-row items-center justify-between pb-2 border-b border-gray-100">
<CardTitle className="text-lg font-semibold text-gray-800">
<div className="flex items-center gap-2">
<Mail className="h-5 w-5" />
<span>Emails</span>
</div>
</CardTitle>
</CardHeader>
<CardContent className="p-6">
<div className="flex items-center justify-center">
<RefreshCw className="h-5 w-5 animate-spin text-gray-400" />
</div>
</CardContent>
</Card>
);
}
return (
<Card className="transition-transform duration-500 ease-in-out transform hover:scale-105 bg-white/95 backdrop-blur-sm border-0 shadow-lg h-full">
<CardHeader className="flex flex-row items-center justify-between pb-2 space-x-4 border-b border-gray-100">
<CardTitle className="text-lg font-semibold text-gray-800">
<div className="flex items-center gap-2">
<Mail className="h-5 w-5" />
<span>Emails</span>
</div>
</CardTitle>
</CardHeader>
<CardContent className="p-0 h-[calc(100%-3.5rem)]">
<iframe
src="https://lab.slm-lab.net/email"
className="w-full h-full border-0"
title="Email Inbox"
/>
</CardContent>
</Card>
);
}