use new method to import dms

package.json

@@ -16,7 +16,7 @@
     "@bimdata/components": "1.3.1",
     "@bimdata/design-system": "2.0.0",
     "@bimdata/guided-tour-components": "1.0.4",
-    "@bimdata/typescript-fetch-api-client": "9.17.0",
+    "@bimdata/typescript-fetch-api-client": "9.20.3",
     "@bimdata/viewer": "^2.0.0-beta.89",
     "async": "^3.2.5",
     "lodash": "^4.17.21",

src/components/specific/files/file-tree-preview-modal/FileTreePreviewModal.vue

@@ -8,11 +8,11 @@
     <span class="file-tree-preview-modal__title">
       {{ $t("FileTreePreviewModal.title") }}
       <span class="file-tree-preview-modal__title__project">
-        {{ projectsToUpload.name }}
+        {{ currentProject.name }}
       </span>
     </span>
     <div class="file-tree-preview-modal__content">
-      <template v-for="folder of projectsToUpload.folders" :key="folder.id">
+      <template v-for="folder of folders" :key="folder.id">
         <FileTree
           :fileStructure="folder"
           :selectedFile="folder"
@@ -35,7 +35,7 @@
         fill
         radius
         width="45%"
-        @click="projectsToUpload.upload"
+        @click="onValidate"
       >
         {{ $t("t.validate") }}
       </BIMDataButton>
@@ -44,26 +44,58 @@
 </template>
 
 <script>
+import { ref, onMounted } from "vue";
 import { useAppModal } from "../../app/app-modal/app-modal.js";
+import FileService from "../../../../services/FileService.js";
+import ProjectService from "../../../../services/ProjectService.js";
+
 // Components
 import FileTree from "../file-tree/FileTree.vue";
+import { setFolderType } from "../../../../utils/files.js";
 
 export default {
   components: {
     FileTree
   },
   props: {
-    projectsToUpload: {
+    currentProject: {
+      type: Object,
+      required: true
+    },
+    sourceProject: {
       type: Object,
       required: true
     },
-    loadingData: {
-      type: Boolean,
+    onSuccess: {
+      type: Function,
       required: true
-    }
+    },
   },
-  setup() {
-    return { closeModal: useAppModal().closeModal };
+  setup(props) {
+    const folders = ref([]);
+    const loadingData = ref(true);
+
+    onMounted(async () => {
+      const folderResponse = await ProjectService.getProjectFolderTree(props.sourceProject);
+      setFolderType(folderResponse)
+      folders.value = folderResponse;
+      loadingData.value = false;
+    });
+
+    const onValidate = async () => {
+      loadingData.value = true;
+      await FileService.createFileStructure(props.currentProject, folders.value);
+      loadingData.value = false;
+      props.onSuccess();
+      useAppModal().closeModal();
+    };
+
+    return { 
+      closeModal: useAppModal().closeModal,
+      loadingData,
+      folders,
+      onValidate,
+    };
   }
 };
 </script>

src/components/specific/files/files-manager/FilesManager.vue

@@ -15,7 +15,6 @@
               height="32px"
               :menuItems="menuItems"
               :subListMaxHeight="dropdownMaxHeight"
-              @click="toggleDropdown"
             >
               <template #header="{ isOpen }">
                 <BIMDataIconBurgerMenu size="m" fill color="primary" />
@@ -283,18 +282,11 @@
         <FilesManagerOnboarding
           class="files-manager__onboarding"
           :project="project"
+          :importFromOtherProjectsActions="importFromOtherProjectsActions"
           :rootFolder="fileStructure"
-          :projectsTree="projectsTree"
           @file-uploaded="$emit('file-uploaded')"
         />
       </template>
-
-      <AppModalContent v-if="projectsToUpload">
-        <FileTreePreviewModal
-          :projectsToUpload="projectsToUpload"
-          :loadingData="loadingData"
-        />
-      </AppModalContent>
     </template>
   </BIMDataCard>
 </template>
@@ -319,7 +311,7 @@ import { useProjects } from "../../../../state/projects.js";
 import { useSpaces } from "../../../../state/spaces.js";
 import { useVisa } from "../../../../state/visa.js";
 import { hasAdminPerm, isFolder } from "../../../../utils/file-structure.js";
-import { getFilesFromEvent, treeIdGenerator } from "../../../../utils/files.js";
+import { getFilesFromEvent } from "../../../../utils/files.js";
 import { isFullTotal } from "../../../../utils/spaces.js";
 import { fileUploadInput } from "../../../../utils/upload.js";
 
@@ -368,10 +360,6 @@ export default {
       type: Object,
       required: true
     },
-    loadingData: {
-      type: Boolean,
-      required: true
-    }
   },
   emits: ["file-uploaded", "file-updated", "model-created"],
   setup(props, { emit }) {
@@ -381,7 +369,7 @@ export default {
     const { currentSpace } = useSpaces();
     const { openModal, closeModal } = useAppModal();
 
-    const { fetchProjectFolderTreeSerializers } = useProjects();
+    const { getProjectFolderTree, spaceProjects } = useProjects();
 
     const { isXXXL, isMidXL } = useCustomBreakpoints({
       isXXXL: ({ width }) => width <= 1521 - 0.02,
@@ -664,45 +652,35 @@ export default {
       allTags.value = await TagService.fetchAllTags(props.project);
     };
 
-    const projectsTree = ref([]);
-    const toggleDropdown = async () => {
-      projectsTree.value = (
-        await fetchProjectFolderTreeSerializers(props.project)
-      ).map(p => ({
-        name: p.name,
-        action: () => {
-          openModal();
-          projectsToUpload.value = {
-            ...p,
-            folders: treeIdGenerator(p),
-            upload: () => {
-              FileService.createFileStructure(props.project, p.folders);
-              emit("file-updated");
-            }
-          };
-        }
-      }));
-    };
-
-    watch(
-      () => props.loadingData,
-      () => {
-        if (!props.loadingData) {
-          closeModal();
-        }
-      }
-    );
+    const importFromOtherProjectsActions = computed(() => {
+      return spaceProjects.value
+        .filter(project => project.id != props.project.id)
+        .map(project => ({
+          name: project.name,
+          action: () => {
+            openModal({
+              component: FileTreePreviewModal,
+              props: {
+                sourceProject: project,
+                currentProject: props.project,
+                onSuccess() {
+                  emit("file-updated");
+                }
+              },
+            });
+          }
+        }));
+    });
 
     const dropdown = ref(null);
-    const projectsToUpload = ref(null);
     const menuItems = computed(() => {
       const items = [];
 
       if (props.project.isAdmin) {
         items.push(
           {
             name: t("FilesManager.structureImport"),
-            children: { list: projectsTree.value }
+            children: { list: importFromOtherProjectsActions.value }
           },
           {
             name: t("FilesManager.gedDownload"),
@@ -732,24 +710,6 @@ export default {
     onMounted(async () => {
       fetchVisas();
       fetchTags();
-      if (props.fileStructure.children.length === 0) {
-        projectsTree.value = (
-          await fetchProjectFolderTreeSerializers(props.project)
-        ).map(p => ({
-          name: p.name,
-          action: () => {
-            openModal();
-            projectsToUpload.value = {
-              ...p,
-              folders: treeIdGenerator(p),
-              upload: () => {
-                FileService.createFileStructure(props.project, p.folders);
-                emit("file-updated");
-              }
-            };
-          }
-        }));
-      }
     });
 
     const fileManager = ref(null);
@@ -791,15 +751,13 @@ export default {
       showVersioningManager,
       shouldSubscribe,
       currentSpace,
-      projectsTree,
-      projectsToUpload,
+      importFromOtherProjectsActions,
       dropdownMaxHeight,
       fileManager,
       dropdown,
       menuItems,
       loadingFileIds,
       // Methods
-      toggleDropdown,
       closeAccessManager,
       closeDeleteModal,
       createModelFromFile,

src/components/specific/files/files-manager/files-manager-onboarding/FilesManagerOnboarding.vue

@@ -42,7 +42,7 @@
               <BIMDataIconPlus size="s" />
             </BIMDataButton>
           </template>
-          <template v-if="isGedMenuOpen">
+          <template v-else>
             <BIMDataDropdownMenu
               class="files-manager-onboarding__actions__advanced__dropdown"
               v-click-away="closeGedMenu"
@@ -130,8 +130,8 @@ export default {
       type: Object,
       required: true
     },
-    projectsTree: {
-      type: Object,
+    importFromOtherProjectsActions: {
+      type: Array,
       required: true
     },
     rootFolder: {
@@ -201,7 +201,7 @@ export default {
           name: t("FilesManagerOnboarding.GEDStructureImport"),
           children: {
             position: "up",
-            list: props.projectsTree
+            list: props.importFromOtherProjectsActions
           }
         });
       }

src/services/ProjectService.js

@@ -172,10 +172,10 @@ class ProjectService {
     }
   }
 
-  async fetchProjectFolderTreeSerializers(project) {
+  async getProjectFolderTree(project) {
     try {
-      return await apiClient.collaborationApi.getProjectFolderTreeSerializers(
-        project.cloud.id
+      return await apiClient.collaborationApi.getProjectFolderTree(
+        project.cloud.id, project.id
       );
     } catch (error) {
       throw new RuntimeError(ERRORS.PROJECT_FOLDER_TREE_FETCH_ERROR, error);

src/state/projects.js

@@ -152,12 +152,11 @@ const getUserProjectList = async (project, folder) => {
     }));
 };
 
-const fetchProjectFolderTreeSerializers = async project => {
-  return (
-    await ProjectService.fetchProjectFolderTreeSerializers(project)
-  ).filter(p => p.name !== project.name);
+const getProjectFolderTree = async project => {
+  return ProjectService.getProjectFolderTree(project);
 };
 
+
 export function useProjects() {
   const readonlyState = readonly(state);
   return {
@@ -179,6 +178,6 @@ export function useProjects() {
     deleteProjectUser,
     fetchFolderProjectUsers,
     getUserProjectList,
-    fetchProjectFolderTreeSerializers
+    getProjectFolderTree,
   };
 }

src/utils/files.js

@@ -57,23 +57,19 @@ function generateFileKey(file) {
   return key;
 }
 
-function treeIdGenerator(projectToImport) {
-  if (projectToImport.folders.length === 0) return;
-  // Populate folder tree with IDs permit to satisfy a requirement from FileTree component. Front-end use only.
-  let idGenerator = 1;
-
-  const mapping = folders => {
-    return folders.map(folder => ({
-      ...folder,
-      id: idGenerator++,
-      type: FILE_TYPE.FOLDER,
-      children: folder.children?.length > 0 ? mapping(folder.children) : []
-    }));
-  };
-
-  return [
-    { name: projectToImport.name, children: mapping(projectToImport.folders) }
-  ];
+/**
+ *  Set type: FILE_TYPE.FOLDER to all folders and their children
+ *
+ * @param {File[]} folders
+ * @returns {void}
+ */
+function setFolderType(folders) {
+  folders.forEach(folder => {
+    folder.type = FILE_TYPE.FOLDER;
+    if (folder.children?.length > 0) {
+      setFolderType(folder.children);
+    }
+  })
 }
 
 /**
@@ -250,5 +246,5 @@ export {
   generateFileKey,
   getFilesFromEvent,
   getFilesWithParentIds,
-  treeIdGenerator
+  setFolderType,
 };