alma/NeahNew
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

missions page 2

Browse Source
This commit is contained in:
alma 2025-05-06 13:51:23 +02:00
parent 93633c31ae
commit 05465beeaa
1 changed files with 33 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
app/missions/[missionId]/page.tsx
View File

@ -2,7 +2,7 @@
import { useState, useEffect } from "react";
import { Button } from "@/components/ui/button";
import { FileIcon, Calendar, Eye, MapPin, DollarSign, Clock, ThumbsUp, Languages, BarChart } from "lucide-react";
import { FileIcon, Calendar, Eye, MapPin, Users, Clock, ThumbsUp, Languages, BarChart } from "lucide-react";
import { useToast } from "@/components/ui/use-toast";
import { useParams } from "next/navigation";
@ -180,9 +180,34 @@ export default function MissionDetailPage() {
</div>
</div>
</div>
<Button className="bg-green-500 hover:bg-green-600 text-white px-4 py-2 rounded-md">
Participer à la mission
</Button>
{/* Display logo instead of Participate button */}
<div className="w-24 h-24 rounded-md overflow-hidden flex-shrink-0">
{mission.logoUrl ? (
<img
src={mission.logoUrl}
alt={mission.name}
className="w-full h-full object-cover rounded-md"
onError={(e) => {
console.log("Logo failed to load:", mission.logoUrl);
// Show placeholder on error
(e.currentTarget as HTMLImageElement).style.display = 'none';
const parent = e.currentTarget.parentElement;
if (parent) {
parent.classList.add('bg-gray-100');
parent.classList.add('flex');
parent.classList.add('items-center');
parent.classList.add('justify-center');
parent.innerHTML = `<span class="text-2xl font-medium text-gray-400">${mission.name.slice(0, 2).toUpperCase()}</span>`;
}
}}
/>
) : (
<div className="w-full h-full bg-gray-100 flex items-center justify-center">
<span className="text-2xl font-medium text-gray-400">{mission.name.slice(0, 2).toUpperCase()}</span>
</div>
)}
</div>
</div>
</div>
@ -200,7 +225,7 @@ export default function MissionDetailPage() {
<div className="bg-white rounded-lg p-4 flex items-center shadow-sm border border-gray-100">
<div className="bg-blue-50 p-3 rounded-full mr-3">
<DollarSign className="h-5 w-5 text-blue-600" />
<Users className="h-5 w-5 text-blue-600" />
</div>
<div>
<p className="text-sm text-gray-500 font-medium">Donneur d'ordre</p>
@ -244,12 +269,12 @@ export default function MissionDetailPage() {
<img
src={oddInfo.iconPath}
alt={oddInfo.label}
className="h-5 w-5"
className="h-8 w-8"
/>
</div>
<div>
<p className="text-sm text-gray-500 font-medium">ODD</p>
<p className="text-gray-800 font-medium">{oddInfo.label}</p>
<p className="text-sm text-gray-500 font-medium">Objectif</p>
<p className="text-gray-800 font-medium">Développement durable</p>
</div>
</div>
)}