refactor/gui-v2-user-management-invite-button-cleanup-and-ui-improvements

packages/nc-gui-v2/components/dashboard/settings/userManagement/ShareBase.vue

@@ -16,11 +16,8 @@ interface ShareBase {
   role?: string
 }
 
-enum Role {
-  Owner = 'owner',
+enum ShareBaseRole {
   Editor = 'editor',
-  User = 'user',
-  Guest = 'guest',
   Viewer = 'viewer',
 }
 
@@ -47,7 +44,7 @@ const loadBase = async () => {
   }
 }
 
-const createShareBase = async (role = Role.Viewer) => {
+const createShareBase = async (role = ShareBaseRole.Viewer) => {
   try {
     if (!project.value.id) return
 
@@ -198,8 +195,7 @@ onMounted(() => {
           <a-menu>
             <a-menu-item>
               <div v-if="base?.uuid" @click="disableSharedBase">Disable shared base</div>
-
-              <div v-else @click="createShareBase(Role.Viewer)">Anyone with the link</div>
+              <div v-else @click="createShareBase(ShareBaseRole.Viewer)">Anyone with the link</div>
             </a-menu-item>
           </a-menu>
         </template>
@@ -207,7 +203,7 @@ onMounted(() => {
 
       <a-select v-if="base?.uuid" v-model:value="base.role" class="flex">
         <a-select-option
-          v-for="(role, index) in [Role.Editor, Role.Viewer]"
+          v-for="(role, index) in [ShareBaseRole.Editor, ShareBaseRole.Viewer]"
           :key="index"
           :value="role"
           dropdown-class-name="capitalize"

packages/nc-gui-v2/components/dashboard/settings/userManagement/UsersModal.vue

@@ -15,12 +15,13 @@ import { isEmail } from '~~/utils/validation'
 const { show, selectedUser } = defineProps<Props>()
 const emits = defineEmits(['closed'])
 const toast = useToast()
+
 interface Props {
   show: boolean
   selectedUser?: User
 }
 interface Users {
-  emails: string
+  emails?: string
   role: ProjectRole
   invitationToken?: string
 }
@@ -28,8 +29,7 @@ interface Users {
 const { project } = useProject()
 const { $api, $e } = useNuxtApp()
 
-const usersData = $ref<Users>({ emails: '', role: ProjectRole.Guest, invitationToken: undefined })
-let isFirstRender = $ref(true)
+const usersData = $ref<Users>({ emails: undefined, role: ProjectRole.Guest, invitationToken: undefined })
 const inviteToken = $ref(null)
 const formRef = ref()
 
@@ -58,11 +58,10 @@ const validators = computed(() => {
 const { validateInfos } = useForm(usersData, validators)
 
 onMounted(() => {
-  if (isFirstRender && selectedUser) {
+  if (!usersData.emails && selectedUser?.email) {
     usersData.emails = selectedUser.email
     usersData.role = selectedUser.roles
   }
-  if (isFirstRender) isFirstRender = false
 })
 
 const saveUser = async () => {
@@ -112,7 +111,7 @@ const clickInviteMore = () => {
   $e('c:user:invite-more')
   usersData.invitationToken = undefined
   usersData.role = ProjectRole.Guest
-  usersData.emails = ''
+  usersData.emails = undefined
 }
 </script>