Add voting rules and timezone to FC frame

packages/commonwealth/server/farcaster/frames/contest/contestCard.tsx

@@ -57,6 +57,8 @@ export const contestCard = frames(async (ctx) => {
 
   const endTime = contestManager.contests?.[0]?.end_time;
 
+  console.log('endTime', endTime);
+
   return {
     title: contestManager.name,
     image: (
@@ -87,7 +89,10 @@ export const contestCard = frames(async (ctx) => {
                 lineHeight: '1.2',
               }}
             >
-              Submit entries by replying below until {endTime.toLocaleString()}
+              Submit entries by replying below until{' '}
+              {endTime.toLocaleString(undefined, {
+                timeZoneName: 'longGeneric',
+              })}
             </p>
           )}
 
@@ -121,11 +126,11 @@ export const contestCard = frames(async (ctx) => {
         Leaderboard
       </Button>,
       <Button
-        key="prizes"
+        key="voting-rules"
         action="post"
-        target={`/${contest_address}/contestPrizes`}
+        target={`/${contest_address}/votingRules`}
       >
-        Prizes
+        Voting Rules
       </Button>,
       <Button key="install" action="link" target={getActionInstallUrl()}>
         Add Upvote Action

packages/commonwealth/server/farcaster/frames/contest/index.ts

@@ -1,4 +1,4 @@
 import { contestCard } from './contestCard';
-import { contestPrizes } from './contestPrizes';
+import { votingRules } from './votingRules';
 
-export { contestCard, contestPrizes };
+export { contestCard, votingRules };

packages/commonwealth/server/farcaster/frames/contest/votingRules.tsx

@@ -0,0 +1,81 @@
+import { query } from '@hicommonwealth/core';
+import { Contest } from '@hicommonwealth/model';
+import { Button } from 'frames.js/express';
+import React from 'react';
+import { frames } from '../../config';
+import { FrameLayout } from '../../utils';
+
+export const votingRules = frames(async (ctx) => {
+  const contest_address = ctx.url.pathname.split('/')[1];
+
+  const contestManager = await query(Contest.GetContest(), {
+    actor: { user: { email: '' } },
+    payload: { contest_address, with_chain_node: true },
+  });
+
+  if (!contestManager) {
+    return {
+      title: 'Contest not found',
+      image: (
+        <FrameLayout header="Contest not found">
+          <p style={{ fontSize: '32px' }}>Try to run the contest again.</p>
+        </FrameLayout>
+      ),
+    };
+  }
+
+  return {
+    title: 'Voting Rules',
+    image: (
+      <FrameLayout header="Voting Rules">
+        <div
+          style={{
+            display: 'flex',
+            flexDirection: 'column',
+            gap: '20px',
+            padding: '20px',
+            fontSize: '32px',
+          }}
+        >
+          <ul
+            style={{
+              listStyle: 'none',
+              margin: 0,
+              padding: 0,
+              display: 'flex',
+              flexDirection: 'column',
+              gap: '16px',
+              lineHeight: '1.1',
+            }}
+          >
+            <li>
+              • All votes are weighted by the token used to fund the contest
+            </li>
+            <li>
+              • Users must have the requisite token in their Farcaster verified
+              wallet to vote
+            </li>
+            <li>
+              • Add the &quot;upvote content&quot; action to add your votes to
+              the entries
+            </li>
+            <li>• Any reply to the frame is considered an entry</li>
+            <li>
+              • Check the leaderboard after voting to see if your votes were
+              applied
+            </li>
+          </ul>
+        </div>
+      </FrameLayout>
+    ),
+    buttons: [
+      <Button
+        key="back"
+        action="post"
+        target={`/${contest_address}/contestCard`}
+      >
+        Back
+      </Button>,
+    ],
+  };
+});

packages/commonwealth/server/farcaster/router.tsx

@@ -1,11 +1,11 @@
 import express from 'express';
-import { contestCard, contestPrizes } from './frames/contest';
+import { contestCard, votingRules } from './frames/contest';
 
 const farcasterRouter = express.Router();
 
 // WARNING: do not change these paths because cloudflare may route to it
 farcasterRouter.get('/:contest_address/contestCard', contestCard);
 farcasterRouter.post('/:contest_address/contestCard', contestCard);
-farcasterRouter.post('/:contest_address/contestPrizes', contestPrizes);
+farcasterRouter.post('/:contest_address/votingRules', votingRules);
 
 export default farcasterRouter;