[arvados] updated: 2.7.0-6273-g79d2927c49
git repository hosting
git at public.arvados.org
Fri Mar 29 18:44:29 UTC 2024
Summary of changes:
services/workbench2/src/components/icon/icon.tsx | 7 +++++
.../multiselect-toolbar/MultiselectToolbar.tsx | 6 ++--
.../context-menu/actions/context-menu-divider.tsx | 32 ++++++++++++++++------
.../views-components/context-menu/context-menu.tsx | 4 +--
.../context-menu/menu-item-sort.ts | 12 ++++++--
5 files changed, 44 insertions(+), 17 deletions(-)
via 79d2927c497c924e9b15545d44b860627e8f8a7c (commit)
from e9856c5b1fc9162ce1f105fee49e2a80d69dd397 (commit)
Those revisions listed above that are new to this repository have
not appeared on any other notification email; so we list those
revisions in full, below.
commit 79d2927c497c924e9b15545d44b860627e8f8a7c
Author: Lisa Knox <lisaknox83 at gmail.com>
Date: Fri Mar 29 14:44:24 2024 -0400
21448: divider in place for toolbar menu Arvados-DCO-1.1-Signed-off-by: Lisa Knox <lisa.knox at curii.com>
diff --git a/services/workbench2/src/components/icon/icon.tsx b/services/workbench2/src/components/icon/icon.tsx
index 1ba88d25b2..08c2e8f454 100644
--- a/services/workbench2/src/components/icon/icon.tsx
+++ b/services/workbench2/src/components/icon/icon.tsx
@@ -179,6 +179,13 @@ export const DoubleRightArrows: IconType = (props: any) => (
</SvgIcon>
)
+//https://pictogrammers.com/library/memory/icon/box-light-vertical/
+export const VerticalLineDivider: IconType = (props: any) => (
+ <SvgIcon {...props}>
+ <path d="M12 0V22H10V0H12Z" />
+ </SvgIcon>
+)
+
export type IconType = React.SFC<{ className?: string; style?: object }>;
export const AddIcon: IconType = props => <Add {...props} />;
diff --git a/services/workbench2/src/components/multiselect-toolbar/MultiselectToolbar.tsx b/services/workbench2/src/components/multiselect-toolbar/MultiselectToolbar.tsx
index ec3db484b4..f9ac243f0d 100644
--- a/services/workbench2/src/components/multiselect-toolbar/MultiselectToolbar.tsx
+++ b/services/workbench2/src/components/multiselect-toolbar/MultiselectToolbar.tsx
@@ -34,7 +34,7 @@ import { Process } from "store/processes/process";
import { PublicFavoritesState } from "store/public-favorites/public-favorites-reducer";
import { isExactlyOneSelected } from "store/multiselect/multiselect-actions";
import { IntersectionObserverWrapper } from "./ms-toolbar-overflow-wrapper";
-import { ContextMenuKind, sortMenuItems } from 'views-components/context-menu/menu-item-sort';
+import { ContextMenuKind, sortMenuItems, menuDirection } from 'views-components/context-menu/menu-item-sort';
import { sortByProperty } from "common/array-utils";
const WIDTH_TRANSITION = 150
@@ -119,8 +119,8 @@ export const MultiselectToolbar = connect(
singleSelectedUuid === null ? action.isForMulti : true
);
- const actions =
- singleResourceKind && singleResourceKind.length ? sortMenuItems(singleResourceKind[0] as ContextMenuKind, rawActions) : rawActions.sort(sortByProperty('name'));
+ const actions: ContextMenuAction[] | MultiSelectMenuAction[] =
+ singleResourceKind && singleResourceKind.length ? sortMenuItems(singleResourceKind[0] as ContextMenuKind, rawActions, menuDirection.HORIZONTAL) : rawActions.sort(sortByProperty('name'));
return (
<React.Fragment>
diff --git a/services/workbench2/src/views-components/context-menu/actions/context-menu-divider.tsx b/services/workbench2/src/views-components/context-menu/actions/context-menu-divider.tsx
index 439f594779..e5c2b35392 100644
--- a/services/workbench2/src/views-components/context-menu/actions/context-menu-divider.tsx
+++ b/services/workbench2/src/views-components/context-menu/actions/context-menu-divider.tsx
@@ -6,25 +6,39 @@ import React from 'react';
import { ContextMenuAction } from '../context-menu-action-set';
import { Divider as DividerComponent, StyleRulesCallback, withStyles } from '@material-ui/core';
import { WithStyles } from '@material-ui/core/styles';
+import { VerticalLineDivider } from 'components/icon/icon';
-type CssRules = 'root';
+type CssRules = 'horizontal' | 'vertical';
const styles:StyleRulesCallback<CssRules> = () => ({
- root: {
+ horizontal: {
backgroundColor: 'black',
},
+ vertical: {
+ backgroundColor: 'black',
+ transform: 'rotate(90deg)',
+ },
});
-type DividerProps = {
- orthogonality: 'vertical' | 'horizontal';
-};
+export const VerticalLine = withStyles(styles)((props: WithStyles<CssRules>) => {
+ return <DividerComponent variant='middle' className={props.classes.vertical}/>;
+});
-export const Divider = withStyles(styles)((props: DividerProps & WithStyles<CssRules>) => {
- return <DividerComponent variant='middle' className={props.classes.root} />;
+export const HorizontalLine = withStyles(styles)((props: WithStyles<CssRules>) => {
+ return <DividerComponent variant='middle' className={props.classes.horizontal} />;
});
-export const menuDivider: ContextMenuAction = {
+//msToolbar only renders icon and not component
+export const horizontalMenuDivider: ContextMenuAction = {
+ name: 'divider',
+ icon: VerticalLineDivider,
+ component: VerticalLine,
+ execute: () => null,
+};
+
+export const verticalMenuDivider: ContextMenuAction = {
name: 'divider',
- component: Divider,
+ icon: () => null,
+ component: HorizontalLine,
execute: () => null,
};
\ No newline at end of file
diff --git a/services/workbench2/src/views-components/context-menu/context-menu.tsx b/services/workbench2/src/views-components/context-menu/context-menu.tsx
index 89b75bbc4f..a173399b7b 100644
--- a/services/workbench2/src/views-components/context-menu/context-menu.tsx
+++ b/services/workbench2/src/views-components/context-menu/context-menu.tsx
@@ -10,7 +10,7 @@ import { createAnchorAt } from "components/popover/helpers";
import { ContextMenuActionSet, ContextMenuAction } from "./context-menu-action-set";
import { Dispatch } from "redux";
import { memoize } from "lodash";
-import { sortMenuItems, ContextMenuKind } from "./menu-item-sort";
+import { sortMenuItems, ContextMenuKind, menuDirection } from "./menu-item-sort";
type DataProps = Pick<ContextMenuProps, "anchorEl" | "items" | "open"> & { resource?: ContextMenuResource };
@@ -66,7 +66,7 @@ export const ContextMenu = connect(mapStateToProps, mapDispatchToProps, mergePro
const menuActionSets = new Map<string, ContextMenuActionSet>();
export const addMenuActionSet = (name: ContextMenuKind, itemSet: ContextMenuActionSet) => {
- const sorted = itemSet.map(items => sortMenuItems(name, items));
+ const sorted = itemSet.map(items => sortMenuItems(name, items, menuDirection.VERTICAL));
menuActionSets.set(name, sorted);
};
diff --git a/services/workbench2/src/views-components/context-menu/menu-item-sort.ts b/services/workbench2/src/views-components/context-menu/menu-item-sort.ts
index 972f83bc0b..b178edfe10 100644
--- a/services/workbench2/src/views-components/context-menu/menu-item-sort.ts
+++ b/services/workbench2/src/views-components/context-menu/menu-item-sort.ts
@@ -5,7 +5,7 @@
import { ContextMenuAction } from './context-menu-action-set';
import { ContextMenuActionNames } from 'views-components/context-menu/context-menu-action-set';
import { sortByProperty } from 'common/array-utils';
-import { menuDivider } from './actions/context-menu-divider';
+import { horizontalMenuDivider, verticalMenuDivider } from './actions/context-menu-divider';
export enum ContextMenuKind {
API_CLIENT_AUTHORIZATION = "ApiClientAuthorization",
@@ -67,6 +67,7 @@ const processOrder = [
ContextMenuActionNames.COPY_AND_RERUN_PROCESS,
ContextMenuActionNames.MOVE_TO,
ContextMenuActionNames.REMOVE,
+ ContextMenuActionNames.DIVIDER,
ContextMenuActionNames.ADD_TO_FAVORITES,
ContextMenuActionNames.ADD_TO_PUBLIC_FAVORITES,
];
@@ -138,7 +139,12 @@ const kindToOrder: Record<string, ContextMenuActionNames[]> = {
[ContextMenuKind.READONLY_WORKFLOW]: workflowOrder,
};
-export const sortMenuItems = (menuKind: ContextMenuKind, menuItems: ContextMenuAction[]) => {
+export const menuDirection = {
+ VERTICAL: 'vertical',
+ HORIZONTAL: 'horizontal'
+}
+
+export const sortMenuItems = (menuKind: ContextMenuKind, menuItems: ContextMenuAction[], orthagonality: string) => {
const preferredOrder = kindToOrder[menuKind];
//if no specified order, sort by name
@@ -153,7 +159,7 @@ export const sortMenuItems = (menuKind: ContextMenuKind, menuItems: ContextMenuA
preferredOrder.forEach((name) => {
if (name === ContextMenuActionNames.DIVIDER) {
count++;
- bucketMap.set(`${name}-${count}`, menuDivider)
+ bucketMap.set(`${name}-${count}`, orthagonality === menuDirection.VERTICAL ? verticalMenuDivider : horizontalMenuDivider)
} else {
bucketMap.set(name, null)
}
-----------------------------------------------------------------------
hooks/post-receive
--
More information about the arvados-commits
mailing list