@@ -3,12 +3,13 @@ import { useParams } from "react-router-dom";
3
3
import styled , { useTheme } from "styled-components" ;
4
4
import { _TimelineItem1 , CustomTimeline } from "@kleros/ui-components-library" ;
5
5
import { Periods } from "consts/periods" ;
6
- import { useVotingHistory } from "queries/useVotingHistory" ;
7
- import { useDisputeTemplate } from "queries/useDisputeTemplate" ;
6
+ import { ClassicRound } from "src/graphql/graphql" ;
8
7
import { DisputeDetailsQuery , useDisputeDetailsQuery } from "queries/useDisputeDetailsQuery" ;
8
+ import { useDisputeTemplate } from "queries/useDisputeTemplate" ;
9
+ import { useVotingHistory } from "queries/useVotingHistory" ;
10
+ import CalendarIcon from "assets/svgs/icons/calendar.svg" ;
9
11
import ClosedCaseIcon from "assets/svgs/icons/check-circle-outline.svg" ;
10
12
import AppealedCaseIcon from "assets/svgs/icons/close-circle.svg" ;
11
- import CalendarIcon from "assets/svgs/icons/calendar.svg" ;
12
13
13
14
const Container = styled . div `
14
15
display: flex;
@@ -59,31 +60,31 @@ const getCaseEventTimes = (
59
60
60
61
type TimelineItems = [ _TimelineItem1 , ..._TimelineItem1 [ ] ] ;
61
62
62
- const useItems = ( disputeDetails ?: DisputeDetailsQuery ) => {
63
- const { data : disputeTemplate } = useDisputeTemplate ( ) ;
63
+ const useItems = ( disputeDetails ?: DisputeDetailsQuery , arbitrable ?: `0x${string } `) => {
64
64
const { id } = useParams ( ) ;
65
65
const { data : votingHistory } = useVotingHistory ( id ) ;
66
- const localRounds = votingHistory ?. dispute ?. disputeKitDispute ?. localRounds ;
66
+ const { data : disputeTemplate } = useDisputeTemplate ( id , arbitrable ) ;
67
+ const localRounds : ClassicRound [ ] = votingHistory ?. dispute ?. disputeKitDispute ?. localRounds ;
67
68
const theme = useTheme ( ) ;
68
69
69
70
return useMemo < TimelineItems | undefined > ( ( ) => {
70
71
const dispute = disputeDetails ?. dispute ;
71
72
if ( dispute ) {
73
+ const rulingOverride = dispute . overridden ;
74
+ const parsedDisputeFinalRuling = parseInt ( dispute . currentRuling ) ;
72
75
const currentPeriodIndex = Periods [ dispute . period ] ;
73
76
const lastPeriodChange = dispute . lastPeriodChange ;
74
77
const courtTimePeriods = dispute . court . timesPerPeriod ;
75
78
return localRounds ?. reduce < TimelineItems > (
76
79
( acc , { winningChoice } , index ) => {
77
- const parsedWinningChoice = parseInt ( winningChoice ) ;
80
+ const parsedRoundChoice = parseInt ( winningChoice ) ;
78
81
const eventDate = getCaseEventTimes ( lastPeriodChange , currentPeriodIndex , courtTimePeriods , false ) ;
79
- const icon = disputeDetails ?. dispute ? .ruled && index === localRounds . length - 1 ? ClosedCaseIcon : "" ;
82
+ const icon = dispute . ruled && ! rulingOverride && index === localRounds . length - 1 ? ClosedCaseIcon : "" ;
80
83
81
84
acc . push ( {
82
85
title : `Jury Decision - Round ${ index + 1 } ` ,
83
86
party :
84
- parsedWinningChoice !== 0
85
- ? disputeTemplate ?. answers ?. [ parseInt ( winningChoice ) - 1 ] . title
86
- : "Refuse to Arbitrate" ,
87
+ parsedRoundChoice !== 0 ? disputeTemplate ?. answers ?. [ parsedRoundChoice - 1 ] . title : "Refuse to Arbitrate" ,
87
88
subtitle : eventDate ,
88
89
rightSided : true ,
89
90
variant : theme . secondaryPurple ,
@@ -98,6 +99,17 @@ const useItems = (disputeDetails?: DisputeDetailsQuery) => {
98
99
rightSided : true ,
99
100
Icon : AppealedCaseIcon ,
100
101
} ) ;
102
+ } else if ( rulingOverride && parsedDisputeFinalRuling !== parsedRoundChoice ) {
103
+ acc . push ( {
104
+ title : "Won by Appeal" ,
105
+ party :
106
+ parsedDisputeFinalRuling !== 0
107
+ ? disputeTemplate ?. answers ?. [ parsedDisputeFinalRuling - 1 ] . title
108
+ : "Refuse to Arbitrate" ,
109
+ subtitle : eventDate ,
110
+ rightSided : true ,
111
+ Icon : ClosedCaseIcon ,
112
+ } ) ;
101
113
}
102
114
103
115
return acc ;
@@ -117,10 +129,14 @@ const useItems = (disputeDetails?: DisputeDetailsQuery) => {
117
129
} , [ disputeDetails , disputeTemplate , localRounds , theme ] ) ;
118
130
} ;
119
131
120
- const DisputeTimeline : React . FC = ( ) => {
132
+ interface IDisputeTimeline {
133
+ arbitrable ?: `0x${string } `;
134
+ }
135
+
136
+ const DisputeTimeline : React . FC < IDisputeTimeline > = ( { arbitrable } ) => {
121
137
const { id } = useParams ( ) ;
122
138
const { data : disputeDetails } = useDisputeDetailsQuery ( id ) ;
123
- const items = useItems ( disputeDetails ) ;
139
+ const items = useItems ( disputeDetails , arbitrable ) ;
124
140
125
141
return (
126
142
< Container >
0 commit comments