feat: courtesy of green, activity stats, most drawing chance, most reward chance

Author: kemuru

web/src/hooks/queries/useHomePageBlockQuery.ts

@@ -1,15 +1,29 @@
 import { useQuery } from "@tanstack/react-query";
 
 import { useGraphqlBatcher } from "context/GraphqlBatcher";
+import { useMemo } from "react";
 
 import { graphql } from "src/graphql";
 import { HomePageBlockQuery } from "src/graphql/graphql";
 export type { HomePageBlockQuery };
 
 const homePageBlockQuery = graphql(`
   query HomePageBlock($blockNumber: Int) {
-    courts(orderBy: id, orderDirection: asc, block: { number: $blockNumber }) {
+    presentCourts: courts(orderBy: id, orderDirection: asc) {
       id
+      parent {
+        id
+      }
+      name
+      numberDisputes
+      feeForJuror
+      stake
+    }
+    pastCourts: courts(orderBy: id, orderDirection: asc, block: { number: $blockNumber }) {
+      id
+      parent {
+        id
+      }
       name
       numberDisputes
       feeForJuror
@@ -22,7 +36,7 @@ export const useHomePageBlockQuery = (blockNumber: number) => {
   const isEnabled = blockNumber != null;
   const { graphqlBatcher } = useGraphqlBatcher();
 
-  return useQuery({
+  const usedQuery = useQuery({
     queryKey: [`homePageBlockQuery${blockNumber}`],
     enabled: isEnabled,
     queryFn: async () => {
@@ -34,4 +48,79 @@ export const useHomePageBlockQuery = (blockNumber: number) => {
       return data;
     },
   });
+
+  const courtActivityStats = useMemo(() => {
+    if (usedQuery.data && !usedQuery.isFetching) {
+      // 1. court with most disputes
+      // we only iterate through past courts, since more courts might exist at the present
+      // these diffCourts have: average stakes, and dispute diff
+
+      const diffCourts = usedQuery.data.pastCourts.map((c, i) => ({
+        ...c,
+        numberDisputes: usedQuery.data.presentCourts[i].numberDisputes - c.numberDisputes,
+        treeNumberDisputes: usedQuery.data.presentCourts[i].numberDisputes - c.numberDisputes,
+        stake: (BigInt(usedQuery.data.presentCourts[i].stake) + BigInt(c.stake)) / 2n,
+      }));
+      const mostDisputedCourt = diffCourts.sort((a, b) => b.numberDisputes - a.numberDisputes)[0];
+      // 2. biggest chances of getting drawn
+      // fact a: getting drawn in a parent court also subjects you to its rewards
+      // fact b: staking in children, stakes in parents. but subgraph at this date doesn't reflect this
+      // so, stakes trickle up, rewards/disputes trickle down
+
+      for (const parent of diffCourts) {
+        for (const child of diffCourts) {
+          if (parent.id === child.parent?.id) {
+            child.treeNumberDisputes = String(Number(parent.treeNumberDisputes) + Number(child.treeNumberDisputes));
+          }
+        }
+      }
+      diffCourts.reverse();
+      for (const child of diffCourts) {
+        for (const parent of diffCourts) {
+          if (parent.id === child.parent?.id) {
+            parent.stake = String(BigInt(parent.stake) + BigInt(child.stake));
+          }
+        }
+      }
+      diffCourts.reverse();
+      //
+      for (const c of diffCourts) {
+        c.disputesPerPnk = Number(c.numberDisputes) / (Number(c.stake) / 1e18);
+        c.treeDisputesPerPnk = c.disputesPerPnk;
+      }
+      for (const parent of diffCourts) {
+        for (const child of diffCourts) {
+          if (parent.id === child.parent?.id) {
+            child.treeDisputesPerPnk += parent.disputesPerPnk;
+          }
+        }
+      }
+      const bestDrawingChancesCourt = diffCourts.sort((a, b) => b.treeDisputesPerPnk - a.treeDisputesPerPnk)[0];
+      // 3. expected reward
+      // since we isolated the exclusive disputes from the cumulative disputes
+      // we can calculate the "isolated reward" of every court
+      // after that's done, then just trickle the rewards down
+
+      for (const c of diffCourts) {
+        c.expectedRewardPerPnk = c.disputesPerPnk * c.feeForJuror;
+        c.treeExpectedRewardPerPnk = c.expectedRewardPerPnk;
+      }
+      for (const parent of diffCourts) {
+        for (const child of diffCourts) {
+          if (parent.id === child.parent?.id) {
+            child.treeExpectedRewardPerPnk = parent.treeExpectedRewardPerPnk + child.treeExpectedRewardPerPnk;
+          }
+        }
+      }
+      const bestExpectedRewardCourt = diffCourts.sort(
+        (a, b) => b.treeExpectedRewardPerPnk - a.treeExpectedRewardPerPnk
+      )[0];
+
+      return { mostDisputedCourt, bestDrawingChancesCourt, bestExpectedRewardCourt };
+    } else {
+      return undefined;
+    }
+  }, [usedQuery]);
+
+  return courtActivityStats;
 };

web/src/hooks/queries/useHomePageExtraStats.ts

@@ -1,44 +1,12 @@
-import { useEffect, useMemo, useState } from "react";
+import { useEffect, useState } from "react";
 
 import { DEFAULT_CHAIN } from "consts/chains";
 
-import { HomePageBlockQuery } from "src/graphql/graphql";
-import { isUndefined } from "src/utils";
-
-import { useHomePageContext } from "../useHomePageContext";
-
 import { useHomePageBlockQuery } from "./useHomePageBlockQuery";
 import { useBlockNumber } from "wagmi";
 import { averageBlockTimeInSeconds } from "consts/averageBlockTimeInSeconds";
 
-type Court = HomePageBlockQuery["courts"][number];
-
-const getCourtWithMaxDifference = (lastWeekCourts: Court[], currentCourts: Court[]): Court => {
-  const diffs = lastWeekCourts.map((court, idx) => {
-    return Number(currentCourts[idx].numberDisputes) - Number(court.numberDisputes);
-  });
-
-  const maxDiffCourtId = diffs.reduce((a, b) => (a > b ? a : b));
-
-  return lastWeekCourts[diffs.indexOf(maxDiffCourtId)];
-};
-
-const getCourtWithMaxDrawingChance = (currentCourts: Court[]): Court => {
-  return currentCourts.reduce((a, b) => (Number(a.stake) > Number(b.feeForJuror) ? b : a));
-};
-
-const getCourtWithMaxRewardChance = (currentCourts: Court[]): Court => {
-  return currentCourts.reduce((a, b) => (Number(a.feeForJuror) > Number(b.feeForJuror) ? a : b));
-};
-
-export interface HomePageExtraStatsType {
-  MostActiveCourt: string | null;
-  HighestDrawingChance: string | null;
-  HighestRewardChance: string | null;
-}
-
-export const useHomePageExtraStats = (): HomePageExtraStatsType => {
-  const { data } = useHomePageContext();
+export const useHomePageExtraStats = () => {
   const [oneWeekAgoBlockNumber, setOneWeekAgoBlockNumber] = useState<number>();
   const currentBlockNumber = useBlockNumber({ chainId: DEFAULT_CHAIN });
 
@@ -49,22 +17,7 @@ export const useHomePageExtraStats = (): HomePageExtraStatsType => {
     }
   }, [DEFAULT_CHAIN, currentBlockNumber]);
 
-  const { data: relData } = useHomePageBlockQuery(oneWeekAgoBlockNumber!);
-
-  const MostActiveCourt = useMemo(() => {
-    if (isUndefined(relData) || isUndefined(data)) {
-      return null;
-    }
-    return getCourtWithMaxDifference(relData.courts, data.courts).name ?? null;
-  }, [relData, data]);
-
-  const HighestDrawingChance = useMemo(() => {
-    return data ? getCourtWithMaxDrawingChance(data.courts).name ?? null : null;
-  }, [data]);
-
-  const HighestRewardChance = useMemo(() => {
-    return data ? getCourtWithMaxRewardChance(data.courts).name ?? null : null;
-  }, [data]);
+  const data = useHomePageBlockQuery(oneWeekAgoBlockNumber!);
 
-  return { MostActiveCourt, HighestDrawingChance, HighestRewardChance };
+  return data;
 };

web/src/pages/Home/CourtOverview/ExtraStats.tsx

@@ -4,7 +4,7 @@ import styled from "styled-components";
 import LawBalance from "svgs/icons/law-balance.svg";
 import LongArrowUp from "svgs/icons/long-arrow-up.svg";
 
-import { useHomePageExtraStats, HomePageExtraStatsType } from "hooks/queries/useHomePageExtraStats";
+import { useHomePageExtraStats } from "hooks/queries/useHomePageExtraStats";
 
 import ExtraStatsDisplay from "components/ExtraStatsDisplay";
 
@@ -17,24 +17,24 @@ const StyledCard = styled.div`
 
 interface IStat {
   title: string;
-  getText: (data: HomePageExtraStatsType) => string | null;
+  getText: (data) => string | null;
   icon: React.FC<React.SVGAttributes<SVGElement>>;
 }
 
 const stats: IStat[] = [
   {
     title: "Most Cases",
-    getText: (data) => data.MostActiveCourt,
+    getText: (data) => data?.mostDisputedCourt?.name,
     icon: LongArrowUp,
   },
   {
     title: "Highest drawing chance",
-    getText: (data) => data.HighestDrawingChance,
+    getText: (data) => data?.bestDrawingChancesCourt?.name,
     icon: LongArrowUp,
   },
   {
     title: "Highest rewards chance",
-    getText: (data) => data.HighestRewardChance,
+    getText: (data) => data?.bestExpectedRewardCourt?.name,
     icon: LongArrowUp,
   },
 ];