Merge pull request #242 from shrutipanjwani/fix-issue-62

Fixed issue #62 - Make bounty addresses clickable
picsoritdidnthappen · Jul 16, 2024 · ee07864 · ee07864
2 parents 8ce3162 + 958121a
commit ee07864
Show file tree

Hide file tree

Showing 3 changed files with 38 additions and 5 deletions.
diff --git a/src/components/bounty/BountyInfo.tsx b/src/components/bounty/BountyInfo.tsx
@@ -11,6 +11,7 @@ import CreateProof from '@/components/ui/CreateProof';
 
 import { cancelOpenBounty, cancelSoloBounty } from '@/app/context/web3';
 import { blacklistedBounties } from '@/constant/blacklist';
+import Link from 'next/link';
 //
 function weiToEther(weiValue: string | number | bigint): string {
   const etherValue = Number(weiValue) / 1e18;
@@ -114,7 +115,13 @@ const BountyInfo = ({ bountyId }: { bountyId: string }) => {
           </p>
           <p className='mt-5 normal-case break-all'>
             bounty issuer:{' '}
-            {bountyData?.issuerDegenOrEnsName || bountyData?.issuer}
+            <Link
+              href={`/${currentNetworkName}/account/${bountyData?.issuer}`}
+              className='hover:text-gray-200'
+            >
+              {' '}
+              {bountyData?.issuerDegenOrEnsName || bountyData?.issuer}
+            </Link>
           </p>
         </div>
 

diff --git a/src/components/bounty/ProofItem.tsx b/src/components/bounty/ProofItem.tsx
@@ -9,6 +9,8 @@ import { useBountyContext } from '@/components/bounty/BountyProvider';
 
 import { acceptClaim, getURI, submitClaimForVote } from '@/app/context/web3';
 import { applyBreakAllToLongWords } from '@/lib/uiHelpers';
+import Link from 'next/link';
+import { usePathname } from 'next/navigation';
 
 interface ProofItemProps {
   id: string;
@@ -35,6 +37,9 @@ const ProofItem: React.FC<ProofItemProps> = ({
   const { user, primaryWallet } = useDynamicContext();
   const [claimsURI, setClaimsURI] = useState('');
   const [imageUrl, setImageUrl] = useState<string | null>(null);
+
+  const path = usePathname();
+  const [currentNetworkName, setCurrentNetworkName] = useState('');
   const {
     isMultiplayer,
     isOwner,
@@ -44,6 +49,11 @@ const ProofItem: React.FC<ProofItemProps> = ({
   } = useBountyContext()!;
   const issuerDegenOrEnsName = useDegenOrEnsName(issuer);
 
+  useEffect(() => {
+    const currentUrl = path.split('/')[1];
+    setCurrentNetworkName(currentUrl || 'base');
+  }, []);
+
   useEffect(() => {
     if (id) {
       getURI(id)
@@ -160,8 +170,13 @@ const ProofItem: React.FC<ProofItemProps> = ({
         <div className='mt-2 py-2 flex flex-row justify-between text-sm border-t border-dashed'>
           <span className=''>issuer</span>
           <span className='flex flex-row'>
-            {issuerDegenOrEnsName ||
-              `$` + issuer.slice(0, 5) + '...' + issuer.slice(-6)}
+            <Link
+              href={`/${currentNetworkName}/account/${issuer}`}
+              className='hover:text-gray-200'
+            >
+              {issuerDegenOrEnsName ||
+                `$` + issuer.slice(0, 5) + '...' + issuer.slice(-6)}
+            </Link>
             <span className='ml-1'>
               <button onClick={() => copyAddresstoClipboard(issuer)}>
                 <LiaCopySolid color='white' size={20} />

diff --git a/src/components/bounty/ProofItemAccount.tsx b/src/components/bounty/ProofItemAccount.tsx
@@ -5,6 +5,7 @@ import React, { useEffect, useState } from 'react';
 import { useDegenOrEnsName } from '@/hooks/useDegenOrEnsName';
 
 import { acceptClaim, getURI, submitClaimForVote } from '@/app/context/web3';
+import { usePathname } from 'next/navigation';
 
 interface ProofItemProps {
   id: string;
@@ -35,6 +36,13 @@ const ProofItem: React.FC<ProofItemProps> = ({
   // const currentUser = user?.verifiedCredentials[0].address;
 
   // const notOwner = currentUser === issuer ;
+  const path = usePathname();
+  const [currentNetworkName, setCurrentNetworkName] = useState('');
+
+  useEffect(() => {
+    const currentUrl = path.split('/')[1];
+    setCurrentNetworkName(currentUrl || 'base');
+  }, []);
 
   useEffect(() => {
     if (id) {
@@ -112,10 +120,13 @@ const ProofItem: React.FC<ProofItemProps> = ({
 
           <div className='mt-2 py-2 flex flex-row justify-between text-sm border-t border-dashed'>
             <span className=''>issuer</span>
-            <span>
+            <Link
+              href={`/${currentNetworkName}/account/${issuer}`}
+              className='hover:text-gray-200'
+            >
               {issuerDegenOrEnsName ||
                 `$` + issuer.slice(0, 5) + '...' + issuer.slice(-6)}
-            </span>
+            </Link>
           </div>
           <div>claim id: {id}</div>
         </div>