Fix re-loading the spaces members panel

owncloud · Jan 24, 2023 · 7714ba8 · 7714ba8
1 parent 5ded076
commit 7714ba8
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 23 deletions.
diff --git a/changelog/unreleased/bugfix-re-loading-space-members b/changelog/unreleased/bugfix-re-loading-space-members
@@ -0,0 +1,6 @@
+Bugfix: Re-loading space members panel
+
+We've fixed a bug where re-loading the members panel for a space would remove recently added members in the UI.
+
+https://github.com/owncloud/web/pull/8300
+https://github.com/owncloud/web/issues/8298
diff --git a/packages/web-app-files/src/components/SideBar/SideBar.vue b/packages/web-app-files/src/components/SideBar/SideBar.vue
@@ -27,6 +27,7 @@
       />
       <space-info
         v-if="isSingleResource && highlightedFileIsSpace"
+        :space-resource="spaceResource"
         class="sidebar-panel__space_info"
       />
     </template>
@@ -219,6 +220,9 @@ export default defineComponent({
         this.isSharedWithOthersLocation ||
         this.isSharedViaLinkLocation
       )
+    },
+    spaceResource() {
+      return this.spaces.find((s) => s.id === this.highlightedFile.id)
     }
   },
   watch: {
@@ -238,7 +242,7 @@ export default defineComponent({
         }
 
         if (isProjectSpaceResource(this.highlightedFile)) {
-          this.loadSpaceMembers({ graphClient: this.graphClient, space: this.highlightedFile })
+          this.loadSpaceMembers({ graphClient: this.graphClient, space: this.spaceResource })
         }
 
         if (this.isShareLocation || !noChanges) {

diff --git a/packages/web-pkg/src/components/sideBar/Spaces/SpaceInfo.vue b/packages/web-pkg/src/components/sideBar/Spaces/SpaceInfo.vue
@@ -4,13 +4,13 @@
       <div class="oc-mr-s">
         <oc-icon
           name="layout-grid"
-          :size="space.description ? 'large' : 'medium'"
+          :size="spaceResource.description ? 'large' : 'medium'"
           class="oc-display-block"
         />
       </div>
       <div>
-        <h3 data-testid="space-info-name" v-text="space.name" />
-        <span data-testid="space-info-subtitle" v-text="space.description" />
+        <h3 data-testid="space-info-name" v-text="spaceResource.name" />
+        <span data-testid="space-info-subtitle" v-text="spaceResource.description" />
       </div>
     </div>
   </div>
@@ -19,7 +19,6 @@
 <script lang="ts">
 import { defineComponent } from 'vue'
 
-import { mapGetters } from 'vuex'
 import { PropType } from 'vue'
 import { SpaceResource } from 'web-client'
 
@@ -30,13 +29,6 @@ export default defineComponent({
       type: Object as PropType<SpaceResource>,
       required: false
     }
-  },
-  computed: {
-    ...mapGetters('Files', ['highlightedFile']),
-
-    space() {
-      return this.spaceResource || this.highlightedFile
-    }
   }
 })
 </script>

diff --git a/packages/web-pkg/tests/unit/components/sidebar/Spaces/SpaceInfo.spec.ts b/packages/web-pkg/tests/unit/components/sidebar/Spaces/SpaceInfo.spec.ts
@@ -1,10 +1,5 @@
 import SpaceInfo from 'web-pkg/src/components/sideBar/Spaces/SpaceInfo.vue'
-import {
-  createStore,
-  defaultPlugins,
-  shallowMount,
-  defaultStoreMockOptions
-} from 'web-test-helpers'
+import { defaultPlugins, shallowMount } from 'web-test-helpers'
 
 const spaceMock = {
   type: 'space',
@@ -31,14 +26,11 @@ describe('SpaceInfo', () => {
 })
 
 function createWrapper(spaceResource) {
-  const storeOptions = { ...defaultStoreMockOptions }
-  storeOptions.modules.Files.getters.highlightedFile.mockImplementation(() => spaceResource)
-  const store = createStore(storeOptions)
-
   return {
     wrapper: shallowMount(SpaceInfo, {
+      props: { spaceResource },
       global: {
-        plugins: [...defaultPlugins(), store]
+        plugins: [...defaultPlugins()]
       }
     })
   }