fix: improve image upload error handling on mobile and desktop

Fixed image upload issues by improving error handling and validation:

Mobile (NoteDetailPage.tsx):
- Added file size validation (5MB max) before upload
- Added error message when upload returns null
- Specified exact image types in accept attribute
- Better user feedback for all error cases

Desktop (Index.tsx):
- Added file size validation (5MB max) before upload
- Added error message when upload returns null
- Specified exact image types in accept attribute
- Removed unnecessary handleUpdateNote call (backend ignores images field)
- Fixed state update to only update local state, not call backend

Both versions now:
- Show clear error messages to users when upload fails
- Validate file size before attempting upload
- Accept only supported formats: JPEG, PNG, WebP, GIF
- Handle null responses from upload service properly

This fixes the silent failure issue where images would not upload but no error was shown to the user.

src/pages/Index.tsx

@@ -1335,17 +1335,29 @@ const Index = () => {
                   <input
                     id="image-upload"
                     type="file"
-                    accept="image/*"
+                    accept="image/jpeg,image/png,image/webp,image/gif"
                     className="hidden"
                     onChange={async (e) => {
                       if (e.target.files && e.target.files[0] && openNote?.id) {
+                        const file = e.target.files[0];
+
+                        // Vérifier la taille du fichier (5MB max)
+                        const maxSize = 5 * 1024 * 1024; // 5MB
+                        if (file.size > maxSize) {
+                          showError("L'image est trop grande (max 5MB)");
+                          e.target.value = '';
+                          return;
+                        }
+
                         try {
-                          const image = await NotesService.uploadImage(openNote.id, e.target.files[0]);
+                          const image = await NotesService.uploadImage(openNote.id, file);
                           if (image) {
                             const updatedImages = [...(openNote.images || []), image];
                             setOpenNote({ ...openNote, images: updatedImages });
-                            await handleUpdateNote({ images: updatedImages });
+                            setNotes(prev => prev.map(note => note.id === openNote.id ? { ...note, images: updatedImages } : note));
                             showSuccess("Image ajoutée");
+                          } else {
+                            showError("Erreur lors de l'upload de l'image");
                           }
                         } catch (error) {
                           showError("Erreur lors de l'upload de l'image");

src/pages/mobile/NoteDetailPage.tsx

@@ -118,12 +118,25 @@ export default function NoteDetailPage() {
 
   const handleImageUpload = async (e: React.ChangeEvent<HTMLInputElement>) => {
     if (!e.target.files || !e.target.files[0] || !note?.id) return;
+
+    const file = e.target.files[0];
+
+    // Vérifier la taille du fichier (5MB max)
+    const maxSize = 5 * 1024 * 1024; // 5MB
+    if (file.size > maxSize) {
+      showError("L'image est trop grande (max 5MB)");
+      e.target.value = '';
+      return;
+    }
+
     try {
-      const image = await NotesService.uploadImage(note.id, e.target.files[0]);
+      const image = await NotesService.uploadImage(note.id, file);
       if (image) {
         const updatedImages = [...(note.images || []), image];
         setNote({ ...note, images: updatedImages });
         showSuccess("Image ajoutée");
+      } else {
+        showError("Erreur lors de l'upload de l'image");
       }
     } catch (error) {
       showError("Erreur lors de l'upload");
@@ -228,7 +241,7 @@ export default function NoteDetailPage() {
           <input
             id="image-upload"
             type="file"
-            accept="image/*"
+            accept="image/jpeg,image/png,image/webp,image/gif"
             className="hidden"
             onChange={handleImageUpload}
           />