diff --git a/.eslintrc.js b/.eslintrc.js index 1dbfd1d3ede..7741093674e 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -98,8 +98,10 @@ module.exports = { 'react/jsx-filename-extension': ['error', { extensions: ['.jsx', 'tsx'] }], 'react/jsx-boolean-value': 'error', 'react/display-name': 'off', + 'react/jsx-fragments': ['error', 'syntax'], 'react/jsx-equals-spacing': 'error', 'react/jsx-no-bind': 'error', + 'react/jsx-no-useless-fragment': 'error', 'react/jsx-no-target-blank': 'off', 'react/jsx-tag-spacing': 'error', 'react/jsx-uses-react': 'off', // not needed with new JSX transform diff --git a/app/javascript/mastodon/components/admin/Counter.jsx b/app/javascript/mastodon/components/admin/Counter.jsx index 5eb83695829..9ae8b2ce4d3 100644 --- a/app/javascript/mastodon/components/admin/Counter.jsx +++ b/app/javascript/mastodon/components/admin/Counter.jsx @@ -1,4 +1,4 @@ -import { PureComponent, Fragment } from 'react'; +import { PureComponent } from 'react'; import PropTypes from 'prop-types'; import api from 'mastodon/api'; import { FormattedNumber } from 'react-intl'; @@ -62,25 +62,25 @@ export default class Counter extends PureComponent { if (loading) { content = ( - + <> - + ); } else { const measure = data[0]; const percentChange = measure.previous_total && percIncrease(measure.previous_total * 1, measure.total * 1); content = ( - + <> {measure.human_value || } {measure.previous_total && ( 0, negative: percentChange < 0 })}>{percentChange > 0 && '+'})} - + ); } const inner = ( - + <>
{content}
@@ -96,7 +96,7 @@ export default class Counter extends PureComponent { )} -
+ ); if (href) { diff --git a/app/javascript/mastodon/components/dropdown_menu.jsx b/app/javascript/mastodon/components/dropdown_menu.jsx index 4a3c211c7b0..a0023166b0b 100644 --- a/app/javascript/mastodon/components/dropdown_menu.jsx +++ b/app/javascript/mastodon/components/dropdown_menu.jsx @@ -1,4 +1,4 @@ -import { PureComponent, cloneElement, Children, Fragment } from 'react'; +import { PureComponent, cloneElement, Children } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { IconButton } from './icon_button'; @@ -306,7 +306,7 @@ export default class Dropdown extends PureComponent { ); return ( - + <> {button} @@ -329,7 +329,7 @@ export default class Dropdown extends PureComponent { )} - + ); } diff --git a/app/javascript/mastodon/components/hashtag.jsx b/app/javascript/mastodon/components/hashtag.jsx index 0f1d3877c21..ea88a1702a4 100644 --- a/app/javascript/mastodon/components/hashtag.jsx +++ b/app/javascript/mastodon/components/hashtag.jsx @@ -1,5 +1,5 @@ // @ts-check -import { Component, Fragment } from 'react'; +import { Component } from 'react'; import { Sparklines, SparklinesCurve } from 'react-sparklines'; import { FormattedMessage } from 'react-intl'; import PropTypes from 'prop-types'; @@ -69,7 +69,7 @@ const Hashtag = ({ name, to, people, uses, history, className, description, with
- {name ? #{name} : } + {name ? <>#{name} : } {description ? ( diff --git a/app/javascript/mastodon/components/navigation_portal.jsx b/app/javascript/mastodon/components/navigation_portal.jsx index 40c47c0218d..671ad1f6ecb 100644 --- a/app/javascript/mastodon/components/navigation_portal.jsx +++ b/app/javascript/mastodon/components/navigation_portal.jsx @@ -5,14 +5,12 @@ import Trends from 'mastodon/features/getting_started/containers/trends_containe import AccountNavigation from 'mastodon/features/account/navigation'; const DefaultNavigation = () => ( - <> - {showTrends && ( - <> -
- - - )} - + showTrends ? ( + <> +
+ + + ) : null ); class NavigationPortal extends PureComponent { diff --git a/app/javascript/mastodon/containers/media_container.jsx b/app/javascript/mastodon/containers/media_container.jsx index 4d1689c2356..d9888089755 100644 --- a/app/javascript/mastodon/containers/media_container.jsx +++ b/app/javascript/mastodon/containers/media_container.jsx @@ -1,4 +1,4 @@ -import { PureComponent, Fragment } from 'react'; +import { PureComponent } from 'react'; import { createPortal } from 'react-dom'; import PropTypes from 'prop-types'; import { IntlProvider, addLocaleData } from 'react-intl'; @@ -75,7 +75,7 @@ export default class MediaContainer extends PureComponent { return ( - + <> {[].map.call(components, (component, i) => { const componentName = component.getAttribute('data-component'); const Component = MEDIA_COMPONENTS[componentName]; @@ -115,7 +115,7 @@ export default class MediaContainer extends PureComponent { /> )} - + ); } diff --git a/app/javascript/mastodon/features/account/components/header.jsx b/app/javascript/mastodon/features/account/components/header.jsx index 2784441c9c1..747177c8649 100644 --- a/app/javascript/mastodon/features/account/components/header.jsx +++ b/app/javascript/mastodon/features/account/components/header.jsx @@ -1,4 +1,3 @@ -import { Fragment } from 'react'; import ImmutablePropTypes from 'react-immutable-proptypes'; import PropTypes from 'prop-types'; import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; @@ -399,10 +398,10 @@ class Header extends ImmutablePureComponent { {!suspended && (
{!hidden && ( - + <> {actionBtn} {bellBtn} - + )} diff --git a/app/javascript/mastodon/features/explore/components/story.jsx b/app/javascript/mastodon/features/explore/components/story.jsx index 1cf9df5c408..e352cf0d334 100644 --- a/app/javascript/mastodon/features/explore/components/story.jsx +++ b/app/javascript/mastodon/features/explore/components/story.jsx @@ -1,4 +1,4 @@ -import { PureComponent, Fragment } from 'react'; +import { PureComponent } from 'react'; import PropTypes from 'prop-types'; import { Blurhash } from 'mastodon/components/blurhash'; import { accountsCountRenderer } from 'mastodon/components/hashtag'; @@ -38,10 +38,10 @@ export default class Story extends PureComponent {
{thumbnail ? ( - + <>
-
+ ) : }
diff --git a/app/javascript/mastodon/features/explore/results.jsx b/app/javascript/mastodon/features/explore/results.jsx index 103cb447879..63e5da3b8a5 100644 --- a/app/javascript/mastodon/features/explore/results.jsx +++ b/app/javascript/mastodon/features/explore/results.jsx @@ -1,4 +1,4 @@ -import { PureComponent, Fragment } from 'react'; +import { PureComponent } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { injectIntl, defineMessages, FormattedMessage } from 'react-intl'; @@ -102,7 +102,7 @@ class Results extends PureComponent { } return ( - + <>
@@ -117,7 +117,7 @@ class Results extends PureComponent { {intl.formatMessage(messages.title, { q })} - + ); } diff --git a/app/javascript/mastodon/features/filters/added_to_filter.jsx b/app/javascript/mastodon/features/filters/added_to_filter.jsx index 139832ee98a..aaf054ac750 100644 --- a/app/javascript/mastodon/features/filters/added_to_filter.jsx +++ b/app/javascript/mastodon/features/filters/added_to_filter.jsx @@ -1,4 +1,4 @@ -import { PureComponent, Fragment } from 'react'; +import { PureComponent } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { FormattedMessage } from 'react-intl'; @@ -30,7 +30,7 @@ class AddedToFilter extends PureComponent { let expiredMessage = null; if (filter.get('expires_at') && filter.get('expires_at') < new Date()) { expiredMessage = ( - + <>

-
+ ); } let contextMismatchMessage = null; if (contextType && !filter.get('context').includes(toServerSideType(contextType))) { contextMismatchMessage = ( - + <>

-
+ ); } @@ -67,7 +67,7 @@ class AddedToFilter extends PureComponent { ); return ( - + <>

-
+ ); } diff --git a/app/javascript/mastodon/features/filters/select_filter.jsx b/app/javascript/mastodon/features/filters/select_filter.jsx index 6d23d48cf2d..fd367be2d48 100644 --- a/app/javascript/mastodon/features/filters/select_filter.jsx +++ b/app/javascript/mastodon/features/filters/select_filter.jsx @@ -1,4 +1,4 @@ -import { PureComponent, Fragment } from 'react'; +import { PureComponent } from 'react'; import PropTypes from 'prop-types'; import { connect } from 'react-redux'; import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; @@ -169,7 +169,7 @@ class SelectFilter extends PureComponent { const results = this.search(); return ( - + <>

@@ -183,7 +183,7 @@ class SelectFilter extends PureComponent { {isSearching && this.renderCreateNew(searchValue) }
- + ); } diff --git a/app/javascript/mastodon/features/notifications/components/follow_request.jsx b/app/javascript/mastodon/features/notifications/components/follow_request.jsx index 9456c29adde..93dcf6d8735 100644 --- a/app/javascript/mastodon/features/notifications/components/follow_request.jsx +++ b/app/javascript/mastodon/features/notifications/components/follow_request.jsx @@ -1,4 +1,3 @@ -import { Fragment } from 'react'; import ImmutablePropTypes from 'react-immutable-proptypes'; import PropTypes from 'prop-types'; import { Avatar } from 'mastodon/components/avatar'; @@ -31,10 +30,10 @@ class FollowRequest extends ImmutablePureComponent { if (hidden) { return ( - + <> {account.get('display_name')} {account.get('username')} - + ); } diff --git a/app/javascript/mastodon/features/notifications/components/report.jsx b/app/javascript/mastodon/features/notifications/components/report.jsx index 301a9525a96..4f133cc03ab 100644 --- a/app/javascript/mastodon/features/notifications/components/report.jsx +++ b/app/javascript/mastodon/features/notifications/components/report.jsx @@ -1,4 +1,3 @@ -import { Fragment } from 'react'; import ImmutablePropTypes from 'react-immutable-proptypes'; import PropTypes from 'prop-types'; import { defineMessages, FormattedMessage, injectIntl } from 'react-intl'; @@ -31,9 +30,9 @@ class Report extends ImmutablePureComponent { if (hidden) { return ( - + <> {report.get('id')} - + ); } diff --git a/app/javascript/mastodon/features/report/category.jsx b/app/javascript/mastodon/features/report/category.jsx index f1fbd9622de..13a5605c65f 100644 --- a/app/javascript/mastodon/features/report/category.jsx +++ b/app/javascript/mastodon/features/report/category.jsx @@ -1,4 +1,4 @@ -import { PureComponent, Fragment } from 'react'; +import { PureComponent } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { connect } from 'react-redux'; @@ -74,7 +74,7 @@ class Category extends PureComponent { ]; return ( - + <>

@@ -97,7 +97,7 @@ class Category extends PureComponent {
-
+ ); } diff --git a/app/javascript/mastodon/features/report/comment.jsx b/app/javascript/mastodon/features/report/comment.jsx index 6cf43fca0df..c4a6961817a 100644 --- a/app/javascript/mastodon/features/report/comment.jsx +++ b/app/javascript/mastodon/features/report/comment.jsx @@ -1,4 +1,4 @@ -import { PureComponent, Fragment } from 'react'; +import { PureComponent } from 'react'; import PropTypes from 'prop-types'; import { injectIntl, defineMessages, FormattedMessage } from 'react-intl'; import Button from 'mastodon/components/button'; @@ -47,7 +47,7 @@ class Comment extends PureComponent { const { comment, isRemote, forward, domain, isSubmitting, intl } = this.props; return ( - + <>