Fix dialog titles

dashboard/src/components/DomainDialog.vue

@@ -131,7 +131,7 @@ defineExpose({
 
 <template>
   <Dialog ref="dialog"
-    :title="editing ? $t('domains.domainDialog.editTitle', { domain: domain }) : $t('domains.domainDialog.addTitle')"
+    :title="editing ? $t('domains.domainDialog.editTitle') : $t('domains.domainDialog.addTitle')"
     :confirm-busy="busy"
     :confirm-active="!busy && isFormValid"
     :confirm-label="editing ? $t('main.dialog.save') : $t('main.action.add')"

dashboard/src/components/GroupDialog.vue

@@ -79,7 +79,7 @@ defineExpose({
 
 <template>
   <Dialog ref="dialog"
-    :title="group ? $t('users.editGroupDialog.title', { name: group.name }) : $t('users.addGroupDialog.title')"
+    :title="group ? $t('users.editGroupDialog.title') : $t('users.addGroupDialog.title')"
     :confirm-label="group ? $t('main.dialog.save') : $t('users.group.addGroupAction')"
     :confirm-busy="busy"
     :confirm-active="!busy && name !== ''"

dashboard/src/components/UserDialog.vue

@@ -228,7 +228,7 @@ defineExpose({
 
 <template>
   <Dialog ref="dialog"
-    :title="user ? $t('users.editUserDialog.title', { username: (user.username || user.email) }) : $t('users.addUserDialog.title')"
+    :title="user ? $t('users.editUserDialog.title') : $t('users.addUserDialog.title')"
     :confirm-label="user ? $t('main.dialog.save') : $t('users.addUserDialog.addUserAction')"
     :confirm-busy="busy"
     :confirm-active="!busy"
@@ -255,23 +255,23 @@ defineExpose({
           </div>
         </div>
 
-        <FormGroup>
-          <label for="emailInput" :has-error="formError.email">{{ $t('users.user.primaryEmail') }} <sup><a href="https://docs.cloudron.io/profile/#primary-email" class="help" target="_blank" tabindex="-1"><i class="fa fa-question-circle"></i></a></sup></label>
-          <TextInput id="emailInput" v-model="email" :disabled="(user && user.source) ? true : null" required />
-          <div class="text-danger" v-if="formError.email">{{ formError.email }}</div>
+        <!-- if profile edit is locked a user has to be set here . username is editable until one is set -->
+        <FormGroup :has-error="formError.username">
+          <label for="usernameInput">{{ $t('users.user.username') }}</label>
+          <TextInput id="usernameInput" v-model="username" :required="profileLocked ? true : null" :readonly="user?.username ? true : undefined" />
+          <small v-if="!user?.username && !profileLocked" class="helper-text">{{ $t('users.user.usernamePlaceholder') }}</small>
+          <div class="text-danger" v-if="formError.username">{{ formError.username }}</div>
         </FormGroup>
 
-        <!-- if profile edit is locked a user has to be set here . username is editable until one is set -->
-        <FormGroup v-if="!user || !user.username" :has-error="formError.username">
-          <label for="usernameInput">{{ $t('users.user.username') }}</label>
-          <TextInput id="usernameInput" v-model="username" :required="profileLocked ? true : null" />
-          <small class="helper-text">{{ profileLocked ? '' : $t('users.user.usernamePlaceholder') }}</small>
-          <div class="text-danger" v-if="formError.username">{{ formError.username }}</div>
+        <FormGroup>
+          <label for="emailInput" :has-error="formError.email">{{ $t('users.user.primaryEmail') }} <sup><a href="https://docs.cloudron.io/profile/#primary-email" class="help" target="_blank" tabindex="-1"><i class="fa fa-question-circle"></i></a></sup></label>
+          <TextInput id="emailInput" v-model="email" :readonly="(user && user.source) ? true : undefined" required />
+          <div class="text-danger" v-if="formError.email">{{ formError.email }}</div>
         </FormGroup>
 
         <FormGroup style="flex-grow: 1">
           <label for="displayNameInput">{{ $t('users.user.fullName') }}</label>
-          <TextInput id="displayNameInput" v-model="displayName" :disabled="(user && user.source) ? true : null"/>
+          <TextInput id="displayNameInput" v-model="displayName" :readonly="(user && user.source) ? true : undefined"/>
           <small v-if="!user || !user.username" class="helper-text">{{ $t('users.user.displayNamePlaceholder') }}</small> <!-- don't show if user has already signed up -->
         </FormGroup>
 

dashboard/src/views/VolumesView.vue

@@ -275,10 +275,10 @@ onMounted(async () =>{
 
     <Dialog ref="volumeDialog"
       class="volume-dialog"
-      :title="volumeDialogData.mode === 'edit' ? $t('volumes.editVolumeDialog.title', { name: volumeDialogData.name }) : $t('volumes.addVolumeDialog.title')"
+      :title="volumeDialogData.mode === 'edit' ? $t('volumes.editVolumeDialog.title') : $t('volumes.addVolumeDialog.title')"
       :reject-label="$t('main.dialog.cancel')"
        reject-style="secondary"
-      :confirm-label="$t('main.action.add')"
+      :confirm-label="volumeDialogData.mode === 'edit' ? $t('main.dialog.save') : $t('main.action.add')"
       :confirm-active="!volumeDialogData.busy && isFormValid"
       :confirm-busy="volumeDialogData.busy"
       @confirm="onSubmit()"
@@ -289,9 +289,9 @@ onMounted(async () =>{
 
           <div class="error-label" v-show="volumeDialogData.error">{{ volumeDialogData.error }}</div>
 
-          <FormGroup v-if="volumeDialogData.mode === 'new'">
+          <FormGroup>
             <label for="volumeName">{{ $t('volumes.name') }}</label>
-            <TextInput id="volumeName" v-model="volumeDialogData.name" />
+            <TextInput id="volumeName" v-model="volumeDialogData.name" :readonly="volumeDialogData.mode === 'edit' ? true : undefined"/>
           </FormGroup>
 
           <FormGroup>