stream-chat 9.52.1 → 9.54.0

package/src/poll.ts

@@ -1,5 +1,6 @@
 import { StateStore } from './store';
 import type { StreamChat } from './client';
+import { getMaxVotedOptionIds, OptimisticPollVotes } from './poll_optimistic_votes';
 import type {
   Event,
   PartialPollUpdate,
@@ -90,12 +91,17 @@ export class Poll {
   public readonly state: StateStore<PollState>;
   public id: string;
   private client: StreamChat;
+  private optimisticVotes: OptimisticPollVotes;
+  // Set whenever server data (WS event or rehydration) confirms that the poll is closed,
+  // so that a failed optimistic close does not reopen a poll that is actually closed.
+  private closeConfirmed = false;
 
   constructor({ client, poll }: PollInitOptions) {
     this.client = client;
     this.id = poll.id;
 
     this.state = new StateStore<PollState>(this.getInitialStateFromPollResponse(poll));
+    this.optimisticVotes = new OptimisticPollVotes({ client: this.client, poll: this });
   }
 
   private getInitialStateFromPollResponse = (poll: PollInitOptions['poll']) => {
@@ -127,15 +133,45 @@ export class Poll {
     };
   };
 
+  // persists only the server's votes, never the optimistic ones
   private upsertOfflineDb = () => {
+    const serverState = this.optimisticVotes.withServerVotes(this.data);
     this.client.offlineDb?.executeQuerySafely(
-      (db) => db.upsertPoll({ poll: mapPollStateToResponse(this) }),
+      (db) => db.upsertPoll({ poll: mapPollStateToResponse(this, serverState) }),
       { method: 'upsertPoll' },
     );
   };
 
   public reinitializeState = (poll: PollInitOptions['poll']) => {
-    this.state.partialNext(this.getInitialStateFromPollResponse(poll));
+    if (poll.is_closed) this.closeConfirmed = true;
+    const initialState = this.getInitialStateFromPollResponse(poll);
+    this.optimisticVotes.reset(initialState);
+    this.state.partialNext(initialState);
+  };
+
+  // Hands the vote state of a WS vote event to the optimistic votes, which decide whether to show it.
+  private updateFromVoteEvent = (
+    event: Event & {
+      created_at: string;
+      poll: PollResponse;
+      poll_vote: PollVote | PollAnswer;
+    },
+    ownVotesByOptionId: Record<OptionId, PollVote>,
+    answerState: Pick<PollState, 'latest_answers' | 'ownAnswer'>,
+  ) => {
+    const isOwnVote = event.poll_vote.user_id === this.client.userID;
+    const shownVoteState = this.optimisticVotes.handleVoteEvent(event.poll, {
+      confirmsOwnVote:
+        isOwnVote && !isVoteAnswer(event.poll_vote) && !!event.poll_vote.option_id,
+      ownVotesByOptionId,
+    });
+    this.state.partialNext({
+      ...answerState,
+      answers_count: event.poll.answers_count,
+      lastActivityAt: new Date(event.created_at),
+      ...shownVoteState,
+    });
+    this.upsertOfflineDb();
   };
 
   get data(): PollState {
@@ -147,6 +183,7 @@ export class Poll {
     if (!isPollUpdatedEvent(event)) return;
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     const { id, ...pollData } = extractPollData(event.poll);
+    if (pollData.is_closed) this.closeConfirmed = true;
     // @ts-expect-error type mismatch
     this.state.partialNext({ ...pollData, lastActivityAt: new Date(event.created_at) });
     this.upsertOfflineDb();
@@ -155,6 +192,7 @@ export class Poll {
   public handlePollClosed = (event: Event) => {
     if (event.poll?.id && event.poll.id !== this.id) return;
     if (!isPollClosedEventEvent(event)) return;
+    this.closeConfirmed = true;
     this.state.partialNext({
       is_closed: true,
       lastActivityAt: new Date(event.created_at),
@@ -169,8 +207,7 @@ export class Poll {
     const isOwnVote = event.poll_vote.user_id === this.client.userID;
     let latestAnswers = [...(currentState.latest_answers as PollAnswer[])];
     let ownAnswer = currentState.ownAnswer;
-    const ownVotesByOptionId = currentState.ownVotesByOptionId;
-    let maxVotedOptionIds = currentState.maxVotedOptionIds;
+    const ownVotesByOptionId = { ...this.optimisticVotes.serverOwnVotes };
 
     if (isOwnVote) {
       if (isVoteAnswer(event.poll_vote)) {
@@ -182,20 +219,12 @@ export class Poll {
 
     if (isVoteAnswer(event.poll_vote)) {
       latestAnswers = [event.poll_vote, ...latestAnswers];
-    } else {
-      maxVotedOptionIds = getMaxVotedOptionIds(event.poll.vote_counts_by_option);
     }
 
-    const pollEnrichData = extractPollEnrichedData(event.poll);
-    this.state.partialNext({
-      ...pollEnrichData,
+    this.updateFromVoteEvent(event, ownVotesByOptionId, {
       latest_answers: latestAnswers,
-      lastActivityAt: new Date(event.created_at),
       ownAnswer,
-      ownVotesByOptionId,
-      maxVotedOptionIds,
     });
-    this.upsertOfflineDb();
   };
 
   public handleVoteChanged = (event: Event) => {
@@ -206,8 +235,7 @@ export class Poll {
     const isOwnVote = event.poll_vote.user_id === this.client.userID;
     let latestAnswers = [...(currentState.latest_answers as PollAnswer[])];
     let ownAnswer = currentState.ownAnswer;
-    let ownVotesByOptionId = currentState.ownVotesByOptionId;
-    let maxVotedOptionIds = currentState.maxVotedOptionIds;
+    let ownVotesByOptionId = this.optimisticVotes.serverOwnVotes;
 
     if (isOwnVote) {
       if (isVoteAnswer(event.poll_vote)) {
@@ -238,24 +266,15 @@ export class Poll {
         if (ownAnswer?.id === event.poll_vote.id) {
           ownAnswer = undefined;
         }
-        maxVotedOptionIds = getMaxVotedOptionIds(event.poll.vote_counts_by_option);
       }
     } else if (isVoteAnswer(event.poll_vote)) {
       latestAnswers = [event.poll_vote, ...latestAnswers];
-    } else {
-      maxVotedOptionIds = getMaxVotedOptionIds(event.poll.vote_counts_by_option);
     }
 
-    const pollEnrichData = extractPollEnrichedData(event.poll);
-    this.state.partialNext({
-      ...pollEnrichData,
+    this.updateFromVoteEvent(event, ownVotesByOptionId, {
       latest_answers: latestAnswers,
-      lastActivityAt: new Date(event.created_at),
       ownAnswer,
-      ownVotesByOptionId,
-      maxVotedOptionIds,
     });
-    this.upsertOfflineDb();
   };
 
   public handleVoteRemoved = (event: Event) => {
@@ -265,31 +284,21 @@ export class Poll {
     const isOwnVote = event.poll_vote.user_id === this.client.userID;
     let latestAnswers = [...(currentState.latest_answers as PollAnswer[])];
     let ownAnswer = currentState.ownAnswer;
-    const ownVotesByOptionId = { ...currentState.ownVotesByOptionId };
-    let maxVotedOptionIds = currentState.maxVotedOptionIds;
+    const ownVotesByOptionId = { ...this.optimisticVotes.serverOwnVotes };
 
     if (isVoteAnswer(event.poll_vote)) {
       latestAnswers = latestAnswers.filter((answer) => answer.id !== event.poll_vote.id);
       if (isOwnVote) {
         ownAnswer = undefined;
       }
-    } else {
-      maxVotedOptionIds = getMaxVotedOptionIds(event.poll.vote_counts_by_option);
-      if (isOwnVote && event.poll_vote.option_id) {
-        delete ownVotesByOptionId[event.poll_vote.option_id];
-      }
+    } else if (isOwnVote && event.poll_vote.option_id) {
+      delete ownVotesByOptionId[event.poll_vote.option_id];
     }
 
-    const pollEnrichData = extractPollEnrichedData(event.poll);
-    this.state.partialNext({
-      ...pollEnrichData,
+    this.updateFromVoteEvent(event, ownVotesByOptionId, {
       latest_answers: latestAnswers,
-      lastActivityAt: new Date(event.created_at),
       ownAnswer,
-      ownVotesByOptionId,
-      maxVotedOptionIds,
     });
-    this.upsertOfflineDb();
   };
 
   query = async (id: string) => {
@@ -304,7 +313,26 @@ export class Poll {
   partialUpdate = async (partialPollObject: PartialPollUpdate) =>
     await this.client.partialUpdatePoll(this.id as string, partialPollObject);
 
-  close = async () => await this.client.closePoll(this.id as string);
+  /**
+   * Closes the poll. The poll is marked as closed optimistically and the change is
+   * reverted if the request fails, unless the server confirmed the close meanwhile.
+   * Does nothing if the poll is already closed.
+   */
+  close = async () => {
+    if (this.data.is_closed) return;
+
+    this.closeConfirmed = false;
+    this.state.partialNext({ is_closed: true });
+
+    try {
+      return await this.client.closePoll(this.id as string);
+    } catch (error) {
+      if (!this.closeConfirmed) {
+        this.state.partialNext({ is_closed: false });
+      }
+      throw error;
+    }
+  };
 
   delete = async () => await this.client.deletePoll(this.id as string);
 
@@ -317,6 +345,11 @@ export class Poll {
   deleteOption = async (optionId: string) =>
     await this.client.deletePollOption(this.id as string, optionId);
 
+  /**
+   * Casts a vote for an option. The vote is shown right away through a local placeholder vote,
+   * which the server's vote replaces once the WS events of all pending vote changes arrived.
+   * If the request fails, the change is reverted.
+   */
   castVote = async (optionId: string, messageId: string) => {
     const { max_votes_allowed, ownVotesByOptionId } = this.data;
 
@@ -336,13 +369,17 @@ export class Poll {
       });
       return;
     }
-    return await this.client.castPollVote(messageId, this.id as string, {
-      option_id: optionId,
-    });
+
+    return await this.optimisticVotes.castVote(optionId, messageId);
   };
 
+  /**
+   * Removes a vote. The vote is removed right away and restored if the request fails. Vote
+   * requests are sent in order, so removing a vote whose cast is not confirmed yet uses the vote
+   * id from the cast's response; if that cast failed, there is nothing to remove.
+   */
   removeVote = async (voteId: string, messageId: string) =>
-    await this.client.removePollVote(messageId, this.id as string, voteId);
+    await this.optimisticVotes.removeVote(voteId, messageId);
 
   addAnswer = async (answerText: string, messageId: string) =>
     await this.client.addPollAnswer(messageId, this.id as string, answerText);
@@ -367,20 +404,6 @@ export class Poll {
     );
 }
 
-function getMaxVotedOptionIds(voteCountsByOption: PollResponse['vote_counts_by_option']) {
-  let maxVotes = 0;
-  let winningOptions: string[] = [];
-  for (const [id, count] of Object.entries(voteCountsByOption ?? {})) {
-    if (count > maxVotes) {
-      winningOptions = [id];
-      maxVotes = count;
-    } else if (count === maxVotes) {
-      winningOptions.push(id);
-    }
-  }
-  return winningOptions;
-}
-
 function getOwnVotesByOptionId(ownVotes: PollVote[]) {
   return !ownVotes
     ? ({} as Record<OptionId, PollVote>)
@@ -406,7 +429,10 @@ export function extractPollData(pollResponse: PollResponse): PollData {
   };
 }
 
-export function mapPollStateToResponse(poll: Poll): PollResponse {
+export function mapPollStateToResponse(
+  poll: Poll,
+  state: PollState = poll.data,
+): PollResponse {
   const {
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     lastActivityAt,
@@ -415,7 +441,7 @@ export function mapPollStateToResponse(poll: Poll): PollResponse {
     ownVotesByOptionId,
     ownAnswer,
     ...restState
-  } = poll.data;
+  } = state;
   const ownVotes = [
     ...Object.values(ownVotesByOptionId),
     ...(ownAnswer ? [ownAnswer] : []),

package/src/poll_optimistic_votes.ts

@@ -0,0 +1,321 @@
+import type { StreamChat } from './client';
+import type { Poll, PollState } from './poll';
+import type { PollResponse, PollVote } from './types';
+import { generateUUIDv4 } from './utils';
+import { hasPending, withoutConcurrency } from './utils/concurrency';
+
+type OptionId = string;
+
+// The vote fields of the poll state that optimistic updates change
+type VoteState = Pick<
+  PollState,
+  'latest_votes_by_option' | 'ownVotesByOptionId' | 'vote_count' | 'vote_counts_by_option'
+>;
+
+// An own vote change is the server vote of a cast, or the option of a removal
+type OwnVoteChange = { optionId: OptionId; vote?: PollVote };
+
+// How long to wait for missing WS events of own vote changes after the last request finished
+const CATCH_UP_TIMEOUT_MS = 3000;
+
+/**
+ * Optimistic updates for the current user's votes on a poll. Vote changes are shown right away.
+ * While any of them is not confirmed by its WS event, vote events are only stored, as the server
+ * state they carry does not contain the pending changes yet. Once all are confirmed (a failed
+ * request counts as confirmed), the server's vote state is shown, which also reverts failed changes.
+ * Vote requests are sent one after another, so the server applies them in the order they were made.
+ * A lost WS event is recovered from after CATCH_UP_TIMEOUT_MS (see applySucceededChanges).
+ */
+export class OptimisticPollVotes {
+  // The server's vote state. WS events only carry the vote that changed, so own votes are kept here.
+  private serverVoteState: VoteState;
+  // Own vote changes not confirmed by a WS event yet
+  private pendingCount = 0;
+  // Own vote changes whose requests succeeded since the server's vote state was last shown
+  private succeededChanges: OwnVoteChange[] = [];
+  // Vote requests with this tag are sent one after another. A symbol, so it is unique per instance.
+  private readonly requestTag = Symbol('poll-votes');
+  private catchUpTimeout?: ReturnType<typeof setTimeout>;
+
+  private readonly client: StreamChat;
+  private readonly poll: Poll;
+
+  constructor({ client, poll }: { client: StreamChat; poll: Poll }) {
+    this.client = client;
+    this.poll = poll;
+    this.serverVoteState = pickVoteState(poll.data);
+  }
+
+  get serverOwnVotes() {
+    return this.serverVoteState.ownVotesByOptionId;
+  }
+
+  withServerVotes = (pollState: PollState): PollState => ({
+    ...pollState,
+    ...this.serverVoteState,
+  });
+
+  /**
+   * Casts a vote for an option, shown right away through a placeholder vote. In polls with unique
+   * votes, it replaces the existing own votes.
+   */
+  castVote = (optionId: OptionId, messageId: string) => {
+    const sendRequest = () =>
+      this.client.castPollVote(messageId, this.poll.id, { option_id: optionId });
+    const state = this.poll.data;
+    // already voted for this option, there is nothing to show
+    if (state.ownVotesByOptionId[optionId]) return this.send(sendRequest);
+
+    const replacedVotes = state.enforce_unique_vote
+      ? Object.values(state.ownVotesByOptionId)
+      : [];
+    this.poll.state.partialNext(
+      applyOwnVoteDelta(state, {
+        add: [this.createPlaceholderVote(optionId)],
+        remove: replacedVotes,
+      }),
+    );
+    return this.track(sendRequest, (response) => ({
+      optionId,
+      vote: response.vote as PollVote,
+    }));
+  };
+
+  // Removes a vote, right away.
+  removeVote = (voteId: string, messageId: string) => {
+    const sendRequest = (id: string) =>
+      this.client.removePollVote(messageId, this.poll.id, id);
+    const state = this.poll.data;
+    const vote = Object.values(state.ownVotesByOptionId).find(({ id }) => id === voteId);
+    // not a shown own vote, there is nothing to show
+    if (!vote?.option_id) return this.send(() => sendRequest(voteId));
+
+    const optionId = vote.option_id;
+    this.poll.state.partialNext(applyOwnVoteDelta(state, { remove: [vote] }));
+    return this.track(
+      // runs when the removal's turn comes, so a preceding cast of the vote has finished
+      () => {
+        const serverVoteId = this.getServerVoteId(vote);
+        // the vote's cast failed, so there is nothing to remove
+        return serverVoteId ? sendRequest(serverVoteId) : Promise.resolve(undefined);
+      },
+      () => ({ optionId }),
+    );
+  };
+
+  // Sends a vote request once the previous one has finished, whether it succeeded or not.
+  private send = async <T>(sendRequest: () => Promise<T>): Promise<T> => {
+    try {
+      return (await withoutConcurrency(this.requestTag, sendRequest)) as T;
+    } finally {
+      // once nothing is left to send, wait for the WS events of the pending changes
+      if (!hasPending(this.requestTag)) this.scheduleCatchUp();
+    }
+  };
+
+  // Stores the vote state of a WS vote event and returns the vote fields to show, if any.
+  handleVoteEvent = (
+    poll: PollResponse,
+    {
+      confirmsOwnVote,
+      ownVotesByOptionId,
+    }: { confirmsOwnVote: boolean; ownVotesByOptionId: Record<OptionId, PollVote> },
+  ): Partial<PollState> => {
+    this.serverVoteState = {
+      latest_votes_by_option: poll.latest_votes_by_option,
+      ownVotesByOptionId,
+      vote_count: poll.vote_count,
+      vote_counts_by_option: poll.vote_counts_by_option,
+    };
+    if (confirmsOwnVote) this.pendingCount = Math.max(this.pendingCount - 1, 0);
+    return this.pendingCount > 0 ? {} : this.takeServerVoteState();
+  };
+
+  // Fresh server state (e.g. a refetch) replaces everything, pending changes are dropped.
+  reset = (pollState: PollState) => {
+    this.serverVoteState = pickVoteState(pollState);
+    this.pendingCount = 0;
+    this.succeededChanges = [];
+    clearTimeout(this.catchUpTimeout);
+  };
+
+  // Tracks an own vote change until its request settles. `sendRequest` resolves to undefined
+  // when no request was needed.
+  private track = async <T>(
+    sendRequest: () => Promise<T | undefined>,
+    toChange: (response: T) => OwnVoteChange,
+  ) => {
+    this.pendingCount += 1;
+    clearTimeout(this.catchUpTimeout);
+
+    let response: T | undefined;
+    try {
+      response = await this.send(async () => {
+        const result = await sendRequest();
+        // recorded before the next request is sent, as a removal looks up the vote id in here
+        if (result !== undefined) this.succeededChanges.push(toChange(result));
+        return result;
+      });
+    } catch (error) {
+      this.settleWithoutEvent();
+      throw error;
+    }
+    if (response === undefined) this.settleWithoutEvent();
+    return response;
+  };
+
+  // A failed or skipped request gets no WS event, so it counts as confirmed right away.
+  private settleWithoutEvent = () => {
+    this.pendingCount = Math.max(this.pendingCount - 1, 0);
+    if (this.pendingCount === 0) this.poll.state.partialNext(this.takeServerVoteState());
+  };
+
+  // The vote shown for a cast until the server's vote arrives
+  private createPlaceholderVote = (optionId: OptionId): PollVote => {
+    const now = new Date().toISOString();
+    return {
+      created_at: now,
+      id: `local-${generateUUIDv4()}`,
+      option_id: optionId,
+      poll_id: this.poll.id,
+      updated_at: now,
+      user: this.client.user,
+      user_id: this.client.userID,
+    };
+  };
+
+  /**
+   * The server id of a vote to remove, once everything sent before the removal has finished. Casts
+   * and removals of an option alternate, so the option's last succeeded change tells: a cast is the
+   * vote being removed (e.g. a placeholder), a removal means the cast in between failed. Without
+   * one, the server's own vote of the option is the vote being removed.
+   */
+  private getServerVoteId = (vote: PollVote) => {
+    for (let i = this.succeededChanges.length - 1; i >= 0; i--) {
+      const change = this.succeededChanges[i];
+      if (change.optionId === vote.option_id) return change.vote?.id;
+    }
+    return this.serverVoteState.ownVotesByOptionId[vote.option_id as OptionId]?.id;
+  };
+
+  private takeServerVoteState = () => {
+    clearTimeout(this.catchUpTimeout);
+    this.succeededChanges = [];
+    return {
+      ...this.serverVoteState,
+      maxVotedOptionIds: getMaxVotedOptionIds(this.serverVoteState.vote_counts_by_option),
+    };
+  };
+
+  private scheduleCatchUp = () => {
+    clearTimeout(this.catchUpTimeout);
+    if (this.pendingCount === 0) return;
+    this.catchUpTimeout = setTimeout(this.applySucceededChanges, CATCH_UP_TIMEOUT_MS);
+  };
+
+  /**
+   * A WS event of an own vote change got lost, so the server's own votes are stale. All requests
+   * have finished (the timeout starts once nothing is left to send and a new request cancels it),
+   * so applying the succeeded changes in order gives the server's own votes (changes whose events
+   * did arrive end up the same). They are shown with the vote counts of the last WS event, which
+   * contain the other users' votes too.
+   */
+  private applySucceededChanges = () => {
+    const { enforce_unique_vote } = this.poll.data;
+    let ownVotesByOptionId = { ...this.serverVoteState.ownVotesByOptionId };
+    for (const { optionId, vote } of this.succeededChanges) {
+      if (!vote) {
+        delete ownVotesByOptionId[optionId];
+      } else if (enforce_unique_vote) {
+        ownVotesByOptionId = { [optionId]: vote };
+      } else {
+        ownVotesByOptionId[optionId] = vote;
+      }
+    }
+
+    this.serverVoteState = { ...this.serverVoteState, ownVotesByOptionId };
+    this.pendingCount = 0;
+    // also drops a failed vote that was still shown
+    this.poll.state.partialNext(this.takeServerVoteState());
+  };
+}
+
+function pickVoteState(state: PollState): VoteState {
+  return {
+    latest_votes_by_option: state.latest_votes_by_option,
+    ownVotesByOptionId: state.ownVotesByOptionId,
+    vote_count: state.vote_count,
+    vote_counts_by_option: state.vote_counts_by_option,
+  };
+}
+
+/**
+ * Adds and removes the current user's votes: own votes, vote counts, latest votes and the
+ * max-voted options. Returns new objects so that state selectors pick up the change.
+ */
+function applyOwnVoteDelta(
+  state: PollState,
+  { add = [], remove = [] }: { add?: PollVote[]; remove?: PollVote[] },
+): VoteState & Pick<PollState, 'maxVotedOptionIds'> {
+  const ownVotesByOptionId = { ...state.ownVotesByOptionId };
+  const voteCountsByOption = { ...state.vote_counts_by_option };
+  // null for anonymous polls, in which case there is nothing to update
+  const latestVotesByOption = state.latest_votes_by_option
+    ? { ...state.latest_votes_by_option }
+    : state.latest_votes_by_option;
+  let voteCount = state.vote_count ?? 0;
+
+  for (const vote of remove) {
+    const optionId = vote.option_id;
+    if (!optionId) continue;
+    delete ownVotesByOptionId[optionId];
+    // the server omits options without votes, so a count that drops to 0 is removed
+    const optionVoteCount = (voteCountsByOption[optionId] ?? 0) - 1;
+    if (optionVoteCount > 0) {
+      voteCountsByOption[optionId] = optionVoteCount;
+    } else {
+      delete voteCountsByOption[optionId];
+    }
+    voteCount = Math.max(voteCount - 1, 0);
+    if (latestVotesByOption?.[optionId]) {
+      latestVotesByOption[optionId] = latestVotesByOption[optionId].filter(
+        (latestVote) => latestVote.id !== vote.id,
+      );
+    }
+  }
+
+  for (const vote of add) {
+    const optionId = vote.option_id;
+    if (!optionId) continue;
+    ownVotesByOptionId[optionId] = vote;
+    voteCountsByOption[optionId] = (voteCountsByOption[optionId] ?? 0) + 1;
+    voteCount += 1;
+    if (latestVotesByOption && state.voting_visibility !== 'anonymous') {
+      latestVotesByOption[optionId] = [vote, ...(latestVotesByOption[optionId] ?? [])];
+    }
+  }
+
+  return {
+    latest_votes_by_option: latestVotesByOption,
+    maxVotedOptionIds: getMaxVotedOptionIds(voteCountsByOption),
+    ownVotesByOptionId,
+    vote_count: voteCount,
+    vote_counts_by_option: voteCountsByOption,
+  };
+}
+
+export function getMaxVotedOptionIds(
+  voteCountsByOption: PollResponse['vote_counts_by_option'],
+) {
+  let maxVotes = 0;
+  let winningOptions: string[] = [];
+  for (const [id, count] of Object.entries(voteCountsByOption ?? {})) {
+    if (count > maxVotes) {
+      winningOptions = [id];
+      maxVotes = count;
+    } else if (count === maxVotes) {
+      winningOptions.push(id);
+    }
+  }
+  return winningOptions;
+}