Refresh

resources/js/store/modules/folders/actions.js

@@ -0,0 +1,231 @@
+/**
+ * Actions on folders
+ */
+export default {
+    /*
+     * -------------------------------------------------------------------------
+     * ----| CRUD |-------------------------------------------------------------
+     * -------------------------------------------------------------------------
+     */
+
+    /**
+     * Display a listing of the resource.
+     */
+    async index({ getters, commit, dispatch }, { folders, show }) {
+        commit("setFolders", folders);
+
+        if (show) {
+            if (show === "unread_items") {
+                show = getters.getUnreadItemsFolder;
+            }
+
+            dispatch("show", { folder: show });
+        } else {
+            dispatch("show", {});
+        }
+    },
+
+    /**
+     * Display the specified resource.
+     */
+    show(
+        { commit, getters, dispatch },
+        { folder, deselectDocuments = true, updateFeedItems = true }
+    ) {
+        const currentSelectedFolder = getters.selectedFolder;
+
+        if (!folder) {
+            folder = currentSelectedFolder;
+        } else if (Number.isInteger(folder)) {
+            folder = getters.folders.find((f) => f.id === folder);
+        }
+
+        commit("setSelectedFolder", folder);
+
+        if (deselectDocuments) {
+            dispatch("documents/selectDocuments", [], { root: true });
+        }
+
+        api.get(route("folder.show", folder)).then(function (response) {
+            dispatch(
+                "documents/index",
+                { documents: response, updateFeedItems: updateFeedItems },
+                { root: true }
+            );
+        });
+    },
+
+    /**
+     * Load folder's details
+     */
+    async loadDetails({ dispatch }, folder) {
+        if (!folder.details_loaded && !folder.details_loading) {
+            dispatch("updateProperties", {
+                folderId: folder.id,
+                newProperties: {
+                    details_loading: true,
+                },
+            });
+
+            let response = await api.get(route("folder.details", folder));
+
+            response.details_loaded = true;
+            response.details_loading = false;
+
+            dispatch("updateProperties", {
+                folderId: folder.id,
+                newProperties: response,
+            });
+        }
+    },
+
+    /**
+     * Store a newly created resource in storage.
+     */
+    store({ dispatch }, { title, parent_id, group_id }) {
+        return api
+            .post(route("folder.store"), {
+                title,
+                parent_id,
+                group_id,
+            })
+            .then((data) => {
+                dispatch("index", { folders: data });
+            })
+            .catch((error) => console.error(error));
+    },
+
+    /**
+     * Update the specified resource in storage.
+     */
+    async update({ dispatch }, { folder, newProperties }) {
+        const data = await api.put(
+            route("folder.update", folder),
+            newProperties
+        );
+
+        dispatch("updateProperties", {
+            folderId: folder.id,
+            newProperties: data,
+        });
+    },
+
+    /**
+     * Update the specified resource in storage.
+     */
+    updateProperties({ commit, getters }, { folderId, newProperties }) {
+        const folder = getters.folders.find((f) => f.id == folderId);
+
+        if (!folder) {
+            return;
+        }
+
+        commit("update", { folder: folder, newProperties: newProperties });
+    },
+
+    updatePermission({ dispatch }, { folder, user, ability, granted }) {
+        api.post(route("folder.set_permission", folder), {
+            ability: ability,
+            granted: granted,
+            user_id: user,
+        }).then(function (response) {
+            dispatch("updateProperties", {
+                folderId: folder.id,
+                newProperties: response,
+            });
+        });
+    },
+
+    /**
+     * Remove the specified resource from storage.
+     */
+    async destroy({ dispatch }, folder) {
+        const data = await api.delete(route("folder.destroy", folder));
+
+        dispatch("index", { folders: data });
+    },
+
+    /**
+     * Toggle specified folder expanded/collapsed
+     */
+    toggleExpanded({ dispatch }, folder) {
+        dispatch("update", {
+            folder: folder,
+            newProperties: {
+                ...folder,
+                ...{
+                    is_expanded: !folder.is_expanded,
+                },
+            },
+        });
+    },
+
+    /**
+     * Toggle specified folder's branch expanded/collapsed
+     */
+    async toggleBranch({ commit }, folder) {
+        const response = await api.post(route("folder.toggle_branch", folder));
+
+        commit("setFolders", response);
+    },
+
+    /*
+     * -------------------------------------------------------------------------
+     * ----| Drag'n'drop |------------------------------------------------------
+     * -------------------------------------------------------------------------
+     */
+
+    /**
+     * Remind folder being dragged
+     */
+    startDraggingFolder({ commit }, folder) {
+        commit("setDraggedFolder", folder);
+    },
+
+    /**
+     * Forget folder being dragged
+     */
+    stopDraggingFolder({ commit }) {
+        commit("setDraggedFolder", null);
+    },
+
+    /**
+     * Drop something into specified folder
+     */
+    async dropIntoFolder({ getters, dispatch }, folder) {
+        var sourceFolder = getters.draggedFolder;
+
+        if (!sourceFolder) {
+            sourceFolder = getters.selectedFolder;
+
+            await dispatch(
+                "documents/dropIntoFolder",
+                { sourceFolder: sourceFolder, targetFolder: folder },
+                { root: true }
+            );
+
+            return;
+        }
+
+        if (
+            sourceFolder.parent_id === folder.id ||
+            sourceFolder.id === folder.id
+        ) {
+            return;
+        }
+
+        const newProperties = {
+            parent_id: folder.id,
+        };
+
+        await dispatch("update", {
+            folder: sourceFolder,
+            newProperties: {
+                ...sourceFolder,
+                ...newProperties,
+            },
+        }).then(function () {
+            dispatch("groups/show", {}, { root: true });
+        });
+    },
+};

resources/js/store/modules/folders/getters.js

@@ -0,0 +1,37 @@
+/**
+ * Folders getters
+ */
+export default {
+    /**
+     * Return folders tree
+     */
+    folders: state => {
+        return state.folders;
+    },
+    /**
+     * Return currently selected folder
+     */
+    selectedFolder: state => {
+        var folders = state.folders ? state.folders : [];
+
+        return folders.find(folder => folder.is_selected);
+    },
+    /**
+     * Return folder being dragged
+     */
+    draggedFolder: state => {
+        return state.draggedFolder;
+    },
+    /**
+     * Return a folder by its id
+     */
+    getFolderById: (state) => (id) => {
+        return state.folders.find(folder => folder.id === id);
+    },
+    /**
+     * Return the "unread items" folder
+     */
+    getUnreadItemsFolder: (state)  => {
+        return state.folders.find(folder => folder.type === 'unread_items');
+    }
+}

resources/js/store/modules/folders/index.js

@@ -0,0 +1,12 @@
+import state from "./state";
+import getters from "./getters";
+import actions from "./actions";
+import mutations from "./mutations";
+
+export default {
+    'namespaced': true,
+    state,
+    getters,
+    actions,
+    mutations
+}

resources/js/store/modules/folders/mutations.js

@@ -0,0 +1,52 @@
+/**
+ * Folders mutations
+ */
+export default {
+    /**
+     * Store folders list
+     * @param {*} state
+     * @param {*} folders
+     */
+    setFolders(state, folders) {
+        state.folders = folders;
+    },
+
+    /**
+     * Unselect all folders, and mark specified folder as selected
+     * @param {*} state
+     * @param {*} folder
+     */
+    setSelectedFolder(state, folder) {
+        state.folders.find((f) => (f.is_selected = false));
+
+        folder.is_selected = true;
+    },
+
+    /**
+     * Update folder's properties
+     * @param {*} state
+     * @param {*} param1
+     */
+    update(state, { folder, newProperties }) {
+        for (var property in newProperties) {
+            folder[property] = newProperties[property];
+        }
+
+        if (folder.type === "unread_items") {
+            if (folder.feed_item_states_count) {
+                folder.iconColor = "folder-unread-not-empty";
+            } else {
+                folder.iconColor = "folder-unread";
+            }
+        }
+    },
+
+    /**
+     * Store folder being dragged during a drag'n'drop process
+     * @param {*} state
+     * @param {*} folder
+     */
+    setDraggedFolder(state, folder) {
+        state.draggedFolder = folder;
+    },
+};

resources/js/store/modules/folders/state.js

@@ -0,0 +1,10 @@
+export default {
+    /**
+     * Folders tree
+     */
+    folders: [],
+    /**
+     * Folder being dragged
+     */
+    draggedFolder: null
+}