ajout envoi smtp (paramètres, test envois, envoi à 1 participant). protège vue mot de passe

- ajout filtre page statistiques

src/app/admin/campaigns/[id]/participants/page.tsx

@@ -8,6 +8,7 @@ import AddParticipantModal from '@/components/AddParticipantModal';
 import EditParticipantModal from '@/components/EditParticipantModal';
 import DeleteParticipantModal from '@/components/DeleteParticipantModal';
 import ImportCSVModal from '@/components/ImportCSVModal';
+import SendParticipantEmailModal from '@/components/SendParticipantEmailModal';
 import { Button } from '@/components/ui/button';
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
 import { Badge } from '@/components/ui/badge';
@@ -29,6 +30,7 @@ function CampaignParticipantsPageContent() {
   const [showEditModal, setShowEditModal] = useState(false);
   const [showDeleteModal, setShowDeleteModal] = useState(false);
   const [showImportModal, setShowImportModal] = useState(false);
+  const [showSendEmailModal, setShowSendEmailModal] = useState(false);
   const [selectedParticipant, setSelectedParticipant] = useState<Participant | null>(null);
   const [copiedParticipantId, setCopiedParticipantId] = useState<string | null>(null);
 
@@ -357,6 +359,18 @@ function CampaignParticipantsPageContent() {
                                   </>
                                 )}
                               </Button>
+                              <Button
+                                variant="outline"
+                                size="sm"
+                                onClick={() => {
+                                  setSelectedParticipant(participant);
+                                  setShowSendEmailModal(true);
+                                }}
+                                className="text-xs"
+                              >
+                                <Mail className="w-3 h-3 mr-1" />
+                                Envoyer un mail
+                              </Button>
                             </div>
                           </div>
                         </div>
@@ -402,6 +416,15 @@ function CampaignParticipantsPageContent() {
           type="participants"
           campaignTitle={campaign?.title}
         />
+
+        {selectedParticipant && campaign && (
+          <SendParticipantEmailModal
+            isOpen={showSendEmailModal}
+            onClose={() => setShowSendEmailModal(false)}
+            participant={selectedParticipant}
+            campaign={campaign}
+          />
+        )}
       </div>
     </div>
   );

src/app/admin/campaigns/[id]/stats/page.tsx

@@ -9,6 +9,7 @@ import { Button } from '@/components/ui/button';
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
 import { Badge } from '@/components/ui/badge';
 import { Progress } from '@/components/ui/progress';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
 import Navigation from '@/components/Navigation';
 import AuthGuard from '@/components/AuthGuard';
 import { 
@@ -20,7 +21,12 @@ import {
   Award,
   FileText,
   Calendar,
-  ArrowLeft
+  ArrowLeft,
+  SortAsc,
+  TrendingDown,
+  Users2,
+  Target as TargetIcon,
+  Hash
 } from 'lucide-react';
 
 export const dynamic = 'force-dynamic';
@@ -31,8 +37,29 @@ interface PropositionStats {
   averageAmount: number;
   minAmount: number;
   maxAmount: number;
+  totalAmount: number;
+  participationRate: number;
+  voteDistribution: number;
+  consensusScore: number;
 }
 
+type SortOption = 
+  | 'popularity' 
+  | 'total_impact' 
+  | 'consensus' 
+  | 'engagement' 
+  | 'distribution' 
+  | 'alphabetical';
+
+const sortOptions = [
+  { value: 'popularity', label: 'Popularité', icon: TrendingUp, description: 'Moyenne décroissante puis nombre de votants' },
+  { value: 'total_impact', label: 'Impact total', icon: Target, description: 'Somme totale investie décroissante' },
+  { value: 'consensus', label: 'Consensus', icon: Users2, description: 'Plus petit écart-type = plus de consensus' },
+  { value: 'engagement', label: 'Engagement', icon: Users, description: 'Taux de participation décroissant' },
+  { value: 'distribution', label: 'Répartition', icon: BarChart3, description: 'Nombre de votes différents' },
+  { value: 'alphabetical', label: 'Alphabétique', icon: Hash, description: 'Ordre alphabétique par titre' }
+];
+
 function CampaignStatsPageContent() {
   const params = useParams();
   const campaignId = params.id as string;
@@ -43,6 +70,7 @@ function CampaignStatsPageContent() {
   const [votes, setVotes] = useState<Vote[]>([]);
   const [loading, setLoading] = useState(true);
   const [propositionStats, setPropositionStats] = useState<PropositionStats[]>([]);
+  const [sortBy, setSortBy] = useState<SortOption>('popularity');
 
   useEffect(() => {
     if (campaignId) {
@@ -74,13 +102,33 @@ function CampaignStatsPageContent() {
       const stats = propositionsData.map(proposition => {
         const propositionVotes = votesData.filter(vote => vote.proposition_id === proposition.id && vote.amount > 0);
         const amounts = propositionVotes.map(vote => vote.amount);
+        const totalAmount = amounts.reduce((sum, amount) => sum + amount, 0);
+        
+        // Calculer l'écart-type pour le consensus
+        const mean = amounts.length > 0 ? totalAmount / amounts.length : 0;
+        const variance = amounts.length > 0 
+          ? amounts.reduce((sum, amount) => sum + Math.pow(amount - mean, 2), 0) / amounts.length 
+          : 0;
+        const consensusScore = Math.sqrt(variance);
+        
+        // Calculer le taux de participation pour cette proposition
+        const participationRate = participantsData.length > 0 
+          ? (propositionVotes.length / participantsData.length) * 100 
+          : 0;
+        
+        // Calculer la répartition des votes (nombre de montants différents)
+        const uniqueAmounts = new Set(amounts).size;
         
         return {
           proposition,
           voteCount: propositionVotes.length,
-          averageAmount: amounts.length > 0 ? Math.round(amounts.reduce((sum, amount) => sum + amount, 0) / amounts.length) : 0,
+          averageAmount: amounts.length > 0 ? Math.round(totalAmount / amounts.length) : 0,
           minAmount: amounts.length > 0 ? Math.min(...amounts) : 0,
-          maxAmount: amounts.length > 0 ? Math.max(...amounts) : 0
+          maxAmount: amounts.length > 0 ? Math.max(...amounts) : 0,
+          totalAmount,
+          participationRate: Math.round(participationRate * 100) / 100,
+          voteDistribution: uniqueAmounts,
+          consensusScore: Math.round(consensusScore * 100) / 100
         };
       });
       
@@ -92,6 +140,38 @@ function CampaignStatsPageContent() {
     }
   };
 
+  const getSortedStats = () => {
+    const sorted = [...propositionStats];
+    
+    switch (sortBy) {
+      case 'popularity':
+        return sorted.sort((a, b) => {
+          if (b.averageAmount !== a.averageAmount) {
+            return b.averageAmount - a.averageAmount;
+          }
+          return b.voteCount - a.voteCount;
+        });
+      
+      case 'total_impact':
+        return sorted.sort((a, b) => b.totalAmount - a.totalAmount);
+      
+      case 'consensus':
+        return sorted.sort((a, b) => a.consensusScore - b.consensusScore);
+      
+      case 'engagement':
+        return sorted.sort((a, b) => b.participationRate - a.participationRate);
+      
+      case 'distribution':
+        return sorted.sort((a, b) => b.voteDistribution - a.voteDistribution);
+      
+      case 'alphabetical':
+        return sorted.sort((a, b) => a.proposition.title.localeCompare(b.proposition.title));
+      
+      default:
+        return sorted;
+    }
+  };
+
   const getParticipationRate = () => {
     if (participants.length === 0) return 0;
     const votedParticipants = participants.filter(p => {
@@ -101,8 +181,6 @@ function CampaignStatsPageContent() {
     return Math.round((votedParticipants.length / participants.length) * 100);
   };
 
-
-
   const getAverageVotesPerProposition = () => {
     if (propositions.length === 0) return 0;
     const totalVotes = votes.filter(v => v.amount > 0).length;
@@ -230,13 +308,42 @@ function CampaignStatsPageContent() {
         {/* Propositions Stats */}
         <Card>
           <CardHeader>
-            <CardTitle className="flex items-center gap-2">
-              <VoteIcon className="w-5 h-5" />
-              Préférences par proposition
-            </CardTitle>
-            <CardDescription>
-              Statistiques des montants exprimés par les participants pour chaque proposition
-            </CardDescription>
+            <div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
+              <div>
+                <CardTitle className="flex items-center gap-2">
+                  <VoteIcon className="w-5 h-5" />
+                  Préférences par proposition
+                </CardTitle>
+                <CardDescription>
+                  Statistiques des montants exprimés par les participants pour chaque proposition
+                </CardDescription>
+              </div>
+              
+              <div className="flex items-center gap-2">
+                <span className="text-sm font-medium text-slate-600 dark:text-slate-300">Trier par :</span>
+                <Select value={sortBy} onValueChange={(value: SortOption) => setSortBy(value)}>
+                  <SelectTrigger className="w-48">
+                    <SelectValue />
+                  </SelectTrigger>
+                  <SelectContent>
+                    {sortOptions.map((option) => {
+                      const IconComponent = option.icon;
+                      return (
+                        <SelectItem key={option.value} value={option.value}>
+                          <div className="flex items-center gap-2">
+                            <IconComponent className="w-4 h-4" />
+                            <div>
+                              <div className="font-medium">{option.label}</div>
+                              <div className="text-xs text-slate-500">{option.description}</div>
+                            </div>
+                          </div>
+                        </SelectItem>
+                      );
+                    })}
+                  </SelectContent>
+                </Select>
+              </div>
+            </div>
           </CardHeader>
           <CardContent>
             {propositionStats.length === 0 ? (
@@ -251,9 +358,7 @@ function CampaignStatsPageContent() {
               </div>
             ) : (
               <div className="space-y-6">
-                {propositionStats
-                  .sort((a, b) => b.averageAmount - a.averageAmount) // Trier par moyenne décroissante
-                  .map((stat, index) => (
+                {getSortedStats().map((stat, index) => (
                     <div key={stat.proposition.id} className="border rounded-lg p-6 hover:bg-slate-50 dark:hover:bg-slate-800 transition-colors">
                       <div className="flex items-start justify-between mb-4">
                         <div className="flex-1">
@@ -269,15 +374,19 @@ function CampaignStatsPageContent() {
                             {stat.proposition.description}
                           </p>
                         </div>
-                                                 {index === 0 && stat.averageAmount > 0 && (
-                           <Badge className="bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200">
-                             <Award className="w-3 h-3 mr-1" />
-                             Préférée
-                           </Badge>
-                         )}
+                        {index === 0 && stat.averageAmount > 0 && (
+                          <Badge className="bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200">
+                            <Award className="w-3 h-3 mr-1" />
+                            {sortBy === 'popularity' ? 'Préférée' : 
+                             sortBy === 'total_impact' ? 'Plus d\'impact' :
+                             sortBy === 'consensus' ? 'Plus de consensus' :
+                             sortBy === 'engagement' ? 'Plus d\'engagement' :
+                             sortBy === 'distribution' ? 'Plus de répartition' : 'Première'}
+                          </Badge>
+                        )}
                       </div>
 
-                      <div className="grid grid-cols-2 md:grid-cols-4 gap-4">
+                      <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
                         <div className="text-center">
                           <p className="text-2xl font-bold text-blue-600 dark:text-blue-400">
                             {stat.voteCount}
@@ -292,6 +401,12 @@ function CampaignStatsPageContent() {
                           </p>
                           <p className="text-xs text-slate-500 dark:text-slate-400">Moyenne</p>
                         </div>
+                        <div className="text-center">
+                          <p className="text-2xl font-bold text-purple-600 dark:text-purple-400">
+                            {stat.totalAmount}€
+                          </p>
+                          <p className="text-xs text-slate-500 dark:text-slate-400">Total</p>
+                        </div>
                         <div className="text-center">
                           <p className="text-2xl font-bold text-orange-600 dark:text-orange-400">
                             {stat.minAmount}€
@@ -304,6 +419,34 @@ function CampaignStatsPageContent() {
                           </p>
                           <p className="text-xs text-slate-500 dark:text-slate-400">Maximum</p>
                         </div>
+                        <div className="text-center">
+                          <p className="text-2xl font-bold text-indigo-600 dark:text-indigo-400">
+                            {stat.participationRate}%
+                          </p>
+                          <p className="text-xs text-slate-500 dark:text-slate-400">Participation</p>
+                        </div>
+                      </div>
+
+                      {/* Métriques avancées */}
+                      <div className="mt-4 grid grid-cols-1 md:grid-cols-2 gap-4">
+                        <div className="flex items-center justify-between p-3 bg-slate-50 dark:bg-slate-800 rounded-lg">
+                          <div className="flex items-center gap-2">
+                            <Users2 className="w-4 h-4 text-slate-500" />
+                            <span className="text-sm text-slate-600 dark:text-slate-300">Consensus</span>
+                          </div>
+                          <Badge variant="outline" className="text-xs">
+                            Écart-type: {stat.consensusScore}€
+                          </Badge>
+                        </div>
+                        <div className="flex items-center justify-between p-3 bg-slate-50 dark:bg-slate-800 rounded-lg">
+                          <div className="flex items-center gap-2">
+                            <BarChart3 className="w-4 h-4 text-slate-500" />
+                            <span className="text-sm text-slate-600 dark:text-slate-300">Répartition</span>
+                          </div>
+                          <Badge variant="outline" className="text-xs">
+                            {stat.voteDistribution} montants différents
+                          </Badge>
+                        </div>
                       </div>
 
                       {stat.voteCount > 0 && (