display csp and robotsTxt errors

dashboard/src/components/app/Security.vue

@@ -16,6 +16,7 @@ const busy = ref(false);
 const robotsTxt = ref('');
 const csp = ref('');
 const hstsPreload = ref(false);
+const submitError = ref({ robotsTxt: '', csp: '' });
 
 function addRobotsTxtPreset(pattern) {
   if (robotsTxt.value) robotsTxt.value += '\n';
@@ -45,6 +46,7 @@ const commonCspMenu = [
 
 async function onSubmit() {
   busy.value = true;
+  submitError.value = {};
 
   const data = {
     robotsTxt: robotsTxt.value || null, // empty string resets
@@ -53,7 +55,11 @@ async function onSubmit() {
   };
 
   const [error] = await appsModel.configure(props.app.id, 'reverse_proxy', data);
-  if (error) return console.error(error);
+  if (error) {
+    if (error.body?.message.includes('CSP')) submitError.value.csp = error.body.message;
+    else if (error.body?.includes('robots')) submitError.value.robotsTxt = error.body.message;
+    else submitError.value.csp = JSON.stringify(error);
+  }
 
   busy.value = false;
 }
@@ -69,7 +75,7 @@ onMounted(() => {
 <template>
   <div>
     <form @submit.prevent="onSubmit()" autocomplete="off">
-      <fieldset :disabled="busy || app.error">
+      <fieldset :disabled="busy">
         <input style="display: none;" type="submit" />
 
         <FormGroup>
@@ -79,6 +85,7 @@ onMounted(() => {
           </label>
           <div description>{{ $t('app.security.robots.description') }}</div>
           <textarea id="robotsTxtInput" spellcheck="false" style="white-space: pre-wrap; font-family: monospace;" v-model="robotsTxt" rows="10"></textarea>
+          <div class="error-label" v-show="submitError.robotsTxt">{{ submitError.robotsTxt }}</div>
         </FormGroup>
 
         <FormGroup>
@@ -88,6 +95,7 @@ onMounted(() => {
           </label>
           <div description>{{ $t('app.security.csp.description') }}</div>
           <textarea id="cspInput" spellcheck="false" style="white-space: pre-wrap; font-family: monospace;" v-model="csp" rows="5"></textarea>
+          <div class="error-label" v-show="submitError.csp">{{ submitError.csp }}</div>
         </FormGroup>
 
         <FormGroup>