From aff69fb3eb0abf3103428118cd4795f07e1b24a5 Mon Sep 17 00:00:00 2001
From: simon987 <me@simon987>
Date: Tue, 30 Jan 2024 10:49:44 -0500
Subject: [PATCH] Force user to not have both --auth and --tag-auth at the same
 time in the UI #453

---
 .../frontend/src/components/WebOptions.vue    | 89 ++++++++++---------
 1 file changed, 48 insertions(+), 41 deletions(-)

diff --git a/sist2-admin/frontend/src/components/WebOptions.vue b/sist2-admin/frontend/src/components/WebOptions.vue
index d0471cb..8326fb8 100644
--- a/sist2-admin/frontend/src/components/WebOptions.vue
+++ b/sist2-admin/frontend/src/components/WebOptions.vue
@@ -1,59 +1,66 @@
 <template>
-    <div>
-        <h4>{{ $t("webOptions.title") }}</h4>
-        <b-card>
-            <label>{{ $t("webOptions.lang") }}</label>
-            <b-form-select v-model="options.lang" :options="['en', 'fr', 'zh-CN', 'pl', 'de']"
-                           @change="update()"></b-form-select>
+  <div>
+    <h4>{{ $t("webOptions.title") }}</h4>
+    <b-card>
+      <label>{{ $t("webOptions.lang") }}</label>
+      <b-form-select v-model="options.lang" :options="['en', 'fr', 'zh-CN', 'pl', 'de']"
+                     @change="update()"></b-form-select>
 
-            <label>{{ $t("webOptions.bind") }}</label>
-            <b-form-input v-model="options.bind" @change="update()"></b-form-input>
+      <label>{{ $t("webOptions.bind") }}</label>
+      <b-form-input v-model="options.bind" @change="update()"></b-form-input>
 
-            <label>{{ $t("webOptions.tagline") }}</label>
-            <b-form-textarea v-model="options.tagline" @change="update()"></b-form-textarea>
+      <label>{{ $t("webOptions.tagline") }}</label>
+      <b-form-textarea v-model="options.tagline" @change="update()"></b-form-textarea>
 
-            <label>{{ $t("webOptions.auth") }}</label>
-            <b-form-input v-model="options.auth" @change="update()"></b-form-input>
+      <label>{{ $t("webOptions.auth") }}</label>
+      <b-form-input v-model="options.auth" @change="update()"></b-form-input>
 
-            <label>{{ $t("webOptions.tagAuth") }}</label>
-            <b-form-input v-model="options.tag_auth" @change="update()"></b-form-input>
-        </b-card>
+      <label>{{ $t("webOptions.tagAuth") }}</label>
+      <b-form-input v-model="options.tag_auth" @change="update()" :disabled="Boolean(options.auth)"></b-form-input>
+    </b-card>
 
-        <br>
-        <h4>Auth0 options</h4>
-        <b-card>
-            <label>{{ $t("webOptions.auth0Audience") }}</label>
-            <b-form-input v-model="options.auth0_audience" @change="update()"></b-form-input>
+    <br>
+    <h4>Auth0 options</h4>
+    <b-card>
+      <label>{{ $t("webOptions.auth0Audience") }}</label>
+      <b-form-input v-model="options.auth0_audience" @change="update()"></b-form-input>
 
-            <label>{{ $t("webOptions.auth0Domain") }}</label>
-            <b-form-input v-model="options.auth0_domain" @change="update()"></b-form-input>
+      <label>{{ $t("webOptions.auth0Domain") }}</label>
+      <b-form-input v-model="options.auth0_domain" @change="update()"></b-form-input>
 
-            <label>{{ $t("webOptions.auth0ClientId") }}</label>
-            <b-form-input v-model="options.auth0_client_id" @change="update()"></b-form-input>
+      <label>{{ $t("webOptions.auth0ClientId") }}</label>
+      <b-form-input v-model="options.auth0_client_id" @change="update()"></b-form-input>
 
-            <label>{{ $t("webOptions.auth0PublicKey") }}</label>
-            <b-textarea rows="10" v-model="options.auth0_public_key" @change="update()"></b-textarea>
-        </b-card>
-    </div>
+      <label>{{ $t("webOptions.auth0PublicKey") }}</label>
+      <b-textarea rows="10" v-model="options.auth0_public_key" @change="update()"></b-textarea>
+    </b-card>
+  </div>
 </template>
 
 <script>
 
 export default {
-    name: "WebOptions",
-    props: ["options", "frontendName"],
-    data() {
-        return {
-            showEsTestAlert: false,
-            esTestOk: false,
-            esTestMessage: "",
-        }
-    },
-    methods: {
-        update() {
-            this.$emit("change", this.options);
-        },
+  name: "WebOptions",
+  props: ["options", "frontendName"],
+  data() {
+    return {
+      showEsTestAlert: false,
+      esTestOk: false,
+      esTestMessage: ""
     }
+  },
+  methods: {
+    update() {
+
+      console.log(this.options)
+      if (this.options.auth && this.options.tag_auth) {
+        // If both are set, remove tagAuth
+        this.options.tag_auth = "";
+      }
+
+      this.$emit("change", this.options);
+    },
+  }
 }
 </script>