diff --git a/app/modules/plus-server/usePlusVoting.ts b/app/modules/plus-server/usePlusVoting.ts index 9e4f9979a..f7479353f 100644 --- a/app/modules/plus-server/usePlusVoting.ts +++ b/app/modules/plus-server/usePlusVoting.ts @@ -52,15 +52,20 @@ export function usePlusVoting(usersForVotingFromServer: UsersForVoting) { const currentUser = usersForVoting?.[votes.length]; + const progress: [currentAmount: number, targetAmount: number] | undefined = + usersForVoting ? [votes.length, usersForVoting.length] : undefined; + return { vote, undoLast, currentUser, previous: previousUser({ usersForVoting, votes }), isReady: Boolean(usersForVoting), + progress, }; } +// xxx: with this implementation i guess bio's / suggestions won't update mid-voting? function useLoadInitialStateFromLocalStorageEffect({ usersForVotingFromServer, setUsersForVoting, @@ -116,7 +121,7 @@ function previousUser({ invariant(previousScore); return { - user: previousUser, + ...previousUser, score: previousScore, }; } diff --git a/app/routes/plus/voting/index.tsx b/app/routes/plus/voting/index.tsx index e0dff95d4..72b5a8c3a 100644 --- a/app/routes/plus/voting/index.tsx +++ b/app/routes/plus/voting/index.tsx @@ -17,6 +17,7 @@ import { isVotingActive } from "~/permissions"; import { discordFullName } from "~/utils/strings"; import { assertUnreachable } from "~/utils/types"; import { PlusSuggestionComments } from "../suggestions"; +import * as React from "react"; type PlusVotingLoaderData = // voting is not active OR user is not eligible to vote @@ -99,15 +100,36 @@ function VotingTimingInfo( ); } +const tips = [ + "Voting progress is saved locally", + "Use left and right arrows on desktop to vote", + "You +1 yourself automatically", +]; + function Voting(data: Extract) { - const { currentUser, previous, vote, undoLast, isReady } = usePlusVoting( - data.usersForVoting - ); + const [randomTip] = React.useState(tips[Math.floor(Math.random() * 3)]); + const { currentUser, previous, vote, undoLast, isReady, progress } = + usePlusVoting(data.usersForVoting); if (!isReady) return null; return ( -
+
+ {previous ? ( +

+ Previously{" "} + + {previous.score > 0 ? "+" : ""} + {previous.score} + {" "} + on {discordFullName(previous.user)}. + +

+ ) : ( +

Tip: {randomTip}

+ )} {currentUser ? (