From 8636dee105a2da4450c41fc8d02ae97f2fc0c035 Mon Sep 17 00:00:00 2001
From: Sepehr Sanaei <46657145+sepehr2github@users.noreply.github.com>
Date: Wed, 23 Aug 2023 14:21:01 +0330
Subject: [PATCH] Changed `VoterListItem` onClick action to open etherscan
 (#21)

---
 CHANGELOG.md                                 | 4 ++++
 src/components/listItem/voter.tsx            | 2 +-
 src/components/table/votersTable.stories.tsx | 1 +
 src/components/table/votersTable.tsx         | 6 +++++-
 4 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 08382aff9..0612ba550 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+### Changed
+
+-   `VoterListItem` onClick action to open etherscan
+
 ## [0.2.11] - 2023-08-23
 
 ### Fixed
diff --git a/src/components/listItem/voter.tsx b/src/components/listItem/voter.tsx
index dc14af302..1e48c55ad 100644
--- a/src/components/listItem/voter.tsx
+++ b/src/components/listItem/voter.tsx
@@ -28,7 +28,7 @@ export type ListItemVoterProps = ButtonHTMLAttributes<HTMLButtonElement> & {
     walletTag?: TagProps;
     voteReplaced?: boolean;
     voteReplacedLabel?: string;
-    onClick: () => null;
+    onClick: () => void;
 };
 
 const colorScheme = (option: string) =>
diff --git a/src/components/table/votersTable.stories.tsx b/src/components/table/votersTable.stories.tsx
index 84355c317..6db506d3d 100644
--- a/src/components/table/votersTable.stories.tsx
+++ b/src/components/table/votersTable.stories.tsx
@@ -41,4 +41,5 @@ Default.args = {
     onLoadMore: () => alert('load more clicked'),
     showOption: true,
     showAmount: true,
+    explorerURL: 'https://etherscan.io/',
 };
diff --git a/src/components/table/votersTable.tsx b/src/components/table/votersTable.tsx
index 147d3299b..6b916116e 100644
--- a/src/components/table/votersTable.tsx
+++ b/src/components/table/votersTable.tsx
@@ -24,6 +24,7 @@ export type VotersTableProps = {
     showOption?: boolean;
     showAmount?: boolean;
     pageSize?: number; // number of rows to show
+    explorerURL: string;
 };
 
 const colorScheme = (option: VoterType['walletTag']) => (option === 'You' ? 'neutral' : 'info');
@@ -35,6 +36,7 @@ export const VotersTable: React.FC<VotersTableProps> = ({
     page = 1,
     showAmount = false,
     pageSize = 3,
+    explorerURL,
 }) => {
     const displayedVoters = page * pageSize;
 
@@ -46,7 +48,9 @@ export const VotersTable: React.FC<VotersTableProps> = ({
                     label={shortenAddress(voter.wallet)}
                     src={voter.src}
                     option={voter.option}
-                    onClick={() => null}
+                    onClick={() => {
+                        window.open(`${explorerURL}address/${voter.wallet}`, '_blank');
+                    }}
                     voteReplaced={voter.voteReplaced}
                     {...(voter.walletTag && {
                         walletTag: {