feat: add result page

privacy-scaling-explorations · Nov 11, 2024 · 4fbff20 · 4fbff20
1 parent f7715c9
commit 4fbff20
Show file tree

Hide file tree

Showing 32 changed files with 250 additions and 82 deletions.
diff --git a/packages/coordinator/scripts/uploadRoundMetadata.ts b/packages/coordinator/scripts/uploadRoundMetadata.ts
@@ -14,7 +14,6 @@ export interface RoundMetadata {
   registrationEndsAt: Date;
   votingStartsAt: Date;
   votingEndsAt: Date;
-  tallyFile: string;
 }
 
 interface IUploadMetadataProps {
@@ -137,17 +136,13 @@ export async function collectMetadata(): Promise<RoundMetadata> {
 
   rl.close();
 
-  // NOTICE! this is when you use vercel blob storage, if you're using another tool, please change this part.
-  const vercelStoragePrefix = `https://${process.env.BLOB_READ_WRITE_TOKEN?.split("_")[3]}.public.blob.vercel-storage.com`;
-
   return {
     roundId,
     description,
     startsAt,
     registrationEndsAt: new Date(startsAt.getTime() + registrationEndsIn * 1000),
     votingStartsAt: new Date(startsAt.getTime() + registrationEndsIn * 1000),
     votingEndsAt: new Date(startsAt.getTime() + registrationEndsIn * 1000 + votingEndsIn * 1000),
-    tallyFile: `${vercelStoragePrefix}/tally-${roundId}.json`,
   };
 }
 

diff --git a/packages/interface/public/bronze.svg b/packages/interface/public/bronze.svg
diff --git a/packages/interface/public/gold.svg b/packages/interface/public/gold.svg
diff --git a/packages/interface/public/line-chart.svg b/packages/interface/public/line-chart.svg
diff --git a/packages/interface/public/silver.svg b/packages/interface/public/silver.svg
diff --git a/packages/interface/src/components/BallotOverview.tsx b/packages/interface/src/components/BallotOverview.tsx
@@ -19,7 +19,7 @@ export const BallotOverview = ({ title = undefined, pollId }: IBallotOverviewPro
 
   const ballot = useMemo(() => getBallot(pollId), [pollId, getBallot]);
 
-  const roundState = useRoundState(pollId);
+  const roundState = useRoundState({ pollId });
 
   return (
     <Link

diff --git a/packages/interface/src/components/EligibilityDialog.tsx b/packages/interface/src/components/EligibilityDialog.tsx
@@ -33,7 +33,7 @@ export const EligibilityDialog = ({ pollId = "" }: IEligibilityDialogProps): JSX
     useMaci();
   const router = useRouter();
 
-  const roundState = useRoundState(pollId);
+  const roundState = useRoundState({ pollId });
 
   const votingEndsAt = useMemo(() => {
     const round = getRoundByPollId(pollId);

diff --git a/packages/interface/src/components/Header.tsx b/packages/interface/src/components/Header.tsx
@@ -63,7 +63,7 @@ const Header = ({ navLinks, pollId = "" }: IHeaderProps) => {
   const { asPath } = useRouter();
   const [isOpen, setOpen] = useState(false);
   const { getBallot } = useBallot();
-  const roundState = useRoundState(pollId);
+  const roundState = useRoundState({ pollId });
   const { theme, setTheme } = useTheme();
 
   const ballot = useMemo(() => getBallot(pollId), [pollId, getBallot]);

diff --git a/packages/interface/src/components/Info.tsx b/packages/interface/src/components/Info.tsx
@@ -39,7 +39,7 @@ export const Info = ({
   showAppState = false,
   showBallot = false,
 }: IInfoProps): JSX.Element => {
-  const roundState = useRoundState(pollId);
+  const roundState = useRoundState({ pollId });
 
   const { getRoundByPollId } = useRound();
   const round = getRoundByPollId(pollId);

diff --git a/packages/interface/src/features/ballot/components/BallotConfirmation.tsx b/packages/interface/src/features/ballot/components/BallotConfirmation.tsx
@@ -41,7 +41,7 @@ export const getServerSideProps: GetServerSideProps = async ({ query: { pollId }
 
 export const BallotConfirmation = ({ pollId }: IBallotConfirmationProps): JSX.Element => {
   const { getBallot, sumBallot } = useBallot();
-  const roundState = useRoundState(pollId);
+  const roundState = useRoundState({ pollId });
   const { getRoundByPollId } = useRound();
   const round = useMemo(() => getRoundByPollId(pollId), [pollId, getRoundByPollId]);
 

diff --git a/packages/interface/src/features/projects/components/ProjectAwarded.tsx b/packages/interface/src/features/projects/components/ProjectAwarded.tsx
@@ -1,24 +1,23 @@
+import { ZeroAddress } from "ethers";
+import { useMemo } from "react";
 import { Hex } from "viem";
 
 import { Button } from "~/components/ui/Button";
 import { config } from "~/config";
+import { useRound } from "~/contexts/Round";
 import { useProjectResults } from "~/hooks/useResults";
 import { formatNumber } from "~/utils/formatNumber";
 
 export interface IProjectAwardedProps {
   pollId: string;
-  tallyFile?: string;
   registryAddress: string;
   id?: string;
 }
 
-export const ProjectAwarded = ({
-  pollId,
-  tallyFile = undefined,
-  registryAddress,
-  id = "",
-}: IProjectAwardedProps): JSX.Element | null => {
-  const amount = useProjectResults(id, registryAddress as Hex, pollId, tallyFile);
+export const ProjectAwarded = ({ pollId, registryAddress, id = "" }: IProjectAwardedProps): JSX.Element | null => {
+  const { getRoundByPollId } = useRound();
+  const round = useMemo(() => getRoundByPollId(pollId), [pollId, getRoundByPollId]);
+  const amount = useProjectResults(id, registryAddress as Hex, pollId, (round?.tallyAddress ?? ZeroAddress) as Hex);
 
   if (amount.isLoading) {
     return null;

diff --git a/packages/interface/src/features/projects/components/ProjectDetails.tsx b/packages/interface/src/features/projects/components/ProjectDetails.tsx
@@ -27,7 +27,7 @@ const ProjectDetails = ({ pollId, project, action = undefined }: IProjectDetails
   const { bio, websiteUrl, payoutAddress, github, twitter, fundingSources, profileImageUrl, bannerImageUrl } =
     metadata.data ?? {};
 
-  const roundState = useRoundState(pollId);
+  const roundState = useRoundState({ pollId });
 
   return (
     <div className="relative dark:text-white">

diff --git a/packages/interface/src/features/projects/components/ProjectItem.tsx b/packages/interface/src/features/projects/components/ProjectItem.tsx
@@ -33,7 +33,7 @@ export const ProjectItem = ({
   action = undefined,
 }: IProjectItemProps): JSX.Element => {
   const metadata = useProjectMetadata(recipient.metadataUrl);
-  const roundState = useRoundState(pollId);
+  const roundState = useRoundState({ pollId });
 
   return (
     <article

diff --git a/packages/interface/src/features/projects/components/ProjectsResults.tsx b/packages/interface/src/features/projects/components/ProjectsResults.tsx
@@ -23,8 +23,12 @@ export const ProjectsResults = ({ pollId }: IProjectsResultsProps): JSX.Element
   const { getRoundByPollId } = useRound();
   const round = useMemo(() => getRoundByPollId(pollId), [pollId, getRoundByPollId]);
   const projects = useProjectsResults((round?.registryAddress ?? zeroAddress) as Hex);
-  const results = useResults(pollId, (round?.registryAddress ?? zeroAddress) as Hex, round?.tallyFile);
-  const roundState = useRoundState(pollId);
+  const results = useResults(
+    pollId,
+    (round?.registryAddress ?? zeroAddress) as Hex,
+    (round?.tallyAddress ?? zeroAddress) as Hex,
+  );
+  const roundState = useRoundState({ pollId });
 
   const handleAction = useCallback(
     (projectId: string) => (e: Event) => {

diff --git a/packages/interface/src/features/rounds/components/Projects.tsx b/packages/interface/src/features/rounds/components/Projects.tsx
@@ -25,7 +25,7 @@ export interface IProjectsProps {
 }
 
 export const Projects = ({ pollId = "" }: IProjectsProps): JSX.Element => {
-  const roundState = useRoundState(pollId);
+  const roundState = useRoundState({ pollId });
 
   const { getRoundByPollId } = useRound();
   const round = useMemo(() => getRoundByPollId(pollId), [pollId, getRoundByPollId]);
@@ -35,7 +35,11 @@ export const Projects = ({ pollId = "" }: IProjectsProps): JSX.Element => {
   const { isRegistered } = useMaci();
   const { addToBallot, removeFromBallot, ballotContains, getBallot } = useBallot();
 
-  const results = useResults(pollId, (round?.registryAddress ?? zeroAddress) as Hex, round?.tallyFile);
+  const results = useResults(
+    pollId,
+    (round?.registryAddress ?? zeroAddress) as Hex,
+    (round?.tallyAddress ?? zeroAddress) as Hex,
+  );
 
   const ballot = useMemo(() => getBallot(pollId), [pollId, getBallot]);
 

diff --git a/packages/interface/src/features/rounds/components/RoundItem.tsx b/packages/interface/src/features/rounds/components/RoundItem.tsx
@@ -61,7 +61,7 @@ const RoundTag = ({ state }: IRoundTagProps): JSX.Element => {
 };
 
 export const RoundItem = ({ round }: IRoundItemProps): JSX.Element => {
-  const roundState = useRoundState(round.pollId);
+  const roundState = useRoundState({ pollId: round.pollId });
 
   return (
     <Link href={`/rounds/${round.pollId}`}>

diff --git a/packages/interface/src/hooks/useResults.ts b/packages/interface/src/hooks/useResults.ts
@@ -11,11 +11,11 @@ import type { IRecipient } from "~/utils/types";
 export function useResults(
   pollId: string,
   registryAddress: string,
-  tallyFile?: string,
+  tallyAddress: string,
 ): UseTRPCQueryResult<{ averageVotes: number; projects: Record<string, { votes: number; voters: number }> }, unknown> {
-  const roundState = useRoundState(pollId);
+  const roundState = useRoundState({ pollId });
 
-  return api.results.votes.useQuery({ registryAddress, tallyFile }, { enabled: roundState === ERoundState.RESULTS });
+  return api.results.votes.useQuery({ registryAddress, tallyAddress }, { enabled: roundState === ERoundState.RESULTS });
 }
 
 const seed = 0;
@@ -38,12 +38,16 @@ export function useProjectResults(
   id: string,
   registryAddress: string,
   pollId: string,
-  tallyFile?: string,
+  tallyAddress: string,
 ): UseTRPCQueryResult<{ amount: number }, unknown> {
-  const appState = useRoundState(pollId);
+  const roundState = useRoundState({ pollId });
 
   return api.results.project.useQuery(
-    { id, registryAddress, tallyFile },
-    { enabled: appState === ERoundState.RESULTS },
+    { id, registryAddress, tallyAddress },
+    { enabled: roundState === ERoundState.RESULTS },
   );
 }
+
+export function useIsTallied(tallyAddress: string): UseTRPCQueryResult<{ isTallied: boolean }, unknown> {
+  return api.maci.isTallied.useQuery({ tallyAddress });
+}
diff --git a/packages/interface/src/layouts/DefaultLayout.tsx b/packages/interface/src/layouts/DefaultLayout.tsx
@@ -18,7 +18,7 @@ import { BaseLayout } from "./BaseLayout";
 
 export const Layout = ({ children = null, ...props }: ILayoutProps): JSX.Element => {
   const { address } = useAccount();
-  const roundState = useRoundState(props.pollId ?? "");
+  const roundState = useRoundState({ pollId: props.pollId ?? "" });
   const { getBallot } = useBallot();
   const { isRegistered, gatekeeperTrait } = useMaci();
 
@@ -54,8 +54,8 @@ export const Layout = ({ children = null, ...props }: ILayoutProps): JSX.Element
 
     if (roundState === ERoundState.RESULTS) {
       links.push({
-        href: `/rounds/${props.pollId}/stats`,
-        children: "Stats",
+        href: `/rounds/${props.pollId}/result`,
+        children: "Result",
       });
     }
 
@@ -96,7 +96,7 @@ export const LayoutWithSidebar = ({ ...props }: ILayoutProps): JSX.Element => {
   const { address } = useAccount();
   const { getBallot } = useBallot();
 
-  const roundState = useRoundState(props.pollId ?? "");
+  const roundState = useRoundState({ pollId: props.pollId ?? "" });
 
   const ballot = useMemo(() => getBallot(props.pollId!), [props.pollId, getBallot]);
 

diff --git a/packages/interface/src/pages/rounds/[pollId]/[projectId]/Project.tsx b/packages/interface/src/pages/rounds/[pollId]/[projectId]/Project.tsx
@@ -23,11 +23,11 @@ const ProjectDetailsPage = ({ projectId = "", pollId }: IProjectDetailsProps): J
 
   const projects = useProjectById(projectId, round?.registryAddress ?? zeroAddress);
 
-  const appState = useRoundState(pollId);
+  const roundState = useRoundState({ pollId });
 
   return (
     <LayoutWithSidebar eligibilityCheck showBallot showInfo pollId={pollId} sidebar="left">
-      {appState === ERoundState.APPLICATION && <ReviewBar pollId={pollId} projectId={projectId} />}
+      {roundState === ERoundState.APPLICATION && <ReviewBar pollId={pollId} projectId={projectId} />}
 
       {projects.data && <ProjectDetails pollId={pollId} project={projects.data as unknown as IRecipient} />}
     </LayoutWithSidebar>

diff --git a/packages/interface/src/pages/rounds/[pollId]/applications/confirmation.tsx b/packages/interface/src/pages/rounds/[pollId]/applications/confirmation.tsx
@@ -22,7 +22,7 @@ export const getServerSideProps: GetServerSideProps = async ({ query: { pollId }
   });
 
 const ConfirmProjectPage = ({ pollId }: { pollId: string }): JSX.Element => {
-  const state = useRoundState(pollId);
+  const state = useRoundState({ pollId });
 
   const { getRoundByPollId } = useRound();
 

diff --git a/packages/interface/src/pages/rounds/[pollId]/applications/new.tsx b/packages/interface/src/pages/rounds/[pollId]/applications/new.tsx
@@ -15,7 +15,7 @@ export const getServerSideProps: GetServerSideProps = async ({ query: { pollId }
   });
 
 const NewProjectPage = ({ pollId }: { pollId: string }): JSX.Element => {
-  const state = useRoundState(pollId);
+  const state = useRoundState({ pollId });
 
   return (
     <Layout>

diff --git a/packages/interface/src/pages/rounds/[pollId]/ballot/index.tsx b/packages/interface/src/pages/rounds/[pollId]/ballot/index.tsx
@@ -35,7 +35,7 @@ const ClearBallot = ({ pollId }: IClearBallotProps): JSX.Element | null => {
     setOpen(true);
   }, [setOpen]);
 
-  if ([ERoundState.TALLYING, ERoundState.RESULTS].includes(useRoundState(pollId))) {
+  if ([ERoundState.TALLYING, ERoundState.RESULTS].includes(useRoundState({ pollId }))) {
     return null;
   }
 
@@ -99,7 +99,7 @@ interface IBallotAllocationFormProps {
 }
 
 const BallotAllocationForm = ({ pollId, mode }: IBallotAllocationFormProps): JSX.Element => {
-  const roundState = useRoundState(pollId);
+  const roundState = useRoundState({ pollId });
   const { getBallot, sumBallot } = useBallot();
   const { initialVoiceCredits } = useMaci();
 
@@ -158,7 +158,7 @@ const BallotPage = ({ pollId }: IBallotPageProps): JSX.Element => {
   const { getBallot, sumBallot } = useBallot();
   const { getRoundByPollId } = useRound();
   const router = useRouter();
-  const roundState = useRoundState(pollId);
+  const roundState = useRoundState({ pollId });
 
   const round = useMemo(() => getRoundByPollId(pollId), [pollId, getRoundByPollId]);
   const ballot = useMemo(() => getBallot(pollId), [round?.pollId, getBallot]);