change secret field to password and allow toggling visibility

amidaware · Oct 22, 2024 · a20074d · a20074d
1 parent fce4cb8
commit a20074d
Showing 1 changed file with 13 additions and 2 deletions.
diff --git a/src/ee/sso/components/SSOProvidersForm.vue b/src/ee/sso/components/SSOProvidersForm.vue
@@ -52,12 +52,22 @@ For details, see: https://license.tacticalrmm.com/ee
       <!-- secret -->
       <q-card-section>
         <q-input
+          v-model="localProvider.secret"
+          filled
+          :type="hideSecret ? 'password' : 'text'"
           label="Secret"
           outlined
           dense
-          v-model="localProvider.secret"
           :rules="[(val) => !!val || '*Required']"
-        />
+        >
+          <template v-slot:append>
+            <q-icon
+              :name="hideSecret ? 'visibility_off' : 'visibility'"
+              class="cursor-pointer"
+              @click="hideSecret = !hideSecret"
+            />
+          </template>
+        </q-input>
       </q-card-section>
 
       <q-card-section>
@@ -113,6 +123,7 @@ const loading = ref(false);
 
 const { roleOptions } = useRoleDropdown({ onMount: true });
 
+const hideSecret = ref(true);
 const localProvider: SSOProvider = props.provider
   ? reactive(extend({}, props.provider))
   : reactive({