From d57908ead8060059077bcbf9dcca592451ee9500 Mon Sep 17 00:00:00 2001
From: Jaco Greeff <jacogr@gmail.com>
Date: Wed, 22 Apr 2020 22:07:24 +0200
Subject: [PATCH] Remove staking badge tooltips (#2603)

---
 .../page-staking/src/Overview/Address/Status.tsx | 16 +---------------
 packages/react-components/src/Badge.tsx          |  5 ++++-
 2 files changed, 5 insertions(+), 16 deletions(-)

diff --git a/packages/page-staking/src/Overview/Address/Status.tsx b/packages/page-staking/src/Overview/Address/Status.tsx
index 751b99d514..00797d4029 100644
--- a/packages/page-staking/src/Overview/Address/Status.tsx
+++ b/packages/page-staking/src/Overview/Address/Status.tsx
@@ -4,9 +4,6 @@
 
 import React from 'react';
 import { Badge, Icon } from '@polkadot/react-components';
-import { formatNumber } from '@polkadot/util';
-
-import { useTranslation } from '../../translate';
 
 interface Props {
   isElected: boolean;
@@ -15,30 +12,19 @@ interface Props {
 }
 
 function Status ({ isElected, onlineCount, onlineMessage }: Props): React.ReactElement<Props> {
-  const { t } = useTranslation();
-
   return (
     <td className='together'>
       {isElected && (
         <Badge
-          hover={t('Selected for the next session')}
           info={<Icon name='chevron right' />}
           isInline
-          isTooltip
           type='next'
         />
       )}
       {(!!onlineCount || onlineMessage) && (
         <Badge
-          hover={t('Active with {{blocks}} blocks authored{{hasMessage}} heartbeat message', {
-            replace: {
-              blocks: formatNumber(onlineCount || 0),
-              hasMessage: onlineMessage ? ' and a' : ', no'
-            }
-          })}
-          info={<Icon name='check' />}
+          info={onlineCount || <Icon name='envelope' />}
           isInline
-          isTooltip
           type='online'
         />
       )}
diff --git a/packages/react-components/src/Badge.tsx b/packages/react-components/src/Badge.tsx
index 36df35c8c2..1cdd3f0d9d 100644
--- a/packages/react-components/src/Badge.tsx
+++ b/packages/react-components/src/Badge.tsx
@@ -52,7 +52,6 @@ export default React.memo(styled(Badge)`
   border-radius: 16px;
   box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
   color: #eee;
-  cursor: help;
   font-size: 12px;
   height: 22px;
   padding: 0 4px;
@@ -60,6 +59,10 @@ export default React.memo(styled(Badge)`
   width: 22px;
   min-width: 22px;
 
+  &.isTooltip {
+    cursor: help;
+  }
+
   i.icon {
     cursor: inherit !important;
     margin: 0;