Bugfix: avatar upload throws 419

Author: devvir

.docker/scripts/staging.sh

@@ -56,8 +56,8 @@ echo -e "${BLUE}📦 Installing PHP dependencies...${NC}"
 "$SCRIPTS_DIR/composer.sh" install --no-interaction --optimize-autoloader
 
 # 8. Run migrations and seed
-echo -e "${BLUE}🗄️  Running database migrations and seeders...${NC}"
-"$SCRIPTS_DIR/artisan.sh" migrate:fresh --seed --force
+# echo -e "${BLUE}🗄️  Running database migrations and seeders...${NC}"
+# "$SCRIPTS_DIR/artisan.sh" migrate:fresh --seed --force
 
 # 9. Create storage symlink
 echo -e "${BLUE}🔗 Creating storage symlink...${NC}"

app/Http/Controllers/Settings/AvatarController.php

@@ -17,9 +17,9 @@ public function update(AvatarUpdateRequest $request): JsonResponse
 
         $user->avatar && Storage::disk('public')->delete($user->avatar);
 
-        $user->update([
-            'avatar' => $request->avatar->store('avatars', 'public'),
-        ]);
+        $path = $request->avatar->store('avatars', 'public');
+
+        $user->update(['avatar' => $path]);
 
         return response()->json([
             'message'    => __('Avatar updated successfully!'),

resources/js/components/avatar/AvatarUpload.vue

@@ -3,6 +3,7 @@ import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
 import { Button } from '@/components/ui/button';
 import { useInitials } from '@/composables/useInitials';
 import { _ } from '@/composables/useTranslations';
+import axios from 'axios';
 import { Camera, Loader2, X } from 'lucide-vue-next';
 
 interface Props {
@@ -98,20 +99,7 @@ const uploadAvatar = async (file: File) => {
   formData.append('avatar', file);
 
   try {
-    const response = await fetch(route(props.uploadRoute), {
-      method: 'POST',
-      headers: {
-        'X-CSRF-TOKEN':
-          document.querySelector('meta[name="csrf-token"]')?.getAttribute('content') || '',
-      },
-      body: formData,
-    });
-
-    if (!response.ok) {
-      throw new Error('Upload failed');
-    }
-
-    const data = await response.json();
+    const { data } = await axios.post(route(props.uploadRoute), formData);
 
     emit('success', data.avatar_url);
   } catch (_error) {