feat(Poll): add option to randomize poll choices

Author: brymut

api/resolvers/item.js

@@ -1152,6 +1152,13 @@ export default {
 
       poll.options = options
       poll.count = options.reduce((t, o) => t + o.count, 0)
+      const pollSettings = await models.item.findFirst({
+        where: {
+          id: item.id
+        },
+        select: { randPollOptions: true }
+      })
+      poll.randPollOptions = pollSettings?.randPollOptions || false
 
       return poll
     },

api/typeDefs/item.js

@@ -57,7 +57,7 @@ export default gql`
       text: String!, url: String!, boost: Int, status: String, logo: Int): ItemPaidAction!
     upsertPoll(
       id: ID, sub: String, title: String!, text: String, options: [String!]!, boost: Int, forward: [ItemForwardInput], pollExpiresAt: Date,
-      hash: String, hmac: String): ItemPaidAction!
+      randPollOptions: Boolean, hash: String, hmac: String): ItemPaidAction!
     updateNoteId(id: ID!, noteId: String!): Item!
     upsertComment(id: ID, text: String!, parentId: ID, boost: Int, hash: String, hmac: String): ItemPaidAction!
     act(id: ID!, sats: Int, act: String, hasSendWallet: Boolean): ItemActPaidAction!
@@ -81,6 +81,7 @@ export default gql`
     meInvoiceActionState: InvoiceActionState
     count: Int!
     options: [PollOption!]!
+    randPollOptions: Boolean
   }
 
   type Items {

components/adv-post-form.js

@@ -311,6 +311,16 @@ export default function AdvPostForm ({ children, item, sub, storageKeyPrefix })
             }
               name='crosspost'
             />}
+          {me && itemType === 'poll' &&
+            <Checkbox
+              label={
+                <div className='d-flex align-items-center'>randomize order of poll choices
+                </div>
+            }
+              name='randPollOptions'
+              checked={formik?.values.randPollOptions}
+              onChange={formik.handleChange}
+            />}
         </>
       }
     />

components/poll-form.js

@@ -30,6 +30,7 @@ export function PollForm ({ item, sub, editThreshold, children }) {
         text: item?.text || '',
         options: initialOptions || ['', ''],
         crosspost: item ? !!item.noteId : me?.privates?.nostrCrossposting,
+        randPollOptions: item?.poll?.randPollOptions || false,
         pollExpiresAt: item ? item.pollExpiresAt : datePivot(new Date(), { hours: 25 }),
         ...AdvPostInitial({ forward: normalizeForwards(item?.forwards), boost: item?.boost }),
         ...SubSelectInitial({ sub: item?.subName || sub?.name })

components/poll.js

@@ -1,5 +1,7 @@
+import { useState, useLayoutEffect } from 'react'
 import Button from 'react-bootstrap/Button'
 import { fixedDecimal, numWithUnits } from '@/lib/format'
+import { shuffleArray } from '@/lib/rand'
 import { timeLeft } from '@/lib/time'
 import { useMe } from './me'
 import styles from './poll.module.css'
@@ -14,6 +16,13 @@ export default function Poll ({ item }) {
   const { me } = useMe()
   const pollVote = usePollVote({ query: POLL_VOTE, itemId: item.id })
   const toaster = useToast()
+  const [pollOptions, setPollOptions] = useState(item.poll.options)
+
+  useLayoutEffect(() => {
+    if (item.poll.randPollOptions) {
+      setPollOptions(shuffleArray(item.poll.options))
+    }
+  }, [])
 
   const PollButton = ({ v }) => {
     return (
@@ -75,7 +84,7 @@ export default function Poll ({ item }) {
   const pollCount = item.poll.count
   return (
     <div className={styles.pollBox}>
-      {item.poll.options.map(v =>
+      {pollOptions.map(v =>
         showPollButton
           ? <PollButton key={v.id} v={v} />
           : <PollResult

fragments/items.js

@@ -152,6 +152,7 @@ export const POLL_FIELDS = gql`
         option
         count
       }
+      randPollOptions
     }
   }`
 

fragments/paidAction.js

@@ -192,10 +192,10 @@ export const UPSERT_POLL = gql`
   ${PAID_ACTION}
   mutation upsertPoll($sub: String, $id: ID, $title: String!, $text: String,
     $options: [String!]!, $boost: Int, $forward: [ItemForwardInput], $pollExpiresAt: Date,
-    ${HASH_HMAC_INPUT_1}) {
+    $randPollOptions: Boolean, ${HASH_HMAC_INPUT_1}) {
     upsertPoll(sub: $sub, id: $id, title: $title, text: $text,
       options: $options, boost: $boost, forward: $forward, pollExpiresAt: $pollExpiresAt,
-      ${HASH_HMAC_INPUT_2}) {
+      randPollOptions: $randPollOptions, ${HASH_HMAC_INPUT_2}) {
       result {
         id
         deleteScheduledAt

lib/rand.js

@@ -1,3 +1,7 @@
 export function randInRange (min, max) {
   return Math.random() * (max - min) + min
 }
+
+export function shuffleArray (array) {
+  return [...array].sort(() => Math.random() - 0.5)
+}

lib/validate.js

@@ -291,6 +291,7 @@ export function pollSchema ({ numExistingChoices = 0, ...args }) {
       test: arr => arr.length >= MIN_POLL_NUM_CHOICES - numExistingChoices
     }),
     pollExpiresAt: date().nullable().min(datePivot(new Date(), { days: 1 }), 'Expiration must be at least 1 day in the future'),
+    randPollOptions: boolean(),
     ...advPostSchemaMembers(args),
     ...subSelectSchemaMembers(args)
   }).test({

prisma/migrations/20250408172602_add_randomize_poll_choices_field/migration.sql

@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "Item" ADD COLUMN     "randPollOptions" BOOLEAN NOT NULL DEFAULT false;

prisma/schema.prisma

@@ -600,6 +600,7 @@ model Item {
   PollBlindVote        PollBlindVote[]
   ItemUserAgg          ItemUserAgg[]
   AutoSocialPost       AutoSocialPost[]
+  randPollOptions      Boolean               @default(false)
 
   @@index([uploadId])
   @@index([lastZapAt])