configpanels: do not display "save" button when non editable

app/src/components/ConfigPanel.vue

@@ -2,6 +2,7 @@
   <abstract-form
     v-bind="{ id: panel.id + '-form', validation, serverError: panel.serverError }"
     @submit.prevent.stop="onApply"
+    :no-footer="!panel.hasApplyButton"
   >
     <slot name="tab-top" />
 
@@ -13,8 +14,10 @@
 
     <template v-for="section in panel.sections">
       <component
-        v-if="section.visible" :is="section.name ? 'section' : 'div'"
-        :key="section.id" class="mb-5"
+        v-if="section.visible"
+        :is="section.name ? 'section' : 'div'"
+        :key="section.id"
+        class="panel-section"
       >
         <b-card-title v-if="section.name" title-tag="h3">
           {{ section.name }} <small v-if="section.help">{{ section.help }}</small>
@@ -86,6 +89,9 @@ export default {
 <style lang="scss" scoped>
 .card-title {
   margin-bottom: 1em;
-  border-bottom: solid 1px #aaa;
+  border-bottom: solid $border-width $gray-500;
+}
+.panel-section:not(:last-child) {
+  margin-bottom: 3rem;
 }
 </style>

app/src/helpers/yunohostArguments.js

@@ -10,6 +10,14 @@ import {
 } from '@/helpers/commons'
 
 
+const NO_VALUE_FIELDS = [
+  'ReadOnlyField',
+  'ReadOnlyAlertItem',
+  'MarkdownItem',
+  'DisplayTextItem',
+  'ButtonItem'
+]
+
 /**
  * Tries to find a translation corresponding to the user's locale/fallback locale in a
  * Yunohost argument or simply return the string if it's not an object literal.
@@ -359,7 +367,7 @@ export function formatYunoHostConfigPanels (data) {
   }
 
   for (const { id: panelId, name, help, sections } of data.panels) {
-    const panel = { id: panelId, sections: [], serverError: '' }
+    const panel = { id: panelId, sections: [], serverError: '', hasApplyButton: false }
     result.forms[panelId] = {}
     result.validations[panelId] = {}
     result.errors[panelId] = {}
@@ -391,6 +399,10 @@ export function formatYunoHostConfigPanels (data) {
       Object.assign(result.errors[panelId], errors)
       section.fields = fields
       panel.sections.push(section)
+
+      if (!section.isActionSection && Object.values(fields).some((field) => !NO_VALUE_FIELDS.includes(field.is))) {
+        panel.hasApplyButton = true
+      }
     }
 
     result.panels.push(panel)