Pre-fill support for file input (#222)

Co-authored-by: Julien Nahum <julien@nahum.net>

app/Http/Requests/UploadAssetRequest.php

@@ -16,15 +16,20 @@ class UploadAssetRequest extends FormRequest
      */
     public function rules()
     {
+        $fileTypes = [
+            'png',
+            'jpeg',
+            'jpg',
+            'bmp',
+            'gif',
+            'svg'
+        ];
+        if ($this->offsetExists('type') && $this->get('type') === 'files') {
+            $fileTypes = [];
+        }
+
         return [
-            'url' => ['required',new StorageFile(self::FORM_ASSET_MAX_SIZE, [
+            'url' => ['required', new StorageFile(self::FORM_ASSET_MAX_SIZE, $fileTypes)],
-                'png',
-                'jpeg',
-                'jpg',
-                'bmp',
-                'gif',
-                'svg'
-            ])],
         ];
     }
 }

app/Http/Resources/FormSubmissionResource.php

@@ -46,7 +46,9 @@ class FormSubmissionResource extends JsonResource
         });
         foreach ($fileFields as $field) {
             if (isset($data[$field['id']]) && !empty($data[$field['id']])) {
-                $data[$field['id']] = collect($data[$field['id']])->map(function ($file) {
+                $data[$field['id']] = collect($data[$field['id']])->filter(function ($file) {
+                    return $file !== null && $file;
+                })->map(function ($file) {
                     return [
                         'file_url' => route('open.forms.submissions.file', [$this->form_id, $file]),
                         'file_name' => $file,

app/Jobs/Form/StoreFormSubmissionJob.php

@@ -4,6 +4,7 @@ namespace App\Jobs\Form;
 
 use App\Events\Forms\FormSubmitted;
 use App\Http\Controllers\Forms\PublicFormController;
+use App\Http\Controllers\Forms\FormController;
 use App\Http\Requests\AnswerFormRequest;
 use App\Models\Forms\Form;
 use App\Models\Forms\FormSubmission;
@@ -162,6 +163,14 @@ class StoreFormSubmissionJob implements ShouldQueue
             return null;
         }
 
+        if(filter_var($value, FILTER_VALIDATE_URL) !== FALSE && str_contains($value, parse_url(config('app.url'))['host'])) {  // In case of prefill we have full url so convert to s3
+            $fileName = basename($value);
+            $path = FormController::ASSETS_UPLOAD_PATH . '/' . $fileName;
+            $newPath = Str::of(PublicFormController::FILE_UPLOAD_PATH)->replace('?', $this->form->id);
+            Storage::move($path, $newPath.'/'.$fileName);
+            return $fileName;
+        }
+        
         if($this->isSkipForUpload($value)) {
             return $value;
         }

app/Rules/StorageFile.php

@@ -40,6 +40,11 @@ class StorageFile implements Rule
      */
     public function passes($attribute, $value): bool
     {
+        // If full path then no need to validate
+        if (filter_var($value, FILTER_VALIDATE_URL) !== FALSE) {
+            return true;
+        }
+
         // This is use when updating a record, and file uploads aren't changed.
         if($this->form){
             $newPath = Str::of(PublicFormController::FILE_UPLOAD_PATH)->replace('?', $this->form->id);

resources/js/components/forms/FileInput.vue

@@ -156,6 +156,7 @@
 
 <script>
 import Modal from '../Modal.vue'
+import axios from 'axios'
 import inputMixin from '~/mixins/forms/input.js'
 
 export default {
@@ -166,7 +167,8 @@ export default {
   props: {
     multiple: { type: Boolean, default: true },
     mbLimit: { type: Number, default: 5 },
-    accept: { type: String, default: '' }
+    accept: { type: String, default: '' },
+    moveToFormAssets: { type: Boolean, default: false }
   },
 
   data: () => ({
@@ -271,12 +273,30 @@ export default {
         if (!this.multiple) {
           this.files = []
         }
-        this.files.push({
+        if (this.moveToFormAssets) {
-          file: file,
+          // Move file to permanent storage for form assets
-          url: file.name.split('.').slice(0, -1).join('.') + '_' + response.uuid + '.' + response.extension
+          axios.post('/api/open/forms/assets/upload', {
-        })
+            type: 'files',
-        this.showUploadModal = false
+            url: file.name.split('.').slice(0, -1).join('.') + '_' + response.uuid + '.' + response.extension
-        this.loading = false
+          }).then(moveFileResponse => {
+            this.files.push({
+              file: file,
+              url: moveFileResponse.data.url
+            })
+            this.showUploadModal = false
+            this.loading = false
+          }).catch((error) => {
+            this.showUploadModal = false
+            this.loading = false
+          })
+        } else {
+          this.files.push({
+            file: file,
+            url: file.name.split('.').slice(0, -1).join('.') + '_' + response.uuid + '.' + response.extension
+          })
+          this.showUploadModal = false
+          this.loading = false
+        }
       }).catch((error) => {
         this.clearAll()
         this.showUploadModal = false

resources/js/components/open/forms/fields/components/FieldOptions.vue

@@ -265,7 +265,12 @@
                        :form="field"
                        label="Pre-filled value"
       />
-      <text-input v-else-if="field.type!=='files'" name="prefill" class="mt-3"
+      <file-input v-else-if="field.type==='files'" name="prefill" class="mt-4"
+                  :form="field"
+                  label="Pre-filled file"
+                  :multiple="field.multiple===true" :moveToFormAssets="true"
+      />
+      <text-input v-else-if="!['files', 'signature'].includes(field.type)" name="prefill" class="mt-3"
                   :form="field"
                   label="Pre-filled value"
                   :disabled="field.type==='date' && field.prefill_today===true"