diff --git a/client/coral-embed-stream/src/tabs/stream/components/Stream.js b/client/coral-embed-stream/src/tabs/stream/components/Stream.js index 75f04da0a..cc4e8e939 100644 --- a/client/coral-embed-stream/src/tabs/stream/components/Stream.js +++ b/client/coral-embed-stream/src/tabs/stream/components/Stream.js @@ -15,14 +15,13 @@ import QuestionBox from '../../../components/QuestionBox'; import { Tab, TabCount, TabPane } from 'coral-ui'; import cn from 'classnames'; import get from 'lodash/get'; - import { reverseCommentParentTree } from '../../../graphql/utils'; import AllCommentsPane from './AllCommentsPane'; import ExtendableTabPanel from '../../../containers/ExtendableTabPanel'; +import ChangedUsername from './ChangedUsername'; +import CommentNotFound from '../containers/CommentNotFound'; import styles from './Stream.css'; -import ChangedUsername from './ChangedUsername'; - class Stream extends React.Component { constructor(props) { super(props); @@ -238,7 +237,11 @@ class Stream extends React.Component { keepCommentBox); if (highlightedComment === null) { - return {t('stream.comment_not_found')}; + return ( + + + + ); } const slotPassthrough = { root, asset }; diff --git a/client/coral-embed-stream/src/tabs/stream/containers/CommentNotFound.js b/client/coral-embed-stream/src/tabs/stream/containers/CommentNotFound.js new file mode 100644 index 000000000..91537aac4 --- /dev/null +++ b/client/coral-embed-stream/src/tabs/stream/containers/CommentNotFound.js @@ -0,0 +1,36 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { Button } from 'coral-ui'; +import { setActiveTab } from '../../../actions/embed'; +import { bindActionCreators } from 'redux'; +import { connect } from 'react-redux'; +import t from 'coral-framework/services/i18n'; + +class CommentNotFound extends React.Component { + showAllTab = () => { + this.props.setActiveTab('all'); + }; + + render() { + return ( +
+

{t('stream.comment_not_found')}

+ +
+ ); + } +} + +CommentNotFound.propTypes = { + setActiveTab: PropTypes.func, +}; + +const mapDispatchToProps = dispatch => + bindActionCreators( + { + setActiveTab, + }, + dispatch + ); + +export default connect(null, mapDispatchToProps)(CommentNotFound);