feat(MultipleVote): create a config input for the vote limit

src/cards/NewPollFormCard.ts

@@ -28,6 +28,7 @@ export default class NewPollFormCard extends BaseCard {
     if (this.config.autoClose) {
       this.buildAutoCloseSection();
     }
+    this.buildMultipleVoteSection();
   }
 
   buildTopicInputSection() {
@@ -159,6 +160,67 @@ export default class NewPollFormCard extends BaseCard {
     });
   }
 
+  buildMultipleVoteSection() {
+    const widgets: chatV1.Schema$GoogleAppsCardV1Widget[] = [];
+
+    const items = [
+      {
+        'text': 'No Limit',
+        'value': '0',
+        'selected': false,
+      },
+      {
+        'text': '1',
+        'value': '1',
+        'selected': false,
+      },
+      {
+        'text': '2',
+        'value': '2',
+        'selected': false,
+      },
+      {
+        'text': '3',
+        'value': '3',
+        'selected': false,
+      },
+      {
+        'text': '4',
+        'value': '4',
+        'selected': false,
+      },
+      {
+        'text': '5',
+        'value': '5',
+        'selected': false,
+      },
+      {
+        'text': '6',
+        'value': '6',
+        'selected': false,
+      },
+    ];
+      // set selected item
+    if (this.config.voteLimit !== undefined && items?.[this.config.voteLimit]) {
+      items[this.config.voteLimit].selected = true;
+    } else {
+      items[1].selected = true;
+    }
+    widgets.push(
+      {
+        'selectionInput': {
+          'type': 'DROPDOWN',
+          'label': 'Vote Limit (Max options that can be voted)',
+          'name': 'vote_limit',
+          items,
+        },
+      });
+
+    this.card.sections!.push({
+      widgets,
+    });
+  }
+
   buildHelpText() {
     return {
       textParagraph: {

src/cards/PollCard.ts

@@ -6,8 +6,8 @@ import {progressBarText} from '../helpers/vote';
 import {createButton} from '../helpers/cards';
 
 export default class PollCard extends BaseCard {
-  private readonly state: PollState;
-  private readonly timezone: LocaleTimezone;
+  protected readonly state: PollState;
+  protected readonly timezone: LocaleTimezone;
 
   constructor(state: PollState, timezone: LocaleTimezone) {
     super();
@@ -31,6 +31,14 @@ export default class PollCard extends BaseCard {
     } else {
       this.card.header = this.cardHeader();
     }
+    this.buildInfoSection();
+  }
+
+  buildInfoSection() {
+    if (this.state.voteLimit === 0 || (this.state.voteLimit && this.state.voteLimit > 1)) {
+      const widgetHeader = this.sectionInfo();
+      this.card.sections!.push(widgetHeader);
+    }
   }
 
   getAuthorName() {
@@ -68,6 +76,19 @@ export default class PollCard extends BaseCard {
       ],
     };
   }
+  sectionInfo(): chatV1.Schema$GoogleAppsCardV1Section {
+    return {
+      widgets: [
+        {
+          'decoratedText': {
+            'text': '',
+            'wrapText': true,
+            'topLabel': `This poll allow multiple votes. Max Votes: ${this.state.voteLimit || 'No limit'}`,
+          },
+        },
+      ],
+    };
+  }
 
   buildSections() {
     const votes: Array<Array<Voter>> = Object.values(this.state.votes ?? {});
@@ -190,6 +211,10 @@ export default class PollCard extends BaseCard {
         },
       },
     };
+    if (this.state.voteLimit !== undefined && this.state.voteLimit !== 1) {
+      voteButton.onClick!.action!.interaction = 'OPEN_DIALOG';
+      voteButton.onClick!.action!.function = 'vote_form';
+    }
 
     if (this.isClosed()) {
       voteButton.disabled = true;

src/cards/PollDialogCard.ts

@@ -0,0 +1,76 @@
+import PollCard from './PollCard';
+import {LocaleTimezone, PollState, Voter} from '../helpers/interfaces';
+import {chat_v1 as chatV1} from '@googleapis/chat';
+import {progressBarText} from '../helpers/vote';
+
+export default class PollDialogCard extends PollCard {
+  private readonly voter: Voter;
+  private readonly userVotes: number[];
+
+  constructor(state: PollState, timezone: LocaleTimezone, voter: Voter) {
+    super(state, timezone);
+    this.voter = voter;
+    this.userVotes = this.getUserVotes();
+  }
+
+  getUserVotes(): number[] {
+    if (this.state.votes === undefined) {
+      return [];
+    }
+    const votes = [];
+    const voter = this.voter;
+    for (let i = 0; i < this.state.choices.length; i++) {
+      if (this.state.votes[i] !== undefined && this.state.votes[i].findIndex((x) => x.uid === voter.uid) > -1) {
+        votes.push(i);
+      }
+    }
+    return votes;
+  }
+
+  sectionInfo(): chatV1.Schema$GoogleAppsCardV1Section {
+    const votedCount = this.userVotes.length;
+    const voteLimit = this.state.voteLimit || this.state.choices.length;
+    const voteRemaining = voteLimit - votedCount;
+    let warningMessage = '';
+    if (voteRemaining === 0) {
+      warningMessage = 'Vote limit reached. Your vote will be overwritten.';
+    }
+    return {
+      widgets: [
+        {
+          'decoratedText': {
+            'text': `You have voted: ${votedCount} out of ${voteLimit} (remaining: ${voteRemaining})`,
+            'wrapText': true,
+            'bottomLabel': warningMessage,
+          },
+        },
+      ],
+    };
+  }
+  choice(index: number, text: string, voteCount: number, totalVotes: number): chatV1.Schema$GoogleAppsCardV1Widget {
+    const progressBar = progressBarText(voteCount, totalVotes);
+
+    const voteSwitch: chatV1.Schema$GoogleAppsCardV1SwitchControl = {
+      'controlType': 'SWITCH',
+      'name': 'mySwitchControl',
+      'value': 'myValue',
+      'selected': this.userVotes.includes(index),
+      'onChangeAction': {
+        'function': 'switch_vote',
+        'parameters': [
+          {
+            key: 'index',
+            value: index.toString(10),
+          },
+        ],
+      },
+    };
+    return {
+      decoratedText: {
+        'bottomLabel': `${progressBar} ${voteCount}`,
+        'text': text,
+        'switchControl': voteSwitch,
+      },
+    };
+  }
+}

src/cards/__mocks__/PollDialogCard.ts

@@ -0,0 +1,6 @@
+export const mockCreatePollDialogCard = jest.fn(() => 'card');
+export default jest.fn(() => {
+  return {
+    create: mockCreatePollDialogCard,
+  };
+});

src/handlers/ActionHandler.ts

@@ -1,7 +1,7 @@
 import {chat_v1 as chatV1} from '@googleapis/chat';
 import BaseHandler from './BaseHandler';
 import NewPollFormCard from '../cards/NewPollFormCard';
-import {addOptionToState, getConfigFromInput, getStateFromCard} from '../helpers/state';
+import {addOptionToState, getConfigFromInput, getStateFromCard, getStateFromMessageId} from '../helpers/state';
 import {callMessageApi} from '../helpers/api';
 import {createDialogActionResponse, createStatusActionResponse} from '../helpers/response';
 import PollCard from '../cards/PollCard';
@@ -13,6 +13,7 @@ import ClosePollFormCard from '../cards/ClosePollFormCard';
 import MessageDialogCard from '../cards/MessageDialogCard';
 import {createAutoCloseTask} from '../helpers/task';
 import ScheduleClosePollFormCard from '../cards/ScheduleClosePollFormCard';
+import PollDialogCard from '../cards/PollDialogCard';
 
 /*
 This list methods are used in the poll chat message
@@ -31,6 +32,10 @@ export default class ActionHandler extends BaseHandler implements PollAction {
         return await this.startPoll();
       case 'vote':
         return this.recordVote();
+      case 'switch_vote':
+        return this.switchVote();
+      case 'vote_form':
+        return this.voteForm();
       case 'add_option_form':
         return this.addOptionForm();
       case 'add_option':
@@ -120,7 +125,7 @@ export default class ActionHandler extends BaseHandler implements PollAction {
     const state = this.getEventPollState();
 
     // Add or update the user's selected option
-    state.votes = saveVotes(choice, voter, state.votes!, state.anon);
+    state.votes = saveVotes(choice, voter, state);
     const card = new PollCard(state, this.getUserTimezone());
     return {
       thread: this.event.message?.thread,
@@ -131,6 +136,43 @@ export default class ActionHandler extends BaseHandler implements PollAction {
     };
   }
 
+  /**
+   * Handle the custom vote action from poll dialog. Updates the state to record
+   * the UI will be showed as a dialog
+   * @param {boolean} eventPollState If true, the event state is from current event instead of calling API to get it
+   * @returns {object} Response to send back to Chat
+   */
+  async switchVote(eventPollState: boolean=false) {
+    const parameters = this.event.common?.parameters;
+    if (!(parameters?.['index'])) {
+      throw new Error('Index Out of Bounds');
+    }
+    const choice = parseInt(parameters['index']);
+    const userId = this.event.user?.name ?? '';
+    const userName = this.event.user?.displayName ?? '';
+    const voter: Voter = {uid: userId, name: userName};
+    let state;
+    if (!eventPollState && this.event!.message!.name) {
+      state = await getStateFromMessageId(this.event!.message!.name);
+    } else {
+      state = this.getEventPollState();
+    }
+
+
+    // Add or update the user's selected option
+    state.votes = saveVotes(choice, voter, state);
+    const cardMessage = new PollCard(state, this.getUserTimezone()).createMessage();
+    const request = {
+      name: this.event!.message!.name,
+      requestBody: cardMessage,
+      updateMask: 'cardsV2',
+    };
+    callMessageApi('update', request);
+
+    const card = new PollDialogCard(state, this.getUserTimezone(), voter);
+    return createDialogActionResponse(card.create());
+  }
+
   /**
    * Opens and starts a dialog that allows users to add details about a contact.
    *
@@ -265,6 +307,10 @@ export default class ActionHandler extends BaseHandler implements PollAction {
     return createDialogActionResponse(new ScheduleClosePollFormCard(state, this.getUserTimezone()).create());
   }
 
+  async voteForm() {
+    return await this.switchVote(true);
+  }
+
   newPollOnChange() {
     const formValues: PollFormInputs = this.event.common!.formInputs! as PollFormInputs;
     const config = getConfigFromInput(formValues);

src/handlers/TaskHandler.ts

@@ -56,6 +56,7 @@ export default class TaskHandler {
     const apiResponse = await callMessageApi('get', request);
     const currentState = getStateFromCardName(apiResponse.data.cardsV2?.[0].card ?? {});
     if (!currentState) {
+      console.log(apiResponse ? JSON.stringify(apiResponse) : 'empty response:' + this.event.id);
       throw new Error('State not found');
     }
     this.event.space = apiResponse.data.space;

src/helpers/interfaces.ts

@@ -28,6 +28,7 @@ export interface PollConfig {
   topic: string,
   type?: ClosableType,
   closedTime?: number,
+  voteLimit?: number,
 }
 
 export interface PollForm extends PollConfig {

src/helpers/state.ts

@@ -1,6 +1,7 @@
 import {ClosableType, PollForm, PollFormInputs, PollState} from './interfaces';
 import {chat_v1 as chatV1} from '@googleapis/chat';
 import {MAX_NUM_OF_OPTIONS} from '../config/default';
+import {callMessageApi} from './api';
 
 /**
  * Add a new option to the state(like DB)
@@ -57,6 +58,7 @@ export function getConfigFromInput(formValues: PollFormInputs) {
   state.autoMention = getStringInputValue(formValues.auto_mention) === '1';
   state.closedTime = parseInt(formValues.close_schedule_time?.dateTimeInput!.msSinceEpoch ?? '0');
   state.choices = getChoicesFromInput(formValues);
+  state.voteLimit = parseInt(getStringInputValue(formValues.vote_limit) || '1');
   return state;
 }
 
@@ -79,3 +81,16 @@ function getStateFromParameter(event: chatV1.Schema$DeprecatedEvent) {
 
   return parameters?.['state'];
 }
+
+export async function getStateFromMessageId(eventId: string): Promise<PollState> {
+  const request = {
+    name: eventId,
+  };
+  const apiResponse = await callMessageApi('get', request);
+  const currentState = getStateFromCardName(apiResponse.data.cardsV2?.[0].card ?? {});
+  if (!currentState) {
+    console.log(apiResponse ? JSON.stringify(apiResponse) : 'empty response:' + eventId);
+    throw new Error('State not found');
+  }
+  return JSON.parse(currentState) as PollState;
+}