Add 'hide votes' option until poll has ended

Fixes #2

js/src/forum/components/CreatePollModal.js

@@ -19,6 +19,7 @@ export default class CreatePollModal extends Modal {
     this.endDate = Stream();
 
     this.publicPoll = Stream(false);
+    this.hideVotes = Stream(false);
     this.allowMultipleVotes = Stream(false);
     this.maxVotes = Stream(0);
 
@@ -37,6 +38,9 @@ export default class CreatePollModal extends Modal {
 
       this.question(poll.question);
       this.publicPoll(poll.publicPoll);
+      this.hideVotes(poll.hideVotes);
+      this.allowMultipleVotes(poll.allowMultipleVotes);
+      this.maxVotes(poll.maxVotes || 0);
 
       this.endDate(this.formatDate(poll.endDate));
 
@@ -135,6 +139,16 @@ export default class CreatePollModal extends Modal {
       20
     );
 
+    items.add(
+      'hide-votes',
+      <div className="Form-group">
+        <Switch state={this.endDate() && this.hideVotes()} onchange={this.hideVotes} disabled={!this.endDate()}>
+          {app.translator.trans('fof-polls.forum.modal.hide_votes_label')}
+        </Switch>
+      </div>,
+      20
+    );
+
     items.add(
       'allow-multiple-votes',
       <div className="Form-group">

js/src/forum/components/EditPollModal.js

@@ -18,6 +18,7 @@ export default class EditPollModal extends CreatePollModal {
     this.endDate = Stream(this.formatDate(this.poll.endDate()));
     this.publicPoll = Stream(this.poll.publicPoll());
     this.allowMultipleVotes = Stream(this.poll.allowMultipleVotes());
+    this.hideVotes = Stream(this.poll.hideVotes());
     this.maxVotes = Stream(this.poll.maxVotes() || 0);
 
     if (this.endDate() && dayjs(this.poll.endDate()).isAfter(dayjs())) {
@@ -95,6 +96,7 @@ export default class EditPollModal extends CreatePollModal {
       question: this.question(),
       endDate: this.dateToTimestamp(this.endDate()),
       publicPoll: this.publicPoll(),
+      hideVotes: this.hideVotes(),
       allowMultipleVotes: this.allowMultipleVotes(),
       maxVotes: this.maxVotes(),
       options,

js/src/forum/components/PostPoll.js

@@ -86,6 +86,7 @@ export default class PostPoll extends Component {
     // isNaN(null) is false, so we have to check type directly now that API always returns the field
     const canSeeVoteCount = typeof votes === 'number';
     const isDisabled = this.loadingOptions || (hasVoted && !poll.canChangeVote());
+    const width = canSeeVoteCount ? percent : (Number(voted) / (poll.myVotes()?.length || 1)) * 100;
 
     const bar = (
       <div className="PollBar" data-selected={voted}>
@@ -96,7 +97,7 @@ export default class PostPoll extends Component {
           </label>
         )}
 
-        <div style={canSeeVoteCount && '--width: ' + percent + '%'} className="PollOption-active" />
+        <div style={`--width: ${width}%`} className="PollOption-active" />
         <label className="PollAnswer">
           <span>{opt.answer()}</span>
           {opt.imageUrl() ? <img className="PollAnswerImage" src={opt.imageUrl()} alt={opt.answer()} /> : null}

js/src/forum/models/Poll.js

@@ -4,7 +4,9 @@ export default class Poll extends Model {
   question = Model.attribute('question');
   hasEnded = Model.attribute('hasEnded');
   endDate = Model.attribute('endDate');
+
   publicPoll = Model.attribute('publicPoll');
+  hideVotes = Model.attribute('hideVotes');
   allowMultipleVotes = Model.attribute('allowMultipleVotes');
   maxVotes = Model.attribute('maxVotes');
 

resources/less/forum.less

@@ -88,6 +88,14 @@
   .PollModal-Button {
     margin-bottom: 15px;
   }
+
+  .Checkbox.disabled {
+    &, [disabled] {
+      cursor: not-allowed;
+    }
+
+    opacity: 0.5;
+  }
 }
 
 .Post-poll {

resources/locale/en.yml

@@ -40,6 +40,7 @@ fof-polls:
       allow_multiple_votes_label: Allow people to vote for multiple options
       max_votes_label: Max votes per user
       max_votes_help: Set to 0 to allow users to vote for all options.
+      hide_votes_label: Hide votes until poll ends
       question_placeholder: Question
       submit: Submit
 

src/Access/PollPolicy.php

@@ -19,6 +19,10 @@ class PollPolicy extends AbstractPolicy
 {
     public function seeVoteCount(User $actor, Poll $poll)
     {
+        if ($poll->hide_votes && $poll->end_date && !$poll->hasEnded()) {
+            return $this->deny();
+        }
+
         if ($poll->myVotes($actor)->count() || $actor->can('polls.viewResultsWithoutVoting', $poll->post->discussion)) {
             return $this->allow();
         }

src/Commands/EditPollHandler.php

@@ -60,15 +60,12 @@ public function handle(EditPoll $command)
 
         if (isset($attributes['question'])) {
             $poll->question = $attributes['question'];
-            $d = $poll->settings['public_poll'];
         }
 
-        if (isset($attributes['publicPoll'])) {
-            $poll->settings['public_poll'] = (bool) $attributes['publicPoll'];
-        }
-
-        if (isset($attributes['allowMultipleVotes'])) {
-            $poll->settings['allow_multiple_votes'] = (bool) $attributes['allowMultipleVotes'];
+        foreach (['publicPoll', 'allowMultipleVotes', 'hideVotes'] as $key) {
+            if (isset($attributes[$key])) {
+                $poll->settings[Str::snake($key)] = (bool) $attributes[$key];
+            }
         }
 
         if (isset($attributes['maxVotes'])) {

src/Poll.php

@@ -25,6 +25,7 @@
  * @property-read bool             $public_poll
  * @property-read bool             $allow_multiple_votes
  * @property-read int              $max_votes
+ * @property-read bool             $hide_votes
  * @property int                   $vote_count
  * @property Post                  $post
  * @property User                  $user
@@ -158,4 +159,9 @@ protected function getAllowMultipleVotesAttribute() {
     protected function getMaxVotesAttribute() {
         return (int) Arr::get($this->settings, 'max_votes');
     }
+
+    protected function getHideVotesAttribute(): bool
+    {
+        return (bool) Arr::get($this->settings, 'hide_votes');
+    }
 }