Merge pull request #147 from alwayslove2013/disabledTooltip

No tooltip on disabled item #131

client/src/components/grid/ToolBar.tsx

@@ -69,6 +69,8 @@ const CustomToolBar: FC<ToolBarType> = props => {
 
             const Icon = c.icon ? Icons[c.icon!]() : '';
             const disabled = c.disabled ? c.disabled(selected) : false;
+            // when disabled "disabledTooltip" will replace "tooltip"
+            const tooltip = disabled && c.disabledTooltip ? c.disabledTooltip : c.tooltip;
             const isIcon = c.type === 'iconBtn';
 
             const btn = (
@@ -81,7 +83,7 @@ const CustomToolBar: FC<ToolBarType> = props => {
                 disabled={disabled}
                 // use contained variant as default
                 variant={c.btnVariant || 'contained'}
-                tooltip={c.tooltip}
+                tooltip={tooltip}
                 className={classes.btn}
               >
                 <Typography variant="button">{c.label}</Typography>
@@ -92,7 +94,7 @@ const CustomToolBar: FC<ToolBarType> = props => {
               <CustomIconButton
                 key={i}
                 onClick={c.onClick}
-                tooltip={c.tooltip}
+                tooltip={tooltip}
                 disabled={disabled}
               >
                 {Icon}

client/src/components/grid/Types.ts

@@ -36,6 +36,8 @@ export type ToolBarConfig = Partial<TableSwitchType> &
     onClick?: (arg0: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
     disabled?: (data: any[]) => boolean;
     tooltip?: string;
+    // when disabled "disabledTooltip" will replace "tooltip"
+    disabledTooltip?: string;
     hidden?: boolean;
     type?: 'iconBtn' | 'buttton' | 'switch' | 'select' | 'groupSelect';
     position?: 'right' | 'left';

client/src/i18n/cn/collection.ts

@@ -7,6 +7,7 @@ const collectionTrans = {
 
   create: 'Create Collection',
   delete: 'delete',
+  deleteTooltip: 'Please select at least one item to delete.',
 
   collection: 'Collection',
 

client/src/i18n/en/collection.ts

@@ -7,6 +7,7 @@ const collectionTrans = {
 
   create: 'Create Collection',
   delete: 'delete',
+  deleteTooltip: 'Please select at least one item to delete.',
 
   collection: 'Collection',
 

client/src/pages/collections/Collections.tsx

@@ -308,6 +308,8 @@ const Collections = () => {
       },
       label: collectionTrans('delete'),
       icon: 'delete',
+      // tooltip: collectionTrans('deleteTooltip'),
+      disabledTooltip: collectionTrans('deleteTooltip'),
       disabled: data => data.length === 0,
     },
     {