NeahNew/app/centrale/[missionId]/edit/page.tsx
2025-05-06 20:59:35 +02:00

68 lines
2.1 KiB
TypeScript

"use client";
import { useState, useEffect } from "react";
import { useRouter } from "next/navigation";
import { MissionsAdminPanel } from "@/components/missions/missions-admin-panel";
import { Button } from "@/components/ui/button";
import { ArrowLeft, Home } from "lucide-react";
export default function EditMissionPage({ params }: { params: { missionId: string }}) {
const router = useRouter();
const { missionId } = params;
const [isLoading, setIsLoading] = useState(true);
// Check if the mission exists
useEffect(() => {
const checkMission = async () => {
try {
const response = await fetch(`/api/centrale/${missionId}`);
if (!response.ok) {
console.error('Mission not found, redirecting to list');
router.push('/centrale');
}
setIsLoading(false);
} catch (error) {
console.error('Error checking mission:', error);
router.push('/centrale');
}
};
checkMission();
}, [missionId, router]);
if (isLoading) {
return <div className="p-8 text-center">Loading...</div>;
}
return (
<div className="flex flex-col h-full w-full bg-white">
<div className="bg-white border-b border-gray-100 py-3 px-6 flex items-center justify-between">
<div className="flex items-center space-x-4">
<Button
variant="ghost"
size="sm"
onClick={() => router.push(`/centrale/${missionId}`)}
className="text-gray-600 hover:text-gray-900"
>
<ArrowLeft className="h-4 w-4 mr-2" />
Retour aux détails
</Button>
<Button
variant="ghost"
size="sm"
onClick={() => router.push("/centrale")}
className="text-gray-600 hover:text-gray-900"
>
<Home className="h-4 w-4 mr-2" />
Liste des missions
</Button>
</div>
</div>
<div className="flex-1 overflow-auto bg-white">
<MissionsAdminPanel missionId={missionId} />
</div>
</div>
);
}