Make users redirect when their role is changed from admin to the others

frontend/components/member/FormCreate.vue

@@ -15,7 +15,6 @@
           :loading="isLoading"
           :search-input.sync="username"
           hide-no-data
-          hide-selected
           item-text="username"
           :label="$t('members.userSearchAPIs')"
           :placeholder="$t('members.userSearchPrompt')"
@@ -86,8 +85,8 @@ export default Vue.extend({
       roles: [] as RoleDTO[],
       username: '',
       rules: {
-        userRequired: (v: UserDTO) => !!v.username || 'Required',
-        roleRequired: (v: RoleDTO) => !!v.rolename || 'Required'
+        userRequired: (v: UserDTO) => !!v && !!v.username || 'Required',
+        roleRequired: (v: RoleDTO) => !!v && !!v.rolename || 'Required'
       }
     }
   },
@@ -101,6 +100,7 @@ export default Vue.extend({
         }
       },
       set(val: MemberDTO) {
+        if (val === undefined) return
         const user = { user: val.id, username: val.username }
         this.$emit('input', { ...this.value, ...user })
       }
@@ -120,7 +120,15 @@ export default Vue.extend({
   },
 
   watch: {
-    username: '$fetch'
+    username() {
+      // Items have already been loaded
+      if (this.users.length > 0) return
+
+      // Items have already been requested
+      if (this.isLoading) return
+
+      this.$fetch()
+    }
   },
 
   async created() {

frontend/middleware/check-admin.js

@@ -1,7 +1,5 @@
 export default async function({ app, store, route, redirect }) {
-  if (store.getters['projects/isEmpty']) {
-    await store.dispatch('projects/setCurrentProject', route.params.id)
-  }
+  await store.dispatch('projects/setCurrentProject', route.params.id)
   const role = store.getters['projects/getCurrentUserRole']
   const projectRoot = app.localePath('/projects/' + route.params.id)
   const path = route.fullPath.replace(/\/$/g, '')

frontend/pages/projects/_id/members/index.vue

@@ -59,8 +59,13 @@ export default Vue.extend({
 
   async fetch() {
     this.isLoading = true
-    this.items = await this.$services.member.list(this.projectId)
-    this.isLoading = false
+    try {
+      this.items = await this.$services.member.list(this.projectId)
+    } catch(e) {
+      this.$router.push(`/projects/${this.projectId}`)
+    } finally {
+      this.isLoading = false
+    }
   },
 
   data() {
@@ -98,14 +103,20 @@ export default Vue.extend({
 
   methods: {
     async create() {
-      await this.$services.member.create(this.projectId, this.editedItem)
-      this.close()
+      try {
+        await this.$services.member.create(this.projectId, this.editedItem)
+        this.close()
+        this.$fetch()
+      } catch(e) {
+        this.errorMessage = e.message
+      }
     },
 
     async update() {
       try {
         await this.$services.member.update(this.projectId, this.editedItem)
         this.close()
+        this.$fetch()
       } catch(e) {
         this.errorMessage = e.message
       }
@@ -117,7 +128,6 @@ export default Vue.extend({
       } else {
         this.create()
       }
-      this.$fetch()
     },
 
     close() {

frontend/services/application/member.service.ts

@@ -23,13 +23,21 @@ export class MemberApplicationService {
   ) {}
 
   public async list(id: string): Promise<MemberDTO[]> {
-    const items = await this.repository.list(id)
-    return items.map(item => new MemberDTO(item))
+    try {
+      const items = await this.repository.list(id)
+      return items.map(item => new MemberDTO(item))
+    } catch(e) {
+      throw new Error(e.response.data.detail)
+    }
   }
 
-  public create(projectId: string, item: MemberDTO): void {
-    const member = new MemberItem(0, item.user, item.role, item.username, item.rolename)
-    this.repository.create(projectId, member)
+  public async create(projectId: string, item: MemberDTO): Promise<void> {
+    try {
+      const member = new MemberItem(0, item.user, item.role, item.username, item.rolename)
+      await this.repository.create(projectId, member)
+    } catch(e) {
+      throw new Error(e.response.data.detail)
+    }
   }
 
   public async update(projectId: string, item: MemberDTO): Promise<void> {