diff --git a/subgraph/core/schema.graphql b/subgraph/core/schema.graphql index d75c3b101..953a36270 100644 --- a/subgraph/core/schema.graphql +++ b/subgraph/core/schema.graphql @@ -318,6 +318,7 @@ type ClassicEvidence implements Evidence @entity(immutable: true) { sender: User! senderAddress: String! timestamp: BigInt! + transactionHash: Bytes! name: String description: String fileURI: String diff --git a/subgraph/core/src/EvidenceModule.ts b/subgraph/core/src/EvidenceModule.ts index a4dfd8e70..03a15c3b4 100644 --- a/subgraph/core/src/EvidenceModule.ts +++ b/subgraph/core/src/EvidenceModule.ts @@ -17,6 +17,7 @@ export function handleEvidenceEvent(event: EvidenceEvent): void { evidence.evidenceIndex = evidenceIndex.plus(ONE).toString(); const userId = event.params._party.toHexString(); evidence.timestamp = event.block.timestamp; + evidence.transactionHash = event.transaction.hash; evidence.evidence = event.params._evidence; evidence.evidenceGroup = evidenceGroupID.toString(); evidence.sender = userId; diff --git a/web/src/components/EvidenceCard.tsx b/web/src/components/EvidenceCard.tsx index cf30bb0bc..bd5a2ad4c 100644 --- a/web/src/components/EvidenceCard.tsx +++ b/web/src/components/EvidenceCard.tsx @@ -1,4 +1,4 @@ -import React from "react"; +import React, { useMemo } from "react"; import styled, { css } from "styled-components"; import Identicon from "react-identicons"; @@ -9,6 +9,7 @@ import { Card } from "@kleros/ui-components-library"; import AttachmentIcon from "svgs/icons/attachment.svg"; +import { DEFAULT_CHAIN, getChain } from "consts/chains"; import { formatDate } from "utils/date"; import { getIpfsUrl } from "utils/getIpfsUrl"; import { shortenAddress } from "utils/shortenAddress"; @@ -116,6 +117,19 @@ const StyledLink = styled(Link)` )} `; +const StyledA = styled.a` + :hover { + text-decoration: underline; + p { + color: ${({ theme }) => theme.primaryBlue}; + } + label { + cursor: pointer; + color: ${({ theme }) => theme.primaryBlue}; + } + } +`; + const AttachedFileText: React.FC = () => ( <> View attached file @@ -128,7 +142,24 @@ interface IEvidenceCard extends Pick = ({ evidence, sender, index, timestamp, name, description, fileURI }) => { +const EvidenceCard: React.FC = ({ + evidence, + sender, + index, + timestamp, + transactionHash, + name, + description, + fileURI, +}) => { + const addressExplorerLink = useMemo(() => { + return `${getChain(DEFAULT_CHAIN)?.blockExplorers?.default.url}/address/${sender}`; + }, [sender]); + + const transactionExplorerLink = useMemo(() => { + return `${getChain(DEFAULT_CHAIN)?.blockExplorers?.default.url}/tx/${transactionHash}`; + }, [transactionHash]); + return ( @@ -145,15 +176,19 @@ const EvidenceCard: React.FC = ({ evidence, sender, index, timest -

{shortenAddress(sender)}

+ +

{shortenAddress(sender)}

+
- {formatDate(Number(timestamp), true)} - {fileURI && ( + + {formatDate(Number(timestamp), true)} + + {fileURI && fileURI !== "-" ? ( - )} + ) : null}
); diff --git a/web/src/hooks/queries/useEvidences.ts b/web/src/hooks/queries/useEvidences.ts index ae4bc00a4..743869619 100644 --- a/web/src/hooks/queries/useEvidences.ts +++ b/web/src/hooks/queries/useEvidences.ts @@ -15,6 +15,7 @@ export const evidenceFragment = graphql(` id } timestamp + transactionHash name description fileURI diff --git a/web/src/pages/Cases/CaseDetails/Evidence/index.tsx b/web/src/pages/Cases/CaseDetails/Evidence/index.tsx index f4fc1955a..488893801 100644 --- a/web/src/pages/Cases/CaseDetails/Evidence/index.tsx +++ b/web/src/pages/Cases/CaseDetails/Evidence/index.tsx @@ -95,14 +95,16 @@ const Evidence: React.FC = () => { {evidences?.realEvidences ? ( - evidences?.realEvidences.map(({ evidence, sender, timestamp, name, description, fileURI, evidenceIndex }) => ( - - )) + evidences?.realEvidences.map( + ({ evidence, sender, timestamp, transactionHash, name, description, fileURI, evidenceIndex }) => ( + + ) + ) ) : ( )} @@ -111,12 +113,12 @@ const Evidence: React.FC = () => { {showSpam ? ( evidences?.spamEvidences.map( - ({ evidence, sender, timestamp, name, description, fileURI, evidenceIndex }) => ( + ({ evidence, sender, timestamp, transactionHash, name, description, fileURI, evidenceIndex }) => ( ) )