file upload max size feature (#328)

* file upload max size feature

* Change label

---------

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

Author: madassdev

app/Http/Requests/AnswerFormRequest.php

@@ -27,6 +27,12 @@ public function __construct(Request $request)
         $this->maxFileSize = $this->form->workspace->max_file_size;
     }
 
+    private function getFieldMaxFileSize($fieldProps)
+    {
+        return array_key_exists('max_file_size', $fieldProps) ?
+            min($fieldProps['max_file_size'] * 1000000, $this->maxFileSize) : $this->maxFileSize;
+    }
+
     /**
      * Validate form before use it
      *
@@ -180,7 +186,7 @@ private function getPropertyRules($property): array
                 if (! empty($property['allowed_file_types'])) {
                     $allowedFileTypes = explode(',', $property['allowed_file_types']);
                 }
-                $this->requestRules[$property['id'].'.*'] = [new StorageFile($this->maxFileSize, $allowedFileTypes, $this->form)];
+                $this->requestRules[$property['id'] . '.*'] = [new StorageFile($this->getFieldMaxFileSize($property), $allowedFileTypes, $this->form)];
 
                 return ['array'];
             case 'email':

app/Http/Requests/UserFormRequest.php

@@ -118,6 +118,9 @@ public function rules()
             'properties.*.generates_uuid' => 'boolean|nullable',
             'properties.*.generates_auto_increment_id' => 'boolean|nullable',
 
+            // For file (min and max)
+            'properties.*.max_file_size' => 'min:1|numeric',
+
             // Security & Privacy
             'can_be_indexed' => 'boolean',
             'password' => 'sometimes|nullable',

client/components/open/forms/OpenFormField.vue

@@ -303,7 +303,7 @@ export default {
         }
       } else if (field.type === 'files' || (field.type === 'url' && field.file_upload)) {
         inputProperties.multiple = (field.multiple !== undefined && field.multiple)
-        inputProperties.mbLimit = this.form?.max_file_size ?? this.currentWorkspace?.max_file_size
+        inputProperties.mbLimit = Math.min(Math.max(field.max_file_size, 1), this.form?.max_file_size ?? this.currentWorkspace?.max_file_size)
         inputProperties.accept = (this.form.is_pro && field.allowed_file_types) ? field.allowed_file_types : ''
       } else if (field.type === 'number' && field.is_rating) {
         inputProperties.numberOfStars = parseInt(field.rating_max_value)

client/components/open/forms/fields/components/FieldOptions.vue

@@ -60,6 +60,13 @@
                   label="Allowed file types" placeholder="jpg,jpeg,png,gif"
                   help="Comma separated values, leave blank to allow all file types"
       />
+
+      <text-input name="max_file_size" class="mt-3" :form="field" native-type="number"
+                  :min="1"
+                  :max="mbLimit"
+                  label="Maximum file size (in MB)" :placeholder="`1MB - ${mbLimit}MB`"
+                  help="Set the maximum file size that can be uploaded"
+      />
     </div>
 
     <!--   Number Options   -->
@@ -428,6 +435,9 @@ export default {
       required: false
     }
   },
+  setup() {
+    return { currentWorkspace: computed(() => useWorkspacesStore().getCurrent), }
+  },
   data () {
     return {
       typesWithoutPlaceholder: ['date', 'checkbox', 'files'],
@@ -442,6 +452,9 @@ export default {
     hasPlaceholder () {
       return !this.typesWithoutPlaceholder.includes(this.field.type)
     },
+    mbLimit() {
+      return this.form?.max_file_size ?? this.currentWorkspace?.max_file_size
+    },
     prefillSelectsOptions () {
       if (!['select', 'multi_select'].includes(this.field.type)) return {}
 
@@ -504,6 +517,9 @@ export default {
     if (['text', 'number', 'url', 'email'].includes(this.field?.type) && !this.field?.max_char_limit) {
       this.field.max_char_limit = 2000
     }
+    if (this.field.type == 'files') {
+      this.field.max_file_size = Math.min((this.field.max_file_size ?? this.mbLimit), this.mbLimit)
+    }
   },
 
   methods: {