[frenemies] Migration logic (MystenLabs#8215)

JonathanH4H · Feb 10, 2023 · 38626a4 · 38626a4
1 parent e432d14
commit 38626a4
Show file tree

Hide file tree

Showing 19 changed files with 484 additions and 341 deletions.
diff --git a/dapps/frenemies/src/components/Assignment/index.tsx b/dapps/frenemies/src/components/Assignment/index.tsx
@@ -1,7 +1,6 @@
 // Copyright (c) Mysten Labs, Inc.
 // SPDX-License-Identifier: Apache-2.0
 
-import { useWalletKit } from "@mysten/wallet-kit";
 import { useScorecard } from "../../network/queries/scorecard";
 import { convertToString, useValidators } from "../../network/queries/sui-system";
 import { Goal } from "../../network/types";
@@ -32,9 +31,8 @@ function getIsInRank(goal: Goal, index: number) {
 }
 
 export function Assignment() {
-  const { currentAccount } = useWalletKit();
   const { data: validators } = useValidators();
-  const { data: scorecard } = useScorecard(currentAccount);
+  const { data: scorecard } = useScorecard();
 
   const sortedValidators = validators
     ? [...validators].sort((a, b) =>

diff --git a/dapps/frenemies/src/components/Validators/Table.tsx b/dapps/frenemies/src/components/Validators/Table.tsx
@@ -9,7 +9,6 @@ import {
   StakedSui,
   STAKED_SUI,
 } from "../../network/types";
-import { useWalletKit } from "@mysten/wallet-kit";
 import { useMyType } from "../../network/queries/use-raw";
 import { GridItem } from "./GridItem";
 import { ValidatorItem } from "./Validator";
@@ -25,12 +24,8 @@ function Header({ children }: { children: ReactNode }) {
 }
 
 export function Table() {
-  const { currentAccount } = useWalletKit();
-  const { data: stakes } = useMyType<StakedSui>(STAKED_SUI, currentAccount);
-  const { data: delegations } = useMyType<Delegation>(
-    DELEGATION,
-    currentAccount
-  );
+  const { data: stakes } = useMyType<StakedSui>(STAKED_SUI);
+  const { data: delegations } = useMyType<Delegation>(DELEGATION);
 
   const { data: validators } = useValidators();
 
@@ -71,9 +66,7 @@ export function Table() {
 
       <div className="flex flex-col gap-1">
         {sorted.map((validator, index) => {
-          const address = normalizeSuiAddress(
-            validator.sui_address
-          );
+          const address = normalizeSuiAddress(validator.sui_address);
 
           return (
             <ValidatorItem

diff --git a/dapps/frenemies/src/components/Validators/Validator.tsx b/dapps/frenemies/src/components/Validators/Validator.tsx
@@ -2,7 +2,6 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import { ValidatorMetaData } from "@mysten/sui.js";
-import { useWalletKit } from "@mysten/wallet-kit";
 import clsx from "clsx";
 import { FormEvent, useState } from "react";
 import { useScorecard } from "../../network/queries/scorecard";
@@ -27,8 +26,7 @@ interface Props {
 const DEC = 9;
 
 export function ValidatorItem({ index, validator, stake, delegation }: Props) {
-  const { currentAccount } = useWalletKit();
-  const { data: scorecard } = useScorecard(currentAccount);
+  const { data: scorecard } = useScorecard();
   const [amount, setAmount] = useState("");
 
   const onInputAmount = (evt: FormEvent<HTMLInputElement>) => {

diff --git a/dapps/frenemies/src/components/Validators/index.tsx b/dapps/frenemies/src/components/Validators/index.tsx
@@ -11,7 +11,7 @@ import { Card } from "../Card";
 
 export function Validators({ hasAssignment }: { hasAssignment: boolean }) {
   const { currentAccount } = useWalletKit();
-  const { data: scorecard } = useScorecard(currentAccount);
+  const { data: scorecard } = useScorecard();
 
   // At this point there's no way it errors out.
   if (!currentAccount) {

diff --git a/dapps/frenemies/src/components/leaderboard/Table.tsx b/dapps/frenemies/src/components/leaderboard/Table.tsx
@@ -20,8 +20,15 @@ const Cell = ({
   </As>
 );
 
+const ELLIPSIS = '\u{2026}';
+function formatName(name: string) {
+  if (name.length <= 4) {
+    return name;
+  }
+  return `${name.slice(0, 4)}${ELLIPSIS}`
+}
+
 export function Table({ data }: Props) {
-  console.log(data.topScores);
   return (
     <div className="overflow-y-scroll max-h-60">
       <table className="table-fixed w-full">
@@ -35,7 +42,7 @@ export function Table({ data }: Props) {
         <tbody>
           {data.topScores.map((score) => (
             <tr key={score.name} className="border-t border-white/20">
-              <Cell>{score.name}</Cell>
+              <Cell>{formatName(score.name)}</Cell>
               <Cell>{score.score}</Cell>
               <Cell>{score.participation}</Cell>
             </tr>

diff --git a/dapps/frenemies/src/components/round/Round.tsx b/dapps/frenemies/src/components/round/Round.tsx
@@ -1,7 +1,7 @@
 // Copyright (c) Mysten Labs, Inc.
 // SPDX-License-Identifier: Apache-2.0
 
-import { config } from "../../config";
+import { config, ROUND_OFFSET } from "../../config";
 import { useEpoch } from "../../network/queries/epoch";
 import { useRawObject } from "../../network/queries/use-raw";
 import { LEADERBOARD, Leaderboard } from "../../network/types";
@@ -23,7 +23,8 @@ export function Round() {
     return null;
   }
 
-  const round = BigInt(epoch.epoch) - leaderboard.data.startEpoch;
+  const round =
+    BigInt(epoch.epoch) - leaderboard.data.startEpoch + ROUND_OFFSET;
 
   return (
     <h2 className="uppercase text-steel-dark font-thin text-6xl sm:text-8xl md:text-9xl lg:text-9xl xl:text-[160px] leading-tight text-center tracking-widest">

diff --git a/dapps/frenemies/src/components/your-score/Refresh.tsx b/dapps/frenemies/src/components/your-score/Refresh.tsx
@@ -1,9 +1,8 @@
 // Copyright (c) Mysten Labs, Inc.
 // SPDX-License-Identifier: Apache-2.0
 
-import { useWalletKit } from "@mysten/wallet-kit";
 import { ReactNode } from "react";
-import { config } from "../../config";
+import { config, ROUND_OFFSET } from "../../config";
 import { useEpoch } from "../../network/queries/epoch";
 import {
   useRefreshScorecard,
@@ -17,8 +16,7 @@ interface Props {
 }
 
 export function Refresh({ fallback = null }: Props) {
-  const { currentAccount } = useWalletKit();
-  const { data: scorecard } = useScorecard(currentAccount);
+  const { data: scorecard } = useScorecard();
   const { data: epoch } = useEpoch();
   const { data: leaderboard } = useRawObject<Leaderboard>(
     config.VITE_LEADERBOARD,
@@ -35,7 +33,9 @@ export function Refresh({ fallback = null }: Props) {
     return <>{fallback}</>;
   }
 
-  const round = BigInt(epoch?.epoch || 0) - leaderboard.data.startEpoch || 0n;
+  const round =
+    BigInt(epoch?.epoch || 0) - leaderboard.data.startEpoch + ROUND_OFFSET ||
+    0n;
 
   return (
     <div className="absolute top-0 right-0">

diff --git a/dapps/frenemies/src/components/your-score/Table.tsx b/dapps/frenemies/src/components/your-score/Table.tsx
@@ -2,8 +2,8 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import { formatAddress } from "@mysten/sui.js";
-import { useWalletKit } from "@mysten/wallet-kit";
 import { ReactNode } from "react";
+import { ROUND_OFFSET } from "../../config";
 import { useScorecard } from "../../network/queries/scorecard";
 import { useScorecardHistory } from "../../network/queries/scorecard-history";
 import {
@@ -33,9 +33,8 @@ const Cell = ({
 );
 
 export function Table({ data, round, leaderboard }: Props) {
-  const { currentAccount } = useWalletKit();
   const { data: validators } = useValidators();
-  const { data: scorecard } = useScorecard(currentAccount);
+  const { data: scorecard } = useScorecard();
   const { isLoading } = useScorecardHistory(scorecard?.data.id);
   const activeValidators = validators || [];
   const getValidator = (addr: string) =>
@@ -44,7 +43,11 @@ export function Table({ data, round, leaderboard }: Props) {
   const dataByRound: { [key: string]: ScorecardUpdatedEvent } = data.reduce(
     (acc, row) =>
       Object.assign(acc, {
-        [(row.assignment.epoch - leaderboard.startEpoch).toString()]: row,
+        [(
+          row.assignment.epoch -
+          leaderboard.startEpoch +
+          ROUND_OFFSET
+        ).toString()]: row,
       }),
     {}
   );

diff --git a/dapps/frenemies/src/components/your-score/YourScore.tsx b/dapps/frenemies/src/components/your-score/YourScore.tsx
@@ -2,7 +2,7 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import { useWalletKit } from "@mysten/wallet-kit";
-import { config } from "../../config";
+import { config, ROUND_OFFSET } from "../../config";
 import { useScorecard } from "../../network/queries/scorecard";
 import { useScorecardHistory } from "../../network/queries/scorecard-history";
 import { Table } from "./Table";
@@ -15,7 +15,7 @@ import { useEpoch } from "../../network/queries/epoch";
 export function YourScore() {
   const { currentAccount } = useWalletKit();
   const { data: epoch } = useEpoch();
-  const { data: scorecard } = useScorecard(currentAccount);
+  const { data: scorecard } = useScorecard();
   const { data: history } = useScorecardHistory(scorecard && scorecard.data.id);
   const { data: leaderboard } = useRawObject<Leaderboard>(
     config.VITE_LEADERBOARD,
@@ -27,7 +27,9 @@ export function YourScore() {
     return null;
   }
 
-  const round = BigInt(epoch?.epoch || 0) - leaderboard.data.startEpoch || 0n;
+  const round =
+    BigInt(epoch?.epoch || 0) - leaderboard.data.startEpoch + ROUND_OFFSET ||
+    0n;
   const rank =
     (leaderboard &&
       leaderboard.data.topScores.findIndex(

diff --git a/dapps/frenemies/src/config.ts b/dapps/frenemies/src/config.ts
@@ -4,6 +4,9 @@
 import { z } from "zod";
 import { Network } from "@mysten/sui.js";
 
+// Oops, we need to bump the round.
+export const ROUND_OFFSET = 5n;
+
 const ConfigSchema = z.object({
   VITE_NETWORK: z
     .union([z.nativeEnum(Network), z.string()])
@@ -14,6 +17,11 @@ const ConfigSchema = z.object({
   VITE_REGISTRY: z.string(),
   /** Frenemies Package ID */
   VITE_PKG: z.string(),
+  VITE_MIGRATION: z.string(),
+  /** Package for the previous version of frenemies: */
+  VITE_OLD_PKG: z.string(),
+  /** Registry for the previous version of frenemies: */
+  VITE_OLD_REGISTRY: z.string(),
 });
 
 export const config = ConfigSchema.parse(import.meta.env);
diff --git a/dapps/frenemies/src/main.tsx b/dapps/frenemies/src/main.tsx
@@ -14,11 +14,11 @@ import {
 import { QueryClientProvider, QueryClient } from "@tanstack/react-query";
 
 import { Root } from "./routes/Root";
-// import { Home } from "./routes/Home";
-// import { Connect } from "./routes/Connect";
-// import { Setup } from "./routes/Setup";
+import { Home } from "./routes/Home";
+import { Connect } from "./routes/Connect";
+import { Setup } from "./routes/Setup";
 import { toast } from "react-hot-toast";
-import { Offline } from "./routes/Offline";
+import { Migrate } from "./routes/Migrate";
 
 const plausible = Plausible({});
 plausible.enableAutoPageviews();
@@ -38,19 +38,22 @@ const router = createBrowserRouter([
     path: "/",
     element: <Root />,
     children: [
-      { path: '', element: <Offline />},
-      // {
-      //   path: "",
-      //   element: <Home />,
-      // },
-      // {
-      //   path: "connect",
-      //   element: <Connect />,
-      // },
-      // {
-      //   path: "setup",
-      //   element: <Setup />,
-      // },
+      {
+        path: "",
+        element: <Home />,
+      },
+      {
+        path: "connect",
+        element: <Connect />,
+      },
+      {
+        path: "setup",
+        element: <Setup />,
+      },
+      {
+        path: "migrate",
+        element: <Migrate />,
+      },
       {
         path: "*",
         element: <Navigate to="/" replace />,

diff --git a/dapps/frenemies/src/network/bcs.ts b/dapps/frenemies/src/network/bcs.ts
@@ -7,6 +7,7 @@ import {
   DELEGATION,
   GENERIC_COIN,
   LEADERBOARD,
+  OLD_SCORECARD,
   SCORECARD,
   SCORECARD_UPDATED,
   STAKED_SUI,
@@ -28,6 +29,14 @@ export const bcs = suiBcs
     participation: "u16",
     epoch: "u64",
   })
+  .registerStructType(OLD_SCORECARD, {
+    id: "address",
+    name: "string",
+    assignment: ASSIGNMENT,
+    score: "u16",
+    participation: "u16",
+    epoch: "u64",
+  })
   .registerStructType(SCORECARD_UPDATED, {
     scorecard: "address",
     assignment: ASSIGNMENT,
@@ -55,7 +64,7 @@ export const bcs = suiBcs
   // Sui System + Validators schema
   .registerStructType(GENERIC_COIN, {
     id: "address",
-    value: "u64"
+    value: "u64",
   })
   .registerStructType(STAKED_SUI, {
     id: "address",

diff --git a/dapps/frenemies/src/network/queries/epoch.ts b/dapps/frenemies/src/network/queries/epoch.ts
@@ -20,7 +20,6 @@ export function useEpoch() {
       prevTimestamp: number;
       data: SystemEpochInfo;
     } | null> => {
-      const { epoch } = await provider.getCommitteeInfo();
       const { data } = await provider.getEvents(
         { MoveEvent: SYSTEM_EPOCH_INFO },
         null,
@@ -34,11 +33,17 @@ export function useEpoch() {
         return null;
       }
 
+      const eventData = bcs.de(
+        SYSTEM_EPOCH_INFO,
+        evt.event.moveEvent.bcs,
+        "base64"
+      ) as SystemEpochInfo;
+
       return {
-        epoch,
+        data: eventData,
+        epoch: Number(eventData.epoch),
         timestamp: evt.timestamp,
         prevTimestamp: prevEvt?.timestamp || 0,
-        data: bcs.de(SYSTEM_EPOCH_INFO, evt.event.moveEvent.bcs, "base64"),
       };
     },
     {