X-Git-Url: https://git.arvados.org/arvados-workbench2.git/blobdiff_plain/d1b1dea7d72c0654dcbd50a70100d364e44ffbf5..bead3b2896eaaceb9b9a3c805d40e8048c93b218:/src/components/multiselect-toolbar/MultiselectToolbar.tsx diff --git a/src/components/multiselect-toolbar/MultiselectToolbar.tsx b/src/components/multiselect-toolbar/MultiselectToolbar.tsx index 81127465..72d375ff 100644 --- a/src/components/multiselect-toolbar/MultiselectToolbar.tsx +++ b/src/components/multiselect-toolbar/MultiselectToolbar.tsx @@ -20,6 +20,7 @@ import { kindToActionSet, findActionByName } from "./ms-kind-action-differentiat import { msToggleTrashAction } from "views-components/multiselect-toolbar/ms-project-action-set"; import { copyToClipboardAction } from "store/open-in-new-tab/open-in-new-tab.actions"; import { ContainerRequestResource } from "models/container-request"; +import { FavoritesState } from "store/favorites/favorites-reducer"; type CssRules = "root" | "button"; @@ -30,7 +31,7 @@ const styles: StyleRulesCallback = (theme: ArvadosTheme) => ({ width: 0, padding: 0, margin: "1rem auto auto 0.5rem", - overflow: "hidden", + overflowY: 'scroll', transition: "width 150ms", }, button: { @@ -42,25 +43,30 @@ const styles: StyleRulesCallback = (theme: ArvadosTheme) => ({ export type MultiselectToolbarProps = { checkedList: TCheckedList; selectedUuid: string | null - resources: ResourcesState; + iconProps: IconProps executeMulti: (action: ContextMenuAction, checkedList: TCheckedList, resources: ResourcesState) => void; - favorites: any }; +type IconProps = { + resources: ResourcesState; + favorites: FavoritesState +} + export const MultiselectToolbar = connect( mapStateToProps, mapDispatchToProps )( withStyles(styles)((props: MultiselectToolbarProps & WithStyles) => { - const { classes, checkedList, resources, selectedUuid, favorites } = props; + const { classes, checkedList, selectedUuid: singleSelectedUuid, iconProps } = props; const currentResourceKinds = Array.from(selectedToKindSet(checkedList)); const currentPathIsTrash = window.location.pathname === "/trash"; const actions = - currentPathIsTrash && selectedToKindSet(checkedList).size - ? [msToggleTrashAction] - : selectActionsByKind(currentResourceKinds, multiselectActionsFilters); + currentPathIsTrash && selectedToKindSet(checkedList).size + ? [msToggleTrashAction] + : selectActionsByKind(currentResourceKinds, multiselectActionsFilters) + .filter((action) => (singleSelectedUuid === null ? action.isForMulti : true)); return ( @@ -70,15 +76,15 @@ export const MultiselectToolbar = connect( > {actions.length ? ( actions.map((action, i) => - action.isDefault ? ( + action.hasAlts ? ( - props.executeMulti(action, checkedList, resources)}> - {action.isDefault(selectedUuid, resources, favorites) ? action.icon && action.icon({}) : action.altIcon && action.altIcon({})} + props.executeMulti(action, checkedList, iconProps.resources)}> + {currentPathIsTrash || action.useAlts(singleSelectedUuid, iconProps) ? action.altIcon && action.altIcon({}) : action.icon({})} ) : ( @@ -88,7 +94,7 @@ export const MultiselectToolbar = connect( key={i} disableFocusListener > - props.executeMulti(action, checkedList, resources)}>{action.icon ? action.icon({}) : <>} + props.executeMulti(action, checkedList, iconProps.resources)}>{action.icon({})} ) ) @@ -178,7 +184,7 @@ function selectActionsByKind(currentResourceKinds: Array, filterSet: TMu }); } -const isExactlyOneSelected = (checkedList: TCheckedList) => { +export const isExactlyOneSelected = (checkedList: TCheckedList) => { let tally = 0; let current = ''; for (const uuid in checkedList) { @@ -192,13 +198,15 @@ const isExactlyOneSelected = (checkedList: TCheckedList) => { //--------------------------------------------------// -function mapStateToProps(state: RootState) { +function mapStateToProps({multiselect, resources, favorites}: RootState) { return { - checkedList: state.multiselect.checkedList as TCheckedList, - selectedUuid: isExactlyOneSelected(state.multiselect.checkedList), - resources: state.resources, - favorites: state.favorites - }; + checkedList: multiselect.checkedList as TCheckedList, + selectedUuid: isExactlyOneSelected(multiselect.checkedList), + iconProps: { + resources, + favorites + } + } } function mapDispatchToProps(dispatch: Dispatch) {