mail page imap connection mime 5 bis rest 16 login page 9
This commit is contained in:
parent
57e913b758
commit
d688cae792
@ -11,27 +11,19 @@ console.log('Environment Variables:', {
|
||||
NODE_ENV: process.env.NODE_ENV
|
||||
});
|
||||
|
||||
// Store for credentials (in memory, you might want to use a proper storage solution)
|
||||
let storedCredentials: {
|
||||
user: string;
|
||||
password: string;
|
||||
host: string;
|
||||
port: string;
|
||||
} | null = null;
|
||||
|
||||
// Helper function to get stored credentials
|
||||
function getStoredCredentials() {
|
||||
// Server-side: use form data
|
||||
// Server-side: use stored credentials
|
||||
if (typeof window === 'undefined') {
|
||||
// Get credentials from the request body
|
||||
const user = 'alma@governance-labs.org';
|
||||
const password = '8s-hN8u37-IP#-y';
|
||||
const host = 'mail.infomaniak.com';
|
||||
const port = '993';
|
||||
|
||||
if (!user || !password || !host || !port) {
|
||||
console.error('Missing IMAP credentials');
|
||||
return null;
|
||||
}
|
||||
|
||||
return {
|
||||
user,
|
||||
password,
|
||||
host,
|
||||
port
|
||||
};
|
||||
return storedCredentials;
|
||||
}
|
||||
|
||||
// Client-side: use localStorage
|
||||
@ -381,23 +373,48 @@ export async function GET() {
|
||||
}
|
||||
}
|
||||
|
||||
// Add endpoint to get mailboxes
|
||||
export async function POST(request: Request) {
|
||||
try {
|
||||
const imap = await createImapConnection(getImapConfig()) as Imap;
|
||||
|
||||
const mailboxes = await new Promise((resolve, reject) => {
|
||||
imap.getBoxes((err, boxes) => {
|
||||
if (err) reject(err);
|
||||
resolve(boxes);
|
||||
});
|
||||
});
|
||||
const body = await request.json();
|
||||
const { email, password, host, port } = body;
|
||||
|
||||
if (!email || !password || !host || !port) {
|
||||
return NextResponse.json(
|
||||
{ error: 'Missing required fields' },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
|
||||
// Store credentials
|
||||
storedCredentials = {
|
||||
user: email,
|
||||
password,
|
||||
host,
|
||||
port
|
||||
};
|
||||
|
||||
// Test the connection
|
||||
const imap = await createImapConnection(storedCredentials);
|
||||
imap.end();
|
||||
return NextResponse.json({ mailboxes });
|
||||
|
||||
return NextResponse.json({ success: true });
|
||||
} catch (error) {
|
||||
console.error('Error fetching mailboxes:', error);
|
||||
return NextResponse.json({ error: 'Failed to fetch mailboxes' }, { status: 500 });
|
||||
console.error('Error in POST handler:', error);
|
||||
if (error instanceof Error) {
|
||||
if (error.message.includes('Invalid login or password')) {
|
||||
return NextResponse.json(
|
||||
{ error: 'Invalid login or password', details: error.message },
|
||||
{ status: 401 }
|
||||
);
|
||||
}
|
||||
return NextResponse.json(
|
||||
{ error: 'Failed to connect to email server', details: error.message },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
return NextResponse.json(
|
||||
{ error: 'Unknown error occurred' },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -2,112 +2,116 @@
|
||||
|
||||
import { useState } from 'react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { Label } from '@/components/ui/label';
|
||||
import { toast } from 'sonner';
|
||||
|
||||
export default function EmailLoginPage() {
|
||||
export default function LoginPage() {
|
||||
const router = useRouter();
|
||||
const [email, setEmail] = useState('');
|
||||
const [password, setPassword] = useState('');
|
||||
const [host, setHost] = useState('mail.infomaniak.com');
|
||||
const [port, setPort] = useState('993');
|
||||
const [error, setError] = useState('');
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [credentials, setCredentials] = useState({
|
||||
email: '',
|
||||
password: '',
|
||||
host: 'mail.infomaniak.com',
|
||||
port: '993'
|
||||
});
|
||||
|
||||
const handleSubmit = async (e: React.FormEvent) => {
|
||||
e.preventDefault();
|
||||
setError('');
|
||||
setLoading(true);
|
||||
|
||||
try {
|
||||
// Store credentials in localStorage
|
||||
localStorage.setItem('imapCredentials', JSON.stringify(credentials));
|
||||
|
||||
// Test the connection
|
||||
const response = await fetch('/api/mail/test-connection', {
|
||||
const response = await fetch('/api/mail', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(credentials),
|
||||
body: JSON.stringify({
|
||||
email,
|
||||
password,
|
||||
host,
|
||||
port,
|
||||
}),
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error('Failed to connect to email server');
|
||||
throw new Error(data.error || 'Failed to connect to email server');
|
||||
}
|
||||
|
||||
toast.success('Successfully connected to email server');
|
||||
// Store credentials in localStorage
|
||||
localStorage.setItem('imapCredentials', JSON.stringify({
|
||||
user: email,
|
||||
password,
|
||||
host,
|
||||
port,
|
||||
}));
|
||||
|
||||
// Redirect to mail page
|
||||
router.push('/mail');
|
||||
} catch (error) {
|
||||
console.error('Login error:', error);
|
||||
toast.error('Failed to connect to email server. Please check your credentials.');
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : 'An error occurred');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex min-h-screen items-center justify-center bg-white">
|
||||
<Card className="w-full max-w-md shadow-lg">
|
||||
<div className="min-h-screen flex items-center justify-center bg-gray-50">
|
||||
<Card className="w-full max-w-md">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-2xl font-bold text-gray-900">Email Login</CardTitle>
|
||||
<CardDescription className="text-gray-600">
|
||||
Enter your email credentials to access your mailbox
|
||||
</CardDescription>
|
||||
<CardTitle>Email Login</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<form onSubmit={handleSubmit} className="space-y-4">
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="email" className="text-gray-700">Email Address</Label>
|
||||
<div>
|
||||
<Label htmlFor="email">Email</Label>
|
||||
<Input
|
||||
id="email"
|
||||
type="email"
|
||||
placeholder="your@email.com"
|
||||
value={credentials.email}
|
||||
onChange={(e) => setCredentials({ ...credentials, email: e.target.value })}
|
||||
value={email}
|
||||
onChange={(e) => setEmail(e.target.value)}
|
||||
required
|
||||
className="border-gray-300 focus:border-blue-500 focus:ring-blue-500"
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="password" className="text-gray-700">Password</Label>
|
||||
<div>
|
||||
<Label htmlFor="password">Password</Label>
|
||||
<Input
|
||||
id="password"
|
||||
type="password"
|
||||
value={credentials.password}
|
||||
onChange={(e) => setCredentials({ ...credentials, password: e.target.value })}
|
||||
value={password}
|
||||
onChange={(e) => setPassword(e.target.value)}
|
||||
required
|
||||
className="border-gray-300 focus:border-blue-500 focus:ring-blue-500"
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="host" className="text-gray-700">IMAP Host</Label>
|
||||
<div>
|
||||
<Label htmlFor="host">IMAP Host</Label>
|
||||
<Input
|
||||
id="host"
|
||||
type="text"
|
||||
value={credentials.host}
|
||||
onChange={(e) => setCredentials({ ...credentials, host: e.target.value })}
|
||||
value={host}
|
||||
onChange={(e) => setHost(e.target.value)}
|
||||
required
|
||||
className="border-gray-300 focus:border-blue-500 focus:ring-blue-500"
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="port" className="text-gray-700">IMAP Port</Label>
|
||||
<div>
|
||||
<Label htmlFor="port">IMAP Port</Label>
|
||||
<Input
|
||||
id="port"
|
||||
type="text"
|
||||
value={credentials.port}
|
||||
onChange={(e) => setCredentials({ ...credentials, port: e.target.value })}
|
||||
value={port}
|
||||
onChange={(e) => setPort(e.target.value)}
|
||||
required
|
||||
className="border-gray-300 focus:border-blue-500 focus:ring-blue-500"
|
||||
/>
|
||||
</div>
|
||||
<Button
|
||||
type="submit"
|
||||
className="w-full bg-blue-600 hover:bg-blue-700 text-white"
|
||||
{error && (
|
||||
<div className="text-red-500 text-sm">{error}</div>
|
||||
)}
|
||||
<Button
|
||||
type="submit"
|
||||
className="w-full"
|
||||
disabled={loading}
|
||||
>
|
||||
{loading ? 'Connecting...' : 'Connect'}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user