From 51e7c39e4072fe1fcbc85895e1d12c80fc1fc875 Mon Sep 17 00:00:00 2001 From: Janicki Artur Date: Mon, 5 Nov 2018 11:43:10 +0100 Subject: [PATCH] add sorting for projects by name and refactor code Feature #14422_item_sorting_in_copy_to_project_modal Arvados-DCO-1.1-Signed-off-by: Janicki Artur --- src/models/tree.ts | 6 ++ .../project-tree-picker-actions.ts | 6 +- src/store/tree-picker/tree-picker-actions.ts | 60 +++++++++++++++-- .../project-tree-picker.tsx | 65 +------------------ 4 files changed, 68 insertions(+), 69 deletions(-) diff --git a/src/models/tree.ts b/src/models/tree.ts index 613601109a..8e18f9fab7 100644 --- a/src/models/tree.ts +++ b/src/models/tree.ts @@ -24,6 +24,12 @@ export enum TreeNodeStatus { LOADED = 'LOADED', } +export enum TreePickerId { + PROJECTS = 'Projects', + SHARED_WITH_ME = 'Shared with me', + FAVORITES = 'Favorites' +} + export const createTree = (): Tree => ({}); export const getNode = (id: string) => (tree: Tree): TreeNode | undefined => tree[id]; diff --git a/src/store/project-tree-picker/project-tree-picker-actions.ts b/src/store/project-tree-picker/project-tree-picker-actions.ts index 86d9a18d88..3111017541 100644 --- a/src/store/project-tree-picker/project-tree-picker-actions.ts +++ b/src/store/project-tree-picker/project-tree-picker-actions.ts @@ -5,9 +5,9 @@ import { Dispatch } from "redux"; import { RootState } from "~/store/store"; import { ServiceRepository } from "~/services/services"; -import { TreePickerId, receiveTreePickerData } from "~/views-components/project-tree-picker/project-tree-picker"; import { mockProjectResource } from "~/models/test-utils"; -import { treePickerActions } from "~/store/tree-picker/tree-picker-actions"; +import { treePickerActions, receiveTreePickerProjectsData } from "~/store/tree-picker/tree-picker-actions"; +import { TreePickerId } from '~/models/tree'; export const resetPickerProjectTree = () => (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => { dispatch(treePickerActions.RESET_TREE_PICKER({pickerId: TreePickerId.PROJECTS})); @@ -38,7 +38,7 @@ const getFavoritesProjectsPickerTree = (uuid: string = '') => { }; const getProjectsPickerTree = (uuid: string, kind: string) => { - return receiveTreePickerData( + return receiveTreePickerProjectsData( '', [mockProjectResource({ uuid, name: kind })], kind diff --git a/src/store/tree-picker/tree-picker-actions.ts b/src/store/tree-picker/tree-picker-actions.ts index a988e89617..f51dcac7ec 100644 --- a/src/store/tree-picker/tree-picker-actions.ts +++ b/src/store/tree-picker/tree-picker-actions.ts @@ -3,17 +3,19 @@ // SPDX-License-Identifier: AGPL-3.0 import { unionize, ofType, UnionOf } from "~/common/unionize"; -import { TreeNode, initTreeNode, getNodeDescendants, getNodeDescendantsIds, getNodeValue, TreeNodeStatus, getNode } from '~/models/tree'; +import { TreeNode, initTreeNode, getNodeDescendants, TreeNodeStatus, getNode, TreePickerId } from '~/models/tree'; import { Dispatch } from 'redux'; import { RootState } from '~/store/store'; import { ServiceRepository } from '~/services/services'; import { FilterBuilder } from '~/services/api/filter-builder'; -import { pipe, map, values, mapValues } from 'lodash/fp'; +import { pipe, values } from 'lodash/fp'; import { ResourceKind } from '~/models/resource'; -import { GroupContentsResource } from '../../services/groups-service/groups-service'; -import { CollectionDirectory, CollectionFile } from '../../models/collection-file'; +import { GroupContentsResource } from '~/services/groups-service/groups-service'; +import { CollectionDirectory, CollectionFile } from '~/models/collection-file'; import { getTreePicker, TreePicker } from './tree-picker'; import { ProjectsTreePickerItem } from '~/views-components/projects-tree-picker/generic-projects-tree-picker'; +import { OrderBuilder } from '~/services/api/order-builder'; +import { ProjectResource } from '~/models/project'; export const treePickerActions = unionize({ LOAD_TREE_PICKER_NODE: ofType<{ id: string, pickerId: string }>(), @@ -73,6 +75,7 @@ interface ReceiveTreePickerDataParams { id: string; pickerId: string; } + export const receiveTreePickerData = (params: ReceiveTreePickerDataParams) => (dispatch: Dispatch) => { const { data, extractNodeData, id, pickerId, } = params; @@ -208,6 +211,7 @@ interface LoadFavoritesProjectParams { includeCollections?: boolean; includeFiles?: boolean; } + export const loadFavoritesProject = (params: LoadFavoritesProjectParams) => async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => { const { pickerId, includeCollections = false, includeFiles = false } = params; @@ -239,3 +243,51 @@ export const loadFavoritesProject = (params: LoadFavoritesProjectParams) => })); } }; + +export const receiveTreePickerProjectsData = (id: string, projects: ProjectResource[], pickerId: string) => + (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => { + dispatch(treePickerActions.LOAD_TREE_PICKER_NODE_SUCCESS({ + id, + nodes: projects.map(project => initTreeNode({ id: project.uuid, value: project })), + pickerId, + })); + + dispatch(treePickerActions.TOGGLE_TREE_PICKER_NODE_COLLAPSE({ id, pickerId })); + }; + +export const loadProjectTreePickerProjects = (id: string) => + async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => { + dispatch(treePickerActions.LOAD_TREE_PICKER_NODE({ id, pickerId: TreePickerId.PROJECTS })); + + const ownerUuid = id.length === 0 ? services.authService.getUuid() || '' : id; + const { items } = await services.projectService.list(buildParams(ownerUuid)); + + dispatch(receiveTreePickerProjectsData(id, items, TreePickerId.PROJECTS)); + }; + +export const loadFavoriteTreePickerProjects = (id: string) => + async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => { + const parentId = services.authService.getUuid() || ''; + + if (id === '') { + dispatch(treePickerActions.LOAD_TREE_PICKER_NODE({ id: parentId, pickerId: TreePickerId.FAVORITES })); + const { items } = await services.favoriteService.list(parentId); + dispatch(receiveTreePickerProjectsData(parentId, items as ProjectResource[], TreePickerId.FAVORITES)); + } else { + dispatch(treePickerActions.LOAD_TREE_PICKER_NODE({ id, pickerId: TreePickerId.FAVORITES })); + const { items } = await services.projectService.list(buildParams(id)); + dispatch(receiveTreePickerProjectsData(id, items, TreePickerId.FAVORITES)); + } + + }; + +const buildParams = (ownerUuid: string) => { + return { + filters: new FilterBuilder() + .addEqual('ownerUuid', ownerUuid) + .getFilters(), + order: new OrderBuilder() + .addAsc('name') + .getOrder() + }; +}; \ No newline at end of file diff --git a/src/views-components/project-tree-picker/project-tree-picker.tsx b/src/views-components/project-tree-picker/project-tree-picker.tsx index 36104d4362..a4e4c40626 100644 --- a/src/views-components/project-tree-picker/project-tree-picker.tsx +++ b/src/views-components/project-tree-picker/project-tree-picker.tsx @@ -9,14 +9,13 @@ import { Typography } from "@material-ui/core"; import { TreePicker, TreePickerProps } from "../tree-picker/tree-picker"; import { TreeItem, TreeItemStatus } from "~/components/tree/tree"; import { ProjectResource } from "~/models/project"; -import { treePickerActions } from "~/store/tree-picker/tree-picker-actions"; +import { treePickerActions, loadProjectTreePickerProjects, loadFavoriteTreePickerProjects } from "~/store/tree-picker/tree-picker-actions"; import { ListItemTextIcon } from "~/components/list-item-text-icon/list-item-text-icon"; import { ProjectIcon, FavoriteIcon, ProjectsIcon, ShareMeIcon } from "~/components/icon/icon"; import { RootState } from "~/store/store"; import { ServiceRepository } from "~/services/services"; -import { FilterBuilder } from "~/services/api/filter-builder"; import { WrappedFieldProps } from 'redux-form'; -import { initTreeNode } from '~/models/tree'; +import { TreePickerId } from '~/models/tree'; type ProjectTreePickerProps = Pick, 'onContextMenu' | 'toggleItemActive' | 'toggleItemOpen' | 'toggleItemSelection'>; @@ -56,12 +55,6 @@ const getNotSelectedTreePickerKind = (pickerId: string) => { return [TreePickerId.PROJECTS, TreePickerId.FAVORITES, TreePickerId.SHARED_WITH_ME].filter(nodeId => nodeId !== pickerId); }; -export enum TreePickerId { - PROJECTS = 'Projects', - SHARED_WITH_ME = 'Shared with me', - FAVORITES = 'Favorites' -} - export const ProjectTreePicker = connect(undefined, mapDispatchToProps)((props: ProjectTreePickerProps) =>
@@ -74,45 +67,6 @@ export const ProjectTreePicker = connect(undefined, mapDispatchToProps)((props:
); - -// TODO: move action creator to store directory -export const loadProjectTreePickerProjects = (id: string) => - async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => { - dispatch(treePickerActions.LOAD_TREE_PICKER_NODE({ id, pickerId: TreePickerId.PROJECTS })); - - const ownerUuid = id.length === 0 ? services.authService.getUuid() || '' : id; - - const filters = new FilterBuilder() - .addEqual('ownerUuid', ownerUuid) - .getFilters(); - - const { items } = await services.projectService.list({ filters }); - - dispatch(receiveTreePickerData(id, items, TreePickerId.PROJECTS)); - }; - -export const loadFavoriteTreePickerProjects = (id: string) => - async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => { - const parentId = services.authService.getUuid() || ''; - - if (id === '') { - dispatch(treePickerActions.LOAD_TREE_PICKER_NODE({ id: parentId, pickerId: TreePickerId.FAVORITES })); - const { items } = await services.favoriteService.list(parentId); - - dispatch(receiveTreePickerData(parentId, items as ProjectResource[], TreePickerId.FAVORITES)); - } else { - dispatch(treePickerActions.LOAD_TREE_PICKER_NODE({ id, pickerId: TreePickerId.FAVORITES })); - const filters = new FilterBuilder() - .addEqual('ownerUuid', id) - .getFilters(); - - const { items } = await services.projectService.list({ filters }); - - dispatch(receiveTreePickerData(id, items, TreePickerId.FAVORITES)); - } - - }; - const getProjectPickerIcon = (item: TreeItem) => { switch (item.data.name) { case TreePickerId.FAVORITES: @@ -129,23 +83,10 @@ const getProjectPickerIcon = (item: TreeItem) => { const renderTreeItem = (item: TreeItem) => ; - -// TODO: move action creator to store directory -export const receiveTreePickerData = (id: string, projects: ProjectResource[], pickerId: string) => - (dispatch: Dispatch) => { - dispatch(treePickerActions.LOAD_TREE_PICKER_NODE_SUCCESS({ - id, - nodes: projects.map(project => initTreeNode({ id: project.uuid, value: project })), - pickerId, - })); - - dispatch(treePickerActions.TOGGLE_TREE_PICKER_NODE_COLLAPSE({ id, pickerId })); - }; - export const ProjectTreePickerField = (props: WrappedFieldProps) =>
-- 2.30.2