missions s3

components/missions/attachments-list.tsx

@@ -189,6 +189,7 @@ export function AttachmentsList({
             type="attachment"
             missionId={missionId}
             onUploadComplete={handleAttachmentUploaded}
+            isNewMission={false}
           />
           <div className="mt-2 flex justify-end">
             <Button

components/missions/file-upload.tsx

@@ -8,18 +8,22 @@ import { toast } from '@/components/ui/use-toast';
 
 interface FileUploadProps {
   type: 'logo' | 'attachment';
-  missionId: string;
+  missionId?: string; // Make missionId optional
   onUploadComplete?: (data: any) => void;
+  onFileSelect?: (file: File) => void; // New callback for when file is selected but not uploaded yet
   maxSize?: number; // in bytes, default 5MB
   acceptedFileTypes?: string;
+  isNewMission?: boolean; // Flag to indicate if this is a new mission being created
 }
 
 export function FileUpload({
   type,
   missionId,
   onUploadComplete,
+  onFileSelect,
   maxSize = 5 * 1024 * 1024, // 5MB
-  acceptedFileTypes = type === 'logo' ? 'image/*' : '.pdf,.doc,.docx,.xls,.xlsx,.jpg,.jpeg,.png'
+  acceptedFileTypes = type === 'logo' ? 'image/*' : '.pdf,.doc,.docx,.xls,.xlsx,.jpg,.jpeg,.png',
+  isNewMission = false
 }: FileUploadProps) {
   // Log props on init
   console.log('FileUpload component initialized with props:', { 
@@ -109,6 +113,10 @@ export function FileUpload({
       const droppedFile = e.dataTransfer.files[0];
       if (validateFile(droppedFile)) {
         setFile(droppedFile);
+        // If this is a new mission, call onFileSelect instead of waiting for upload
+        if (isNewMission && onFileSelect) {
+          onFileSelect(droppedFile);
+        }
       }
     }
   };
@@ -118,20 +126,15 @@ export function FileUpload({
       const selectedFile = e.target.files[0];
       if (validateFile(selectedFile)) {
         setFile(selectedFile);
+        // If this is a new mission, call onFileSelect instead of waiting for upload
+        if (isNewMission && onFileSelect) {
+          onFileSelect(selectedFile);
+        }
       }
     }
   };
   
   const handleUpload = async () => {
-    // Log all values to see what's missing
-    console.log('Debug upload parameters:', {
-      file,
-      sessionUser: session?.user,
-      userId: session?.user?.id,
-      missionId
-    });
-    
-    // Check for missing parameters and provide specific feedback
     if (!file) {
       console.error('Upload failed: No file selected');
       toast({
@@ -152,6 +155,20 @@ export function FileUpload({
       return;
     }
     
+    // For new missions, just notify through the callback and don't try to upload
+    if (isNewMission) {
+      if (onFileSelect) {
+        onFileSelect(file);
+      }
+      toast({
+        title: 'File selected',
+        description: 'The file will be uploaded when you save the mission.',
+        variant: 'default',
+      });
+      return;
+    }
+    
+    // For existing missions, we need a missionId
     if (!missionId) {
       console.error('Upload failed: Missing mission ID');
       toast({
@@ -331,15 +348,18 @@ export function FileUpload({
                   >
                     <X className="h-4 w-4" />
                   </Button>
-                  <Button
-                    variant="default"
-                    size="sm"
-                    className="bg-blue-600 hover:bg-blue-700 text-white"
-                    onClick={handleUpload}
-                  >
-                    <Check className="h-4 w-4 mr-1" />
-                    Upload
-                  </Button>
+                  
+                  {!isNewMission && (
+                    <Button
+                      variant="default"
+                      size="sm"
+                      className="bg-blue-600 hover:bg-blue-700 text-white"
+                      onClick={handleUpload}
+                    >
+                      <Check className="h-4 w-4 mr-1" />
+                      Upload
+                    </Button>
+                  )}
                 </>
               )}
             </div>

components/missions/missions-admin-panel.tsx

@@ -64,6 +64,7 @@ export function MissionsAdminPanel() {
   const [missionId, setMissionId] = useState<string>("");
   const [activeTab, setActiveTab] = useState<string>("general");
   const [isSubmitting, setIsSubmitting] = useState(false);
+  const [selectedLogoFile, setSelectedLogoFile] = useState<File | null>(null);
   const [missionData, setMissionData] = useState<{
     name?: string;
     logo?: string;
@@ -415,6 +416,28 @@ export function MissionsAdminPanel() {
       
       const data = await response.json();
       
+      // If we have a selected logo file and this is a new mission, upload it now
+      if (selectedLogoFile && data.mission && data.mission.id) {
+        console.log('Uploading logo for new mission:', data.mission.id);
+        
+        const formData = new FormData();
+        formData.append('file', selectedLogoFile);
+        formData.append('missionId', data.mission.id);
+        formData.append('type', 'logo');
+        
+        const logoResponse = await fetch('/api/missions/upload', {
+          method: 'POST',
+          body: formData
+        });
+        
+        if (!logoResponse.ok) {
+          console.error('Failed to upload logo:', await logoResponse.json());
+          // Continue with mission creation even if logo upload fails
+        } else {
+          console.log('Logo uploaded successfully');
+        }
+      }
+      
       toast({
         title: "Mission créée avec succès",
         description: "Tous les gardiens ont été assignés et la mission a été enregistrée.",
@@ -473,6 +496,12 @@ export function MissionsAdminPanel() {
                   <FileUpload 
                     type="logo"
                     missionId={missionId || ""}
+                    isNewMission={!missionId}
+                    onFileSelect={(file) => {
+                      // Store the selected file in state for later upload
+                      setSelectedLogoFile(file);
+                      console.log('Logo file selected for later upload:', file.name);
+                    }}
                     onUploadComplete={(data) => {
                       // Handle logo upload complete
                       if (data?.filePath) {