From 81ef21a0c802f1d905f37a2a818544a8b400793c Mon Sep 17 00:00:00 2001 From: Renaud Chaput Date: Sat, 25 Feb 2023 14:34:32 +0100 Subject: [Glitch] Rename JSX files with proper `.jsx` extension Port 44a7d87cb1f5df953b6c14c16c59e2e4ead1bcb9 to glitch-soc Signed-off-by: Claire --- .../glitch/features/explore/components/story.js | 51 --------- .../glitch/features/explore/components/story.jsx | 51 +++++++++ .../flavours/glitch/features/explore/index.js | 107 ----------------- .../flavours/glitch/features/explore/index.jsx | 107 +++++++++++++++++ .../flavours/glitch/features/explore/links.js | 70 ------------ .../flavours/glitch/features/explore/links.jsx | 70 ++++++++++++ .../flavours/glitch/features/explore/results.js | 126 --------------------- .../flavours/glitch/features/explore/results.jsx | 126 +++++++++++++++++++++ .../flavours/glitch/features/explore/statuses.js | 64 ----------- .../flavours/glitch/features/explore/statuses.jsx | 64 +++++++++++ .../glitch/features/explore/suggestions.js | 56 --------- .../glitch/features/explore/suggestions.jsx | 56 +++++++++ .../flavours/glitch/features/explore/tags.js | 62 ---------- .../flavours/glitch/features/explore/tags.jsx | 62 ++++++++++ 14 files changed, 536 insertions(+), 536 deletions(-) delete mode 100644 app/javascript/flavours/glitch/features/explore/components/story.js create mode 100644 app/javascript/flavours/glitch/features/explore/components/story.jsx delete mode 100644 app/javascript/flavours/glitch/features/explore/index.js create mode 100644 app/javascript/flavours/glitch/features/explore/index.jsx delete mode 100644 app/javascript/flavours/glitch/features/explore/links.js create mode 100644 app/javascript/flavours/glitch/features/explore/links.jsx delete mode 100644 app/javascript/flavours/glitch/features/explore/results.js create mode 100644 app/javascript/flavours/glitch/features/explore/results.jsx delete mode 100644 app/javascript/flavours/glitch/features/explore/statuses.js create mode 100644 app/javascript/flavours/glitch/features/explore/statuses.jsx delete mode 100644 app/javascript/flavours/glitch/features/explore/suggestions.js create mode 100644 app/javascript/flavours/glitch/features/explore/suggestions.jsx delete mode 100644 app/javascript/flavours/glitch/features/explore/tags.js create mode 100644 app/javascript/flavours/glitch/features/explore/tags.jsx (limited to 'app/javascript/flavours/glitch/features/explore') diff --git a/app/javascript/flavours/glitch/features/explore/components/story.js b/app/javascript/flavours/glitch/features/explore/components/story.js deleted file mode 100644 index 8270d3ccb..000000000 --- a/app/javascript/flavours/glitch/features/explore/components/story.js +++ /dev/null @@ -1,51 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import Blurhash from 'flavours/glitch/components/blurhash'; -import { accountsCountRenderer } from 'flavours/glitch/components/hashtag'; -import ShortNumber from 'flavours/glitch/components/short_number'; -import Skeleton from 'flavours/glitch/components/skeleton'; -import classNames from 'classnames'; - -export default class Story extends React.PureComponent { - - static propTypes = { - url: PropTypes.string, - title: PropTypes.string, - publisher: PropTypes.string, - sharedTimes: PropTypes.number, - thumbnail: PropTypes.string, - blurhash: PropTypes.string, - }; - - state = { - thumbnailLoaded: false, - }; - - handleImageLoad = () => this.setState({ thumbnailLoaded: true }); - - render () { - const { url, title, publisher, sharedTimes, thumbnail, blurhash } = this.props; - - const { thumbnailLoaded } = this.state; - - return ( - -
-
{publisher ? publisher : }
-
{title ? title : }
-
{typeof sharedTimes === 'number' ? : }
-
- -
- {thumbnail ? ( - -
- - - ) : } -
- - ); - } - -} diff --git a/app/javascript/flavours/glitch/features/explore/components/story.jsx b/app/javascript/flavours/glitch/features/explore/components/story.jsx new file mode 100644 index 000000000..8270d3ccb --- /dev/null +++ b/app/javascript/flavours/glitch/features/explore/components/story.jsx @@ -0,0 +1,51 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import Blurhash from 'flavours/glitch/components/blurhash'; +import { accountsCountRenderer } from 'flavours/glitch/components/hashtag'; +import ShortNumber from 'flavours/glitch/components/short_number'; +import Skeleton from 'flavours/glitch/components/skeleton'; +import classNames from 'classnames'; + +export default class Story extends React.PureComponent { + + static propTypes = { + url: PropTypes.string, + title: PropTypes.string, + publisher: PropTypes.string, + sharedTimes: PropTypes.number, + thumbnail: PropTypes.string, + blurhash: PropTypes.string, + }; + + state = { + thumbnailLoaded: false, + }; + + handleImageLoad = () => this.setState({ thumbnailLoaded: true }); + + render () { + const { url, title, publisher, sharedTimes, thumbnail, blurhash } = this.props; + + const { thumbnailLoaded } = this.state; + + return ( + +
+
{publisher ? publisher : }
+
{title ? title : }
+
{typeof sharedTimes === 'number' ? : }
+
+ +
+ {thumbnail ? ( + +
+ + + ) : } +
+ + ); + } + +} diff --git a/app/javascript/flavours/glitch/features/explore/index.js b/app/javascript/flavours/glitch/features/explore/index.js deleted file mode 100644 index 4cbc5294b..000000000 --- a/app/javascript/flavours/glitch/features/explore/index.js +++ /dev/null @@ -1,107 +0,0 @@ -import React from 'react'; -import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; -import { connect } from 'react-redux'; -import PropTypes from 'prop-types'; -import Column from 'flavours/glitch/components/column'; -import ColumnHeader from 'flavours/glitch/components/column_header'; -import { NavLink, Switch, Route } from 'react-router-dom'; -import Links from './links'; -import Tags from './tags'; -import Statuses from './statuses'; -import Suggestions from './suggestions'; -import Search from 'flavours/glitch/features/compose/containers/search_container'; -import SearchResults from './results'; -import { showTrends } from 'flavours/glitch/initial_state'; -import { Helmet } from 'react-helmet'; - -const messages = defineMessages({ - title: { id: 'explore.title', defaultMessage: 'Explore' }, - searchResults: { id: 'explore.search_results', defaultMessage: 'Search results' }, -}); - -const mapStateToProps = state => ({ - layout: state.getIn(['meta', 'layout']), - isSearching: state.getIn(['search', 'submitted']) || !showTrends, -}); - -export default @connect(mapStateToProps) -@injectIntl -class Explore extends React.PureComponent { - - static contextTypes = { - router: PropTypes.object, - identity: PropTypes.object, - }; - - static propTypes = { - intl: PropTypes.object.isRequired, - multiColumn: PropTypes.bool, - isSearching: PropTypes.bool, - }; - - handleHeaderClick = () => { - this.column.scrollTop(); - }; - - setRef = c => { - this.column = c; - }; - - render() { - const { intl, multiColumn, isSearching } = this.props; - const { signedIn } = this.context.identity; - - return ( - - - -
- -
- -
- {isSearching ? ( - - ) : ( - <> -
- - - - - - - - - - {signedIn && ( - - - - )} -
- - - - - - - - - - {intl.formatMessage(messages.title)} - - - - )} -
- - ); - } - -} diff --git a/app/javascript/flavours/glitch/features/explore/index.jsx b/app/javascript/flavours/glitch/features/explore/index.jsx new file mode 100644 index 000000000..4cbc5294b --- /dev/null +++ b/app/javascript/flavours/glitch/features/explore/index.jsx @@ -0,0 +1,107 @@ +import React from 'react'; +import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; +import { connect } from 'react-redux'; +import PropTypes from 'prop-types'; +import Column from 'flavours/glitch/components/column'; +import ColumnHeader from 'flavours/glitch/components/column_header'; +import { NavLink, Switch, Route } from 'react-router-dom'; +import Links from './links'; +import Tags from './tags'; +import Statuses from './statuses'; +import Suggestions from './suggestions'; +import Search from 'flavours/glitch/features/compose/containers/search_container'; +import SearchResults from './results'; +import { showTrends } from 'flavours/glitch/initial_state'; +import { Helmet } from 'react-helmet'; + +const messages = defineMessages({ + title: { id: 'explore.title', defaultMessage: 'Explore' }, + searchResults: { id: 'explore.search_results', defaultMessage: 'Search results' }, +}); + +const mapStateToProps = state => ({ + layout: state.getIn(['meta', 'layout']), + isSearching: state.getIn(['search', 'submitted']) || !showTrends, +}); + +export default @connect(mapStateToProps) +@injectIntl +class Explore extends React.PureComponent { + + static contextTypes = { + router: PropTypes.object, + identity: PropTypes.object, + }; + + static propTypes = { + intl: PropTypes.object.isRequired, + multiColumn: PropTypes.bool, + isSearching: PropTypes.bool, + }; + + handleHeaderClick = () => { + this.column.scrollTop(); + }; + + setRef = c => { + this.column = c; + }; + + render() { + const { intl, multiColumn, isSearching } = this.props; + const { signedIn } = this.context.identity; + + return ( + + + +
+ +
+ +
+ {isSearching ? ( + + ) : ( + <> +
+ + + + + + + + + + {signedIn && ( + + + + )} +
+ + + + + + + + + + {intl.formatMessage(messages.title)} + + + + )} +
+ + ); + } + +} diff --git a/app/javascript/flavours/glitch/features/explore/links.js b/app/javascript/flavours/glitch/features/explore/links.js deleted file mode 100644 index 092f86b29..000000000 --- a/app/javascript/flavours/glitch/features/explore/links.js +++ /dev/null @@ -1,70 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import ImmutablePropTypes from 'react-immutable-proptypes'; -import Story from './components/story'; -import LoadingIndicator from 'flavours/glitch/components/loading_indicator'; -import { connect } from 'react-redux'; -import { fetchTrendingLinks } from 'flavours/glitch/actions/trends'; -import { FormattedMessage } from 'react-intl'; -import DismissableBanner from 'flavours/glitch/components/dismissable_banner'; - -const mapStateToProps = state => ({ - links: state.getIn(['trends', 'links', 'items']), - isLoading: state.getIn(['trends', 'links', 'isLoading']), -}); - -export default @connect(mapStateToProps) -class Links extends React.PureComponent { - - static propTypes = { - links: ImmutablePropTypes.list, - isLoading: PropTypes.bool, - dispatch: PropTypes.func.isRequired, - }; - - componentDidMount () { - const { dispatch } = this.props; - dispatch(fetchTrendingLinks()); - } - - render () { - const { isLoading, links } = this.props; - - const banner = ( - - - - ); - - if (!isLoading && links.isEmpty()) { - return ( -
- {banner} - -
- -
-
- ); - } - - return ( -
- {banner} - - {isLoading ? () : links.map(link => ( - - ))} -
- ); - } - -} diff --git a/app/javascript/flavours/glitch/features/explore/links.jsx b/app/javascript/flavours/glitch/features/explore/links.jsx new file mode 100644 index 000000000..092f86b29 --- /dev/null +++ b/app/javascript/flavours/glitch/features/explore/links.jsx @@ -0,0 +1,70 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import ImmutablePropTypes from 'react-immutable-proptypes'; +import Story from './components/story'; +import LoadingIndicator from 'flavours/glitch/components/loading_indicator'; +import { connect } from 'react-redux'; +import { fetchTrendingLinks } from 'flavours/glitch/actions/trends'; +import { FormattedMessage } from 'react-intl'; +import DismissableBanner from 'flavours/glitch/components/dismissable_banner'; + +const mapStateToProps = state => ({ + links: state.getIn(['trends', 'links', 'items']), + isLoading: state.getIn(['trends', 'links', 'isLoading']), +}); + +export default @connect(mapStateToProps) +class Links extends React.PureComponent { + + static propTypes = { + links: ImmutablePropTypes.list, + isLoading: PropTypes.bool, + dispatch: PropTypes.func.isRequired, + }; + + componentDidMount () { + const { dispatch } = this.props; + dispatch(fetchTrendingLinks()); + } + + render () { + const { isLoading, links } = this.props; + + const banner = ( + + + + ); + + if (!isLoading && links.isEmpty()) { + return ( +
+ {banner} + +
+ +
+
+ ); + } + + return ( +
+ {banner} + + {isLoading ? () : links.map(link => ( + + ))} +
+ ); + } + +} diff --git a/app/javascript/flavours/glitch/features/explore/results.js b/app/javascript/flavours/glitch/features/explore/results.js deleted file mode 100644 index 892980d95..000000000 --- a/app/javascript/flavours/glitch/features/explore/results.js +++ /dev/null @@ -1,126 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import ImmutablePropTypes from 'react-immutable-proptypes'; -import { injectIntl, defineMessages, FormattedMessage } from 'react-intl'; -import { connect } from 'react-redux'; -import { expandSearch } from 'flavours/glitch/actions/search'; -import Account from 'flavours/glitch/containers/account_container'; -import Status from 'flavours/glitch/containers/status_container'; -import { ImmutableHashtag as Hashtag } from 'flavours/glitch/components/hashtag'; -import { List as ImmutableList } from 'immutable'; -import LoadMore from 'flavours/glitch/components/load_more'; -import LoadingIndicator from 'flavours/glitch/components/loading_indicator'; -import { Helmet } from 'react-helmet'; - -const messages = defineMessages({ - title: { id: 'search_results.title', defaultMessage: 'Search for {q}' }, -}); - -const mapStateToProps = state => ({ - isLoading: state.getIn(['search', 'isLoading']), - results: state.getIn(['search', 'results']), - q: state.getIn(['search', 'searchTerm']), -}); - -const appendLoadMore = (id, list, onLoadMore) => { - if (list.size >= 5) { - return list.push(); - } else { - return list; - } -}; - -const renderAccounts = (results, onLoadMore) => appendLoadMore('accounts', results.get('accounts', ImmutableList()).map(item => ( - -)), onLoadMore); - -const renderHashtags = (results, onLoadMore) => appendLoadMore('hashtags', results.get('hashtags', ImmutableList()).map(item => ( - -)), onLoadMore); - -const renderStatuses = (results, onLoadMore) => appendLoadMore('statuses', results.get('statuses', ImmutableList()).map(item => ( - -)), onLoadMore); - -export default @connect(mapStateToProps) -@injectIntl -class Results extends React.PureComponent { - - static propTypes = { - results: ImmutablePropTypes.map, - isLoading: PropTypes.bool, - multiColumn: PropTypes.bool, - dispatch: PropTypes.func.isRequired, - q: PropTypes.string, - intl: PropTypes.object, - }; - - state = { - type: 'all', - }; - - handleSelectAll = () => this.setState({ type: 'all' }); - handleSelectAccounts = () => this.setState({ type: 'accounts' }); - handleSelectHashtags = () => this.setState({ type: 'hashtags' }); - handleSelectStatuses = () => this.setState({ type: 'statuses' }); - handleLoadMoreAccounts = () => this.loadMore('accounts'); - handleLoadMoreStatuses = () => this.loadMore('statuses'); - handleLoadMoreHashtags = () => this.loadMore('hashtags'); - - loadMore (type) { - const { dispatch } = this.props; - dispatch(expandSearch(type)); - } - - render () { - const { intl, isLoading, q, results } = this.props; - const { type } = this.state; - - let filteredResults = ImmutableList(); - - if (!isLoading) { - switch(type) { - case 'all': - filteredResults = filteredResults.concat(renderAccounts(results, this.handleLoadMoreAccounts), renderHashtags(results, this.handleLoadMoreHashtags), renderStatuses(results, this.handleLoadMoreStatuses)); - break; - case 'accounts': - filteredResults = filteredResults.concat(renderAccounts(results, this.handleLoadMoreAccounts)); - break; - case 'hashtags': - filteredResults = filteredResults.concat(renderHashtags(results, this.handleLoadMoreHashtags)); - break; - case 'statuses': - filteredResults = filteredResults.concat(renderStatuses(results, this.handleLoadMoreStatuses)); - break; - } - - if (filteredResults.size === 0) { - filteredResults = ( -
- -
- ); - } - } - - return ( - -
- - - - -
- -
- {isLoading ? : filteredResults} -
- - - {intl.formatMessage(messages.title, { q })} - - - ); - } - -} diff --git a/app/javascript/flavours/glitch/features/explore/results.jsx b/app/javascript/flavours/glitch/features/explore/results.jsx new file mode 100644 index 000000000..892980d95 --- /dev/null +++ b/app/javascript/flavours/glitch/features/explore/results.jsx @@ -0,0 +1,126 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import ImmutablePropTypes from 'react-immutable-proptypes'; +import { injectIntl, defineMessages, FormattedMessage } from 'react-intl'; +import { connect } from 'react-redux'; +import { expandSearch } from 'flavours/glitch/actions/search'; +import Account from 'flavours/glitch/containers/account_container'; +import Status from 'flavours/glitch/containers/status_container'; +import { ImmutableHashtag as Hashtag } from 'flavours/glitch/components/hashtag'; +import { List as ImmutableList } from 'immutable'; +import LoadMore from 'flavours/glitch/components/load_more'; +import LoadingIndicator from 'flavours/glitch/components/loading_indicator'; +import { Helmet } from 'react-helmet'; + +const messages = defineMessages({ + title: { id: 'search_results.title', defaultMessage: 'Search for {q}' }, +}); + +const mapStateToProps = state => ({ + isLoading: state.getIn(['search', 'isLoading']), + results: state.getIn(['search', 'results']), + q: state.getIn(['search', 'searchTerm']), +}); + +const appendLoadMore = (id, list, onLoadMore) => { + if (list.size >= 5) { + return list.push(); + } else { + return list; + } +}; + +const renderAccounts = (results, onLoadMore) => appendLoadMore('accounts', results.get('accounts', ImmutableList()).map(item => ( + +)), onLoadMore); + +const renderHashtags = (results, onLoadMore) => appendLoadMore('hashtags', results.get('hashtags', ImmutableList()).map(item => ( + +)), onLoadMore); + +const renderStatuses = (results, onLoadMore) => appendLoadMore('statuses', results.get('statuses', ImmutableList()).map(item => ( + +)), onLoadMore); + +export default @connect(mapStateToProps) +@injectIntl +class Results extends React.PureComponent { + + static propTypes = { + results: ImmutablePropTypes.map, + isLoading: PropTypes.bool, + multiColumn: PropTypes.bool, + dispatch: PropTypes.func.isRequired, + q: PropTypes.string, + intl: PropTypes.object, + }; + + state = { + type: 'all', + }; + + handleSelectAll = () => this.setState({ type: 'all' }); + handleSelectAccounts = () => this.setState({ type: 'accounts' }); + handleSelectHashtags = () => this.setState({ type: 'hashtags' }); + handleSelectStatuses = () => this.setState({ type: 'statuses' }); + handleLoadMoreAccounts = () => this.loadMore('accounts'); + handleLoadMoreStatuses = () => this.loadMore('statuses'); + handleLoadMoreHashtags = () => this.loadMore('hashtags'); + + loadMore (type) { + const { dispatch } = this.props; + dispatch(expandSearch(type)); + } + + render () { + const { intl, isLoading, q, results } = this.props; + const { type } = this.state; + + let filteredResults = ImmutableList(); + + if (!isLoading) { + switch(type) { + case 'all': + filteredResults = filteredResults.concat(renderAccounts(results, this.handleLoadMoreAccounts), renderHashtags(results, this.handleLoadMoreHashtags), renderStatuses(results, this.handleLoadMoreStatuses)); + break; + case 'accounts': + filteredResults = filteredResults.concat(renderAccounts(results, this.handleLoadMoreAccounts)); + break; + case 'hashtags': + filteredResults = filteredResults.concat(renderHashtags(results, this.handleLoadMoreHashtags)); + break; + case 'statuses': + filteredResults = filteredResults.concat(renderStatuses(results, this.handleLoadMoreStatuses)); + break; + } + + if (filteredResults.size === 0) { + filteredResults = ( +
+ +
+ ); + } + } + + return ( + +
+ + + + +
+ +
+ {isLoading ? : filteredResults} +
+ + + {intl.formatMessage(messages.title, { q })} + + + ); + } + +} diff --git a/app/javascript/flavours/glitch/features/explore/statuses.js b/app/javascript/flavours/glitch/features/explore/statuses.js deleted file mode 100644 index 21768dd24..000000000 --- a/app/javascript/flavours/glitch/features/explore/statuses.js +++ /dev/null @@ -1,64 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import ImmutablePropTypes from 'react-immutable-proptypes'; -import StatusList from 'flavours/glitch/components/status_list'; -import { FormattedMessage } from 'react-intl'; -import { connect } from 'react-redux'; -import { fetchTrendingStatuses, expandTrendingStatuses } from 'flavours/glitch/actions/trends'; -import { debounce } from 'lodash'; -import DismissableBanner from 'flavours/glitch/components/dismissable_banner'; - -const mapStateToProps = state => ({ - statusIds: state.getIn(['status_lists', 'trending', 'items']), - isLoading: state.getIn(['status_lists', 'trending', 'isLoading'], true), - hasMore: !!state.getIn(['status_lists', 'trending', 'next']), -}); - -export default @connect(mapStateToProps) -class Statuses extends React.PureComponent { - - static propTypes = { - statusIds: ImmutablePropTypes.list, - isLoading: PropTypes.bool, - hasMore: PropTypes.bool, - multiColumn: PropTypes.bool, - dispatch: PropTypes.func.isRequired, - }; - - componentDidMount () { - const { dispatch } = this.props; - dispatch(fetchTrendingStatuses()); - } - - handleLoadMore = debounce(() => { - const { dispatch } = this.props; - dispatch(expandTrendingStatuses()); - }, 300, { leading: true }); - - render () { - const { isLoading, hasMore, statusIds, multiColumn } = this.props; - - const emptyMessage = ; - - return ( - <> - - - - - - - ); - } - -} diff --git a/app/javascript/flavours/glitch/features/explore/statuses.jsx b/app/javascript/flavours/glitch/features/explore/statuses.jsx new file mode 100644 index 000000000..21768dd24 --- /dev/null +++ b/app/javascript/flavours/glitch/features/explore/statuses.jsx @@ -0,0 +1,64 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import ImmutablePropTypes from 'react-immutable-proptypes'; +import StatusList from 'flavours/glitch/components/status_list'; +import { FormattedMessage } from 'react-intl'; +import { connect } from 'react-redux'; +import { fetchTrendingStatuses, expandTrendingStatuses } from 'flavours/glitch/actions/trends'; +import { debounce } from 'lodash'; +import DismissableBanner from 'flavours/glitch/components/dismissable_banner'; + +const mapStateToProps = state => ({ + statusIds: state.getIn(['status_lists', 'trending', 'items']), + isLoading: state.getIn(['status_lists', 'trending', 'isLoading'], true), + hasMore: !!state.getIn(['status_lists', 'trending', 'next']), +}); + +export default @connect(mapStateToProps) +class Statuses extends React.PureComponent { + + static propTypes = { + statusIds: ImmutablePropTypes.list, + isLoading: PropTypes.bool, + hasMore: PropTypes.bool, + multiColumn: PropTypes.bool, + dispatch: PropTypes.func.isRequired, + }; + + componentDidMount () { + const { dispatch } = this.props; + dispatch(fetchTrendingStatuses()); + } + + handleLoadMore = debounce(() => { + const { dispatch } = this.props; + dispatch(expandTrendingStatuses()); + }, 300, { leading: true }); + + render () { + const { isLoading, hasMore, statusIds, multiColumn } = this.props; + + const emptyMessage = ; + + return ( + <> + + + + + + + ); + } + +} diff --git a/app/javascript/flavours/glitch/features/explore/suggestions.js b/app/javascript/flavours/glitch/features/explore/suggestions.js deleted file mode 100644 index 1c9b99266..000000000 --- a/app/javascript/flavours/glitch/features/explore/suggestions.js +++ /dev/null @@ -1,56 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import ImmutablePropTypes from 'react-immutable-proptypes'; -import AccountCard from 'flavours/glitch/features/directory/components/account_card'; -import LoadingIndicator from 'flavours/glitch/components/loading_indicator'; -import { connect } from 'react-redux'; -import { fetchSuggestions, dismissSuggestion } from 'flavours/glitch/actions/suggestions'; -import { FormattedMessage } from 'react-intl'; - -const mapStateToProps = state => ({ - suggestions: state.getIn(['suggestions', 'items']), - isLoading: state.getIn(['suggestions', 'isLoading']), -}); - -export default @connect(mapStateToProps) -class Suggestions extends React.PureComponent { - - static propTypes = { - isLoading: PropTypes.bool, - suggestions: ImmutablePropTypes.list, - dispatch: PropTypes.func.isRequired, - }; - - componentDidMount () { - const { dispatch } = this.props; - dispatch(fetchSuggestions(true)); - } - - handleDismiss = (accountId) => { - const { dispatch } = this.props; - dispatch(dismissSuggestion(accountId)); - }; - - render () { - const { isLoading, suggestions } = this.props; - - if (!isLoading && suggestions.isEmpty()) { - return ( -
-
- -
-
- ); - } - - return ( -
- {isLoading ? : suggestions.map(suggestion => ( - - ))} -
- ); - } - -} diff --git a/app/javascript/flavours/glitch/features/explore/suggestions.jsx b/app/javascript/flavours/glitch/features/explore/suggestions.jsx new file mode 100644 index 000000000..1c9b99266 --- /dev/null +++ b/app/javascript/flavours/glitch/features/explore/suggestions.jsx @@ -0,0 +1,56 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import ImmutablePropTypes from 'react-immutable-proptypes'; +import AccountCard from 'flavours/glitch/features/directory/components/account_card'; +import LoadingIndicator from 'flavours/glitch/components/loading_indicator'; +import { connect } from 'react-redux'; +import { fetchSuggestions, dismissSuggestion } from 'flavours/glitch/actions/suggestions'; +import { FormattedMessage } from 'react-intl'; + +const mapStateToProps = state => ({ + suggestions: state.getIn(['suggestions', 'items']), + isLoading: state.getIn(['suggestions', 'isLoading']), +}); + +export default @connect(mapStateToProps) +class Suggestions extends React.PureComponent { + + static propTypes = { + isLoading: PropTypes.bool, + suggestions: ImmutablePropTypes.list, + dispatch: PropTypes.func.isRequired, + }; + + componentDidMount () { + const { dispatch } = this.props; + dispatch(fetchSuggestions(true)); + } + + handleDismiss = (accountId) => { + const { dispatch } = this.props; + dispatch(dismissSuggestion(accountId)); + }; + + render () { + const { isLoading, suggestions } = this.props; + + if (!isLoading && suggestions.isEmpty()) { + return ( +
+
+ +
+
+ ); + } + + return ( +
+ {isLoading ? : suggestions.map(suggestion => ( + + ))} +
+ ); + } + +} diff --git a/app/javascript/flavours/glitch/features/explore/tags.js b/app/javascript/flavours/glitch/features/explore/tags.js deleted file mode 100644 index 938036b64..000000000 --- a/app/javascript/flavours/glitch/features/explore/tags.js +++ /dev/null @@ -1,62 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import ImmutablePropTypes from 'react-immutable-proptypes'; -import { ImmutableHashtag as Hashtag } from 'flavours/glitch/components/hashtag'; -import LoadingIndicator from 'flavours/glitch/components/loading_indicator'; -import { connect } from 'react-redux'; -import { fetchTrendingHashtags } from 'flavours/glitch/actions/trends'; -import { FormattedMessage } from 'react-intl'; -import DismissableBanner from 'flavours/glitch/components/dismissable_banner'; - -const mapStateToProps = state => ({ - hashtags: state.getIn(['trends', 'tags', 'items']), - isLoadingHashtags: state.getIn(['trends', 'tags', 'isLoading']), -}); - -export default @connect(mapStateToProps) -class Tags extends React.PureComponent { - - static propTypes = { - hashtags: ImmutablePropTypes.list, - isLoading: PropTypes.bool, - dispatch: PropTypes.func.isRequired, - }; - - componentDidMount () { - const { dispatch } = this.props; - dispatch(fetchTrendingHashtags()); - } - - render () { - const { isLoading, hashtags } = this.props; - - const banner = ( - - - - ); - - if (!isLoading && hashtags.isEmpty()) { - return ( -
- {banner} - -
- -
-
- ); - } - - return ( -
- {banner} - - {isLoading ? () : hashtags.map(hashtag => ( - - ))} -
- ); - } - -} diff --git a/app/javascript/flavours/glitch/features/explore/tags.jsx b/app/javascript/flavours/glitch/features/explore/tags.jsx new file mode 100644 index 000000000..938036b64 --- /dev/null +++ b/app/javascript/flavours/glitch/features/explore/tags.jsx @@ -0,0 +1,62 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import ImmutablePropTypes from 'react-immutable-proptypes'; +import { ImmutableHashtag as Hashtag } from 'flavours/glitch/components/hashtag'; +import LoadingIndicator from 'flavours/glitch/components/loading_indicator'; +import { connect } from 'react-redux'; +import { fetchTrendingHashtags } from 'flavours/glitch/actions/trends'; +import { FormattedMessage } from 'react-intl'; +import DismissableBanner from 'flavours/glitch/components/dismissable_banner'; + +const mapStateToProps = state => ({ + hashtags: state.getIn(['trends', 'tags', 'items']), + isLoadingHashtags: state.getIn(['trends', 'tags', 'isLoading']), +}); + +export default @connect(mapStateToProps) +class Tags extends React.PureComponent { + + static propTypes = { + hashtags: ImmutablePropTypes.list, + isLoading: PropTypes.bool, + dispatch: PropTypes.func.isRequired, + }; + + componentDidMount () { + const { dispatch } = this.props; + dispatch(fetchTrendingHashtags()); + } + + render () { + const { isLoading, hashtags } = this.props; + + const banner = ( + + + + ); + + if (!isLoading && hashtags.isEmpty()) { + return ( +
+ {banner} + +
+ +
+
+ ); + } + + return ( +
+ {banner} + + {isLoading ? () : hashtags.map(hashtag => ( + + ))} +
+ ); + } + +} -- cgit