add fix

app/Http/Controllers/Dashboard/ProjectController.php

@@ -7,6 +7,7 @@
 use App\Http\Controllers\Controller;
 use App\Http\Requests\Project\StoreRequest;
 use App\Http\Resources\ProjectCardResource;
+use App\Http\Resources\ProjectResource;
 use App\Models\Activity;
 use App\Models\County;
 use App\Models\Project;
@@ -47,8 +48,14 @@ public function store(StoreRequest $request)
     {
         $data = $request->validated();
         $project = (new ProjectService(Project::class))->create($data);
-        $project->addAllMediaFromRequest()->each(function ($fileAdder) {
-            $fileAdder->toMediaCollection('project_files');
+        $project->addAllMediaFromRequest()->each(function ($fileAdder,$index) {
+            if ($index == 0)
+            {
+                $fileAdder->toMediaCollection('preview');
+            }else{
+
+                $fileAdder->toMediaCollection('gallery');
+            }
         });
 
         return redirect()->route('dashboard.projects.edit', $project->id)->with('success', 'Project created.');
@@ -61,7 +68,7 @@ public function edit(Project $project)
         $counties = County::get(['name', 'id']);
 
         return Inertia::render('AdminOng/Projects/EditProject', [
-            'project' => $project,
+            'project' => new ProjectResource($project),
             'counties' => $counties,
             'projectCategories' => ProjectCategory::get(['name', 'id']),
             'changes' => Activity::pendingChangesFor($project)

app/Http/Resources/ProjectCardResource.php

@@ -18,7 +18,7 @@ public function toArray(Request $request): array
             'name' => $this->name,
             'slug' => $this->slug,
             'county' => 'Replace me', // $this->county?->name,
-            'image' => $this->getFirstMediaUrl('cover_image'),
+            'image' => $this->getFirstMediaUrl('preview'),
             'organization' => [
                 'name' => $this->organization->name,
                 'id' => $this->organization->id,

app/Http/Resources/ProjectResource.php

@@ -0,0 +1,53 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\Http\Resources;
+
+use Illuminate\Http\Request;
+
+class ProjectResource extends Resource
+{
+    public static $wrap = null;
+
+    public function toArray(Request $request): array
+    {
+//        dd($this);
+
+        return [
+            'id' => $this->id,
+            // 'type' => $this->type,
+            'name' => $this->name,
+            'slug' => $this->slug,
+            'county' => $this->counties->pluck('name')->join(', '),
+            'image' => $this->getFirstMediaUrl('preview'),
+            'target_budget'=> $this->target_budget,
+            'gallery' => $this->getMedia('gallery')->map(function ($media) {
+
+                return [
+                    'id' => $media->id,
+                    'url' => $media->getFullUrl(),
+                ];
+            })->toArray(),
+            'organization' => [
+                'name' => $this->organization->name,
+                'id' => $this->organization->id,
+            ],
+            'is_national' => boolval($this->is_national),
+            'start' => $this->start,
+            'end' => $this->end,
+            'description' => $this->description,
+            'scope' => $this->scope,
+            'reason_to_donate' => $this->reason_to_donate,
+            'accepting_volunteers' => boolval($this->accepting_volunteers),
+            'accepting_comments' => boolval($this->accepting_comments),
+            'videos' => $this->videos,
+            'external_links' => $this->external_links,
+            'categories' => $this->categories->pluck('name')->join(', '),
+            'championship' => [
+                'troffees_count' => 2,
+                'score' => 100,
+            ],
+        ];
+    }
+}

app/Models/Project.php

@@ -71,15 +71,17 @@ class Project extends Model implements HasMedia
 
     public function registerMediaCollections(): void
     {
-        $this->addMediaCollection('cover_image')
-            ->singleFile()
+        $this->addMediaCollection('preview')
             ->useFallbackUrl(Vite::image('placeholder.png'))
+            ->singleFile()
             ->registerMediaConversions(function (Media $media) {
                 $this
-                    ->addMediaConversion('thumb')
-                    ->fit(Manipulations::FIT_CROP, 300, 300)
+                    ->addMediaConversion('preview')
+                    ->fit(Manipulations::FIT_CONTAIN, 300, 300)
                     ->nonQueued();
             });
+
+        $this->addMediaCollection('gallery');
     }
 
     public function getActivitylogOptions(): LogOptions

resources/js/Components/form/FileGroup.vue

@@ -73,7 +73,7 @@
         props.modelValue.splice(index, 1);
     };
     const setCoverImage = (index) => {
-        //TODO set cover image
+      console.log(index)
     };
 
     /** Component emits. */

resources/js/Pages/AdminOng/Projects/EditProject.vue

@@ -92,7 +92,7 @@
             <!-- Edit project category -->
             <Field :label="$t('project_category_label')" :hasPendingChanges="changes.includes('categories')">
                 <template #value>
-                    {{ project.categories.map((item) => item.name).join(', ') }}
+                    {{ project.categories }}
                 </template>
 
                 <template #action>
@@ -115,7 +115,7 @@
             <!-- Edit project county -->
             <Field :label="$t('counties_label')" :hasPendingChanges="changes.includes('counties')" alt>
                 <template #value>
-                    {{ project.counties.map((item) => item.name).join(', ') }}
+                    {{ project.counties}}
                 </template>
 
                 <template #action>
@@ -247,7 +247,7 @@
             <Field :label="$t('main_image')" :hasPendingChanges="changes.includes('cover_image')">
                 <template #value>
                     <div class="flex items-center col-span-12 gap-6 text-base font-medium leading-6 text-gray-700">
-                        <img class="object-contain w-32 h-32 shrink-0" :src="project.cover_image" alt="" />
+                        <img class="object-contain w-32 h-32 shrink-0" :src="project.image" alt="" />
 
                         <div>
                             <EditModal
@@ -258,7 +258,7 @@
                                 <FileInput
                                     :label="$t('upload_image')"
                                     @upload="(file) => (form.cover_image = file)"
-                                    :form="project.cover_image"
+                                    :form="project.image"
                                     accept="image/png, image/jpeg"
                                     previewable
                                 />
@@ -275,9 +275,9 @@
 
                     <div class="flex flex-wrap">
                         <div
-                            :style="{ backgroundImage: 'url(' + image.preview_url + ')' }"
+                            :style="{backgroundImage: `url(${image.url})` }"
                             style="background-size: contain"
-                            v-for="(image, index) in project.media"
+                            v-for="(image, index) in project.gallery"
                             :key="index"
                             class="grid content-end grid-cols-2 gap-4 mx-2 my-2 w-60 h-60"
                         >
@@ -417,11 +417,16 @@
 
     const project = ref(props.project);
     const originalProject = computed(() => props.project);
+    console.log(project.value)
 
     const resetField = (field) => {
         project.value[field] = originalProject.value[field];
     };
 
+    function urlImage (image){
+        return window.location.origin+image.original_url
+    }
+
     const editField = (field) => {
         const form = useForm({
             [field]: project.value[field],