do compare and update user to permission mapping in store

store mapped users for multiple objects/buckets Rather than replacing map<bucket/user>ToUserPermissions every time context changes, compare existing data and patch as required reduces network calls
bcgov · Feb 15, 2024 · 55263ca · 55263ca
1 parent fd64478
commit 55263ca
Show file tree

Hide file tree

Showing 7 changed files with 233 additions and 132 deletions.
diff --git a/frontend/src/components/bucket/BucketPermission.vue b/frontend/src/components/bucket/BucketPermission.vue
@@ -34,7 +34,9 @@ const cancelSearchUsers = () => {
 };
 
 const removeBucketUser = (userId: string) => {
-  const managers = getMappedBucketToUserPermissions.value.filter((x: UserPermissions) => x.manage);
+  const managers = getMappedBucketToUserPermissions
+    .value(props.bucketId)
+    .filter((x: UserPermissions) => x.manage && x.id === props.bucketId);
   if (managers.length === 1 && managers[0].userId === userId) {
     removeManageAlert.show();
   } else {
@@ -46,16 +48,18 @@ const updateBucketPermission = (value: boolean, userId: string, permCode: string
   if (value) {
     permissionStore.addBucketPermission(props.bucketId, userId, permCode);
   } else {
-    const managers = getMappedBucketToUserPermissions.value.filter((x: UserPermissions) => x.manage);
+    const managers = getMappedBucketToUserPermissions
+      .value(props.bucketId)
+      .filter((x: UserPermissions) => x.manage && x.id === props.bucketId);
 
     // Disallow removable of final MANAGE permission
     if (permCode === Permissions.MANAGE && !managers.length) {
       removeManageAlert.show();
 
       // Set the value back as clicking will automatically change it
-      const perm: UserPermissions = getMappedBucketToUserPermissions.value.find(
-        (x: UserPermissions) => x.userId === userId
-      ) as UserPermissions;
+      const perm: UserPermissions = getMappedBucketToUserPermissions
+        .value(props.bucketId)
+        .find((x: UserPermissions) => x.userId === userId && x.id === props.bucketId) as UserPermissions;
       perm.manage = true;
     } else {
       permissionStore.deleteBucketPermission(props.bucketId, userId, permCode);
@@ -84,11 +88,14 @@ onBeforeMount(async () => {
       </Button>
     </div>
     <div v-else>
-      <BucketPermissionAddUser @cancel-search-users="cancelSearchUsers" />
+      <BucketPermissionAddUser
+        @cancel-search-users="cancelSearchUsers"
+        :bucket-id="props.bucketId"
+      />
     </div>
 
     <DataTable
-      :value="getMappedBucketToUserPermissions"
+      :value="getMappedBucketToUserPermissions(props.bucketId)"
       data-key="bucketId"
       class="p-datatable-sm"
       responsive-layout="scroll"

diff --git a/frontend/src/components/bucket/BucketPermissionAddUser.vue b/frontend/src/components/bucket/BucketPermissionAddUser.vue
@@ -6,6 +6,9 @@ import { useConfigStore, usePermissionStore } from '@/store';
 
 import type { User } from '@/types';
 
+// Props
+const props = withDefaults(defineProps<{ bucketId: string }>(), {});
+
 // Store
 const { getConfig } = storeToRefs(useConfigStore());
 const permissionStore = usePermissionStore();
@@ -15,6 +18,7 @@ const onAdd = (selectedUser: User) => {
   const idp = getConfig.value.idpList.find((idp: any) => idp.idp === selectedUser?.idp);
 
   permissionStore.addBucketUser({
+    id: props.bucketId,
     userId: selectedUser.userId,
     idpName: idp?.name,
     elevatedRights: idp?.elevatedRights,
@@ -30,7 +34,7 @@ const onAdd = (selectedUser: User) => {
 
 <template>
   <SearchUsers
-    :permissions="permissionStore.getMappedBucketToUserPermissions"
+    :permissions="permissionStore.getMappedBucketToUserPermissions(bucketId)"
     @add-user="onAdd"
   />
 </template>
diff --git a/frontend/src/components/object/ObjectPermission.vue b/frontend/src/components/object/ObjectPermission.vue
@@ -86,11 +86,14 @@ onBeforeMount(() => {
       </Button>
     </div>
     <div v-else>
-      <ObjectPermissionAddUser @cancel-search-users="cancelSearchUsers" />
+      <ObjectPermissionAddUser
+        @cancel-search-users="cancelSearchUsers"
+        :object-id="props.objectId"
+      />
     </div>
 
     <DataTable
-      :value="getMappedObjectToUserPermissions"
+      :value="getMappedObjectToUserPermissions(objectId)"
       data-key="userId"
       class="p-datatable-sm"
       responsive-layout="scroll"

diff --git a/frontend/src/components/object/ObjectPermissionAddUser.vue b/frontend/src/components/object/ObjectPermissionAddUser.vue
@@ -6,6 +6,9 @@ import { useConfigStore, usePermissionStore } from '@/store';
 
 import type { User } from '@/types';
 
+// Props
+const props = withDefaults(defineProps<{ objectId: string }>(), {});
+
 // Store
 const { getConfig } = storeToRefs(useConfigStore());
 const permissionStore = usePermissionStore();
@@ -15,6 +18,7 @@ const onAdd = (selectedUser: User) => {
   const idp = getConfig.value.idpList.find((idp: any) => idp.idp === selectedUser?.idp);
 
   permissionStore.addObjectUser({
+    id: props.objectId,
     userId: selectedUser.userId,
     idpName: idp?.name,
     elevatedRights: idp?.elevatedRights,
@@ -30,7 +34,7 @@ const onAdd = (selectedUser: User) => {
 
 <template>
   <SearchUsers
-    :permissions="permissionStore.getMappedObjectToUserPermissions"
+    :permissions="permissionStore.getMappedObjectToUserPermissions(props.objectId)"
     @add-user="onAdd"
   />
 </template>