fix(web): juror dashboard coherency fix

Author: kemuru

web/src/pages/Dashboard/JurorInfo/Coherency.tsx

@@ -19,29 +19,34 @@ const Container = styled.div`
 
 const tooltipMsg =
   "A Coherent Vote is a vote coherent with the final jury decision" +
-  " (after all the appeal instances). Your coherency score is calculated" +
-  " using the number of times you have been coherent and the total cases you" +
-  " have been in.";
+  " (after all the appeal instances). If the juror vote is the same as " +
+  " the majority of jurors it's considered a Coherent Vote.";
 
 interface ICoherency {
   userLevelData: {
     scoreRange: number[];
     level: number;
     title: string;
   };
-  score: number;
+  totalCoherent: number;
+  totalResolvedDisputes: number;
 }
 
-const Coherency: React.FC<ICoherency> = ({ userLevelData, score }) => {
+const Coherency: React.FC<ICoherency> = ({ userLevelData, totalCoherent, totalResolvedDisputes }) => {
   return (
     <Container>
       <small>{userLevelData.title}</small>
       <label>Level {userLevelData.level}</label>
-      <CircularProgress progress={parseFloat(score.toFixed(2))} />
+      <CircularProgress
+        progress={parseFloat(((totalCoherent / Math.max(totalResolvedDisputes, 1)) * 100).toFixed(2))}
+      />
       <WithHelpTooltip place="left" {...{ tooltipMsg }}>
         <label>
-          Coherency Score:
-          <small> {score.toFixed(2)} </small>
+          Coherent Votes:
+          <small>
+            {" "}
+            {totalCoherent}/{totalResolvedDisputes}{" "}
+          </small>
         </label>
       </WithHelpTooltip>
     </Container>

web/src/pages/Dashboard/JurorInfo/index.tsx

@@ -40,6 +40,8 @@ const JurorInfo: React.FC = () => {
   const { address } = useAccount();
   const { data } = useUserQuery(address?.toLowerCase());
   const coherenceScore = data?.user ? parseInt(data?.user?.coherenceScore) : 0;
+  const totalCoherent = data?.user ? parseInt(data?.user?.totalCoherent) : 0;
+  const totalResolvedDisputes = data?.user ? parseInt(data?.user?.totalResolvedDisputes) : 0;
 
   const userLevelData = getUserLevelData(coherenceScore);
 
@@ -48,7 +50,11 @@ const JurorInfo: React.FC = () => {
       <Header>Juror Dashboard</Header>
       <Card>
         <PixelArt level={userLevelData.level} width="189px" height="189px" />
-        <Coherency userLevelData={userLevelData} score={coherenceScore} />
+        <Coherency
+          userLevelData={userLevelData}
+          totalCoherent={totalCoherent}
+          totalResolvedDisputes={totalResolvedDisputes}
+        />
         <JurorRewards />
       </Card>
     </Container>