Finnish image field

Author: Sofian Mourabit

resources/views/fields/image.blade.php

@@ -1,13 +1,21 @@
 <div class="{{ $field->divClass ?? 'col-6' }}">
     @include('livewire-forms::fields.label')
+
     @if($field->getValue())
     <img
         class="{{ $field->class ?? 'img-fluid' }}"
-        src="{{ optional($field->getValue())->getFormatOrOriginal($field->format)}}"
+        src="{{ isset($files_[$field->getName()]) ? $files_[$field->getName()]->temporaryUrl() : $field->getValue() }}"
         alt="{{ $field->altText ?? optional($field->getValue())->name  }}"
         id="{{ $field->getName() }}"
-        wire:model="files.{{ $field->getName() }}"
     >
     @endif
+    <input
+        type="file"
+        class="{{ $field->class }}"
+        id="{{ $field->getName() }}"
+        name="{{ $field->getName() }}"
+        placeholder="{{ $field->getLabel() }}"
+        wire:model="files.{{ $field->getName() }}"
+    >
     @include('livewire-forms::fields.error')
 </div>

src/Fields/ImageField.php

@@ -3,25 +3,30 @@
 namespace Codedor\LivewireForms\Fields;
 
 use Codedor\Media\Models\Attachment;
+use Livewire\TemporaryUploadedFile;
 
 class ImageField extends Field
 {
     public $component = 'livewire-forms::fields.image';
 
     public $value = false;
 
+    public $containsFile = true;
+
     public function getValue($doConditionalChecks = false)
     {
+
         $value = parent::getValue($doConditionalChecks);
 
         if ($value === '') {
             return $value;
         }
 
         if (Attachment::find($value)) {
-            return Attachment::find($value);
+            return Attachment::find($value)->getFormatOrOriginal($this->format ?? '');
         }
 
         return $value;
     }
+
 }