From: Daniel Kutyła Date: Tue, 12 Jul 2022 14:00:50 +0000 (+0200) Subject: 18692: Replaced icons, fixed context menu confusion X-Git-Tag: 2.5.0~33^2~30 X-Git-Url: https://git.arvados.org/arvados-workbench2.git/commitdiff_plain/1b7a371a20a0ce0f4811e1b58222f1d837b62337 18692: Replaced icons, fixed context menu confusion Arvados-DCO-1.1-Signed-off-by: Daniel Kutyła --- diff --git a/src/components/breadcrumbs/breadcrumbs.tsx b/src/components/breadcrumbs/breadcrumbs.tsx index c081c314..2cb81205 100644 --- a/src/components/breadcrumbs/breadcrumbs.tsx +++ b/src/components/breadcrumbs/breadcrumbs.tsx @@ -7,7 +7,7 @@ import { Button, Grid, StyleRulesCallback, WithStyles, Typography, Tooltip } fro import ChevronRightIcon from '@material-ui/icons/ChevronRight'; import { withStyles } from '@material-ui/core'; import { IllegalNamingWarning } from '../warning/warning'; -import { IconType, LockIcon } from 'components/icon/icon'; +import { IconType, FreezeIcon } from 'components/icon/icon'; import grey from '@material-ui/core/colors/grey'; export interface Breadcrumb { @@ -30,7 +30,8 @@ const styles: StyleRulesCallback = theme => ({ }, icon: { fontSize: 20, - color: grey["600"] + color: grey["600"], + marginRight: '10px' }, }); @@ -65,7 +66,7 @@ export const Breadcrumbs = withStyles(styles)( onContextMenu={event => onContextMenu(event, item)}> { - item.isFrozen ? : null + item.isFrozen ? : null } + + + + +export const UnfreezeIcon = (props: any) => +
+
+ + +
+
; + export const PendingIcon = (props: any) => @@ -155,8 +167,6 @@ export const PaginationLeftArrowIcon: IconType = (props) => ; export const ProcessIcon: IconType = (props) => ; export const ProjectIcon: IconType = (props) => ; -export const LockIcon: IconType = (props) => ; -export const UnlockIcon: IconType = (props) => ; export const FilterGroupIcon: IconType = (props) => ; export const ProjectsIcon: IconType = (props) => ; export const ProvenanceGraphIcon: IconType = (props) => ; diff --git a/src/index.tsx b/src/index.tsx index 066b520c..f0f75210 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -60,7 +60,7 @@ import { groupActionSet } from 'views-components/context-menu/action-sets/group- import { groupMemberActionSet } from 'views-components/context-menu/action-sets/group-member-action-set'; import { linkActionSet } from 'views-components/context-menu/action-sets/link-action-set'; import { loadFileViewersConfig } from 'store/file-viewers/file-viewers-actions'; -import { filterGroupAdminActionSet, projectAdminActionSet } from 'views-components/context-menu/action-sets/project-admin-action-set'; +import { filterGroupAdminActionSet, frozenAdminActionSet, projectAdminActionSet } from 'views-components/context-menu/action-sets/project-admin-action-set'; import { permissionEditActionSet } from 'views-components/context-menu/action-sets/permission-edit-action-set'; import { workflowActionSet } from 'views-components/context-menu/action-sets/workflow-action-set'; import { snackbarActions, SnackbarKind } from "store/snackbar/snackbar-actions"; @@ -101,12 +101,8 @@ addMenuActionSet(ContextMenuKind.GROUP_MEMBER, groupMemberActionSet); addMenuActionSet(ContextMenuKind.COLLECTION_ADMIN, collectionAdminActionSet); addMenuActionSet(ContextMenuKind.PROCESS_ADMIN, processResourceAdminActionSet); addMenuActionSet(ContextMenuKind.PROJECT_ADMIN, projectAdminActionSet); -addMenuActionSet(ContextMenuKind.FROZEN_PROJECT, [ - [ - ...frozenActionSet.reduce((prev, next) => prev.concat(next), []), - ...readOnlyProjectActionSet.reduce((prev, next) => prev.concat(next), []), - ] -]); +addMenuActionSet(ContextMenuKind.FROZEN_PROJECT, frozenActionSet); +addMenuActionSet(ContextMenuKind.FROZEN_PROJECT_ADMIN, frozenAdminActionSet); addMenuActionSet(ContextMenuKind.FILTER_GROUP_ADMIN, filterGroupAdminActionSet); addMenuActionSet(ContextMenuKind.PERMISSION_EDIT, permissionEditActionSet); addMenuActionSet(ContextMenuKind.WORKFLOW, workflowActionSet); diff --git a/src/store/context-menu/context-menu-actions.ts b/src/store/context-menu/context-menu-actions.ts index 3fb4d25d..d098823d 100644 --- a/src/store/context-menu/context-menu-actions.ts +++ b/src/store/context-menu/context-menu-actions.ts @@ -232,8 +232,8 @@ export const resourceUuidToContextMenuKind = (uuid: string, readonly = false) => switch (kind) { case ResourceKind.PROJECT: - if (resource && !!(resource as any).frozenByUuid) { - return ContextMenuKind.FROZEN_PROJECT; + if (isFrozen) { + return isAdminUser ? ContextMenuKind.FROZEN_PROJECT_ADMIN : ContextMenuKind.FROZEN_PROJECT; } return (isAdminUser && !readonly) @@ -254,13 +254,13 @@ export const resourceUuidToContextMenuKind = (uuid: string, readonly = false) => ? ContextMenuKind.OLD_VERSION_COLLECTION : (isTrashed && isEditable) ? ContextMenuKind.TRASHED_COLLECTION - : (isAdminUser && !readonly) + : (isAdminUser && isEditable) ? ContextMenuKind.COLLECTION_ADMIN : isEditable ? ContextMenuKind.COLLECTION : ContextMenuKind.READONLY_COLLECTION; case ResourceKind.PROCESS: - return (isAdminUser && !readonly) + return (isAdminUser && isEditable) ? ContextMenuKind.PROCESS_ADMIN : readonly ? ContextMenuKind.READONLY_PROCESS_RESOURCE diff --git a/src/store/projects/project-lock-actions.ts b/src/store/projects/project-lock-actions.ts index f135522b..f01a6225 100644 --- a/src/store/projects/project-lock-actions.ts +++ b/src/store/projects/project-lock-actions.ts @@ -7,7 +7,7 @@ import { ServiceRepository } from "services/services"; import { projectPanelActions } from "store/project-panel/project-panel-action"; import { RootState } from "store/store"; -export const lockProject = (uuid: string) => +export const freezeProject = (uuid: string) => async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => { const userUUID = getState().auth.user!.uuid; @@ -19,7 +19,7 @@ export const lockProject = (uuid: string) => return updatedProject; }; -export const unlockProject = (uuid: string) => +export const unfreezeProject = (uuid: string) => async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => { const updatedProject = await services.projectService.update(uuid, { diff --git a/src/views-components/context-menu/action-sets/project-action-set.ts b/src/views-components/context-menu/action-sets/project-action-set.ts index 77abb128..e68eda96 100644 --- a/src/views-components/context-menu/action-sets/project-action-set.ts +++ b/src/views-components/context-menu/action-sets/project-action-set.ts @@ -19,116 +19,155 @@ import { toggleDetailsPanel } from 'store/details-panel/details-panel-action'; import { copyToClipboardAction, openInNewTabAction } from "store/open-in-new-tab/open-in-new-tab.actions"; import { openWebDavS3InfoDialog } from "store/collections/collection-info-actions"; import { ToggleLockAction } from "../actions/lock-action"; -import { lockProject, unlockProject } from "store/projects/project-lock-actions"; +import { freezeProject, unfreezeProject } from "store/projects/project-lock-actions"; -export const readOnlyProjectActionSet: ContextMenuActionSet = [[ - { - component: ToggleFavoriteAction, - name: 'ToggleFavoriteAction', - execute: (dispatch, resource) => { - dispatch(toggleFavorite(resource)).then(() => { - dispatch(favoritePanelActions.REQUEST_ITEMS()); - }); - } - }, - { - icon: OpenIcon, - name: "Open in new tab", - execute: (dispatch, resource) => { - dispatch(openInNewTabAction(resource)); - } - }, - { - icon: Link, - name: "Copy to clipboard", - execute: (dispatch, resource) => { - dispatch(copyToClipboardAction(resource)); - } - }, - { - icon: DetailsIcon, - name: "View details", - execute: dispatch => { - dispatch(toggleDetailsPanel()); - } - }, - { - icon: AdvancedIcon, - name: "Advanced", - execute: (dispatch, resource) => { - dispatch(openAdvancedTabDialog(resource.uuid)); - } - }, - { - icon: FolderSharedIcon, - name: "Open with 3rd party client", - execute: (dispatch, resource) => { - dispatch(openWebDavS3InfoDialog(resource.uuid)); +export const toggleFavoriteAction = { + component: ToggleFavoriteAction, + name: 'ToggleFavoriteAction', + execute: (dispatch, resource) => { + dispatch(toggleFavorite(resource)).then(() => { + dispatch(favoritePanelActions.REQUEST_ITEMS()); + }); + } +}; + +export const openInNewTabMenuAction = { + icon: OpenIcon, + name: "Open in new tab", + execute: (dispatch, resource) => { + dispatch(openInNewTabAction(resource)); + } +}; + +export const copyToClipboardMenuAction = { + icon: Link, + name: "Copy to clipboard", + execute: (dispatch, resource) => { + dispatch(copyToClipboardAction(resource)); + } +}; + +export const viewDetailsAction = { + icon: DetailsIcon, + name: "View details", + execute: dispatch => { + dispatch(toggleDetailsPanel()); + } +} + +export const advancedAction = { + icon: AdvancedIcon, + name: "Advanced", + execute: (dispatch, resource) => { + dispatch(openAdvancedTabDialog(resource.uuid)); + } +} + +export const openWith3rdPartyClientAction = { + icon: FolderSharedIcon, + name: "Open with 3rd party client", + execute: (dispatch, resource) => { + dispatch(openWebDavS3InfoDialog(resource.uuid)); + } +} + +export const editProjectAction = { + icon: RenameIcon, + name: "Edit project", + execute: (dispatch, resource) => { + dispatch(openProjectUpdateDialog(resource)); + } +} + +export const shareAction = { + icon: ShareIcon, + name: "Share", + execute: (dispatch, { uuid }) => { + dispatch(openSharingDialog(uuid)); + } +} + +export const moveToAction = { + icon: MoveToIcon, + name: "Move to", + execute: (dispatch, resource) => { + dispatch(openMoveProjectDialog(resource)); + } +} + +export const toggleTrashAction = { + component: ToggleTrashAction, + name: 'ToggleTrashAction', + execute: (dispatch, resource) => { + dispatch(toggleProjectTrashed(resource.uuid, resource.ownerUuid, resource.isTrashed!!)); + } +} + +export const freezeProjectAction = { + component: ToggleLockAction, + name: 'ToggleLockAction', + execute: (dispatch, resource) => { + if (resource.isFrozen) { + dispatch(unfreezeProject(resource.uuid)); + } else { + dispatch(freezeProject(resource.uuid)); } - }, + + } +} + +export const newProjectAction: any = { + icon: NewProjectIcon, + name: "New project", + execute: (dispatch, resource): void => { + dispatch(openProjectCreateDialog(resource.uuid)); + } +} + +export const readOnlyProjectActionSet: ContextMenuActionSet = [[ + toggleFavoriteAction, + openInNewTabMenuAction, + copyToClipboardMenuAction, + viewDetailsAction, + advancedAction, + openWith3rdPartyClientAction, ]]; -export const filterGroupActionSet: ContextMenuActionSet = [ - [ - ...readOnlyProjectActionSet.reduce((prev, next) => prev.concat(next), []), - { - icon: RenameIcon, - name: "Edit project", - execute: (dispatch, resource) => { - dispatch(openProjectUpdateDialog(resource)); - } - }, - { - icon: ShareIcon, - name: "Share", - execute: (dispatch, { uuid }) => { - dispatch(openSharingDialog(uuid)); - } - }, - { - icon: MoveToIcon, - name: "Move to", - execute: (dispatch, resource) => { - dispatch(openMoveProjectDialog(resource)); - } - }, - { - component: ToggleTrashAction, - name: 'ToggleTrashAction', - execute: (dispatch, resource) => { - dispatch(toggleProjectTrashed(resource.uuid, resource.ownerUuid, resource.isTrashed!!)); - } - }, - ] -]; - -export const frozenActionSet: ContextMenuActionSet = [ - [ - { - component: ToggleLockAction, - name: 'ToggleLockAction', - execute: (dispatch, resource) => { - if (resource.isFrozen) { - dispatch(unlockProject(resource.uuid)); - } else { - dispatch(lockProject(resource.uuid)); - } - - } - } - ] -]; - -export const projectActionSet: ContextMenuActionSet = [ - [ - ...filterGroupActionSet.reduce((prev, next) => prev.concat(next), []), - { - icon: NewProjectIcon, - name: "New project", - execute: (dispatch, resource) => { - dispatch(openProjectCreateDialog(resource.uuid)); - } - }, - ...frozenActionSet.reduce((prev, next) => prev.concat(next), []), - ] -]; +export const filterGroupActionSet: ContextMenuActionSet = [[ + toggleFavoriteAction, + openInNewTabMenuAction, + copyToClipboardMenuAction, + viewDetailsAction, + advancedAction, + openWith3rdPartyClientAction, + editProjectAction, + shareAction, + moveToAction, + toggleTrashAction, +]]; + +export const frozenActionSet: ContextMenuActionSet = [[ + shareAction, + toggleFavoriteAction, + openInNewTabMenuAction, + copyToClipboardMenuAction, + viewDetailsAction, + advancedAction, + openWith3rdPartyClientAction, + freezeProjectAction +]]; + +export const projectActionSet: ContextMenuActionSet = [[ + toggleFavoriteAction, + openInNewTabMenuAction, + copyToClipboardMenuAction, + viewDetailsAction, + advancedAction, + openWith3rdPartyClientAction, + editProjectAction, + shareAction, + moveToAction, + toggleTrashAction, + newProjectAction, + freezeProjectAction, +]]; diff --git a/src/views-components/context-menu/action-sets/project-admin-action-set.ts b/src/views-components/context-menu/action-sets/project-admin-action-set.ts index ebf827aa..3faf675d 100644 --- a/src/views-components/context-menu/action-sets/project-admin-action-set.ts +++ b/src/views-components/context-menu/action-sets/project-admin-action-set.ts @@ -7,30 +7,56 @@ import { TogglePublicFavoriteAction } from "views-components/context-menu/action import { togglePublicFavorite } from "store/public-favorites/public-favorites-actions"; import { publicFavoritePanelActions } from "store/public-favorites-panel/public-favorites-action"; -import { projectActionSet, filterGroupActionSet } from "views-components/context-menu/action-sets/project-action-set"; +import { shareAction, toggleFavoriteAction, openInNewTabMenuAction, copyToClipboardMenuAction, viewDetailsAction, advancedAction, openWith3rdPartyClientAction, freezeProjectAction, editProjectAction, moveToAction, toggleTrashAction, newProjectAction } from "views-components/context-menu/action-sets/project-action-set"; + +export const togglePublicFavoriteAction = { + component: TogglePublicFavoriteAction, + name: 'TogglePublicFavoriteAction', + execute: (dispatch, resource) => { + dispatch(togglePublicFavorite(resource)).then(() => { + dispatch(publicFavoritePanelActions.REQUEST_ITEMS()); + }); +}} export const projectAdminActionSet: ContextMenuActionSet = [[ - ...projectActionSet.reduce((prev, next) => prev.concat(next), []), - { - component: TogglePublicFavoriteAction, - name: 'TogglePublicFavoriteAction', - execute: (dispatch, resource) => { - dispatch(togglePublicFavorite(resource)).then(() => { - dispatch(publicFavoritePanelActions.REQUEST_ITEMS()); - }); - } - } + toggleFavoriteAction, + openInNewTabMenuAction, + copyToClipboardMenuAction, + viewDetailsAction, + advancedAction, + openWith3rdPartyClientAction, + editProjectAction, + shareAction, + moveToAction, + toggleTrashAction, + newProjectAction, + freezeProjectAction, + togglePublicFavoriteAction ]]; export const filterGroupAdminActionSet: ContextMenuActionSet = [[ - ...filterGroupActionSet.reduce((prev, next) => prev.concat(next), []), - { - component: TogglePublicFavoriteAction, - name: 'TogglePublicFavoriteAction', - execute: (dispatch, resource) => { - dispatch(togglePublicFavorite(resource)).then(() => { - dispatch(publicFavoritePanelActions.REQUEST_ITEMS()); - }); - } - } + toggleFavoriteAction, + openInNewTabMenuAction, + copyToClipboardMenuAction, + viewDetailsAction, + advancedAction, + openWith3rdPartyClientAction, + editProjectAction, + shareAction, + moveToAction, + toggleTrashAction, + togglePublicFavoriteAction +]]; + + +export const frozenAdminActionSet: ContextMenuActionSet = [[ + shareAction, + togglePublicFavoriteAction, + toggleFavoriteAction, + openInNewTabMenuAction, + copyToClipboardMenuAction, + viewDetailsAction, + advancedAction, + openWith3rdPartyClientAction, + freezeProjectAction ]]; diff --git a/src/views-components/context-menu/actions/lock-action.tsx b/src/views-components/context-menu/actions/lock-action.tsx index 785de583..8d141e96 100644 --- a/src/views-components/context-menu/actions/lock-action.tsx +++ b/src/views-components/context-menu/actions/lock-action.tsx @@ -4,7 +4,7 @@ import React from "react"; import { ListItemIcon, ListItemText, ListItem } from "@material-ui/core"; -import { LockIcon, UnlockIcon } from "components/icon/icon"; +import { FreezeIcon, UnfreezeIcon } from "components/icon/icon"; import { connect } from "react-redux"; import { RootState } from "store/store"; import { ProjectResource } from "models/project"; @@ -25,8 +25,8 @@ export const ToggleLockAction = withRouter(connect(mapStateToProps)((props: { st onClick={props.onClick} > {props.isLocked - ? - : } + ? + : } {props.isLocked diff --git a/src/views-components/context-menu/context-menu.tsx b/src/views-components/context-menu/context-menu.tsx index b66a9a84..f89a1780 100644 --- a/src/views-components/context-menu/context-menu.tsx +++ b/src/views-components/context-menu/context-menu.tsx @@ -80,6 +80,7 @@ export enum ContextMenuKind { FILTER_GROUP = "FilterGroup", READONLY_PROJECT = 'ReadOnlyProject', FROZEN_PROJECT = 'FrozenProject', + FROZEN_PROJECT_ADMIN = 'FrozenProjectAdmin', PROJECT_ADMIN = "ProjectAdmin", FILTER_GROUP_ADMIN = "FilterGroupAdmin", RESOURCE = "Resource", diff --git a/src/views-components/data-explorer/renderers.tsx b/src/views-components/data-explorer/renderers.tsx index c955ebec..e0916066 100644 --- a/src/views-components/data-explorer/renderers.tsx +++ b/src/views-components/data-explorer/renderers.tsx @@ -15,7 +15,7 @@ import { import { FavoriteStar, PublicFavoriteStar } from '../favorite-star/favorite-star'; import { Resource, ResourceKind, TrashableResource } from 'models/resource'; import { - LockIcon, + FreezeIcon, ProjectIcon, FilterGroupIcon, CollectionIcon, @@ -100,7 +100,7 @@ const FrozenProject = (props: {item: ProjectResource}) => { if (props.item.frozenByUuid) { return Project was frozen by {fullUsername}}> - + ; } else { return null;