services/workbench2/src/views-components/context-menu/actions/context-menu-divider.tsx

   1 // Copyright (C) The Arvados Authors. All rights reserved.
   2 //
   3 // SPDX-License-Identifier: AGPL-3.0
   4
   5 import React from 'react';
   6 import { ContextMenuAction } from '../context-menu-action-set';
   7 import { CustomStyleRulesCallback } from 'common/custom-theme';
   8 import { Divider as DividerComponent } from '@mui/material';
   9 import withStyles from '@mui/styles/withStyles';
  10 import { WithStyles } from '@mui/styles';
  11 import { ArvadosTheme } from 'common/custom-theme';
  12 import { VerticalLineDivider } from 'components/icon/icon';
  13
  14 type CssRules = 'horizontal' | 'vertical';
  15
  16 const styles:CustomStyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
  17   horizontal: {
  18       backgroundColor: 'black',
  19   },
  20   vertical: {
  21     color: theme.palette.grey["400"],
  22     margin: 'auto 0',
  23     transform: 'scaleY(1.25)',
  24   },
  25 });
  26
  27 export const VerticalLine = withStyles(styles)((props: WithStyles<CssRules>) => {
  28   return  <VerticalLineDivider className={props.classes.vertical} />;
  29 });
  30
  31 export const HorizontalLine = withStyles(styles)((props: WithStyles<CssRules>) => {
  32   return  <DividerComponent variant='middle' className={props.classes.horizontal} />;
  33 });
  34
  35 export const horizontalMenuDivider: ContextMenuAction = {
  36   name: 'Divider',
  37   icon: () => null,
  38   component: VerticalLine,
  39   execute: () => null,
  40 };
  41
  42 export const verticalMenuDivider: ContextMenuAction = {
  43   name: 'Divider',
  44   icon: () => null,
  45   component: HorizontalLine,
  46   execute: () => null,
  47 };