[Glitch] Use the new JSX transform everywhere

Port 8f66126b10 to glitch-soc
This commit is contained in:
Claire
2023-05-28 14:18:23 +02:00
parent 9381f78166
commit 6001f5ff36
263 changed files with 403 additions and 502 deletions

View File

@ -1,4 +1,4 @@
import React from 'react';
import { Fragment } from 'react';
import PropTypes from 'prop-types';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
@ -35,13 +35,13 @@ export default class ActionsModal extends ImmutablePureComponent {
if (!contents) {
contents = (
<React.Fragment>
<Fragment>
{icon && <IconButton title={text} icon={icon} role='presentation' tabIndex={-1} inverted />}
<div>
<div className={classNames({ 'actions-modal__item-label': !!meta })}>{text}</div>
<div>{meta}</div>
</div>
</React.Fragment>
</Fragment>
);
}

View File

@ -1,4 +1,3 @@
import React from 'react';
import ImmutablePropTypes from 'react-immutable-proptypes';
import PropTypes from 'prop-types';
import Audio from 'flavours/glitch/features/audio';

View File

@ -1,4 +1,4 @@
import React from 'react';
import { PureComponent } from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import { injectIntl, FormattedMessage } from 'react-intl';
@ -36,7 +36,7 @@ const mapDispatchToProps = dispatch => {
};
};
class BlockModal extends React.PureComponent {
class BlockModal extends PureComponent {
static propTypes = {
account: PropTypes.object.isRequired,

View File

@ -1,4 +1,3 @@
import React from 'react';
import { connect } from 'react-redux';
import ImmutablePropTypes from 'react-immutable-proptypes';
import PropTypes from 'prop-types';

View File

@ -1,10 +1,10 @@
import React from 'react';
import { Component } from 'react';
import PropTypes from 'prop-types';
const emptyComponent = () => null;
const noop = () => { };
class Bundle extends React.Component {
class Bundle extends Component {
static propTypes = {
fetchComponent: PropTypes.func.isRequired,

View File

@ -1,4 +1,4 @@
import React from 'react';
import { PureComponent } from 'react';
import PropTypes from 'prop-types';
import { injectIntl, FormattedMessage } from 'react-intl';
import Column from 'flavours/glitch/components/column';
@ -8,7 +8,7 @@ import { Link } from 'react-router-dom';
import classNames from 'classnames';
import { autoPlayGif } from 'flavours/glitch/initial_state';
class GIF extends React.PureComponent {
class GIF extends PureComponent {
static propTypes = {
src: PropTypes.string.isRequired,
@ -59,7 +59,7 @@ class GIF extends React.PureComponent {
}
class CopyButton extends React.PureComponent {
class CopyButton extends PureComponent {
static propTypes = {
children: PropTypes.node.isRequired,
@ -92,7 +92,7 @@ class CopyButton extends React.PureComponent {
}
class BundleColumnError extends React.PureComponent {
class BundleColumnError extends PureComponent {
static propTypes = {
errorType: PropTypes.oneOf(['routing', 'network', 'error']),

View File

@ -1,4 +1,4 @@
import React from 'react';
import { Component } from 'react';
import PropTypes from 'prop-types';
import { defineMessages, injectIntl } from 'react-intl';
@ -10,7 +10,7 @@ const messages = defineMessages({
close: { id: 'bundle_modal_error.close', defaultMessage: 'Close' },
});
class BundleModalError extends React.Component {
class BundleModalError extends Component {
static propTypes = {
onRetry: PropTypes.func.isRequired,

View File

@ -1,11 +1,11 @@
import React from 'react';
import { PureComponent } from 'react';
import ColumnHeader from './column_header';
import PropTypes from 'prop-types';
import { debounce } from 'lodash';
import { scrollTop } from 'flavours/glitch/scroll';
import { isMobile } from 'flavours/glitch/is_mobile';
export default class Column extends React.PureComponent {
export default class Column extends PureComponent {
static propTypes = {
heading: PropTypes.string,

View File

@ -1,9 +1,9 @@
import React from 'react';
import { PureComponent } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { Icon } from 'flavours/glitch/components/icon';
export default class ColumnHeader extends React.PureComponent {
export default class ColumnHeader extends PureComponent {
static propTypes = {
icon: PropTypes.string,

View File

@ -1,4 +1,3 @@
import React from 'react';
import PropTypes from 'prop-types';
import { NavLink } from 'react-router-dom';
import { Icon } from 'flavours/glitch/components/icon';

View File

@ -1,4 +1,3 @@
import React from 'react';
import PropTypes from 'prop-types';
import Column from 'flavours/glitch/components/column';

View File

@ -1,4 +1,3 @@
import React from 'react';
import PropTypes from 'prop-types';
const ColumnSubheading = ({ text }) => {

View File

@ -1,4 +1,4 @@
import React from 'react';
import { Children, cloneElement } from 'react';
import PropTypes from 'prop-types';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
@ -174,7 +174,7 @@ export default class ColumnsArea extends ImmutablePureComponent {
);
})}
{React.Children.map(children, child => React.cloneElement(child, { multiColumn: true }))}
{Children.map(children, child => cloneElement(child, { multiColumn: true }))}
</div>
);
}

View File

@ -1,4 +1,4 @@
import React from 'react';
import { PureComponent, Fragment } from 'react';
import PropTypes from 'prop-types';
import ImmutablePropTypes from 'react-immutable-proptypes';
import { connect } from 'react-redux';
@ -24,7 +24,7 @@ const mapDispatchToProps = dispatch => ({
});
class CompareHistoryModal extends React.PureComponent {
class CompareHistoryModal extends PureComponent {
static propTypes = {
onClose: PropTypes.func.isRequired,
@ -65,10 +65,10 @@ class CompareHistoryModal extends React.PureComponent {
<div className='compare-history-modal__container'>
<div className='status__content'>
{currentVersion.get('spoiler_text').length > 0 && (
<React.Fragment>
<Fragment>
<div className='translate' dangerouslySetInnerHTML={spoilerContent} lang={language} />
<hr />
</React.Fragment>
</Fragment>
)}
<div className='status__content__text status__content__text--visible translate' dangerouslySetInnerHTML={content} lang={language} />

View File

@ -1,4 +1,4 @@
import React from 'react';
import { PureComponent, Fragment } from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import SearchContainer from 'flavours/glitch/features/compose/containers/search_container';
@ -8,7 +8,7 @@ import LinkFooter from './link_footer';
import ServerBanner from 'flavours/glitch/components/server_banner';
import { mountCompose, unmountCompose } from 'flavours/glitch/actions/compose';
class ComposePanel extends React.PureComponent {
class ComposePanel extends PureComponent {
static contextTypes = {
identity: PropTypes.object.isRequired,
@ -36,17 +36,17 @@ class ComposePanel extends React.PureComponent {
<SearchContainer openInRoute />
{!signedIn && (
<React.Fragment>
<Fragment>
<ServerBanner />
<div className='flex-spacer' />
</React.Fragment>
</Fragment>
)}
{signedIn && (
<React.Fragment>
<Fragment>
<NavigationContainer />
<ComposeFormContainer singleColumn />
</React.Fragment>
</Fragment>
)}
<LinkFooter />

View File

@ -1,9 +1,9 @@
import React from 'react';
import { PureComponent } from 'react';
import PropTypes from 'prop-types';
import { injectIntl, FormattedMessage } from 'react-intl';
import Button from 'flavours/glitch/components/button';
class ConfirmationModal extends React.PureComponent {
class ConfirmationModal extends PureComponent {
static propTypes = {
message: PropTypes.node.isRequired,

View File

@ -1,4 +1,4 @@
import React from 'react';
import { PureComponent } from 'react';
import PropTypes from 'prop-types';
import ImmutablePropTypes from 'react-immutable-proptypes';
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
@ -13,7 +13,7 @@ const messages = defineMessages({
user_setting_disable_swiping: { id: 'settings.swipe_to_change_columns', defaultMessage: 'Allow swiping to change columns (Mobile only)' },
});
class DeprecatedSettingsModal extends React.PureComponent {
class DeprecatedSettingsModal extends PureComponent {
static propTypes = {
settings: ImmutablePropTypes.list.isRequired,

View File

@ -1,4 +1,4 @@
import React from 'react';
import { PureComponent } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { Link } from 'react-router-dom';
@ -28,7 +28,7 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
},
});
class DisabledAccountBanner extends React.PureComponent {
class DisabledAccountBanner extends PureComponent {
static propTypes = {
disabledAcct: PropTypes.string.isRequired,

View File

@ -1,4 +1,3 @@
import React from 'react';
import PropTypes from 'prop-types';
import Button from 'flavours/glitch/components/button';
import ImmutablePureComponent from 'react-immutable-pure-component';

View File

@ -1,5 +1,3 @@
import React from 'react';
const DrawerLoading = () => (
<div className='drawer'>
<div className='drawer__pager'>

View File

@ -1,4 +1,3 @@
import React from 'react';
import PropTypes from 'prop-types';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { defineMessages, FormattedMessage, injectIntl } from 'react-intl';

View File

@ -1,4 +1,3 @@
import React from 'react';
import ImmutablePropTypes from 'react-immutable-proptypes';
import PropTypes from 'prop-types';
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';

View File

@ -1,4 +1,3 @@
import React from 'react';
import { connect } from 'react-redux';
import { fetchStatus } from 'flavours/glitch/actions/statuses';
import { fetchFilters, createFilter, createFilterStatus } from 'flavours/glitch/actions/filters';

View File

@ -1,4 +1,4 @@
import React from 'react';
import { PureComponent, Fragment } from 'react';
import ImmutablePropTypes from 'react-immutable-proptypes';
import PropTypes from 'prop-types';
import ImmutablePureComponent from 'react-immutable-pure-component';
@ -69,7 +69,7 @@ const removeExtraLineBreaks = str => str.replace(/\n\n/g, '******')
.replace(/\n/g, ' ')
.replace(/\*\*\*\*\*\*/g, '\n\n');
class ImageLoader extends React.PureComponent {
class ImageLoader extends PureComponent {
static propTypes = {
src: PropTypes.string.isRequired,
@ -315,7 +315,7 @@ class FocalPointModal extends ImmutablePureComponent {
{focals && <p><FormattedMessage id='upload_modal.hint' defaultMessage='Click or drag the circle on the preview to choose the focal point which will always be in view on all thumbnails.' /></p>}
{thumbnailable && (
<React.Fragment>
<Fragment>
<label className='setting-text-label' htmlFor='upload-modal__thumbnail'><FormattedMessage id='upload_form.thumbnail' defaultMessage='Change thumbnail' /></label>
<Button disabled={isUploadingThumbnail || !media.get('unattached')} text={intl.formatMessage(messages.chooseImage)} onClick={this.handleFileInputClick} />
@ -335,7 +335,7 @@ class FocalPointModal extends ImmutablePureComponent {
</label>
<hr className='setting-divider' />
</React.Fragment>
</Fragment>
)}
<label className='setting-text-label' htmlFor='upload-modal__description'>

View File

@ -1,4 +1,4 @@
import React from 'react';
import { Component } from 'react';
import PropTypes from 'prop-types';
import { fetchFollowRequests } from 'flavours/glitch/actions/accounts';
import { connect } from 'react-redux';
@ -15,7 +15,7 @@ const mapStateToProps = state => ({
count: state.getIn(['user_lists', 'follow_requests', 'items'], ImmutableList()).size,
});
class FollowRequestsColumnLink extends React.Component {
class FollowRequestsColumnLink extends Component {
static propTypes = {
dispatch: PropTypes.func.isRequired,

View File

@ -1,4 +1,4 @@
import React from 'react';
import { PureComponent } from 'react';
import { WordmarkLogo, SymbolLogo } from 'flavours/glitch/components/logo';
import { Link, withRouter } from 'react-router-dom';
import { FormattedMessage } from 'react-intl';
@ -23,7 +23,7 @@ const mapDispatchToProps = (dispatch) => ({
},
});
class Header extends React.PureComponent {
class Header extends PureComponent {
static contextTypes = {
identity: PropTypes.object,

View File

@ -1,6 +1,6 @@
import classNames from 'classnames';
import PropTypes from 'prop-types';
import React, { PureComponent } from 'react';
import { PureComponent } from 'react';
import { LoadingBar } from 'react-redux-loading-bar';
import ZoomableImage from './zoomable_image';

View File

@ -1,4 +1,4 @@
import React from 'react';
import { PureComponent } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { defineMessages, injectIntl } from 'react-intl';
@ -9,7 +9,7 @@ const messages = defineMessages({
close: { id: 'lightbox.close', defaultMessage: 'Close' },
});
class ImageModal extends React.PureComponent {
class ImageModal extends PureComponent {
static propTypes = {
src: PropTypes.string.isRequired,

View File

@ -1,5 +1,5 @@
import { connect } from 'react-redux';
import React from 'react';
import { PureComponent } from 'react';
import PropTypes from 'prop-types';
import { FormattedMessage, defineMessages, injectIntl } from 'react-intl';
import { Link } from 'react-router-dom';
@ -24,7 +24,7 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
},
});
class LinkFooter extends React.PureComponent {
class LinkFooter extends PureComponent {
static contextTypes = {
identity: PropTypes.object,

View File

@ -1,4 +1,3 @@
import React from 'react';
import PropTypes from 'prop-types';
import { createSelector } from 'reselect';
import ImmutablePropTypes from 'react-immutable-proptypes';

View File

@ -1,4 +1,3 @@
import React from 'react';
import ReactSwipeableViews from 'react-swipeable-views';
import ImmutablePropTypes from 'react-immutable-proptypes';
import PropTypes from 'prop-types';

View File

@ -1,5 +1,3 @@
import React from 'react';
import LoadingIndicator from 'flavours/glitch/components/loading_indicator';
// Keep the markup in sync with <BundleModalError />

View File

@ -1,4 +1,4 @@
import React from 'react';
import { PureComponent } from 'react';
import PropTypes from 'prop-types';
import { getScrollbarWidth } from 'flavours/glitch/utils/scrollbar';
import Base from 'flavours/glitch/components/modal_root';
@ -62,7 +62,7 @@ const MODAL_COMPONENTS = {
'CLOSED_REGISTRATIONS': ClosedRegistrationsModal,
};
export default class ModalRoot extends React.PureComponent {
export default class ModalRoot extends PureComponent {
static propTypes = {
type: PropTypes.string,

View File

@ -1,4 +1,4 @@
import React from 'react';
import { PureComponent } from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
@ -43,7 +43,7 @@ const mapDispatchToProps = dispatch => {
};
};
class MuteModal extends React.PureComponent {
class MuteModal extends PureComponent {
static propTypes = {
account: PropTypes.object.isRequired,

View File

@ -1,4 +1,4 @@
import React from 'react';
import { Component, Fragment } from 'react';
import PropTypes from 'prop-types';
import { defineMessages, injectIntl } from 'react-intl';
import { timelinePreview, showTrends } from 'flavours/glitch/initial_state';
@ -28,7 +28,7 @@ const messages = defineMessages({
app_settings: { id: 'navigation_bar.app_settings', defaultMessage: 'App settings' },
});
class NavigationPanel extends React.Component {
class NavigationPanel extends Component {
static contextTypes = {
router: PropTypes.object.isRequired,
@ -47,11 +47,11 @@ class NavigationPanel extends React.Component {
return (
<div className='navigation-panel'>
{signedIn && (
<React.Fragment>
<Fragment>
<ColumnLink transparent to='/home' icon='home' text={intl.formatMessage(messages.home)} />
<ColumnLink transparent to='/notifications' icon={<NotificationsCounterIcon className='column-link__icon' />} text={intl.formatMessage(messages.notifications)} />
<FollowRequestsColumnLink />
</React.Fragment>
</Fragment>
)}
{showTrends ? (
@ -75,7 +75,7 @@ class NavigationPanel extends React.Component {
)}
{signedIn && (
<React.Fragment>
<Fragment>
<ColumnLink transparent to='/conversations' icon='at' text={intl.formatMessage(messages.direct)} />
<ColumnLink transparent to='/bookmarks' icon='bookmark' text={intl.formatMessage(messages.bookmarks)} />
<ColumnLink transparent to='/favourites' icon='star' text={intl.formatMessage(messages.favourites)} />
@ -87,7 +87,7 @@ class NavigationPanel extends React.Component {
{!!preferencesLink && <ColumnLink transparent href={preferencesLink} icon='cog' text={intl.formatMessage(messages.preferences)} />}
<ColumnLink transparent onClick={onOpenSettings} icon='cogs' text={intl.formatMessage(messages.app_settings)} />
</React.Fragment>
</Fragment>
)}
<div className='navigation-panel__legal'>

View File

@ -1,4 +1,4 @@
import React from 'react';
import { PureComponent } from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import ImmutablePropTypes from 'react-immutable-proptypes';
@ -170,7 +170,7 @@ const mapStateToProps = state => ({
domain: state.getIn(['meta', 'domain']),
});
class OnboardingModal extends React.PureComponent {
class OnboardingModal extends PureComponent {
static propTypes = {
onClose: PropTypes.func.isRequired,

View File

@ -1,4 +1,3 @@
import React from 'react';
import { connect } from 'react-redux';
import { submitReport } from 'flavours/glitch/actions/reports';
import { expandAccountTimeline } from 'flavours/glitch/actions/timelines';

View File

@ -1,4 +1,4 @@
import React, { useCallback } from 'react';
import { useCallback } from 'react';
import { FormattedMessage } from 'react-intl';
import { useDispatch } from 'react-redux';
import { registrationsOpen } from 'flavours/glitch/initial_state';

View File

@ -1,10 +1,10 @@
import React from 'react';
import { PureComponent } from 'react';
import PropTypes from 'prop-types';
import Motion from '../util/optional_motion';
import spring from 'react-motion/lib/spring';
import { FormattedMessage } from 'react-intl';
export default class UploadArea extends React.PureComponent {
export default class UploadArea extends PureComponent {
static propTypes = {
active: PropTypes.bool,

View File

@ -1,4 +1,3 @@
import React from 'react';
import ImmutablePropTypes from 'react-immutable-proptypes';
import PropTypes from 'prop-types';
import Video from 'flavours/glitch/features/video';

View File

@ -1,4 +1,4 @@
import React from 'react';
import { PureComponent, Fragment } from 'react';
import PropTypes from 'prop-types';
import { IconButton } from 'flavours/glitch/components/icon_button';
import { defineMessages, injectIntl } from 'react-intl';
@ -91,7 +91,7 @@ const normalizeWheel = event => {
};
};
class ZoomableImage extends React.PureComponent {
class ZoomableImage extends PureComponent {
static propTypes = {
alt: PropTypes.string,
@ -411,7 +411,7 @@ class ZoomableImage extends React.PureComponent {
const zoomButtonTitle = this.state.zoomState === 'compress' ? intl.formatMessage(messages.compress) : intl.formatMessage(messages.expand);
return (
<React.Fragment>
<Fragment>
<IconButton
className={`media-modal__zoom-button ${zoomButtonShouldHide}`}
title={zoomButtonTitle}
@ -445,7 +445,7 @@ class ZoomableImage extends React.PureComponent {
onMouseDown={this.handleMouseDown}
/>
</div>
</React.Fragment>
</Fragment>
);
}

View File

@ -1,4 +1,4 @@
import React from 'react';
import { PureComponent, Component } from 'react';
import NotificationsContainer from './containers/notifications_container';
import PropTypes from 'prop-types';
import LoadingBarContainer from './containers/loading_bar_container';
@ -121,7 +121,7 @@ const keyMap = {
openMedia: 'e',
};
class SwitchingColumnsArea extends React.PureComponent {
class SwitchingColumnsArea extends PureComponent {
static contextTypes = {
identity: PropTypes.object,
@ -240,7 +240,7 @@ class SwitchingColumnsArea extends React.PureComponent {
}
class UI extends React.Component {
class UI extends Component {
static contextTypes = {
identity: PropTypes.object.isRequired,

View File

@ -1,4 +1,4 @@
import React from 'react';
import * as React from 'react';
import PropTypes from 'prop-types';
import { Switch, Route } from 'react-router-dom';
import StackTrace from 'stacktrace-js';

View File

@ -1,6 +1,6 @@
// Like react-motion's Motion, but reduces all animations to cross-fades
// for the benefit of users with motion sickness.
import React from 'react';
import { Component } from 'react';
import Motion from 'react-motion/lib/Motion';
import PropTypes from 'prop-types';
@ -11,7 +11,7 @@ const extractValue = (value) => {
return (typeof value === 'object' && value && 'val' in value) ? value.val : value;
};
class ReducedMotion extends React.Component {
class ReducedMotion extends Component {
static propTypes = {
defaultStyle: PropTypes.object,