feat: disable admin option when using LDAP auth (#2583)

* fix typo

* add override readonly/disable support for autoform

* made admin permission conditionally disabled

frontend/components/global/AutoForm.vue

@@ -18,7 +18,7 @@
           :label="inputField.label"
           :name="inputField.varName"
           :hint="inputField.hint || ''"
-          :disabled="(inputField.disableUpdate && updateMode) || (!updateMode && inputField.disableCreate)"
+          :disabled="(inputField.disableUpdate && updateMode) || (!updateMode && inputField.disableCreate) || (disabledFields && disabledFields.includes(inputField.varName))"
           @change="emitBlur"
         />
 
@@ -26,8 +26,8 @@
         <v-text-field
           v-else-if="inputField.type === fieldTypes.TEXT || inputField.type === fieldTypes.PASSWORD"
           v-model="value[inputField.varName]"
-          :readonly="(inputField.disableUpdate && updateMode) || (!updateMode && inputField.disableCreate)"
+          :readonly="(inputField.disableUpdate && updateMode) || (!updateMode && inputField.disableCreate) || (readonlyFields && readonlyFields.includes(inputField.varName))"
-          :disabled="(inputField.disableUpdate && updateMode) || (!updateMode && inputField.disableCreate)"
+          :disabled="(inputField.disableUpdate && updateMode) || (!updateMode && inputField.disableCreate) || (disabledFields && disabledFields.includes(inputField.varName))"
           filled
           :type="inputField.type === fieldTypes.PASSWORD ? 'password' : 'text'"
           rounded
@@ -46,8 +46,8 @@
         <v-textarea
           v-else-if="inputField.type === fieldTypes.TEXT_AREA"
           v-model="value[inputField.varName]"
-          :readonly="(inputField.disableUpdate && updateMode) || (!updateMode && inputField.disableCreate)"
+          :readonly="(inputField.disableUpdate && updateMode) || (!updateMode && inputField.disableCreate) || (readonlyFields && readonlyFields.includes(inputField.varName))"
-          :disabled="(inputField.disableUpdate && updateMode) || (!updateMode && inputField.disableCreate)"
+          :disabled="(inputField.disableUpdate && updateMode) || (!updateMode && inputField.disableCreate) || (disabledFields && disabledFields.includes(inputField.varName))"
           filled
           rounded
           class="rounded-lg"
@@ -66,8 +66,8 @@
         <v-select
           v-else-if="inputField.type === fieldTypes.SELECT"
           v-model="value[inputField.varName]"
-          :readonly="(inputField.disableUpdate && updateMode) || (!updateMode && inputField.disableCreate)"
+          :readonly="(inputField.disableUpdate && updateMode) || (!updateMode && inputField.disableCreate) || (readonlyFields && readonlyFields.includes(inputField.varName))"
-          :disabled="(inputField.disableUpdate && updateMode) || (!updateMode && inputField.disableCreate)"
+          :disabled="(inputField.disableUpdate && updateMode) || (!updateMode && inputField.disableCreate) || (disabledFields && disabledFields.includes(inputField.varName))"
           filled
           rounded
           class="rounded-lg"
@@ -183,6 +183,14 @@ export default defineComponent({
       default: false,
       type: Boolean,
     },
+    disabledFields: {
+      default: null,
+      type: Array as () => string[],
+    },
+    readonlyFields: {
+      default: null,
+      type: Array as () => string[],
+    },
   },
   setup(props, context) {
     function rulesByKey(keys?: ValidatorKey[] | null) {

frontend/lang/messages/en-US.json

@@ -858,7 +858,7 @@
     "user-details": "User Details",
     "user-name": "User Name",
     "authentication-method": "Authentication Method",
-    "authentication-method-hint": "This specifies how a user will authenticate with Mealie. If you're not sure, choose 'Mealie",
+    "authentication-method-hint": "This specifies how a user will authenticate with Mealie. If you're not sure, choose 'Mealie'",
     "permissions": "Permissions",
     "administrator": "Administrator",
     "user-can-invite-other-to-group": "User can invite other to group",

frontend/pages/admin/manage/users/_id.vue

@@ -34,7 +34,7 @@
             <AppButtonCopy v-if="resetUrl" :copy-text="resetUrl"></AppButtonCopy>
           </div>
 
-          <AutoForm v-model="user" :items="userForm" update-mode />
+          <AutoForm v-model="user" :items="userForm" update-mode :disabled-fields="disabledFields" />
         </v-card-text>
       </v-card>
       <div class="d-flex pa-2">
@@ -45,7 +45,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, useRoute, onMounted, ref } from "@nuxtjs/composition-api";
+import { computed, defineComponent, useRoute, onMounted, ref } from "@nuxtjs/composition-api";
 import { useAdminApi } from "~/composables/api";
 import { useGroups } from "~/composables/use-groups";
 import { alert } from "~/composables/use-toast";
@@ -71,6 +71,9 @@ export default defineComponent({
     const adminApi = useAdminApi();
 
     const user = ref<UserOut | null>(null);
+    const disabledFields = computed(() => {
+      return user.value?.authMethod === "LDAP" ? ["admin"] : [];
+    })
 
     const userError = ref(false);
 
@@ -116,6 +119,7 @@ export default defineComponent({
 
     return {
       user,
+      disabledFields,
       userError,
       userForm,
       refNewUserForm,