Merge commit '1b70d7ed7c0fd3a9fcf028bf76b8c62ac8b3897f' into glitch-soc/merge-upstream

pull/2449/head
Claire 2023-10-21 14:33:33 +02:00
commit 245513d630
42 changed files with 419 additions and 361 deletions

View File

@ -236,7 +236,7 @@ module.exports = {
},
// Common React utilities
{
pattern: '{classnames,react-helmet,react-router-dom}',
pattern: '{classnames,react-helmet,react-router,react-router-dom}',
group: 'external',
position: 'before',
},

View File

@ -4,29 +4,28 @@ import { createPortal } from 'react-dom';
import { FormattedMessage } from 'react-intl';
import { withRouter } from 'react-router-dom';
import { Icon } from 'mastodon/components/icon';
import { WithRouterPropTypes } from 'mastodon/utils/react_router';
export default class ColumnBackButton extends PureComponent {
static contextTypes = {
router: PropTypes.object,
};
class ColumnBackButton extends PureComponent {
static propTypes = {
multiColumn: PropTypes.bool,
onClick: PropTypes.func,
...WithRouterPropTypes,
};
handleClick = () => {
const { router } = this.context;
const { onClick } = this.props;
const { onClick, history } = this.props;
if (onClick) {
onClick();
} else if (router.history.location?.state?.fromMastodon) {
router.history.goBack();
} else if (history.location?.state?.fromMastodon) {
history.goBack();
} else {
router.history.push('/');
history.push('/');
}
};
@ -60,3 +59,5 @@ export default class ColumnBackButton extends PureComponent {
}
}
export default withRouter(ColumnBackButton);

View File

@ -5,8 +5,10 @@ import { createPortal } from 'react-dom';
import { FormattedMessage, injectIntl, defineMessages } from 'react-intl';
import classNames from 'classnames';
import { withRouter } from 'react-router-dom';
import { Icon } from 'mastodon/components/icon';
import { WithRouterPropTypes } from 'mastodon/utils/react_router';
const messages = defineMessages({
show: { id: 'column_header.show_settings', defaultMessage: 'Show settings' },
@ -18,7 +20,6 @@ const messages = defineMessages({
class ColumnHeader extends PureComponent {
static contextTypes = {
router: PropTypes.object,
identity: PropTypes.object,
};
@ -38,6 +39,7 @@ class ColumnHeader extends PureComponent {
onClick: PropTypes.func,
appendContent: PropTypes.node,
collapseIssues: PropTypes.bool,
...WithRouterPropTypes,
};
state = {
@ -63,12 +65,12 @@ class ColumnHeader extends PureComponent {
};
handleBackClick = () => {
const { router } = this.context;
const { history } = this.props;
if (router.history.location?.state?.fromMastodon) {
router.history.goBack();
if (history.location?.state?.fromMastodon) {
history.goBack();
} else {
router.history.push('/');
history.push('/');
}
};
@ -78,15 +80,14 @@ class ColumnHeader extends PureComponent {
handlePin = () => {
if (!this.props.pinned) {
this.context.router.history.replace('/');
this.props.history.replace('/');
}
this.props.onPin();
};
render () {
const { router } = this.context;
const { title, icon, active, children, pinned, multiColumn, extraButton, showBackButton, intl: { formatMessage }, placeholder, appendContent, collapseIssues } = this.props;
const { title, icon, active, children, pinned, multiColumn, extraButton, showBackButton, intl: { formatMessage }, placeholder, appendContent, collapseIssues, history } = this.props;
const { collapsed, animating } = this.state;
const wrapperClassName = classNames('column-header__wrapper', {
@ -129,7 +130,7 @@ class ColumnHeader extends PureComponent {
pinButton = <button key='pin-button' className='text-btn column-header__setting-btn' onClick={this.handlePin}><Icon id='plus' /> <FormattedMessage id='column_header.pin' defaultMessage='Pin' /></button>;
}
if (!pinned && ((multiColumn && router.history.location?.state?.fromMastodon) || showBackButton)) {
if (!pinned && ((multiColumn && history.location?.state?.fromMastodon) || showBackButton)) {
backButton = (
<button onClick={this.handleBackClick} className='column-header__back-button'>
<Icon id='chevron-left' className='column-back-button__icon' fixedWidth />
@ -215,4 +216,4 @@ class ColumnHeader extends PureComponent {
}
export default injectIntl(ColumnHeader);
export default injectIntl(withRouter(ColumnHeader));

View File

@ -2,13 +2,16 @@ import PropTypes from 'prop-types';
import { PureComponent, cloneElement, Children } from 'react';
import classNames from 'classnames';
import { withRouter } from 'react-router-dom';
import ImmutablePropTypes from 'react-immutable-proptypes';
import { supportsPassiveEvents } from 'detect-passive-events';
import Overlay from 'react-overlays/Overlay';
import { CircularProgress } from "./circular_progress";
import { CircularProgress } from 'mastodon/components/circular_progress';
import { WithRouterPropTypes } from 'mastodon/utils/react_router';
import { IconButton } from './icon_button';
const listenerOptions = supportsPassiveEvents ? { passive: true, capture: true } : true;
@ -16,10 +19,6 @@ let id = 0;
class DropdownMenu extends PureComponent {
static contextTypes = {
router: PropTypes.object,
};
static propTypes = {
items: PropTypes.oneOfType([PropTypes.array, ImmutablePropTypes.list]).isRequired,
loading: PropTypes.bool,
@ -159,11 +158,7 @@ class DropdownMenu extends PureComponent {
}
export default class Dropdown extends PureComponent {
static contextTypes = {
router: PropTypes.object,
};
class Dropdown extends PureComponent {
static propTypes = {
children: PropTypes.node,
@ -183,6 +178,7 @@ export default class Dropdown extends PureComponent {
renderItem: PropTypes.func,
renderHeader: PropTypes.func,
onItemClick: PropTypes.func,
...WithRouterPropTypes
};
static defaultProps = {
@ -250,7 +246,7 @@ export default class Dropdown extends PureComponent {
item.action();
} else if (item && item.to) {
e.preventDefault();
this.context.router.history.push(item.to);
this.props.history.push(item.to);
}
};
@ -338,3 +334,5 @@ export default class Dropdown extends PureComponent {
}
}
export default withRouter(Dropdown);

View File

@ -2,14 +2,13 @@ import PropTypes from 'prop-types';
import { PureComponent } from 'react';
import 'wicg-inert';
import { multiply } from 'color-blend';
import { createBrowserHistory } from 'history';
export default class ModalRoot extends PureComponent {
import { WithOptionalRouterPropTypes, withOptionalRouter } from 'mastodon/utils/react_router';
static contextTypes = {
router: PropTypes.object,
};
class ModalRoot extends PureComponent {
static propTypes = {
children: PropTypes.node,
@ -20,6 +19,7 @@ export default class ModalRoot extends PureComponent {
b: PropTypes.number,
}),
ignoreFocus: PropTypes.bool,
...WithOptionalRouterPropTypes,
};
activeElement = this.props.children ? document.activeElement : null;
@ -55,7 +55,7 @@ export default class ModalRoot extends PureComponent {
componentDidMount () {
window.addEventListener('keyup', this.handleKeyUp, false);
window.addEventListener('keydown', this.handleKeyDown, false);
this.history = this.context.router ? this.context.router.history : createBrowserHistory();
this.history = this.props.history || createBrowserHistory();
}
UNSAFE_componentWillReceiveProps (nextProps) {
@ -156,3 +156,5 @@ export default class ModalRoot extends PureComponent {
}
}
export default withOptionalRouter(ModalRoot);

View File

@ -1,35 +0,0 @@
import { PureComponent } from 'react';
import { Switch, Route, withRouter } from 'react-router-dom';
import AccountNavigation from 'mastodon/features/account/navigation';
import Trends from 'mastodon/features/getting_started/containers/trends_container';
import { showTrends } from 'mastodon/initial_state';
const DefaultNavigation = () => (
showTrends ? (
<>
<div className='flex-spacer' />
<Trends />
</>
) : null
);
class NavigationPortal extends PureComponent {
render () {
return (
<Switch>
<Route path='/@:acct' exact component={AccountNavigation} />
<Route path='/@:acct/tagged/:tagged?' exact component={AccountNavigation} />
<Route path='/@:acct/with_replies' exact component={AccountNavigation} />
<Route path='/@:acct/followers' exact component={AccountNavigation} />
<Route path='/@:acct/following' exact component={AccountNavigation} />
<Route path='/@:acct/media' exact component={AccountNavigation} />
<Route component={DefaultNavigation} />
</Switch>
);
}
}
export default withRouter(NavigationPortal);

View File

@ -0,0 +1,25 @@
import { Switch, Route } from 'react-router-dom';
import AccountNavigation from 'mastodon/features/account/navigation';
import Trends from 'mastodon/features/getting_started/containers/trends_container';
import { showTrends } from 'mastodon/initial_state';
const DefaultNavigation: React.FC = () =>
showTrends ? (
<>
<div className='flex-spacer' />
<Trends />
</>
) : null;
export const NavigationPortal: React.FC = () => (
<Switch>
<Route path='/@:acct' exact component={AccountNavigation} />
<Route path='/@:acct/tagged/:tagged?' exact component={AccountNavigation} />
<Route path='/@:acct/with_replies' exact component={AccountNavigation} />
<Route path='/@:acct/followers' exact component={AccountNavigation} />
<Route path='/@:acct/following' exact component={AccountNavigation} />
<Route path='/@:acct/media' exact component={AccountNavigation} />
<Route component={DefaultNavigation} />
</Switch>
);

View File

@ -1,15 +1,18 @@
import type { PropsWithChildren } from 'react';
import React from 'react';
import { createBrowserHistory } from 'history';
import { Router as OriginalRouter } from 'react-router';
import type { LocationDescriptor, Path } from 'history';
import { createBrowserHistory } from 'history';
import { layoutFromWindow } from 'mastodon/is_mobile';
interface MastodonLocationState {
fromMastodon?: boolean;
mastodonModalKey?: string;
}
type HistoryPath = Path | LocationDescriptor<MastodonLocationState>;
const browserHistory = createBrowserHistory<
MastodonLocationState | undefined
@ -17,25 +20,36 @@ const browserHistory = createBrowserHistory<
const originalPush = browserHistory.push.bind(browserHistory);
const originalReplace = browserHistory.replace.bind(browserHistory);
browserHistory.push = (path: string, state?: MastodonLocationState) => {
function extractRealPath(path: HistoryPath) {
if (typeof path === 'string') return path;
else return path.pathname;
}
browserHistory.push = (path: HistoryPath, state?: MastodonLocationState) => {
state = state ?? {};
state.fromMastodon = true;
if (layoutFromWindow() === 'multi-column' && !path.startsWith('/deck')) {
originalPush(`/deck${path}`, state);
const realPath = extractRealPath(path);
if (!realPath) return;
if (layoutFromWindow() === 'multi-column' && !realPath.startsWith('/deck')) {
originalPush(`/deck${realPath}`, state);
} else {
originalPush(path, state);
}
};
browserHistory.replace = (path: string, state?: MastodonLocationState) => {
browserHistory.replace = (path: HistoryPath, state?: MastodonLocationState) => {
if (browserHistory.location.state?.fromMastodon) {
state = state ?? {};
state.fromMastodon = true;
}
if (layoutFromWindow() === 'multi-column' && !path.startsWith('/deck')) {
originalReplace(`/deck${path}`, state);
const realPath = extractRealPath(path);
if (!realPath) return;
if (layoutFromWindow() === 'multi-column' && !realPath.startsWith('/deck')) {
originalReplace(`/deck${realPath}`, state);
} else {
originalReplace(path, state);
}

View File

@ -2,6 +2,7 @@ import PropTypes from 'prop-types';
import { Children, cloneElement, PureComponent } from 'react';
import classNames from 'classnames';
import { useLocation } from 'react-router-dom';
import { List as ImmutableList } from 'immutable';
import { connect } from 'react-redux';
@ -34,11 +35,32 @@ const mapStateToProps = (state, { scrollKey }) => {
};
};
class ScrollableList extends PureComponent {
// This component only exists to be able to call useLocation()
const IOArticleContainerWrapper = ({id, index, listLength, intersectionObserverWrapper, trackScroll, scrollKey, children}) => {
const location = useLocation();
static contextTypes = {
router: PropTypes.object,
};
return (<IntersectionObserverArticleContainer
id={id}
index={index}
listLength={listLength}
intersectionObserverWrapper={intersectionObserverWrapper}
saveHeightKey={trackScroll ? `${location.key}:${scrollKey}` : null}
>
{children}
</IntersectionObserverArticleContainer>);
};
IOArticleContainerWrapper.propTypes = {
id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
index: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
listLength: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
scrollKey: PropTypes.string.isRequired,
intersectionObserverWrapper: PropTypes.object.isRequired,
trackScroll: PropTypes.bool.isRequired,
children: PropTypes.node,
};
class ScrollableList extends PureComponent {
static propTypes = {
scrollKey: PropTypes.string.isRequired,
@ -331,13 +353,14 @@ class ScrollableList extends PureComponent {
{loadPending}
{Children.map(this.props.children, (child, index) => (
<IntersectionObserverArticleContainer
<IOArticleContainerWrapper
key={child.key}
id={child.key}
index={index}
listLength={childrenCount}
intersectionObserverWrapper={this.intersectionObserverWrapper}
saveHeightKey={trackScroll ? `${this.context.router.route.location.key}:${scrollKey}` : null}
trackScroll={trackScroll}
scrollKey={scrollKey}
>
{cloneElement(child, {
getScrollPosition: this.getScrollPosition,
@ -345,7 +368,7 @@ class ScrollableList extends PureComponent {
cachedMediaWidth: this.state.cachedMediaWidth,
cacheMediaWidth: this.cacheMediaWidth,
})}
</IntersectionObserverArticleContainer>
</IOArticleContainerWrapper>
))}
{loadMore}

View File

@ -11,6 +11,7 @@ import { HotKeys } from 'react-hotkeys';
import { Icon } from 'mastodon/components/icon';
import PictureInPicturePlaceholder from 'mastodon/components/picture_in_picture_placeholder';
import { withOptionalRouter, WithRouterPropTypes } from 'mastodon/utils/react_router';
import Card from '../features/status/components/card';
// We use the component (and not the container) since we do not want
@ -72,10 +73,6 @@ const messages = defineMessages({
class Status extends ImmutablePureComponent {
static contextTypes = {
router: PropTypes.object,
};
static propTypes = {
status: ImmutablePropTypes.map,
account: ImmutablePropTypes.map,
@ -116,6 +113,7 @@ class Status extends ImmutablePureComponent {
inUse: PropTypes.bool,
available: PropTypes.bool,
}),
...WithRouterPropTypes,
};
// Avoid checking props that are functions (and whose equality will always
@ -258,7 +256,7 @@ class Status extends ImmutablePureComponent {
handleHotkeyReply = e => {
e.preventDefault();
this.props.onReply(this._properStatus(), this.context.router.history);
this.props.onReply(this._properStatus(), this.props.history);
};
handleHotkeyFavourite = () => {
@ -271,7 +269,7 @@ class Status extends ImmutablePureComponent {
handleHotkeyMention = e => {
e.preventDefault();
this.props.onMention(this._properStatus().get('account'), this.context.router.history);
this.props.onMention(this._properStatus().get('account'), this.props.history);
};
handleHotkeyOpen = () => {
@ -280,14 +278,14 @@ class Status extends ImmutablePureComponent {
return;
}
const { router } = this.context;
const { history } = this.props;
const status = this._properStatus();
if (!router) {
if (!history) {
return;
}
router.history.push(`/@${status.getIn(['account', 'acct'])}/${status.get('id')}`);
history.push(`/@${status.getIn(['account', 'acct'])}/${status.get('id')}`);
};
handleHotkeyOpenProfile = () => {
@ -295,14 +293,14 @@ class Status extends ImmutablePureComponent {
};
_openProfile = (proper = true) => {
const { router } = this.context;
const { history } = this.props;
const status = proper ? this._properStatus() : this.props.status;
if (!router) {
if (!history) {
return;
}
router.history.push(`/@${status.getIn(['account', 'acct'])}`);
history.push(`/@${status.getIn(['account', 'acct'])}`);
};
handleHotkeyMoveUp = e => {
@ -596,4 +594,4 @@ class Status extends ImmutablePureComponent {
}
export default injectIntl(Status);
export default withOptionalRouter(injectIntl(Status));

View File

@ -3,12 +3,14 @@ import PropTypes from 'prop-types';
import { defineMessages, injectIntl } from 'react-intl';
import classNames from 'classnames';
import { withRouter } from 'react-router-dom';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { connect } from 'react-redux';
import { PERMISSION_MANAGE_USERS, PERMISSION_MANAGE_FEDERATION } from 'mastodon/permissions';
import { WithRouterPropTypes } from 'mastodon/utils/react_router';
import DropdownMenuContainer from '../containers/dropdown_menu_container';
import { me } from '../initial_state';
@ -61,7 +63,6 @@ const mapStateToProps = (state, { status }) => ({
class StatusActionBar extends ImmutablePureComponent {
static contextTypes = {
router: PropTypes.object,
identity: PropTypes.object,
};
@ -92,6 +93,7 @@ class StatusActionBar extends ImmutablePureComponent {
withCounters: PropTypes.bool,
scrollKey: PropTypes.string,
intl: PropTypes.object.isRequired,
...WithRouterPropTypes,
};
// Avoid checking props that are functions (and whose equality will always
@ -106,7 +108,7 @@ class StatusActionBar extends ImmutablePureComponent {
const { signedIn } = this.context.identity;
if (signedIn) {
this.props.onReply(this.props.status, this.context.router.history);
this.props.onReply(this.props.status, this.props.history);
} else {
this.props.onInteractionModal('reply', this.props.status);
}
@ -145,15 +147,15 @@ class StatusActionBar extends ImmutablePureComponent {
};
handleDeleteClick = () => {
this.props.onDelete(this.props.status, this.context.router.history);
this.props.onDelete(this.props.status, this.props.history);
};
handleRedraftClick = () => {
this.props.onDelete(this.props.status, this.context.router.history, true);
this.props.onDelete(this.props.status, this.props.history, true);
};
handleEditClick = () => {
this.props.onEdit(this.props.status, this.context.router.history);
this.props.onEdit(this.props.status, this.props.history);
};
handlePinClick = () => {
@ -161,11 +163,11 @@ class StatusActionBar extends ImmutablePureComponent {
};
handleMentionClick = () => {
this.props.onMention(this.props.status.get('account'), this.context.router.history);
this.props.onMention(this.props.status.get('account'), this.props.history);
};
handleDirectClick = () => {
this.props.onDirect(this.props.status.get('account'), this.context.router.history);
this.props.onDirect(this.props.status.get('account'), this.props.history);
};
handleMuteClick = () => {
@ -205,7 +207,7 @@ class StatusActionBar extends ImmutablePureComponent {
};
handleOpen = () => {
this.context.router.history.push(`/@${this.props.status.getIn(['account', 'acct'])}/${this.props.status.get('id')}`);
this.props.history.push(`/@${this.props.status.getIn(['account', 'acct'])}/${this.props.status.get('id')}`);
};
handleEmbed = () => {
@ -386,4 +388,4 @@ class StatusActionBar extends ImmutablePureComponent {
}
export default connect(mapStateToProps)(injectIntl(StatusActionBar));
export default withRouter(connect(mapStateToProps)(injectIntl(StatusActionBar)));

View File

@ -4,7 +4,7 @@ import { PureComponent } from 'react';
import { FormattedMessage, injectIntl } from 'react-intl';
import classnames from 'classnames';
import { Link } from 'react-router-dom';
import { Link, withRouter } from 'react-router-dom';
import ImmutablePropTypes from 'react-immutable-proptypes';
import { connect } from 'react-redux';
@ -68,7 +68,6 @@ const mapStateToProps = state => ({
class StatusContent extends PureComponent {
static contextTypes = {
router: PropTypes.object,
identity: PropTypes.object,
};
@ -83,6 +82,10 @@ class StatusContent extends PureComponent {
onCollapsedToggle: PropTypes.func,
languages: ImmutablePropTypes.map,
intl: PropTypes.object,
// from react-router
match: PropTypes.object.isRequired,
location: PropTypes.object.isRequired,
history: PropTypes.object.isRequired
};
state = {
@ -173,18 +176,18 @@ class StatusContent extends PureComponent {
}
onMentionClick = (mention, e) => {
if (this.context.router && e.button === 0 && !(e.ctrlKey || e.metaKey)) {
if (this.props.history && e.button === 0 && !(e.ctrlKey || e.metaKey)) {
e.preventDefault();
this.context.router.history.push(`/@${mention.get('acct')}`);
this.props.history.push(`/@${mention.get('acct')}`);
}
};
onHashtagClick = (hashtag, e) => {
hashtag = hashtag.replace(/^#/, '');
if (this.context.router && e.button === 0 && !(e.ctrlKey || e.metaKey)) {
if (this.props.history && e.button === 0 && !(e.ctrlKey || e.metaKey)) {
e.preventDefault();
this.context.router.history.push(`/tags/${hashtag}`);
this.props.history.push(`/tags/${hashtag}`);
}
};
@ -247,7 +250,7 @@ class StatusContent extends PureComponent {
const spoilerContent = { __html: status.getIn(['translation', 'spoilerHtml']) || status.get('spoilerHtml') };
const language = status.getIn(['translation', 'language']) || status.get('language');
const classNames = classnames('status__content', {
'status__content--with-action': this.props.onClick && this.context.router,
'status__content--with-action': this.props.onClick && this.props.history,
'status__content--with-spoiler': status.get('spoiler_text').length > 0,
'status__content--collapsed': renderReadMore,
});
@ -324,4 +327,4 @@ class StatusContent extends PureComponent {
}
export default connect(mapStateToProps)(injectIntl(StatusContent));
export default withRouter(connect(mapStateToProps)(injectIntl(StatusContent)));

View File

@ -14,10 +14,6 @@ const messages = defineMessages({
class FeaturedTags extends ImmutablePureComponent {
static contextTypes = {
router: PropTypes.object,
};
static propTypes = {
account: ImmutablePropTypes.map,
featuredTags: ImmutablePropTypes.list,

View File

@ -4,7 +4,7 @@ import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
import classNames from 'classnames';
import { Helmet } from 'react-helmet';
import { NavLink } from 'react-router-dom';
import { NavLink, withRouter } from 'react-router-dom';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
@ -19,6 +19,7 @@ import { ShortNumber } from 'mastodon/components/short_number';
import DropdownMenuContainer from 'mastodon/containers/dropdown_menu_container';
import { autoPlayGif, me, domain } from 'mastodon/initial_state';
import { PERMISSION_MANAGE_USERS, PERMISSION_MANAGE_FEDERATION } from 'mastodon/permissions';
import { WithRouterPropTypes } from 'mastodon/utils/react_router';
import AccountNoteContainer from '../containers/account_note_container';
import FollowRequestNoteContainer from '../containers/follow_request_note_container';
@ -83,11 +84,6 @@ const dateFormatOptions = {
class Header extends ImmutablePureComponent {
static contextTypes = {
identity: PropTypes.object,
router: PropTypes.object,
};
static propTypes = {
account: ImmutablePropTypes.map,
identity_props: ImmutablePropTypes.list,
@ -111,6 +107,11 @@ class Header extends ImmutablePureComponent {
intl: PropTypes.object.isRequired,
domain: PropTypes.string.isRequired,
hidden: PropTypes.bool,
...WithRouterPropTypes,
};
static contextTypes = {
identity: PropTypes.object,
};
setRef = c => {
@ -173,25 +174,24 @@ class Header extends ImmutablePureComponent {
};
handleHashtagClick = e => {
const { router } = this.context;
const { history } = this.props;
const value = e.currentTarget.textContent.replace(/^#/, '');
if (router && e.button === 0 && !(e.ctrlKey || e.metaKey)) {
if (history && e.button === 0 && !(e.ctrlKey || e.metaKey)) {
e.preventDefault();
router.history.push(`/tags/${value}`);
history.push(`/tags/${value}`);
}
};
handleMentionClick = e => {
const { router } = this.context;
const { onOpenURL } = this.props;
const { history, onOpenURL } = this.props;
if (router && e.button === 0 && !(e.ctrlKey || e.metaKey)) {
if (history && e.button === 0 && !(e.ctrlKey || e.metaKey)) {
e.preventDefault();
const link = e.currentTarget;
onOpenURL(link.href, router.history, () => {
onOpenURL(link.href, history, () => {
window.location = link.href;
});
}
@ -492,4 +492,4 @@ class Header extends ImmutablePureComponent {
}
export default injectIntl(Header);
export default withRouter(injectIntl(Header));

View File

@ -2,17 +2,19 @@ import PropTypes from 'prop-types';
import { FormattedMessage } from 'react-intl';
import { NavLink } from 'react-router-dom';
import { NavLink, withRouter } from 'react-router-dom';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { WithRouterPropTypes } from 'mastodon/utils/react_router';
import InnerHeader from '../../account/components/header';
import MemorialNote from './memorial_note';
import MovedNote from './moved_note';
export default class Header extends ImmutablePureComponent {
class Header extends ImmutablePureComponent {
static propTypes = {
account: ImmutablePropTypes.map,
@ -34,10 +36,7 @@ export default class Header extends ImmutablePureComponent {
hideTabs: PropTypes.bool,
domain: PropTypes.string.isRequired,
hidden: PropTypes.bool,
};
static contextTypes = {
router: PropTypes.object,
...WithRouterPropTypes,
};
handleFollow = () => {
@ -49,11 +48,11 @@ export default class Header extends ImmutablePureComponent {
};
handleMention = () => {
this.props.onMention(this.props.account, this.context.router.history);
this.props.onMention(this.props.account, this.props.history);
};
handleDirect = () => {
this.props.onDirect(this.props.account, this.context.router.history);
this.props.onDirect(this.props.account, this.props.history);
};
handleReport = () => {
@ -159,3 +158,5 @@ export default class Header extends ImmutablePureComponent {
}
}
export default withRouter(Header);

View File

@ -39,7 +39,6 @@ const mapStateToProps = (state, { columnId }) => {
class CommunityTimeline extends PureComponent {
static contextTypes = {
router: PropTypes.object,
identity: PropTypes.object,
};

View File

@ -10,6 +10,7 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
import { length } from 'stringz';
import { Icon } from 'mastodon/components/icon';
import { WithOptionalRouterPropTypes, withOptionalRouter } from 'mastodon/utils/react_router';
import AutosuggestInput from '../../../components/autosuggest_input';
import AutosuggestTextarea from '../../../components/autosuggest_textarea';
@ -40,11 +41,6 @@ const messages = defineMessages({
});
class ComposeForm extends ImmutablePureComponent {
static contextTypes = {
router: PropTypes.object,
};
static propTypes = {
intl: PropTypes.object.isRequired,
text: PropTypes.string.isRequired,
@ -72,6 +68,7 @@ class ComposeForm extends ImmutablePureComponent {
isInReply: PropTypes.bool,
singleColumn: PropTypes.bool,
lang: PropTypes.string,
...WithOptionalRouterPropTypes
};
static defaultProps = {
@ -115,7 +112,7 @@ class ComposeForm extends ImmutablePureComponent {
return;
}
this.props.onSubmit(this.context.router ? this.context.router.history : null);
this.props.onSubmit(this.props.history || null);
if (e) {
e.preventDefault();
@ -319,4 +316,4 @@ class ComposeForm extends ImmutablePureComponent {
}
export default injectIntl(ComposeForm);
export default withOptionalRouter(injectIntl(ComposeForm));

View File

@ -6,6 +6,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import AttachmentList from 'mastodon/components/attachment_list';
import { WithOptionalRouterPropTypes, withOptionalRouter } from 'mastodon/utils/react_router';
import { Avatar } from '../../../components/avatar';
import { DisplayName } from '../../../components/display_name';
@ -17,14 +18,11 @@ const messages = defineMessages({
class ReplyIndicator extends ImmutablePureComponent {
static contextTypes = {
router: PropTypes.object,
};
static propTypes = {
status: ImmutablePropTypes.map,
onCancel: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
...WithOptionalRouterPropTypes,
};
handleClick = () => {
@ -34,7 +32,7 @@ class ReplyIndicator extends ImmutablePureComponent {
handleAccountClick = (e) => {
if (e.button === 0 && !(e.ctrlKey || e.metaKey)) {
e.preventDefault();
this.context.router.history.push(`/@${this.props.status.getIn(['account', 'acct'])}`);
this.props.history?.push(`/@${this.props.status.getIn(['account', 'acct'])}`);
}
};
@ -72,4 +70,4 @@ class ReplyIndicator extends ImmutablePureComponent {
}
export default injectIntl(ReplyIndicator);
export default withOptionalRouter(injectIntl(ReplyIndicator));

View File

@ -4,12 +4,14 @@ import { PureComponent } from 'react';
import { defineMessages, injectIntl, FormattedMessage, FormattedList } from 'react-intl';
import classNames from 'classnames';
import { withRouter } from 'react-router-dom';
import ImmutablePropTypes from 'react-immutable-proptypes';
import { Icon } from 'mastodon/components/icon';
import { domain, searchEnabled } from 'mastodon/initial_state';
import { HASHTAG_REGEX } from 'mastodon/utils/hashtags';
import { WithRouterPropTypes } from 'mastodon/utils/react_router';
const messages = defineMessages({
placeholder: { id: 'search.placeholder', defaultMessage: 'Search' },
@ -30,7 +32,6 @@ const labelForRecentSearch = search => {
class Search extends PureComponent {
static contextTypes = {
router: PropTypes.object.isRequired,
identity: PropTypes.object.isRequired,
};
@ -48,6 +49,7 @@ class Search extends PureComponent {
openInRoute: PropTypes.bool,
intl: PropTypes.object.isRequired,
singleColumn: PropTypes.bool,
...WithRouterPropTypes,
};
state = {
@ -160,32 +162,29 @@ class Search extends PureComponent {
};
handleHashtagClick = () => {
const { router } = this.context;
const { value, onClickSearchResult } = this.props;
const { value, onClickSearchResult, history } = this.props;
const query = value.trim().replace(/^#/, '');
router.history.push(`/tags/${query}`);
history.push(`/tags/${query}`);
onClickSearchResult(query, 'hashtag');
this._unfocus();
};
handleAccountClick = () => {
const { router } = this.context;
const { value, onClickSearchResult } = this.props;
const { value, onClickSearchResult, history } = this.props;
const query = value.trim().replace(/^@/, '');
router.history.push(`/@${query}`);
history.push(`/@${query}`);
onClickSearchResult(query, 'account');
this._unfocus();
};
handleURLClick = () => {
const { router } = this.context;
const { value, onOpenURL } = this.props;
const { value, onOpenURL, history } = this.props;
onOpenURL(value, router.history);
onOpenURL(value, history);
this._unfocus();
};
@ -198,13 +197,12 @@ class Search extends PureComponent {
};
handleRecentSearchClick = search => {
const { onChange } = this.props;
const { router } = this.context;
const { onChange, history } = this.props;
if (search.get('type') === 'account') {
router.history.push(`/@${search.get('q')}`);
history.push(`/@${search.get('q')}`);
} else if (search.get('type') === 'hashtag') {
router.history.push(`/tags/${search.get('q')}`);
history.push(`/tags/${search.get('q')}`);
} else {
onChange(search.get('q'));
this._submit(search.get('type'));
@ -236,8 +234,7 @@ class Search extends PureComponent {
}
_submit (type) {
const { onSubmit, openInRoute, value, onClickSearchResult } = this.props;
const { router } = this.context;
const { onSubmit, openInRoute, value, onClickSearchResult, history } = this.props;
onSubmit(type);
@ -246,7 +243,7 @@ class Search extends PureComponent {
}
if (openInRoute) {
router.history.push('/search');
history.push('/search');
}
this._unfocus();
@ -395,4 +392,4 @@ class Search extends PureComponent {
}
export default injectIntl(Search);
export default withRouter(injectIntl(Search));

View File

@ -13,10 +13,6 @@ import Motion from '../../ui/util/optional_motion';
export default class Upload extends ImmutablePureComponent {
static contextTypes = {
router: PropTypes.object,
};
static propTypes = {
media: ImmutablePropTypes.map.isRequired,
onUndo: PropTypes.func.isRequired,

View File

@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
import classNames from 'classnames';
import { Link } from 'react-router-dom';
import { Link, withRouter } from 'react-router-dom';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
@ -17,6 +17,7 @@ import { RelativeTimestamp } from 'mastodon/components/relative_timestamp';
import StatusContent from 'mastodon/components/status_content';
import DropdownMenuContainer from 'mastodon/containers/dropdown_menu_container';
import { autoPlayGif } from 'mastodon/initial_state';
import { WithRouterPropTypes } from 'mastodon/utils/react_router';
const messages = defineMessages({
more: { id: 'status.more', defaultMessage: 'More' },
@ -30,10 +31,6 @@ const messages = defineMessages({
class Conversation extends ImmutablePureComponent {
static contextTypes = {
router: PropTypes.object,
};
static propTypes = {
conversationId: PropTypes.string.isRequired,
accounts: ImmutablePropTypes.list.isRequired,
@ -45,6 +42,7 @@ class Conversation extends ImmutablePureComponent {
markRead: PropTypes.func.isRequired,
delete: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
...WithRouterPropTypes,
};
handleMouseEnter = ({ currentTarget }) => {
@ -74,7 +72,7 @@ class Conversation extends ImmutablePureComponent {
};
handleClick = () => {
if (!this.context.router) {
if (!this.props.history) {
return;
}
@ -84,7 +82,7 @@ class Conversation extends ImmutablePureComponent {
markRead();
}
this.context.router.history.push(`/@${lastStatus.getIn(['account', 'acct'])}/${lastStatus.get('id')}`);
this.props.history.push(`/@${lastStatus.getIn(['account', 'acct'])}/${lastStatus.get('id')}`);
};
handleMarkAsRead = () => {
@ -92,7 +90,7 @@ class Conversation extends ImmutablePureComponent {
};
handleReply = () => {
this.props.reply(this.props.lastStatus, this.context.router.history);
this.props.reply(this.props.lastStatus, this.props.history);
};
handleDelete = () => {
@ -202,4 +200,4 @@ class Conversation extends ImmutablePureComponent {
}
export default injectIntl(Conversation);
export default withRouter(injectIntl(Conversation));

View File

@ -36,10 +36,6 @@ const mapStateToProps = state => ({
class Directory extends PureComponent {
static contextTypes = {
router: PropTypes.object,
};
static propTypes = {
isLoading: PropTypes.bool,
accountIds: ImmutablePropTypes.list.isRequired,

View File

@ -32,7 +32,6 @@ const mapStateToProps = state => ({
class Explore extends PureComponent {
static contextTypes = {
router: PropTypes.object,
identity: PropTypes.object,
};

View File

@ -4,6 +4,7 @@ import { PureComponent } from 'react';
import { defineMessages, injectIntl, FormattedMessage, FormattedDate } from 'react-intl';
import classNames from 'classnames';
import { withRouter } from 'react-router-dom';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
@ -20,6 +21,7 @@ import EmojiPickerDropdown from 'mastodon/features/compose/containers/emoji_pick
import unicodeMapping from 'mastodon/features/emoji/emoji_unicode_mapping_light';
import { autoPlayGif, reduceMotion, disableSwiping, mascot } from 'mastodon/initial_state';
import { assetHost } from 'mastodon/utils/config';
import { WithRouterPropTypes } from 'mastodon/utils/react_router';
const messages = defineMessages({
close: { id: 'lightbox.close', defaultMessage: 'Close' },