diff --git a/client/coral-admin/src/AppRouter.js b/client/coral-admin/src/AppRouter.js index dcd660c25..d50aeb3f6 100644 --- a/client/coral-admin/src/AppRouter.js +++ b/client/coral-admin/src/AppRouter.js @@ -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'; diff --git a/client/coral-admin/src/components/ActionButton.js b/client/coral-admin/src/components/ActionButton.js index 3dbac206b..b8778bef0 100644 --- a/client/coral-admin/src/components/ActionButton.js +++ b/client/coral-admin/src/components/ActionButton.js @@ -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'; diff --git a/client/coral-admin/src/components/ActionsMenu.js b/client/coral-admin/src/components/ActionsMenu.js index ff4a9c5b3..6e236bf1c 100644 --- a/client/coral-admin/src/components/ActionsMenu.js +++ b/client/coral-admin/src/components/ActionsMenu.js @@ -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'; diff --git a/client/coral-admin/src/components/AdminLogin.js b/client/coral-admin/src/components/AdminLogin.js index 014773a1b..5f9712127 100644 --- a/client/coral-admin/src/components/AdminLogin.js +++ b/client/coral-admin/src/components/AdminLogin.js @@ -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'; diff --git a/client/coral-admin/src/components/BanUserDialog.js b/client/coral-admin/src/components/BanUserDialog.js index bade3578d..169afe043 100644 --- a/client/coral-admin/src/components/BanUserDialog.js +++ b/client/coral-admin/src/components/BanUserDialog.js @@ -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'; diff --git a/client/coral-admin/src/components/CommentType.js b/client/coral-admin/src/components/CommentType.js index 075ec5a78..4d1ff7e67 100644 --- a/client/coral-admin/src/components/CommentType.js +++ b/client/coral-admin/src/components/CommentType.js @@ -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'; diff --git a/client/coral-admin/src/components/EmptyCard.js b/client/coral-admin/src/components/EmptyCard.js index ae291bcad..8adc63747 100644 --- a/client/coral-admin/src/components/EmptyCard.js +++ b/client/coral-admin/src/components/EmptyCard.js @@ -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) => ( diff --git a/client/coral-admin/src/components/FlagBox.js b/client/coral-admin/src/components/FlagBox.js index 240d52078..05fd14128 100644 --- a/client/coral-admin/src/components/FlagBox.js +++ b/client/coral-admin/src/components/FlagBox.js @@ -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'; diff --git a/client/coral-admin/src/components/LoadMore.js b/client/coral-admin/src/components/LoadMore.js index 969c6734f..eaacb4413 100644 --- a/client/coral-admin/src/components/LoadMore.js +++ b/client/coral-admin/src/components/LoadMore.js @@ -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'; diff --git a/client/coral-admin/src/components/ModerationKeysModal.js b/client/coral-admin/src/components/ModerationKeysModal.js index c4f3f1e1d..abdffa2b1 100644 --- a/client/coral-admin/src/components/ModerationKeysModal.js +++ b/client/coral-admin/src/components/ModerationKeysModal.js @@ -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'; diff --git a/client/coral-admin/src/components/ModerationList.js b/client/coral-admin/src/components/ModerationList.js index e2b536f2c..adfe63051 100644 --- a/client/coral-admin/src/components/ModerationList.js +++ b/client/coral-admin/src/components/ModerationList.js @@ -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'; diff --git a/client/coral-admin/src/components/SuspendUserDialog.js b/client/coral-admin/src/components/SuspendUserDialog.js index 0ed947506..d56201e2f 100644 --- a/client/coral-admin/src/components/SuspendUserDialog.js +++ b/client/coral-admin/src/components/SuspendUserDialog.js @@ -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'; diff --git a/client/coral-admin/src/components/UserDetailComment.js b/client/coral-admin/src/components/UserDetailComment.js index 4e31d338b..fa196dc41 100644 --- a/client/coral-admin/src/components/UserDetailComment.js +++ b/client/coral-admin/src/components/UserDetailComment.js @@ -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'; diff --git a/client/coral-admin/src/components/ui/Drawer.js b/client/coral-admin/src/components/ui/Drawer.js index b49caf30a..2b728a33a 100644 --- a/client/coral-admin/src/components/ui/Drawer.js +++ b/client/coral-admin/src/components/ui/Drawer.js @@ -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'; diff --git a/client/coral-admin/src/components/ui/Header.js b/client/coral-admin/src/components/ui/Header.js index b43fa8b35..560935c2a 100644 --- a/client/coral-admin/src/components/ui/Header.js +++ b/client/coral-admin/src/components/ui/Header.js @@ -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 = ({ -
  • - {`v${process.env.VERSION}`} +
  • + {`v${process.env.VERSION}`}
    • diff --git a/client/coral-admin/src/components/ui/Layout.js b/client/coral-admin/src/components/ui/Layout.js index 10433048e..3aa056d9e 100644 --- a/client/coral-admin/src/components/ui/Layout.js +++ b/client/coral-admin/src/components/ui/Layout.js @@ -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'; diff --git a/client/coral-admin/src/routes/Community/components/RejectUsernameDialog.js b/client/coral-admin/src/routes/Community/components/RejectUsernameDialog.js index 4932021bd..a9877368a 100644 --- a/client/coral-admin/src/routes/Community/components/RejectUsernameDialog.js +++ b/client/coral-admin/src/routes/Community/components/RejectUsernameDialog.js @@ -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'; diff --git a/client/coral-admin/src/routes/Configure/components/ModerationSettings.js b/client/coral-admin/src/routes/Configure/components/ModerationSettings.js index 99f3435e2..92a5413e2 100644 --- a/client/coral-admin/src/routes/Configure/components/ModerationSettings.js +++ b/client/coral-admin/src/routes/Configure/components/ModerationSettings.js @@ -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'; diff --git a/client/coral-admin/src/routes/Configure/components/TechSettings.js b/client/coral-admin/src/routes/Configure/components/TechSettings.js index 2dca7b207..4f1202a67 100644 --- a/client/coral-admin/src/routes/Configure/components/TechSettings.js +++ b/client/coral-admin/src/routes/Configure/components/TechSettings.js @@ -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'; diff --git a/client/coral-admin/src/routes/Dashboard/components/ActivityWidget.js b/client/coral-admin/src/routes/Dashboard/components/ActivityWidget.js index 5b43a605c..3f8af141b 100644 --- a/client/coral-admin/src/routes/Dashboard/components/ActivityWidget.js +++ b/client/coral-admin/src/routes/Dashboard/components/ActivityWidget.js @@ -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'; diff --git a/client/coral-admin/src/routes/Dashboard/components/CountdownTimer.js b/client/coral-admin/src/routes/Dashboard/components/CountdownTimer.js index 6864acb6b..a2e6ea9f1 100644 --- a/client/coral-admin/src/routes/Dashboard/components/CountdownTimer.js +++ b/client/coral-admin/src/routes/Dashboard/components/CountdownTimer.js @@ -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'; diff --git a/client/coral-admin/src/routes/Dashboard/components/FlagWidget.js b/client/coral-admin/src/routes/Dashboard/components/FlagWidget.js index 5dfbfb3ac..2f3548cf1 100644 --- a/client/coral-admin/src/routes/Dashboard/components/FlagWidget.js +++ b/client/coral-admin/src/routes/Dashboard/components/FlagWidget.js @@ -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'; diff --git a/client/coral-admin/src/routes/Dashboard/components/LikeWidget.js b/client/coral-admin/src/routes/Dashboard/components/LikeWidget.js index aeb31c318..7525f7223 100644 --- a/client/coral-admin/src/routes/Dashboard/components/LikeWidget.js +++ b/client/coral-admin/src/routes/Dashboard/components/LikeWidget.js @@ -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'; diff --git a/client/coral-admin/src/routes/Install/containers/Install.js b/client/coral-admin/src/routes/Install/containers/Install.js index 442127e47..77486a9c1 100644 --- a/client/coral-admin/src/routes/Install/containers/Install.js +++ b/client/coral-admin/src/routes/Install/containers/Install.js @@ -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) => ({ diff --git a/client/coral-admin/src/routes/Moderation/components/Comment.js b/client/coral-admin/src/routes/Moderation/components/Comment.js index 38cf3e5a5..9d9428bc4 100644 --- a/client/coral-admin/src/routes/Moderation/components/Comment.js +++ b/client/coral-admin/src/routes/Moderation/components/Comment.js @@ -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'; diff --git a/client/coral-admin/src/routes/Moderation/components/CommentCount.js b/client/coral-admin/src/routes/Moderation/components/CommentCount.js index 75af89584..53d611ed6 100644 --- a/client/coral-admin/src/routes/Moderation/components/CommentCount.js +++ b/client/coral-admin/src/routes/Moderation/components/CommentCount.js @@ -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'; diff --git a/client/coral-admin/src/routes/Moderation/components/ModerationHeader.js b/client/coral-admin/src/routes/Moderation/components/ModerationHeader.js index 9cc0bfed9..b9bd0caff 100644 --- a/client/coral-admin/src/routes/Moderation/components/ModerationHeader.js +++ b/client/coral-admin/src/routes/Moderation/components/ModerationHeader.js @@ -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'; diff --git a/client/coral-admin/src/routes/Moderation/components/ModerationMenu.js b/client/coral-admin/src/routes/Moderation/components/ModerationMenu.js index a28e90c65..25b90cf64 100644 --- a/client/coral-admin/src/routes/Moderation/components/ModerationMenu.js +++ b/client/coral-admin/src/routes/Moderation/components/ModerationMenu.js @@ -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'; diff --git a/client/coral-admin/src/routes/Moderation/components/ModerationQueue.js b/client/coral-admin/src/routes/Moderation/components/ModerationQueue.js index e8b5b8191..3197ddd78 100644 --- a/client/coral-admin/src/routes/Moderation/components/ModerationQueue.js +++ b/client/coral-admin/src/routes/Moderation/components/ModerationQueue.js @@ -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'; diff --git a/client/coral-admin/src/routes/Moderation/components/Story.js b/client/coral-admin/src/routes/Moderation/components/Story.js index 6c3a4b02f..eaad6c2a6 100644 --- a/client/coral-admin/src/routes/Moderation/components/Story.js +++ b/client/coral-admin/src/routes/Moderation/components/Story.js @@ -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) => { diff --git a/client/coral-configure/components/Markdown.js b/client/coral-configure/components/Markdown.js index 482467987..d9d1bc4a7 100644 --- a/client/coral-configure/components/Markdown.js +++ b/client/coral-configure/components/Markdown.js @@ -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(); diff --git a/client/coral-embed-stream/src/components/CountdownSeconds.js b/client/coral-embed-stream/src/components/CountdownSeconds.js index d350c803b..789b674b5 100644 --- a/client/coral-embed-stream/src/components/CountdownSeconds.js +++ b/client/coral-embed-stream/src/components/CountdownSeconds.js @@ -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'; /** diff --git a/client/coral-embed-stream/src/components/EditableCommentContent.js b/client/coral-embed-stream/src/components/EditableCommentContent.js index 084a061e1..c256616f0 100644 --- a/client/coral-embed-stream/src/components/EditableCommentContent.js +++ b/client/coral-embed-stream/src/components/EditableCommentContent.js @@ -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) { diff --git a/client/coral-embed-stream/src/components/Embed.js b/client/coral-embed-stream/src/components/Embed.js index a74028627..86d36d47e 100644 --- a/client/coral-embed-stream/src/components/Embed.js +++ b/client/coral-embed-stream/src/components/Embed.js @@ -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 }; diff --git a/client/coral-embed-stream/src/components/IgnoreUserWizard.js b/client/coral-embed-stream/src/components/IgnoreUserWizard.js index b7612b9f8..68b92ae29 100644 --- a/client/coral-embed-stream/src/components/IgnoreUserWizard.js +++ b/client/coral-embed-stream/src/components/IgnoreUserWizard.js @@ -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'; diff --git a/client/coral-embed-stream/src/components/InactiveCommentLabel.js b/client/coral-embed-stream/src/components/InactiveCommentLabel.js index 824692558..6655c4881 100644 --- a/client/coral-embed-stream/src/components/InactiveCommentLabel.js +++ b/client/coral-embed-stream/src/components/InactiveCommentLabel.js @@ -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'; diff --git a/client/coral-embed-stream/src/components/NewCount.js b/client/coral-embed-stream/src/components/NewCount.js index d93148e0c..71f15fbeb 100644 --- a/client/coral-embed-stream/src/components/NewCount.js +++ b/client/coral-embed-stream/src/components/NewCount.js @@ -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'; diff --git a/client/coral-embed-stream/src/components/Stream.js b/client/coral-embed-stream/src/components/Stream.js index 89e7b13ae..43176353f 100644 --- a/client/coral-embed-stream/src/components/Stream.js +++ b/client/coral-embed-stream/src/components/Stream.js @@ -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; diff --git a/client/coral-embed-stream/src/components/SuspendedAccount.js b/client/coral-embed-stream/src/components/SuspendedAccount.js index df2b6162c..903b1bcf4 100644 --- a/client/coral-embed-stream/src/components/SuspendedAccount.js +++ b/client/coral-embed-stream/src/components/SuspendedAccount.js @@ -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'; diff --git a/client/coral-embed-stream/src/components/TopRightMenu.js b/client/coral-embed-stream/src/components/TopRightMenu.js new file mode 100644 index 000000000..fd4587356 --- /dev/null +++ b/client/coral-embed-stream/src/components/TopRightMenu.js @@ -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 ( + +
    + +
    +     + ); + } +} + diff --git a/client/coral-framework/components/Markdown.js b/client/coral-framework/components/Markdown.js index 482467987..d9d1bc4a7 100644 --- a/client/coral-framework/components/Markdown.js +++ b/client/coral-framework/components/Markdown.js @@ -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(); diff --git a/client/coral-framework/components/MarkdownEditor.js b/client/coral-framework/components/MarkdownEditor.js index 0d2088e51..65f603b0c 100644 --- a/client/coral-framework/components/MarkdownEditor.js +++ b/client/coral-framework/components/MarkdownEditor.js @@ -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'; diff --git a/client/coral-settings/components/IgnoredUsers.js b/client/coral-settings/components/IgnoredUsers.js new file mode 100644 index 000000000..9cb314373 --- /dev/null +++ b/client/coral-settings/components/IgnoredUsers.js @@ -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 ( +
    + { + users.length + ?

    {t('framework.because_you_ignored')}

    + : null + } +
    + { + users.map(({username, id}) => ( + +
    { username }
    +
    + stopIgnoring({id})} + className={styles.link}>{t('framework.stop_ignoring')} +
    +     + )) + } +
    +
    + ); + } +} + +export default IgnoredUsers; diff --git a/client/coral-ui/components/CoralLogo.js b/client/coral-ui/components/CoralLogo.js index 91331523f..ba640020e 100644 --- a/client/coral-ui/components/CoralLogo.js +++ b/client/coral-ui/components/CoralLogo.js @@ -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 = ''}) => ( diff --git a/client/coral-ui/components/Dialog.js b/client/coral-ui/components/Dialog.js index 6e2489fea..93431db4c 100644 --- a/client/coral-ui/components/Dialog.js +++ b/client/coral-ui/components/Dialog.js @@ -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); } } diff --git a/client/coral-ui/components/Drawer.js b/client/coral-ui/components/Drawer.js index 3c4f051bd..d50237bfb 100644 --- a/client/coral-ui/components/Drawer.js +++ b/client/coral-ui/components/Drawer.js @@ -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}) => { diff --git a/client/coral-ui/components/Icon.js b/client/coral-ui/components/Icon.js index 025b6df9e..e0dfea3a7 100644 --- a/client/coral-ui/components/Icon.js +++ b/client/coral-ui/components/Icon.js @@ -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'; diff --git a/client/coral-ui/components/Pager.js b/client/coral-ui/components/Pager.js index d14f2fc60..8f560593e 100644 --- a/client/coral-ui/components/Pager.js +++ b/client/coral-ui/components/Pager.js @@ -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) => diff --git a/client/coral-ui/components/TextArea.js b/client/coral-ui/components/TextArea.js index fedc7914b..547c0fc2e 100644 --- a/client/coral-ui/components/TextArea.js +++ b/client/coral-ui/components/TextArea.js @@ -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}) => ( diff --git a/client/coral-ui/components/TextField.js b/client/coral-ui/components/TextField.js index ab5fc08ba..80c8173e7 100644 --- a/client/coral-ui/components/TextField.js +++ b/client/coral-ui/components/TextField.js @@ -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}) => ( diff --git a/client/coral-ui/components/Wizard.js b/client/coral-ui/components/Wizard.js index bc87a8bcc..97b056674 100644 --- a/client/coral-ui/components/Wizard.js +++ b/client/coral-ui/components/Wizard.js @@ -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; diff --git a/client/coral-ui/components/WizardNav.js b/client/coral-ui/components/WizardNav.js index cbcb664be..c465c1da4 100644 --- a/client/coral-ui/components/WizardNav.js +++ b/client/coral-ui/components/WizardNav.js @@ -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'; diff --git a/client/talk-plugin-commentbox/CommentBox.js b/client/talk-plugin-commentbox/CommentBox.js index 2c671946a..8bdfb9a24 100644 --- a/client/talk-plugin-commentbox/CommentBox.js +++ b/client/talk-plugin-commentbox/CommentBox.js @@ -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'; diff --git a/client/talk-plugin-commentbox/CommentForm.js b/client/talk-plugin-commentbox/CommentForm.js index fe0f9f6d9..f4bbbd139 100644 --- a/client/talk-plugin-commentbox/CommentForm.js +++ b/client/talk-plugin-commentbox/CommentForm.js @@ -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'; diff --git a/client/talk-plugin-history/Comment.js b/client/talk-plugin-history/Comment.js index b813e514b..51ab5c84a 100644 --- a/client/talk-plugin-history/Comment.js +++ b/client/talk-plugin-history/Comment.js @@ -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'; diff --git a/client/talk-plugin-history/CommentHistory.js b/client/talk-plugin-history/CommentHistory.js index 91883cdc8..2e6f627e7 100644 --- a/client/talk-plugin-history/CommentHistory.js +++ b/client/talk-plugin-history/CommentHistory.js @@ -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'; diff --git a/client/talk-plugin-moderation/ModerationLink.js b/client/talk-plugin-moderation/ModerationLink.js index 2d9b8ff1e..6a2b43361 100644 --- a/client/talk-plugin-moderation/ModerationLink.js +++ b/client/talk-plugin-moderation/ModerationLink.js @@ -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'; diff --git a/client/talk-plugin-replies/ReplyBox.js b/client/talk-plugin-replies/ReplyBox.js index 50bd9a538..606aad000 100644 --- a/client/talk-plugin-replies/ReplyBox.js +++ b/client/talk-plugin-replies/ReplyBox.js @@ -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'; diff --git a/client/talk-plugin-replies/ReplyButton.js b/client/talk-plugin-replies/ReplyButton.js index 8ea113c97..13ff4de75 100644 --- a/client/talk-plugin-replies/ReplyButton.js +++ b/client/talk-plugin-replies/ReplyButton.js @@ -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'; diff --git a/plugins/talk-plugin-auth/client/components/SignInContent.js b/plugins/talk-plugin-auth/client/components/SignInContent.js index 39c671ac2..d1b4caec1 100644 --- a/plugins/talk-plugin-auth/client/components/SignInContent.js +++ b/plugins/talk-plugin-auth/client/components/SignInContent.js @@ -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';