From a08cc3eda8b0dd48f3d76f50a413bbd720badf0c Mon Sep 17 00:00:00 2001
From: Jaco <jacogr@gmail.com>
Date: Sat, 23 Oct 2021 15:33:52 +0200
Subject: [PATCH] Turn staking query into link (#6383)

---
 .../src/Overview/Address/index.tsx            | 19 +++++++++----------
 1 file changed, 9 insertions(+), 10 deletions(-)

diff --git a/packages/page-staking/src/Overview/Address/index.tsx b/packages/page-staking/src/Overview/Address/index.tsx
index 19a1a11cf4..0afedfeed6 100644
--- a/packages/page-staking/src/Overview/Address/index.tsx
+++ b/packages/page-staking/src/Overview/Address/index.tsx
@@ -8,7 +8,7 @@ import type { SlashingSpans, ValidatorPrefs } from '@polkadot/types/interfaces';
 import type { NominatedBy as NominatedByType, ValidatorInfo } from '../../types';
 import type { NominatorValue } from './types';
 
-import React, { useCallback, useMemo } from 'react';
+import React, { useMemo } from 'react';
 
 import { ApiPromise } from '@polkadot/api';
 import { AddressSmall, Icon, LinkExternal } from '@polkadot/react-components';
@@ -100,10 +100,8 @@ function Address ({ address, className = '', filterName, hasQueries, isElected,
     [api, accountInfo, address, filterName, withIdentity]
   );
 
-  const _onQueryStats = useCallback(
-    (): void => {
-      window.location.hash = `/staking/query/${address}`;
-    },
+  const statsLink = useMemo(
+    () => `#/staking/query/${address}`,
     [address]
   );
 
@@ -168,11 +166,12 @@ function Address ({ address, className = '', filterName, hasQueries, isElected,
       )}
       <td>
         {hasQueries && (
-          <Icon
-            className='highlight--color'
-            icon='chart-line'
-            onClick={_onQueryStats}
-          />
+          <a href={statsLink}>
+            <Icon
+              className='highlight--color'
+              icon='chart-line'
+            />
+          </a>
         )}
       </td>
       <td className='links media--1200'>