ajout page envoi mails groupes
This commit is contained in:
Yannick Le Duc
465
src/app/admin/campaigns/[id]/send-emails/page.tsx
Normal file
465
src/app/admin/campaigns/[id]/send-emails/page.tsx
Normal file
@@ -0,0 +1,465 @@
|
|||||||
|
'use client';
|
||||||
|
|
||||||
|
import { useState, useEffect } from 'react';
|
||||||
|
import { useParams, useRouter } from 'next/navigation';
|
||||||
|
import { Campaign, Participant } from '@/types';
|
||||||
|
import { campaignService, participantService, settingsService } from '@/lib/services';
|
||||||
|
import { Button } from '@/components/ui/button';
|
||||||
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
||||||
|
import { Textarea } from '@/components/ui/textarea';
|
||||||
|
import { Label } from '@/components/ui/label';
|
||||||
|
import { Alert, AlertDescription } from '@/components/ui/alert';
|
||||||
|
import { Progress } from '@/components/ui/progress';
|
||||||
|
import { Badge } from '@/components/ui/badge';
|
||||||
|
import { ArrowLeft, Mail, Send, CheckCircle, XCircle, Clock, Users } from 'lucide-react';
|
||||||
|
import AuthGuard from '@/components/AuthGuard';
|
||||||
|
import Footer from '@/components/Footer';
|
||||||
|
|
||||||
|
export const dynamic = 'force-dynamic';
|
||||||
|
|
||||||
|
interface EmailProgress {
|
||||||
|
participant: Participant;
|
||||||
|
status: 'pending' | 'sending' | 'sent' | 'error';
|
||||||
|
error?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
function SendEmailsPageContent() {
|
||||||
|
const params = useParams();
|
||||||
|
const router = useRouter();
|
||||||
|
const campaignId = params.id as string;
|
||||||
|
|
||||||
|
const [campaign, setCampaign] = useState<Campaign | null>(null);
|
||||||
|
const [participants, setParticipants] = useState<Participant[]>([]);
|
||||||
|
const [loading, setLoading] = useState(true);
|
||||||
|
const [sending, setSending] = useState(false);
|
||||||
|
const [emailProgress, setEmailProgress] = useState<EmailProgress[]>([]);
|
||||||
|
const [defaultSubject, setDefaultSubject] = useState('');
|
||||||
|
const [defaultMessage, setDefaultMessage] = useState('');
|
||||||
|
const [smtpConfigured, setSmtpConfigured] = useState(false);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
loadData();
|
||||||
|
}, [campaignId]);
|
||||||
|
|
||||||
|
const loadData = async () => {
|
||||||
|
try {
|
||||||
|
setLoading(true);
|
||||||
|
const [campaignData, participantsData, smtpSettings] = await Promise.all([
|
||||||
|
campaignService.getById(campaignId),
|
||||||
|
participantService.getByCampaign(campaignId),
|
||||||
|
settingsService.getSmtpSettings()
|
||||||
|
]);
|
||||||
|
|
||||||
|
setCampaign(campaignData);
|
||||||
|
setParticipants(participantsData);
|
||||||
|
setSmtpConfigured(!!(smtpSettings.host && smtpSettings.username && smtpSettings.password));
|
||||||
|
|
||||||
|
// Initialiser le message par défaut
|
||||||
|
if (campaignData) {
|
||||||
|
setDefaultSubject(`Votez pour la campagne "${campaignData.title}"`);
|
||||||
|
setDefaultMessage(`Bonjour,
|
||||||
|
|
||||||
|
Vous êtes invité(e) à participer au vote pour la campagne "${campaignData.title}".
|
||||||
|
|
||||||
|
${campaignData.description}
|
||||||
|
|
||||||
|
Pour voter, cliquez sur le lien suivant :
|
||||||
|
[LIEN_DE_VOTE]
|
||||||
|
|
||||||
|
Vous disposez d'un budget de ${campaignData.budget_per_user}€ à répartir entre les propositions selon vos préférences.
|
||||||
|
|
||||||
|
Merci de votre participation !
|
||||||
|
|
||||||
|
Cordialement,`);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initialiser le progrès des emails
|
||||||
|
setEmailProgress(participantsData.map(participant => ({
|
||||||
|
participant,
|
||||||
|
status: 'pending' as const
|
||||||
|
})));
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Erreur lors du chargement des données:', error);
|
||||||
|
} finally {
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleSendAllEmails = async () => {
|
||||||
|
if (!campaign || !defaultSubject.trim() || !defaultMessage.trim()) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
setSending(true);
|
||||||
|
|
||||||
|
for (let i = 0; i < participants.length; i++) {
|
||||||
|
const participant = participants[i];
|
||||||
|
|
||||||
|
// Mettre à jour le statut à "sending"
|
||||||
|
setEmailProgress(prev => prev.map(p =>
|
||||||
|
p.participant.id === participant.id
|
||||||
|
? { ...p, status: 'sending' as const }
|
||||||
|
: p
|
||||||
|
));
|
||||||
|
|
||||||
|
try {
|
||||||
|
// Générer le lien de vote
|
||||||
|
const voteUrl = participant.short_id
|
||||||
|
? `${window.location.origin}/v/${participant.short_id}`
|
||||||
|
: `${window.location.origin}/v/EN_ATTENTE`;
|
||||||
|
|
||||||
|
// Remplacer le placeholder dans le message
|
||||||
|
const personalizedMessage = defaultMessage.replace('[LIEN_DE_VOTE]', voteUrl);
|
||||||
|
|
||||||
|
// Récupérer les paramètres SMTP
|
||||||
|
const smtpSettings = await settingsService.getSmtpSettings();
|
||||||
|
|
||||||
|
if (!smtpSettings.host || !smtpSettings.username || !smtpSettings.password) {
|
||||||
|
throw new Error('Configuration SMTP manquante');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Envoyer l'email via l'API
|
||||||
|
const response = await fetch('/api/send-participant-email', {
|
||||||
|
method: 'POST',
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json',
|
||||||
|
},
|
||||||
|
body: JSON.stringify({
|
||||||
|
smtpSettings,
|
||||||
|
toEmail: participant.email,
|
||||||
|
toName: `${participant.first_name} ${participant.last_name}`,
|
||||||
|
subject: defaultSubject.trim(),
|
||||||
|
message: personalizedMessage.trim(),
|
||||||
|
campaignTitle: campaign.title,
|
||||||
|
voteUrl
|
||||||
|
}),
|
||||||
|
});
|
||||||
|
|
||||||
|
const result = await response.json();
|
||||||
|
|
||||||
|
if (result.success) {
|
||||||
|
// Mettre à jour le statut à "sent"
|
||||||
|
setEmailProgress(prev => prev.map(p =>
|
||||||
|
p.participant.id === participant.id
|
||||||
|
? { ...p, status: 'sent' as const }
|
||||||
|
: p
|
||||||
|
));
|
||||||
|
} else {
|
||||||
|
throw new Error(result.error || 'Erreur lors de l\'envoi');
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
// Mettre à jour le statut à "error"
|
||||||
|
setEmailProgress(prev => prev.map(p =>
|
||||||
|
p.participant.id === participant.id
|
||||||
|
? { ...p, status: 'error' as const, error: error instanceof Error ? error.message : 'Erreur inconnue' }
|
||||||
|
: p
|
||||||
|
));
|
||||||
|
}
|
||||||
|
|
||||||
|
// Attendre 1 seconde avant l'email suivant
|
||||||
|
if (i < participants.length - 1) {
|
||||||
|
await new Promise(resolve => setTimeout(resolve, 1000));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
setSending(false);
|
||||||
|
};
|
||||||
|
|
||||||
|
const getStatusIcon = (status: EmailProgress['status']) => {
|
||||||
|
switch (status) {
|
||||||
|
case 'pending':
|
||||||
|
return <Clock className="w-4 h-4 text-slate-400" />;
|
||||||
|
case 'sending':
|
||||||
|
return <Mail className="w-4 h-4 text-blue-500 animate-pulse" />;
|
||||||
|
case 'sent':
|
||||||
|
return <CheckCircle className="w-4 h-4 text-green-500" />;
|
||||||
|
case 'error':
|
||||||
|
return <XCircle className="w-4 h-4 text-red-500" />;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const getStatusBadge = (status: EmailProgress['status']) => {
|
||||||
|
switch (status) {
|
||||||
|
case 'pending':
|
||||||
|
return <Badge variant="secondary">En attente</Badge>;
|
||||||
|
case 'sending':
|
||||||
|
return <Badge variant="default" className="bg-blue-500">En cours</Badge>;
|
||||||
|
case 'sent':
|
||||||
|
return <Badge variant="default" className="bg-green-500">Envoyé</Badge>;
|
||||||
|
case 'error':
|
||||||
|
return <Badge variant="destructive">Erreur</Badge>;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const sentCount = emailProgress.filter(p => p.status === 'sent').length;
|
||||||
|
const errorCount = emailProgress.filter(p => p.status === 'error').length;
|
||||||
|
const progressPercentage = participants.length > 0 ? (sentCount / participants.length) * 100 : 0;
|
||||||
|
|
||||||
|
if (loading) {
|
||||||
|
return (
|
||||||
|
<div className="min-h-screen bg-slate-50 dark:bg-slate-900">
|
||||||
|
<div className="container mx-auto px-4 py-8">
|
||||||
|
<div className="flex items-center justify-center h-64">
|
||||||
|
<div className="text-center">
|
||||||
|
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-slate-900 dark:border-slate-100 mx-auto mb-4"></div>
|
||||||
|
<p className="text-slate-600 dark:text-slate-400">Chargement...</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!campaign) {
|
||||||
|
return (
|
||||||
|
<div className="min-h-screen bg-slate-50 dark:bg-slate-900">
|
||||||
|
<div className="container mx-auto px-4 py-8">
|
||||||
|
<div className="text-center">
|
||||||
|
<h1 className="text-2xl font-bold text-slate-900 dark:text-slate-100 mb-4">Campagne non trouvée</h1>
|
||||||
|
<Button onClick={() => router.back()}>
|
||||||
|
<ArrowLeft className="w-4 h-4 mr-2" />
|
||||||
|
Retour
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (campaign.status !== 'voting') {
|
||||||
|
return (
|
||||||
|
<div className="min-h-screen bg-slate-50 dark:bg-slate-900">
|
||||||
|
<div className="container mx-auto px-4 py-8">
|
||||||
|
<div className="text-center">
|
||||||
|
<h1 className="text-2xl font-bold text-slate-900 dark:text-slate-100 mb-4">
|
||||||
|
Cette fonctionnalité n'est disponible que pour les campagnes en mode vote
|
||||||
|
</h1>
|
||||||
|
<p className="text-slate-600 dark:text-slate-400 mb-6">
|
||||||
|
La campagne "{campaign.title}" est actuellement en mode "{campaign.status}".
|
||||||
|
</p>
|
||||||
|
<Button onClick={() => router.back()}>
|
||||||
|
<ArrowLeft className="w-4 h-4 mr-2" />
|
||||||
|
Retour
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!smtpConfigured) {
|
||||||
|
return (
|
||||||
|
<div className="min-h-screen bg-slate-50 dark:bg-slate-900">
|
||||||
|
<div className="container mx-auto px-4 py-8">
|
||||||
|
<div className="max-w-2xl mx-auto">
|
||||||
|
<div className="text-center mb-8">
|
||||||
|
<h1 className="text-2xl font-bold text-slate-900 dark:text-slate-100 mb-4">
|
||||||
|
Configuration SMTP requise
|
||||||
|
</h1>
|
||||||
|
<p className="text-slate-600 dark:text-slate-400">
|
||||||
|
Vous devez configurer les paramètres SMTP avant de pouvoir envoyer des emails.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Card>
|
||||||
|
<CardContent className="p-6">
|
||||||
|
<Alert>
|
||||||
|
<Mail className="h-4 w-4" />
|
||||||
|
<AlertDescription>
|
||||||
|
Veuillez configurer les paramètres SMTP dans les paramètres de l'application avant de pouvoir envoyer des emails aux participants.
|
||||||
|
</AlertDescription>
|
||||||
|
</Alert>
|
||||||
|
|
||||||
|
<div className="flex gap-4 mt-6">
|
||||||
|
<Button onClick={() => router.push('/admin/settings')}>
|
||||||
|
Configurer SMTP
|
||||||
|
</Button>
|
||||||
|
<Button variant="outline" onClick={() => router.back()}>
|
||||||
|
<ArrowLeft className="w-4 h-4 mr-2" />
|
||||||
|
Retour
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="min-h-screen bg-slate-50 dark:bg-slate-900">
|
||||||
|
<div className="container mx-auto px-4 py-8">
|
||||||
|
<div className="max-w-4xl mx-auto">
|
||||||
|
{/* Header */}
|
||||||
|
<div className="flex items-center justify-between mb-8">
|
||||||
|
<div>
|
||||||
|
<h1 className="text-3xl font-bold text-slate-900 dark:text-slate-100 mb-2">
|
||||||
|
Envoyer des emails aux participants
|
||||||
|
</h1>
|
||||||
|
<p className="text-slate-600 dark:text-slate-400">
|
||||||
|
Campagne : {campaign.title}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<Button variant="outline" onClick={() => router.back()}>
|
||||||
|
<ArrowLeft className="w-4 h-4 mr-2" />
|
||||||
|
Retour
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Statistiques */}
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
|
||||||
|
<Card>
|
||||||
|
<CardContent className="p-6">
|
||||||
|
<div className="flex items-center">
|
||||||
|
<Users className="h-8 w-8 text-slate-600 dark:text-slate-400 mr-3" />
|
||||||
|
<div>
|
||||||
|
<p className="text-sm font-medium text-slate-600 dark:text-slate-400">Participants</p>
|
||||||
|
<p className="text-2xl font-bold text-slate-900 dark:text-slate-100">{participants.length}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
<Card>
|
||||||
|
<CardContent className="p-6">
|
||||||
|
<div className="flex items-center">
|
||||||
|
<CheckCircle className="h-8 w-8 text-green-500 mr-3" />
|
||||||
|
<div>
|
||||||
|
<p className="text-sm font-medium text-slate-600 dark:text-slate-400">Envoyés</p>
|
||||||
|
<p className="text-2xl font-bold text-green-600">{sentCount}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
<Card>
|
||||||
|
<CardContent className="p-6">
|
||||||
|
<div className="flex items-center">
|
||||||
|
<XCircle className="h-8 w-8 text-red-500 mr-3" />
|
||||||
|
<div>
|
||||||
|
<p className="text-sm font-medium text-slate-600 dark:text-slate-400">Erreurs</p>
|
||||||
|
<p className="text-2xl font-bold text-red-600">{errorCount}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Configuration de l'email */}
|
||||||
|
<Card className="mb-8">
|
||||||
|
<CardHeader>
|
||||||
|
<CardTitle>Configuration de l'email</CardTitle>
|
||||||
|
<CardDescription>
|
||||||
|
Personnalisez le message qui sera envoyé à tous les participants. Utilisez [LIEN_DE_VOTE] pour insérer automatiquement le lien de vote de chaque participant.
|
||||||
|
</CardDescription>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent className="space-y-4">
|
||||||
|
<div>
|
||||||
|
<Label htmlFor="subject">Sujet de l'email</Label>
|
||||||
|
<input
|
||||||
|
id="subject"
|
||||||
|
type="text"
|
||||||
|
value={defaultSubject}
|
||||||
|
onChange={(e) => setDefaultSubject(e.target.value)}
|
||||||
|
className="w-full px-3 py-2 border border-slate-300 dark:border-slate-600 rounded-md bg-white dark:bg-slate-800 text-slate-900 dark:text-slate-100"
|
||||||
|
placeholder="Sujet de l'email"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<Label htmlFor="message">Message</Label>
|
||||||
|
<Textarea
|
||||||
|
id="message"
|
||||||
|
value={defaultMessage}
|
||||||
|
onChange={(e) => setDefaultMessage(e.target.value)}
|
||||||
|
rows={12}
|
||||||
|
placeholder="Message de l'email..."
|
||||||
|
className="w-full"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex gap-4">
|
||||||
|
<Button
|
||||||
|
onClick={handleSendAllEmails}
|
||||||
|
disabled={sending || !defaultSubject.trim() || !defaultMessage.trim() || participants.length === 0}
|
||||||
|
className="flex-1"
|
||||||
|
>
|
||||||
|
<Send className="w-4 h-4 mr-2" />
|
||||||
|
{sending ? 'Envoi en cours...' : 'Envoyer à tous'}
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
{/* Progression */}
|
||||||
|
{sending && (
|
||||||
|
<Card className="mb-8">
|
||||||
|
<CardHeader>
|
||||||
|
<CardTitle>Progression de l'envoi</CardTitle>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent>
|
||||||
|
<div className="space-y-4">
|
||||||
|
<div className="flex items-center justify-between">
|
||||||
|
<span className="text-sm text-slate-600 dark:text-slate-400">
|
||||||
|
{sentCount} / {participants.length} emails envoyés
|
||||||
|
</span>
|
||||||
|
<span className="text-sm text-slate-600 dark:text-slate-400">
|
||||||
|
{Math.round(progressPercentage)}%
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<Progress value={progressPercentage} className="w-full" />
|
||||||
|
</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{/* Liste des participants */}
|
||||||
|
<Card>
|
||||||
|
<CardHeader>
|
||||||
|
<CardTitle>Participants</CardTitle>
|
||||||
|
<CardDescription>
|
||||||
|
Suivi de l'envoi des emails pour chaque participant
|
||||||
|
</CardDescription>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent>
|
||||||
|
<div className="space-y-3">
|
||||||
|
{emailProgress.map((progress) => (
|
||||||
|
<div key={progress.participant.id} className="flex items-center justify-between p-3 border border-slate-200 dark:border-slate-700 rounded-lg">
|
||||||
|
<div className="flex items-center space-x-3">
|
||||||
|
{getStatusIcon(progress.status)}
|
||||||
|
<div>
|
||||||
|
<p className="font-medium text-slate-900 dark:text-slate-100">
|
||||||
|
{progress.participant.first_name} {progress.participant.last_name}
|
||||||
|
</p>
|
||||||
|
<p className="text-sm text-slate-600 dark:text-slate-400">
|
||||||
|
{progress.participant.email}
|
||||||
|
</p>
|
||||||
|
{progress.error && (
|
||||||
|
<p className="text-sm text-red-600 dark:text-red-400">
|
||||||
|
{progress.error}
|
||||||
|
</p>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{getStatusBadge(progress.status)}
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Footer />
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function SendEmailsPage() {
|
||||||
|
return (
|
||||||
|
<AuthGuard>
|
||||||
|
<SendEmailsPageContent />
|
||||||
|
</AuthGuard>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -14,7 +14,7 @@ import { Badge } from '@/components/ui/badge';
|
|||||||
|
|
||||||
import AuthGuard from '@/components/AuthGuard';
|
import AuthGuard from '@/components/AuthGuard';
|
||||||
import Footer from '@/components/Footer';
|
import Footer from '@/components/Footer';
|
||||||
import { FolderOpen, Users, FileText, Plus, BarChart3, Settings, Check, Copy } from 'lucide-react';
|
import { FolderOpen, Users, FileText, Plus, BarChart3, Settings, Check, Copy, Mail } from 'lucide-react';
|
||||||
import StatusSwitch from '@/components/StatusSwitch';
|
import StatusSwitch from '@/components/StatusSwitch';
|
||||||
import { MarkdownContent } from '@/components/MarkdownContent';
|
import { MarkdownContent } from '@/components/MarkdownContent';
|
||||||
|
|
||||||
@@ -437,8 +437,16 @@ function AdminPageContent() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
) : (campaign.status === 'voting' || campaign.status === 'closed') ? (
|
) : (campaign.status === 'voting' || campaign.status === 'closed') ? (
|
||||||
/* Bouton Statistiques pour les campagnes en vote/fermées */
|
/* Boutons pour les campagnes en vote/fermées */
|
||||||
<div className="flex justify-center">
|
<div className="flex justify-center gap-3">
|
||||||
|
{campaign.status === 'voting' && (
|
||||||
|
<Button asChild variant="outline" className="border-slate-200 dark:border-slate-700 hover:bg-slate-50 dark:hover:bg-slate-800 text-slate-700 dark:text-slate-300">
|
||||||
|
<Link href={`/admin/campaigns/${campaign.id}/send-emails`}>
|
||||||
|
<Mail className="w-4 h-4 mr-2" />
|
||||||
|
Envoyer emails
|
||||||
|
</Link>
|
||||||
|
</Button>
|
||||||
|
)}
|
||||||
<Button asChild variant="outline" className="border-slate-200 dark:border-slate-700 hover:bg-slate-50 dark:hover:bg-slate-800 text-slate-700 dark:text-slate-300">
|
<Button asChild variant="outline" className="border-slate-200 dark:border-slate-700 hover:bg-slate-50 dark:hover:bg-slate-800 text-slate-700 dark:text-slate-300">
|
||||||
<Link href={`/admin/campaigns/${campaign.id}/stats`}>
|
<Link href={`/admin/campaigns/${campaign.id}/stats`}>
|
||||||
<BarChart3 className="w-4 h-4 mr-2" />
|
<BarChart3 className="w-4 h-4 mr-2" />
|
||||||
|
|||||||
Reference in New Issue
Block a user