Merge branch 'master' into remember-sort

2026-07-05 08:49:04 +08:00 · 2017-09-08 19:28:26 +02:00
parent 6b74877d01 1221c6043f
commit be86a6f3dc
60 changed files with 227 additions and 65 deletions
@@ -1,6 +1,6 @@
 import React from 'react';
-import {Router, Route, IndexRedirect, IndexRoute} from 'react-router';
 import PropTypes from 'prop-types';
+import {Router, Route, IndexRedirect, IndexRoute} from 'react-router';

 import Configure from 'routes/Configure';
 import Dashboard from 'routes/Dashboard';
@@ -1,4 +1,6 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
+
 import styles from './ModerationList.css';
 import {Button} from 'coral-ui';
 import {menuActionsMap} from '../utils/moderationQueueActionsMap';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Button, Icon} from 'coral-ui';
 import {Menu} from 'react-mdl';
 import cn from 'classnames';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import Layout from 'coral-admin/src/components/ui/Layout';
 import styles from './NotFound.css';
 import {Button, TextField, Alert, Success} from 'coral-ui';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Dialog} from 'coral-ui';
 import styles from './BanUserDialog.css';

@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './CommentType.css';
 import {Icon} from 'coral-ui';
 import cn from 'classnames';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Card} from 'coral-ui';

 const EmptyCard = (props) => (
@@ -1,4 +1,5 @@
-import React, {Component, PropTypes} from 'react';
+import React, {Component} from 'react';
+import PropTypes from 'prop-types';
 import {Icon} from 'coral-ui';
 import styles from './FlagBox.css';
 import t from 'coral-framework/services/i18n';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Button} from 'coral-ui';
 import styles from './LoadMore.css';
 import cn from 'classnames';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import Modal from 'components/Modal';
 import styles from './ModerationKeysModal.css';
 import t from 'coral-framework/services/i18n';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './ModerationList.css';
 import key from 'keymaster';
 import Hammer from 'hammerjs';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Dialog} from 'coral-ui';
 import {RadioGroup, Radio} from 'react-mdl';
 import styles from './SuspendUserDialog.css';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Link} from 'react-router';

 import {Icon} from 'coral-ui';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Navigation, Drawer} from 'react-mdl';
 import {IndexLink, Link} from 'react-router';
 import styles from './Drawer.css';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Navigation, Header, IconButton, MenuItem, Menu} from 'react-mdl';
 import {Link, IndexLink} from 'react-router';
 import styles from './Header.css';
@@ -87,8 +88,8 @@ const CoralHeader = ({
              </Menu>
            </div>
          </li>
-          <li>        
-            {`v${process.env.VERSION}`}        
+          <li>
+            {`v${process.env.VERSION}`}
          </li>
        </ul>
      </div>
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Layout as LayoutMDL} from 'react-mdl';
 import Header from './Header';
 import Drawer from './Drawer';
@@ -1,4 +1,5 @@
-import React, {Component, PropTypes} from 'react';
+import React, {Component} from 'react';
+import PropTypes from 'prop-types';

 import {Dialog, Button} from 'coral-ui';
 import styles from './RejectUsernameDialog.css';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './Configure.css';
 import {Card} from 'coral-ui';
 import {Checkbox} from 'react-mdl';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Card} from 'coral-ui';
 import Domainlist from './Domainlist';
 import EmbedLink from './EmbedLink';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Link} from 'react-router';
 import styles from './Widget.css';
 import t from 'coral-framework/services/i18n';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './Dashboard.css';
 import {Icon} from 'coral-ui';

@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Link} from 'react-router';
 import styles from './Widget.css';

@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Link} from 'react-router';
 import styles from './Widget.css';
 import t from 'coral-framework/services/i18n';
@@ -1,4 +1,5 @@
 import React, {Component} from 'react';
+import PropTypes from 'prop-types';
 import {connect} from 'react-redux';
 import {bindActionCreators} from 'redux';
 import {compose} from 'react-apollo';
@@ -31,7 +32,7 @@ class InstallContainer extends Component {
 }

 InstallContainer.contextTypes = {
-  router: React.PropTypes.object
+  router: PropTypes.object
 };

 const mapStateToProps = (state) => ({
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Link} from 'react-router';

 import {Icon} from 'coral-ui';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './CommentCount.css';

 import t from 'coral-framework/services/i18n';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Icon} from 'coral-ui';
 import styles from './styles.css';
 import t from 'coral-framework/services/i18n';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import CommentCount from './CommentCount';
 import styles from './styles.css';
 import {SelectField, Option} from 'react-mdl-selectfield';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';

 import Comment from '../containers/Comment';
 import styles from './styles.css';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './StorySearch.css';

 const formatDate = (date) => {
@@ -1,4 +1,5 @@
-import React, {PureComponent, PropTypes} from 'react';
+import React, {PureComponent} from 'react';
+import PropTypes from 'prop-types';
 import marked from 'marked';

 const renderer = new marked.Renderer();
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import t from 'coral-framework/services/i18n';

 /**
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {notifyForNewCommentStatus} from 'talk-plugin-commentbox/CommentBox';
 import {CommentForm} from 'talk-plugin-commentbox/CommentForm';
 import styles from './Comment.css';
@@ -38,10 +39,10 @@ export class EditableCommentContent extends React.Component {
    maxCharCount: PropTypes.number,

    // edit a comment, passed {{ body }}
-    editComment: React.PropTypes.func,
+    editComment: PropTypes.func,

    // called when editing should be stopped
-    stopEditing: React.PropTypes.func,
+    stopEditing: PropTypes.func,
  }

  constructor(props) {
@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import Stream from '../containers/Stream';
 import Slot from 'coral-framework/components/Slot';
 import {can} from 'coral-framework/services/perms';
@@ -90,8 +91,8 @@ export default class Embed extends React.Component {
 }

 Embed.propTypes = {
-  data: React.PropTypes.shape({
-    loading: React.PropTypes.bool,
-    error: React.PropTypes.object
+  data: PropTypes.shape({
+    loading: PropTypes.bool,
+    error: PropTypes.object
  }).isRequired
 };
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './Comment.css';
 import {Button} from 'coral-ui';

@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import t from 'coral-framework/services/i18n';
 import styles from './InactiveCommentLabel.css';
 import {Icon} from 'coral-ui';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Button} from 'coral-ui';

 import t from 'coral-framework/services/i18n';
@@ -308,7 +308,7 @@ Stream.propTypes = {
  postComment: PropTypes.func.isRequired,

  // edit a comment, passed (id, asset_id, { body })
-  editComment: React.PropTypes.func
+  editComment: PropTypes.func
 };

 export default Stream;
@@ -1,4 +1,5 @@
-import React, {Component, PropTypes} from 'react';
+import React, {Component} from 'react';
+import PropTypes from 'prop-types';
 import t from 'coral-framework/services/i18n';
 import styles from './SuspendAccount.css';
 import {Button} from 'coral-ui';
@@ -0,0 +1,61 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import {IgnoreUserWizard} from './IgnoreUserWizard';
+import Toggleable from './Toggleable';
+
+// TopRightMenu appears as a dropdown in the top right of the comment.
+// when you click the down cehvron, it expands and shows IgnoreUserWizard
+// when you click 'cancel' in the wizard, it closes the menu
+export class TopRightMenu extends React.Component {
+  static propTypes = {
+
+    // comment on which this menu appears
+    comment: PropTypes.shape({
+      user: PropTypes.shape({
+        id: PropTypes.string.isRequired,
+        username: PropTypes.string.isRequired
+      }).isRequired
+    }).isRequired,
+    ignoreUser: PropTypes.func,
+
+    // show notification to the user (e.g. for errors)
+    notify: PropTypes.func.isRequired,
+  }
+  constructor(props) {
+    super(props);
+    this.state = {
+      timesReset: 0
+    };
+  }
+  render() {
+    const {comment, ignoreUser, notify} = this.props;
+
+    // timesReset is used as Toggleable key so it re-renders on reset (closing the toggleable)
+    const reset = () => this.setState({timesReset: this.state.timesReset + 1});
+    const ignoreUserAndCloseMenuAndNotifyOnError = async ({id}) => {
+
+      // close menu
+      reset();
+
+      // ignore user
+      try {
+        await ignoreUser({id});
+      } catch (error) {
+        notify('error', 'Failed to ignore user');
+        throw error;
+      }
+    };
+    return (
+      <Toggleable key={this.state.timesReset} className="talk-stream-comment-chevron">
+        <div style={{position: 'absolute', right: 0, zIndex: 1}}>
+          <IgnoreUserWizard
+            user={comment.user}
+            cancel={reset}
+            ignoreUser={ignoreUserAndCloseMenuAndNotifyOnError}
+          />
+        </div>
+      </Toggleable>
+    );
+  }
+}
+
@@ -1,4 +1,5 @@
-import React, {PureComponent, PropTypes} from 'react';
+import React, {PureComponent} from 'react';
+import PropTypes from 'prop-types';
 import marked from 'marked';

 const renderer = new marked.Renderer();
@@ -1,4 +1,5 @@
-import React, {Component, PropTypes} from 'react';
+import React, {Component} from 'react';
+import PropTypes from 'prop-types';
 import SimpleMDE from 'simplemde';
 import cn from 'classnames';
 import noop from 'lodash/noop';
@@ -0,0 +1,44 @@
+import React, {Component} from 'react';
+import PropTypes from 'prop-types';
+import t from 'coral-framework/services/i18n';
+import styles from './IgnoredUsers.css';
+
+export class IgnoredUsers extends Component {
+  static propTypes = {
+    users: PropTypes.arrayOf(PropTypes.shape({
+      username: PropTypes.string,
+      id: PropTypes.string,
+    })).isRequired,
+
+    // accepts { id }
+    stopIgnoring: PropTypes.func.isRequired,
+  }
+  render() {
+    const {users, stopIgnoring} = this.props;
+    return (
+      <div>
+        {
+          users.length
+            ? <p>{t('framework.because_you_ignored')}</p>
+            : null
+        }
+        <dl className={styles.ignoredUserList}>
+          {
+            users.map(({username, id}) => (
+              <span className={styles.ignoredUser} key={id}>
+                <dt key={id}>{ username }</dt>
+                <dd className={styles.stopListening}>
+                  <a
+                    onClick={() => stopIgnoring({id})}
+                    className={styles.link}>{t('framework.stop_ignoring')}</a>
+                </dd>
+              </span>
+            ))
+          }
+        </dl>
+      </div>
+    );
+  }
+}
+
+export default IgnoredUsers;
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './CoralLogo.css';

 const CoralLogo = ({className = ''}) => (
@@ -1,4 +1,5 @@
-import React, {Component, PropTypes} from 'react';
+import React, {Component} from 'react';
+import PropTypes from 'prop-types';
 import dialogPolyfill from 'dialog-polyfill';
 import 'dialog-polyfill/dialog-polyfill.css';

@@ -43,7 +44,7 @@ export default class Dialog extends Component {
  componentWillUnmount() {
    const dialog = this.dialog;
    if (dialog) {
-      dialog.removeEventListener('cancel', this.props.onCancel);      
+      dialog.removeEventListener('cancel', this.props.onCancel);
    }
  }

@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './Drawer.css';

 const Drawer = ({children, onClose}) => {
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Icon as IconMDL}  from 'react-mdl';
 import cn from 'classnames';
 import styles from './Icon.css';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './Pager.css';

 const Rows = (curr, total, onClickHandler) => Array.from(Array(total)).map((e, i) =>
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './TextArea.css';

 const TextArea = ({className, value = '', ...props}) => (
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './TextField.css';

 const TextField = ({className, showErrors = false, errorMsg, label, ...props}) => (
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';

 const Wizard = (props) => {
  const {children, currentStep, ...rest} = props;
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './WizardNav.css';
 import Icon from './Icon';

@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';

 import t from 'coral-framework/services/i18n';
 import {can} from 'coral-framework/services/perms';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Button} from 'coral-ui';
 import cn from 'classnames';
 import Slot from 'coral-framework/components/Slot';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Icon} from '../coral-ui';
 import styles from './Comment.css';
 import Slot from 'coral-framework/components/Slot';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import Comment from './Comment';
 import styles from './CommentHistory.css';
 import LoadMore from './LoadMore';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './styles.css';

 import t from 'coral-framework/services/i18n';
@@ -1,4 +1,5 @@
-import React, {Component, PropTypes} from 'react';
+import React, {Component} from 'react';
+import PropTypes from 'prop-types';
 import CommentBox from '../talk-plugin-commentbox/CommentBox';

 const name = 'talk-plugin-replies';
@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';

 import t from 'coral-framework/services/i18n';

@@ -1,4 +1,5 @@
-import React, {PropTypes} from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import {Button, TextField, Spinner, Success, Alert} from 'plugin-api/beta/client/components/ui';
 import styles from './styles.css';
 import t from 'coral-framework/services/i18n';