fix(files): properly update displayed permissions when switching folders

bimdata · Jul 2, 2024 · bf9653b · bf9653b
1 parent 01f9878
commit bf9653b
Show file tree

Hide file tree

Showing 6 changed files with 55 additions and 15 deletions.
diff --git a/src/components/specific/files/files-manager/FilesManager.vue b/src/components/specific/files/files-manager/FilesManager.vue
@@ -529,10 +529,10 @@ export default {
 
     const { openSidePanel, closeSidePanel } = useAppSidePanel();
 
-    const showVersioningManager = ref(false);
     const showAccessManager = ref(false);
     const showVisaManager = ref(false);
     const showTagManager = ref(false);
+    const showVersioningManager = ref(false);
     const folderToManage = ref(null);
     const fileToManage = ref(null);
     const currentVisa = ref(null);
@@ -541,9 +541,9 @@ export default {
     const openAccessManager = (folder) => {
       folderToManage.value = folder;
       showAccessManager.value = true;
-      showVersioningManager.value = false;
       showVisaManager.value = false;
       showTagManager.value = false;
+      showVersioningManager.value = false;
       openSidePanel();
       // Watch for current files changes in order to update
       // folder data in access manager accordingly
@@ -561,8 +561,9 @@ export default {
     };
     const closeAccessManager = () => {
       stopCurrentFilesWatcher();
+      closeSidePanel();
       setTimeout(() => {
-        closeSidePanel();
+        showAccessManager.value = false;
         folderToManage.value = null;
       }, 100);
     };
@@ -575,8 +576,8 @@ export default {
         fileToManage.value = { id: null };
       }
       showVisaManager.value = true;
-      showVersioningManager.value = false;
       showAccessManager.value = false;
+      showVersioningManager.value = false;
       showTagManager.value = false;
     };
 
@@ -594,13 +595,17 @@ export default {
       if (file.file_name) {
         fileToManage.value = file;
         showTagManager.value = true;
+        showAccessManager.value = false;
+        showVisaManager.value = false;
+        showVersioningManager.value = false;
       }
     };
 
     const closeTagManager = () => {
       closeSidePanel();
       setTimeout(() => {
         showTagManager.value = false;
+        fileToManage.value = null;
       }, 100);
     };
 
@@ -611,6 +616,7 @@ export default {
         showVersioningManager.value = true;
         showAccessManager.value = false;
         showVisaManager.value = false;
+        showTagManager.value = false;
       }
     };
 

diff --git a/src/components/specific/files/folder-access-manager/FolderAccessManager.scss b/src/components/specific/files/folder-access-manager/FolderAccessManager.scss
@@ -1,5 +1,7 @@
 .folder-access-manager {
-  padding: var(--spacing-unit);
+  width: 100%;
+  height: 100%;
+  padding: 0;
   color: var(--color-primary);
   display: flex;
   flex-direction: column;
@@ -53,3 +55,19 @@
     }
   }
 }
+
+.loading {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: rgba(255, 255, 255, 0.8);
+
+  .spinner {
+    transform: scale(2);
+  }
+}
diff --git a/src/components/specific/files/folder-access-manager/FolderAccessManager.vue b/src/components/specific/files/folder-access-manager/FolderAccessManager.vue
@@ -4,7 +4,7 @@
       <BIMDataIconKey size="s" />
       <span class="folder-access-manager__title__text">
         {{ $t("FolderAccessManager.title") }} -
-        <BIMDataTextbox width="auto" maxWidth="100px" :text="folder.name" />
+        <BIMDataTextbox width="auto" maxWidth="100px" :text="currentFolder.name" />
       </span>
       <BIMDataButton ghost rounded icon @click="$emit('close')">
         <BIMDataIconClose size="xxs" fill color="granite-light" />
@@ -54,10 +54,13 @@
       </transition-group>
     </div>
   </div>
+  <div v-show="loading" class="loading">
+    <BIMDataSpinner class="spinner" />
+  </div>
 </template>
 
 <script>
-import { ref, onMounted, computed } from "vue";
+import { ref, computed, watch } from "vue";
 import { useListFilter } from "../../../../composables/list-filter.js";
 import FileService from "../../../../services/FileService.js";
 // Components
@@ -81,6 +84,7 @@ export default {
   },
   emits: ["close"],
   setup(props) {
+    const loading = ref(false);
     const currentFolder = ref(null);
     const propagate = ref(false);
 
@@ -95,18 +99,28 @@ export default {
     );
 
     const loadFolderInfo = async () => {
-      currentFolder.value = await FileService.fetchFolder(
-        props.project,
-        props.folder
-      );
+      try {
+        loading.value = true;
+        currentFolder.value = await FileService.fetchFolder(
+          props.project,
+          props.folder
+        );
+      } finally {
+        loading.value = false;
+      }
     };
 
-    onMounted(loadFolderInfo);
+    watch(
+      () => props.folder,
+      () => loadFolderInfo(),
+      { immediate: true }
+    );
 
     return {
       // References
       currentFolder,
       filteredGroupList,
+      loading,
       propagate,
       searchText,
       // Methods

diff --git a/src/components/specific/tags/tags-main/TagsMain.scss b/src/components/specific/tags/tags-main/TagsMain.scss
@@ -1,6 +1,7 @@
 .tags-main {
+  width: 100%;
   height: 100%;
-  padding: var(--spacing-unit) var(--spacing-unit) 0;
+  padding: 0;
 
   &__content {
     height: 100%;

diff --git a/src/components/specific/versioning/versioning-main/VersioningMain.scss b/src/components/specific/versioning/versioning-main/VersioningMain.scss
@@ -1,8 +1,9 @@
 .versioning-main {
+  width: 100%;
   height: 100%;
+  padding: 0;
   overflow: auto;
   overflow-x: hidden;
-  padding: var(--spacing-unit);
 
   &__safe-zone {
     z-index: 2;

diff --git a/src/components/specific/visa/visa-main/VisaMain.scss b/src/components/specific/visa/visa-main/VisaMain.scss
@@ -1,3 +1,3 @@
 .visa-main {
-  height: 100%
+  height: 100%;
 }