feat(project-files): update a FileStructureHandler and provide it in …

…ProjectBoard view

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

@@ -1,10 +1,7 @@
 <template>
   <BIMDataCard class="files-manager" :titleHeader="$t('FilesManager.title')">
     <template #left>
-      <FilesManagerBreadcrumb
-        :fileStructure="fileStructure"
-        :file="currentFolder"
-      />
+      <FilesManagerBreadcrumb :file="currentFolder" />
     </template>
     <template #content>
       <div class="files-manager__actions">
@@ -86,10 +83,6 @@ export default {
       type: Object,
       required: true
     },
-    files: {
-      type: Array,
-      required: true
-    },
     fileStructure: {
       type: Object,
       required: true
@@ -144,7 +137,6 @@ export default {
 
     return {
       // References
-      // currentFiles,
       currentFolder,
       displayedFiles,
       searchText,

src/components/specific/files/files-manager/files-manager-breadcrumb/FilesManagerBreadcrumb.vue

@@ -6,41 +6,26 @@
 </template>
 
 <script>
-import { ref } from "@vue/reactivity";
-import { watch } from "@vue/runtime-core";
-import { FileStructureHandler } from "@/utils/file-structure";
+import { inject, ref, watch } from "vue";
 
 export default {
   props: {
-    fileStructure: {
-      type: Object,
-      required: true
-    },
     file: {
       type: Object,
       required: true
     }
   },
   setup(props) {
-    const path = ref([]);
+    const handler = inject("fileStructureHandler");
 
-    let structure = {};
+    const path = ref([]);
 
-    watch(
-      () => props.fileStructure,
-      () => (structure = new FileStructureHandler(props.fileStructure)),
-      { immediate: true }
-    );
     watch(
       () => props.file,
       () => {
-        let file = structure.file(props.file.id);
-        const filePath = [];
-        while (file.parent) {
-          file = file.parent;
-          filePath.unshift(file.name);
-        }
-        path.value = filePath;
+        path.value = handler()
+          .ancestors(props.file)
+          .map(f => f.name);
       },
       { immediate: true }
     );

src/server/FileService.js

@@ -8,21 +8,63 @@ class FileService {
     });
   }
 
-  fetchDocuments(project) {
-    return apiClient.collaborationApi.getDocuments({
+  // fetchFolders(project) {
+  //   return apiClient.collaborationApi.getFolders({
+  //     cloudPk: project.cloud.id,
+  //     projectPk: project.id
+  //   });
+  // }
+
+  createFolder(project, folder) {
+    return apiClient.collaborationApi.createFolder({
       cloudPk: project.cloud.id,
-      projectPk: project.id
+      projectPk: project.id,
+      data: folder
     });
   }
 
-  // createDocument(project, document) {
-  //   return apiClient.collaborationApi.createDocument({
+  updateFolders(project, folders) {
+    folders = [folders].flat();
+    return Promise.all(
+      folders.map(folder =>
+        apiClient.collaborationApi.updateFolder({
+          cloudPk: project.cloud.id,
+          projectPk: project.id,
+          id: folder.id,
+          data: folder
+        })
+      )
+    );
+  }
+
+  deleteFolders(project, folders) {
+    folders = [folders].flat();
+    return Promise.all(
+      folders.map(folder =>
+        apiClient.collaborationApi.deleteFolder({
+          cloudPk: project.cloud.id,
+          projectPk: project.id,
+          id: folder.id
+        })
+      )
+    );
+  }
+
+  // fetchDocuments(project) {
+  //   return apiClient.collaborationApi.getDocuments({
   //     cloudPk: project.cloud.id,
-  //     projectPk: project.id,
-  //     data: document
+  //     projectPk: project.id
   //   });
   // }
 
+  createDocument(project, document) {
+    return apiClient.collaborationApi.createDocument({
+      cloudPk: project.cloud.id,
+      projectPk: project.id,
+      data: document
+    });
+  }
+
   updateDocuments(project, documents) {
     documents = [].concat(documents);
     return Promise.all(

src/state/files.js

@@ -1,28 +1,85 @@
 import { reactive, readonly, toRefs } from "@vue/reactivity";
 import FileService from "@/server/FileService";
+import { FileStructureHandler } from "@/utils/file-structure";
 
 const state = reactive({
-  projectFiles: [],
   projectFileStructure: {}
 });
 
-const loadProjectFiles = async project => {
-  const files = await FileService.fetchDocuments(project);
-  state.projectFiles = files;
-  return files;
-};
+let fileStructureHandler = null;
 
 const loadProjectFileStructure = async project => {
   const fileStructure = await FileService.fetchFileStructure(project);
   state.projectFileStructure = fileStructure;
+  fileStructureHandler = new FileStructureHandler(fileStructure);
   return fileStructure;
 };
 
+const softUpdateFileStructure = (action, files) => {
+  for (const file of [files].flat()) {
+    switch (action) {
+      case "create":
+        // TODO
+        break;
+      case "update":
+        // TODO
+        break;
+      case "delete":
+        // TODO
+        break;
+    }
+  }
+};
+
+const createFolder = async (project, folder) => {
+  const newFolder = await FileService.createFolder(project, folder);
+  softUpdateFileStructure("create", newFolder);
+  return newFolder;
+};
+
+const updateFolders = async (project, folders) => {
+  const newFolders = await FileService.updateFolders(project, folders);
+  softUpdateFileStructure("update", newFolders);
+  return newFolders;
+};
+
+const deleteFolders = async (project, folders) => {
+  await FileService.deleteFolders(project, folders);
+  softUpdateFileStructure("delete", folders);
+  return folders;
+};
+
+const createDocument = async (project, document) => {
+  const newDocument = await FileService.createDocument(project, document);
+  softUpdateFileStructure("create", newDocument);
+  return newDocument;
+};
+
+const updateDocuments = async (project, documents) => {
+  const newDocuments = await FileService.updateDocuments(project, documents);
+  softUpdateFileStructure("update", newDocuments);
+  return newDocuments;
+};
+
+const deleteDocuments = async (project, documents) => {
+  await FileService.deleteDocuments(project, documents);
+  softUpdateFileStructure("delete", documents);
+  return documents;
+};
+
 export function useFiles() {
   const readOnlyState = readonly(state);
   return {
+    // References
     ...toRefs(readOnlyState),
-    loadProjectFiles,
-    loadProjectFileStructure
+    fileStructureHandler: () => fileStructureHandler,
+    // Methods
+    loadProjectFileStructure,
+    createFolder,
+    updateFolders,
+    deleteFolders,
+    createDocument,
+    updateDocuments,
+    deleteDocuments
   };
 }

src/state/models.js

@@ -24,7 +24,7 @@ const updateModels = async (project, models) => {
 };
 
 const softUpdateModels = models => {
-  for (const model of [].concat(models)) {
+  for (const model of [models].flat()) {
     state.projectModels = state.projectModels.map(m =>
       m.id === model.id ? { ...m, ...model } : m
     );

src/state/projects.js

@@ -1,4 +1,4 @@
-import { reactive, readonly, toRefs, watchEffect } from "vue";
+import { reactive, readonly, toRefs, watch } from "vue";
 import ProjectService from "@/server/ProjectService";
 import { useUser } from "@/state/user";
 import { PROJECT_ROLE } from "@/utils/users";
@@ -7,8 +7,8 @@ const state = reactive({
   userProjects: [],
   spaceProjects: [],
   currentProject: null,
-  currentProjectUsers: [],
-  currentProjectInvitations: []
+  projectUsers: [],
+  projectInvitations: []
 });
 
 const loadUserProjects = async () => {
@@ -27,16 +27,18 @@ const loadUserProjects = async () => {
   return projects;
 };
 
-let stopSpaceProjectsWatcher;
+let unwatchUserProjects = () => {};
 const loadSpaceProjects = space => {
-  if (typeof stopSpaceProjectsWatcher === "function") {
-    stopSpaceProjectsWatcher();
-  }
-  stopSpaceProjectsWatcher = watchEffect(() => {
-    state.spaceProjects = state.userProjects.filter(
-      project => project.cloud.id === space.id
-    );
-  });
+  unwatchUserProjects();
+  unwatchUserProjects = watch(
+    () => state.userProjects,
+    () => {
+      state.spaceProjects = state.userProjects.filter(
+        project => project.cloud.id === space.id
+      );
+    },
+    { immediate: true }
+  );
 };
 
 const loadProjectUsers = async project => {
@@ -51,13 +53,13 @@ const loadProjectUsers = async project => {
     .sort((a, b) =>
       `${a.firstname}${a.lastname}` < `${b.firstname}${b.lastname}` ? -1 : 1
     );
-  state.currentProjectUsers = users;
+  state.projectUsers = users;
   return users;
 };
 
 const loadProjectInvitations = async project => {
   const invitations = await ProjectService.fetchProjectInvitations(project);
-  state.currentProjectInvitations = invitations;
+  state.projectInvitations = invitations;
   return invitations;
 };
 
@@ -109,34 +111,30 @@ const sendProjectInvitation = async (project, invitation, options = {}) => {
     invitation
   );
   if (!options.resend) {
-    state.currentProjectInvitations = [newInvitation].concat(
-      state.currentProjectInvitations
-    );
+    state.projectInvitations = [newInvitation].concat(state.projectInvitations);
   }
   return newInvitation;
 };
 
 const cancelProjectInvitation = async (project, invitation) => {
   await ProjectService.cancelProjectInvitation(project, invitation);
-  state.currentProjectInvitations = state.currentProjectInvitations.filter(
+  state.projectInvitations = state.projectInvitations.filter(
     i => i.id !== invitation.id
   );
   return invitation;
 };
 
 const updateProjectUser = async (project, user) => {
   const newUser = await ProjectService.updateProjectUser(project, user);
-  state.currentProjectUsers = state.currentProjectUsers.map(u =>
+  state.projectUsers = state.projectUsers.map(u =>
     u.id === user.id ? newUser : u
   );
   return newUser;
 };
 
 const deleteProjectUser = async (project, user) => {
   await ProjectService.deleteProjectUser(project, user);
-  state.currentProjectUsers = state.currentProjectUsers.filter(
-    u => u.id !== user.id
-  );
+  state.projectUsers = state.projectUsers.filter(u => u.id !== user.id);
   return user;
 };