Merge branch 'next-polls' into 'next'

Next: Polls

See merge request soapbox-pub/soapbox-fe!1153

app/soapbox/components/poll.js

@@ -9,6 +9,7 @@ import spring from 'react-motion/lib/spring';
 import { openModal } from 'soapbox/actions/modals';
 import { vote, fetchPoll } from 'soapbox/actions/polls';
 import Icon from 'soapbox/components/icon';
+import { Text } from 'soapbox/components/ui';
 import Motion from 'soapbox/features/ui/util/optional_motion';
 import SoapboxPropTypes from 'soapbox/utils/soapbox_prop_types';
 
@@ -106,7 +107,7 @@ class Poll extends ImmutablePureComponent {
         {showResults && (
           <Motion defaultStyle={{ width: 0 }} style={{ width: spring(percent, { stiffness: 180, damping: 12 }) }}>
             {({ width }) =>
-              <span className={classNames('poll__chart', { leading })} style={{ width: `${width}%` }} />
+              <span className={classNames('poll__chart bg-gray-300 dark:bg-slate-900', { 'bg-primary-300 dark:bg-primary-400': leading })} style={{ width: `${width}%` }} />
             }
           </Motion>
         )}
@@ -163,9 +164,15 @@ class Poll extends ImmutablePureComponent {
 
         <div className='poll__footer'>
           {!showResults && <button className='button button-secondary' disabled={disabled} onClick={this.handleVote}><FormattedMessage id='poll.vote' defaultMessage='Vote' /></button>}
-          {showResults && !this.props.disabled && <span><button className='poll__link' onClick={this.handleRefresh}><FormattedMessage id='poll.refresh' defaultMessage='Refresh' /></button> · </span>}
-          <FormattedMessage id='poll.total_votes' defaultMessage='{count, plural, one {# vote} other {# votes}}' values={{ count: poll.get('votes_count') }} />
-          {poll.get('expires_at') && <span> · {timeRemaining}</span>}
+          <Text>
+            {showResults && !this.props.disabled && (
+              <span><button className='poll__link' onClick={this.handleRefresh}>
+                <Text><FormattedMessage id='poll.refresh' defaultMessage='Refresh' /></Text>
+              </button> · </span>
+            )}
+            <FormattedMessage id='poll.total_votes' defaultMessage='{count, plural, one {# vote} other {# votes}}' values={{ count: poll.get('votes_count') }} />
+            {poll.get('expires_at') && <span> · {timeRemaining}</span>}
+          </Text>
         </div>
       </div>
     );

app/soapbox/reducers/polls.js

@@ -1,28 +0,0 @@
-import { Map as ImmutableMap } from 'immutable';
-
-import { POLLS_IMPORT } from 'soapbox/actions/importer';
-import { normalizeStatus } from 'soapbox/normalizers/status';
-
-// HOTFIX: Convert the poll into a fake status to normalize it...
-// TODO: get rid of POLLS_IMPORT and use STATUS_IMPORT here.
-const normalizePoll = poll => {
-  const status = { poll };
-  return normalizeStatus(status).poll;
-};
-
-const importPolls = (state, polls) => {
-  return state.withMutations(map => {
-    return polls.forEach(poll => map.set(poll.id, normalizePoll(poll)));
-  });
-};
-
-const initialState = ImmutableMap();
-
-export default function polls(state = initialState, action) {
-  switch(action.type) {
-  case POLLS_IMPORT:
-    return importPolls(state, action.polls);
-  default:
-    return state;
-  }
-}

app/soapbox/reducers/polls.ts

@@ -0,0 +1,39 @@
+import { Map as ImmutableMap } from 'immutable';
+
+import { POLLS_IMPORT } from 'soapbox/actions/importer';
+import { normalizeStatus } from 'soapbox/normalizers/status';
+
+import type { AnyAction } from 'redux';
+import type { Poll, APIEntity, EmbeddedEntity } from 'soapbox/types/entities';
+
+type State = ImmutableMap<string, Poll>;
+
+// HOTFIX: Convert the poll into a fake status to normalize it...
+// TODO: get rid of POLLS_IMPORT and use STATUS_IMPORT here.
+const normalizePoll = (poll: any): EmbeddedEntity<Poll> => {
+  const status = { poll };
+  return normalizeStatus(status).poll;
+};
+
+const importPolls = (state: State, polls: Array<APIEntity>) => {
+  return state.withMutations(map => {
+    return polls.forEach(poll => {
+      const normalPoll = normalizePoll(poll);
+
+      if (normalPoll && typeof normalPoll === 'object') {
+        map.set(normalPoll.id, normalPoll);
+      }
+    });
+  });
+};
+
+const initialState: State = ImmutableMap();
+
+export default function polls(state: State = initialState, action: AnyAction): State {
+  switch(action.type) {
+  case POLLS_IMPORT:
+    return importPolls(state, action.polls);
+  default:
+    return state;
+  }
+}

app/soapbox/reducers/statuses.ts

@@ -1,6 +1,5 @@
 import escapeTextContentForBrowser from 'escape-html';
 import { Map as ImmutableMap, List as ImmutableList } from 'immutable';
-import { AnyAction } from 'redux';
 
 import emojify from 'soapbox/features/emoji/emoji';
 import { normalizeStatus } from 'soapbox/normalizers';
@@ -32,6 +31,8 @@ import {
 } from '../actions/statuses';
 import { TIMELINE_DELETE } from '../actions/timelines';
 
+import type { AnyAction } from 'redux';
+
 const domParser = new DOMParser();
 
 type StatusRecord = ReturnType<typeof normalizeStatus>;

app/soapbox/types/entities.ts

@@ -27,6 +27,7 @@ type PollOption = ReturnType<typeof PollOptionRecord>;
 type Status = ReturnType<typeof StatusRecord>;
 
 // Utility types
+type APIEntity = Record<string, any>;
 type EmbeddedEntity<T extends object> = null | string | ReturnType<ImmutableRecord.Factory<T>>;
 
 export {
@@ -43,5 +44,6 @@ export {
   Status,
 
   // Utility types
+  APIEntity,
   EmbeddedEntity,
 };