From 407d1f609f40e8a7d21cf5846690b63706befaa4 Mon Sep 17 00:00:00 2001 From: Ward Vandewege Date: Sat, 20 Mar 2021 22:03:14 -0400 Subject: [PATCH] 17119: implement review feedback. Arvados-DCO-1.1-Signed-off-by: Ward Vandewege --- src/components/icon/icon.tsx | 2 + src/components/tree/tree.tsx | 49 ++++++++++--------- .../context-menu/context-menu-actions.ts | 21 +++----- src/store/resources/resources.ts | 11 ----- .../data-explorer/renderers.tsx | 6 ++- .../details-panel/project-details.tsx | 18 ++++--- .../side-panel-tree/side-panel-tree.tsx | 8 ++- 7 files changed, 59 insertions(+), 56 deletions(-) diff --git a/src/components/icon/icon.tsx b/src/components/icon/icon.tsx index 9eb60332..6bbacaf4 100644 --- a/src/components/icon/icon.tsx +++ b/src/components/icon/icon.tsx @@ -28,6 +28,7 @@ import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; import FlipToFront from '@material-ui/icons/FlipToFront'; import Folder from '@material-ui/icons/Folder'; import FolderShared from '@material-ui/icons/FolderShared'; +import Pageview from '@material-ui/icons/Pageview'; import GetApp from '@material-ui/icons/GetApp'; import Help from '@material-ui/icons/Help'; import HelpOutline from '@material-ui/icons/HelpOutline'; @@ -126,6 +127,7 @@ export const PaginationLeftArrowIcon: IconType = (props) => ; export const ProcessIcon: IconType = (props) => ; export const ProjectIcon: IconType = (props) => ; +export const FilterGroupIcon: IconType = (props) => ; export const ProjectsIcon: IconType = (props) => ; export const ProvenanceGraphIcon: IconType = (props) => ; export const RemoveIcon: IconType = (props) => ; diff --git a/src/components/tree/tree.tsx b/src/components/tree/tree.tsx index 908ee28c..cf4d708d 100644 --- a/src/components/tree/tree.tsx +++ b/src/components/tree/tree.tsx @@ -5,7 +5,7 @@ import * as React from 'react'; import { List, ListItem, ListItemIcon, Checkbox, Radio, Collapse } from "@material-ui/core"; import { StyleRulesCallback, withStyles, WithStyles } from '@material-ui/core/styles'; -import { CollectionIcon, DefaultIcon, DirectoryIcon, FileIcon, ProjectIcon } from '~/components/icon/icon'; +import { CollectionIcon, DefaultIcon, DirectoryIcon, FileIcon, ProjectIcon, FilterGroupIcon } from '~/components/icon/icon'; import { ReactElement } from "react"; import CircularProgress from '@material-ui/core/CircularProgress'; import classnames from "classnames"; @@ -13,6 +13,7 @@ import classnames from "classnames"; import { ArvadosTheme } from '~/common/custom-theme'; import { SidePanelRightArrowIcon } from '../icon/icon'; import { ResourceKind } from '~/models/resource'; +import { GroupClass } from '~/models/group'; type CssRules = 'list' | 'listItem' @@ -162,31 +163,35 @@ const FLAT_TREE_ACTIONS = { toggleActive: 'TOGGLE_ACTIVE', }; -const ItemIcon = React.memo(({type, kind, active, classes}: any) => { +const ItemIcon = React.memo(({type, kind, active, groupClass, classes}: any) => { let Icon = ProjectIcon; - if (type) { - switch (type) { - case 'directory': - Icon = DirectoryIcon; - break; - case 'file': - Icon = FileIcon; - break; - default: - Icon = DefaultIcon; - } + if (groupClass === GroupClass.FILTER) { + Icon = FilterGroupIcon; + } + + if (type) { + switch (type) { + case 'directory': + Icon = DirectoryIcon; + break; + case 'file': + Icon = FileIcon; + break; + default: + Icon = DefaultIcon; } + } - if (kind) { - switch(kind) { - case ResourceKind.COLLECTION: - Icon = CollectionIcon; - break; - default: - break; - } + if (kind) { + switch(kind) { + case ResourceKind.COLLECTION: + Icon = CollectionIcon; + break; + default: + break; } + } return ; }); @@ -228,7 +233,7 @@ const FlatTree = (props: FlatTreeProps) =>
- + {item.data.name} diff --git a/src/store/context-menu/context-menu-actions.ts b/src/store/context-menu/context-menu-actions.ts index 9a5b3099..f8049a5c 100644 --- a/src/store/context-menu/context-menu-actions.ts +++ b/src/store/context-menu/context-menu-actions.ts @@ -205,9 +205,6 @@ export const openProcessContextMenu = (event: React.MouseEvent, pro }; export const isProjectRoute = (router: RouterState) => { - if (router === undefined) { - return false; - } const pathname = router.location ? router.location.pathname : ''; const matchProject = matchProjectRoute(pathname); return Boolean(matchProject); @@ -223,24 +220,20 @@ export const resourceUuidToContextMenuKind = (uuid: string) => let inFilterGroup = false; const { router } = getState(); if (isProjectRoute(router)) { - const projectUuid = getProjectPanelCurrentUuid(getState()); - if (projectUuid !== undefined) { - const project = getResource(projectUuid)(getState().resources); - if (project) { - if (project.groupClass === GroupClass.FILTER) { - inFilterGroup = true; - } + const projectUuid = getProjectPanelCurrentUuid(getState()); + if (projectUuid !== undefined) { + const project = getResource(projectUuid)(getState().resources); + if (project && project.groupClass === GroupClass.FILTER) { + inFilterGroup = true; + } } - } } const isEditable = (isAdminUser || (resource || {} as EditableResource).isEditable) && !inFilterGroup; switch (kind) { case ResourceKind.PROJECT: return (isAdminUser && !inFilterGroup) - ? (resource && resource.groupClass === GroupClass.PROJECT) - ? ContextMenuKind.PROJECT_ADMIN - : ContextMenuKind.READONLY_PROJECT + ? ContextMenuKind.PROJECT_ADMIN : isEditable ? ContextMenuKind.PROJECT : ContextMenuKind.READONLY_PROJECT; diff --git a/src/store/resources/resources.ts b/src/store/resources/resources.ts index 915235d1..696a1362 100644 --- a/src/store/resources/resources.ts +++ b/src/store/resources/resources.ts @@ -6,8 +6,6 @@ import { Resource, EditableResource } from "~/models/resource"; import { ResourceKind } from '~/models/resource'; import { ProjectResource } from "~/models/project"; import { GroupResource } from "~/models/group"; -import { extractUuidObjectType, ResourceObjectType } from "~/models/resource"; -import { GroupClass } from '~/models/group'; export type ResourcesState = { [key: string]: Resource }; @@ -38,15 +36,6 @@ export const getResourceWithEditableStatus = -1 : false; } diff --git a/src/views-components/data-explorer/renderers.tsx b/src/views-components/data-explorer/renderers.tsx index 6cf29fae..28a6f253 100644 --- a/src/views-components/data-explorer/renderers.tsx +++ b/src/views-components/data-explorer/renderers.tsx @@ -6,7 +6,7 @@ import * as React from 'react'; import { Grid, Typography, withStyles, Tooltip, IconButton, Checkbox } from '@material-ui/core'; import { FavoriteStar, PublicFavoriteStar } from '../favorite-star/favorite-star'; import { ResourceKind, TrashableResource } from '~/models/resource'; -import { ProjectIcon, CollectionIcon, ProcessIcon, DefaultIcon, ShareIcon, CollectionOldVersionIcon, WorkflowIcon } from '~/components/icon/icon'; +import { ProjectIcon, FilterGroupIcon, CollectionIcon, ProcessIcon, DefaultIcon, ShareIcon, CollectionOldVersionIcon, WorkflowIcon } from '~/components/icon/icon'; import { formatDate, formatFileSize, formatTime } from '~/common/formatters'; import { resourceLabel } from '~/common/labels'; import { connect, DispatchProp } from 'react-redux'; @@ -28,6 +28,7 @@ import { withResourceData } from '~/views-components/data-explorer/with-resource import { CollectionResource } from '~/models/collection'; import { IllegalNamingWarning } from '~/components/warning/warning'; import { loadResource } from '~/store/resources/resources-actions'; +import { GroupClass } from '~/models/group'; const renderName = (dispatch: Dispatch, item: GroupContentsResource) => @@ -59,6 +60,9 @@ export const ResourceName = connect( const renderIcon = (item: GroupContentsResource) => { switch (item.kind) { case ResourceKind.PROJECT: + if (item.groupClass === GroupClass.FILTER) { + return ; + } return ; case ResourceKind.COLLECTION: if (item.uuid === item.currentVersionUuid) { diff --git a/src/views-components/details-panel/project-details.tsx b/src/views-components/details-panel/project-details.tsx index 4a615506..3c2bc099 100644 --- a/src/views-components/details-panel/project-details.tsx +++ b/src/views-components/details-panel/project-details.tsx @@ -5,7 +5,7 @@ import * as React from 'react'; import { connect } from 'react-redux'; import { openProjectPropertiesDialog } from '~/store/details-panel/details-panel-action'; -import { ProjectIcon, RenameIcon } from '~/components/icon/icon'; +import { ProjectIcon, RenameIcon, FilterGroupIcon } from '~/components/icon/icon'; import { ProjectResource } from '~/models/project'; import { formatDate } from '~/common/formatters'; import { ResourceKind } from '~/models/resource'; @@ -18,9 +18,13 @@ import { ArvadosTheme } from '~/common/custom-theme'; import { Dispatch } from 'redux'; import { getPropertyChip } from '../resource-properties-form/property-chip'; import { ResourceOwnerWithName } from '../data-explorer/renderers'; +import { GroupClass } from "~/models/group"; export class ProjectDetails extends DetailsData { getIcon(className?: string) { + if (this.item.groupClass === GroupClass.FILTER) { + return ; + } return ; } @@ -59,8 +63,7 @@ type ProjectDetailsComponentProps = ProjectDetailsComponentDataProps & ProjectDe const ProjectDetailsComponent = connect(null, mapDispatchToProps)( withStyles(styles)( ({ classes, project, onClick }: ProjectDetailsComponentProps) =>
- - + } /> @@ -76,9 +79,12 @@ const ProjectDetailsComponent = connect(null, mapDispatchToProps)( } -
- -
+ {project.groupClass !== GroupClass.FILTER ? +
+ +
+ : '' + }
{ Object.keys(project.properties).map(k => diff --git a/src/views-components/side-panel-tree/side-panel-tree.tsx b/src/views-components/side-panel-tree/side-panel-tree.tsx index e0d9777d..4c6f01a1 100644 --- a/src/views-components/side-panel-tree/side-panel-tree.tsx +++ b/src/views-components/side-panel-tree/side-panel-tree.tsx @@ -9,13 +9,15 @@ import { TreePicker, TreePickerProps } from "../tree-picker/tree-picker"; import { TreeItem } from "~/components/tree/tree"; import { ProjectResource } from "~/models/project"; import { ListItemTextIcon } from "~/components/list-item-text-icon/list-item-text-icon"; -import { ProcessIcon, ProjectIcon, FavoriteIcon, ProjectsIcon, ShareMeIcon, TrashIcon, PublicFavoriteIcon } from '~/components/icon/icon'; +import { ProcessIcon, ProjectIcon, FilterGroupIcon, FavoriteIcon, ProjectsIcon, ShareMeIcon, TrashIcon, PublicFavoriteIcon } from '~/components/icon/icon'; import { WorkflowIcon } from '~/components/icon/icon'; import { activateSidePanelTreeItem, toggleSidePanelTreeItemCollapse, SIDE_PANEL_TREE, SidePanelTreeCategory } from '~/store/side-panel-tree/side-panel-tree-actions'; import { openSidePanelContextMenu } from '~/store/context-menu/context-menu-actions'; import { noop } from 'lodash'; import { ResourceKind } from "~/models/resource"; import { IllegalNamingWarning } from "~/components/warning/warning"; +import { GroupClass } from "~/models/group"; + export interface SidePanelTreeProps { onItemActivation: (id: string) => void; sidePanelProgress?: boolean; @@ -58,7 +60,9 @@ const renderSidePanelItem = (item: TreeItem) => { const getProjectPickerIcon = (item: TreeItem) => typeof item.data === 'string' ? getSidePanelIcon(item.data) - : ProjectIcon; + : (item.data && item.data.groupClass === GroupClass.FILTER) + ? FilterGroupIcon + : ProjectIcon; const getSidePanelIcon = (category: string) => { switch (category) { -- 2.30.2