From 927886334b321dffeca77b8c601e6e656f449a5f Mon Sep 17 00:00:00 2001
From: ljf <ljf+git@grimaud.me>
Date: Fri, 27 Aug 2021 01:09:36 +0200
Subject: [PATCH] [enh] Add some step, autocomplete, trim, visibleIf properties

---
 .../globals/formItems/InputItem.vue           | 12 ++++++++++++
 app/src/helpers/yunohostArguments.js          | 19 ++++++++++++-------
 app/src/views/app/AppConfigPanel.vue          |  7 +++----
 3 files changed, 27 insertions(+), 11 deletions(-)

diff --git a/app/src/components/globals/formItems/InputItem.vue b/app/src/components/globals/formItems/InputItem.vue
index c3b8e36b..9e6cdfc2 100644
--- a/app/src/components/globals/formItems/InputItem.vue
+++ b/app/src/components/globals/formItems/InputItem.vue
@@ -9,6 +9,9 @@
     :required="required"
     :min="min"
     :max="max"
+    :step="step"
+    :trim="trim"
+    :autocomplete="autocomplete_"
     @blur="$parent.$emit('touch', name)"
   />
 </template>
@@ -17,6 +20,12 @@
 export default {
   name: 'InputItem',
 
+  data () {
+    return {
+      autocomplete_: (this.autocomplete) ? this.autocomplete : (this.type === 'password') ? 'new-password' : null
+    }
+  },
+
   props: {
     value: { type: [String, Number], default: null },
     id: { type: String, default: null },
@@ -26,6 +35,9 @@ export default {
     state: { type: Boolean, default: null },
     min: { type: Number, default: null },
     max: { type: Number, default: null },
+    step: { type: Number, default: null },
+    trim: { type: Boolean, default: true },
+    autocomplete: { type: String, default: null },
     name: { type: String, default: null }
   }
 }
diff --git a/app/src/helpers/yunohostArguments.js b/app/src/helpers/yunohostArguments.js
index 8c623fa2..edc5def7 100644
--- a/app/src/helpers/yunohostArguments.js
+++ b/app/src/helpers/yunohostArguments.js
@@ -69,17 +69,17 @@ export function formatYunoHostArgument (arg) {
     {
       types: [undefined, 'string', 'path'],
       name: 'InputItem',
-      props: defaultProps
+      props: defaultProps.concat(['autocomplete', 'trim'])
     },
     {
       types: ['email', 'url', 'date', 'time', 'color'],
       name: 'InputItem',
-      props: defaultProps.concat(['type'])
+      props: defaultProps.concat(['type', 'trim'])
     },
     {
       types: ['password'],
       name: 'InputItem',
-      props: defaultProps.concat(['type']),
+      props: defaultProps.concat(['type', 'autocomplete', 'trim']),
       callback: function () {
         if (!arg.help) {
           arg.help = 'good_practices_about_admin_password'
@@ -91,7 +91,7 @@ export function formatYunoHostArgument (arg) {
     {
       types: ['number', 'range'],
       name: 'InputItem',
-      props: defaultProps.concat(['type', 'min', 'max']),
+      props: defaultProps.concat(['type', 'min', 'max', 'step']),
       callback: function () {
         if (!isNaN(parseInt(arg.min))) {
           validation.minValue = validators.minValue(parseInt(arg.min))
@@ -123,7 +123,12 @@ export function formatYunoHostArgument (arg) {
     {
       types: ['file'],
       name: 'FileItem',
-      props: defaultProps.concat(['accept'])
+      props: defaultProps.concat(['accept']),
+      callback: function () {
+        if (value) {
+          value = new File([''], value.replace(/^.*[/]/, ''))
+        }
+      }
     },
     {
       types: ['text'],
@@ -202,8 +207,8 @@ export function formatYunoHostArgument (arg) {
     field.link = { href: arg.helpLink.href, text: i18n.t(arg.helpLink.text) }
   }
 
-  if (arg.visibleif) {
-    field.visibleif = arg.visibleif
+  if (arg.visibleIf) {
+    field.visibleIf = arg.visibleIf
   }
 
   return {
diff --git a/app/src/views/app/AppConfigPanel.vue b/app/src/views/app/AppConfigPanel.vue
index 4132407a..8f18fe90 100644
--- a/app/src/views/app/AppConfigPanel.vue
+++ b/app/src/views/app/AppConfigPanel.vue
@@ -19,7 +19,7 @@
           <template v-for="(field, fname) in section.fields">
             <form-field :key="fname" v-model="forms[id_][fname]"
                         :validation="$v.forms[id_][fname]"
-                        v-if="isVisible(field.visibleif)" v-bind="field"
+                        v-if="isVisible(field.visibleIf)" v-bind="field"
             />
           </template>
         </div>
@@ -73,9 +73,8 @@ export default {
       if (!expression) return true
       const context = {}
       for (const args of Object.values(this.forms)) {
-        for (const fname in args) {
-          const shortname = fname.split('_').slice(4).join('_').toLowerCase()
-          context[shortname] = args[fname]
+        for (const shortname in args) {
+          context[shortname] = args[shortname]
         }
       }
       return evaluate(context, expression)