Merge commit '71db616fed817893d0efa363f0e7dbfcf23866a0' into glitch-soc/merge-upstream
This commit is contained in:
@ -142,7 +142,7 @@ class GettingStarted extends ImmutablePureComponent {
|
||||
|
||||
{!multiColumn && <div className='flex-spacer' />}
|
||||
|
||||
<LinkFooter />
|
||||
<LinkFooter multiColumn />
|
||||
</div>
|
||||
|
||||
{(multiColumn && showTrends) && <TrendsContainer />}
|
||||
|
@ -205,7 +205,7 @@ class ActionBar extends PureComponent {
|
||||
menu.push({ text: intl.formatMessage(messages.share), action: this.handleShare });
|
||||
}
|
||||
|
||||
if (publicStatus) {
|
||||
if (publicStatus && (signedIn || !isRemote)) {
|
||||
menu.push({ text: intl.formatMessage(messages.embed), action: this.handleEmbed });
|
||||
}
|
||||
|
||||
|
@ -110,7 +110,7 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
|
||||
dispatch(openModal({
|
||||
modalType: 'EMBED',
|
||||
modalProps: {
|
||||
url: status.get('url'),
|
||||
id: status.get('id'),
|
||||
onError: error => dispatch(showAlertForError(error)),
|
||||
},
|
||||
}));
|
||||
|
@ -449,7 +449,7 @@ class Status extends ImmutablePureComponent {
|
||||
handleEmbed = (status) => {
|
||||
this.props.dispatch(openModal({
|
||||
modalType: 'EMBED',
|
||||
modalProps: { url: status.get('url') },
|
||||
modalProps: { id: status.get('id') },
|
||||
}));
|
||||
};
|
||||
|
||||
|
@ -14,7 +14,7 @@ const messages = defineMessages({
|
||||
class EmbedModal extends ImmutablePureComponent {
|
||||
|
||||
static propTypes = {
|
||||
url: PropTypes.string.isRequired,
|
||||
id: PropTypes.string.isRequired,
|
||||
onClose: PropTypes.func.isRequired,
|
||||
onError: PropTypes.func.isRequired,
|
||||
intl: PropTypes.object.isRequired,
|
||||
@ -26,11 +26,11 @@ class EmbedModal extends ImmutablePureComponent {
|
||||
};
|
||||
|
||||
componentDidMount () {
|
||||
const { url } = this.props;
|
||||
const { id } = this.props;
|
||||
|
||||
this.setState({ loading: true });
|
||||
|
||||
api().post('/api/web/embed', { url }).then(res => {
|
||||
api().get(`/api/web/embeds/${id}`).then(res => {
|
||||
this.setState({ loading: false, oembed: res.data });
|
||||
|
||||
const iframeDocument = this.iframe.contentWindow.document;
|
||||
|
@ -38,6 +38,7 @@ class LinkFooter extends PureComponent {
|
||||
};
|
||||
|
||||
static propTypes = {
|
||||
multiColumn: PropTypes.bool,
|
||||
onLogout: PropTypes.func.isRequired,
|
||||
intl: PropTypes.object.isRequired,
|
||||
};
|
||||
@ -53,6 +54,7 @@ class LinkFooter extends PureComponent {
|
||||
|
||||
render () {
|
||||
const { signedIn, permissions } = this.context.identity;
|
||||
const { multiColumn } = this.props;
|
||||
|
||||
const canInvite = signedIn && ((permissions & PERMISSION_INVITE_USERS) === PERMISSION_INVITE_USERS);
|
||||
const canProfileDirectory = profileDirectory;
|
||||
@ -64,7 +66,7 @@ class LinkFooter extends PureComponent {
|
||||
<p>
|
||||
<strong>{domain}</strong>:
|
||||
{' '}
|
||||
<Link to='/about'><FormattedMessage id='footer.about' defaultMessage='About' /></Link>
|
||||
<Link to='/about' target={multiColumn ? '_blank' : undefined}><FormattedMessage id='footer.about' defaultMessage='About' /></Link>
|
||||
{statusPageUrl && (
|
||||
<>
|
||||
{DividingCircle}
|
||||
@ -84,7 +86,7 @@ class LinkFooter extends PureComponent {
|
||||
</>
|
||||
)}
|
||||
{DividingCircle}
|
||||
<Link to='/privacy-policy'><FormattedMessage id='footer.privacy_policy' defaultMessage='Privacy policy' /></Link>
|
||||
<Link to='/privacy-policy' target={multiColumn ? '_blank' : undefined}><FormattedMessage id='footer.privacy_policy' defaultMessage='Privacy policy' /></Link>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
|
@ -8,6 +8,7 @@ import { Link } from 'react-router-dom';
|
||||
import { WordmarkLogo } from 'mastodon/components/logo';
|
||||
import NavigationPortal from 'mastodon/components/navigation_portal';
|
||||
import { timelinePreview, trendsEnabled } from 'mastodon/initial_state';
|
||||
import { transientSingleColumn } from 'mastodon/is_mobile';
|
||||
|
||||
import ColumnLink from './column_link';
|
||||
import DisabledAccountBanner from './disabled_account_banner';
|
||||
@ -29,6 +30,7 @@ const messages = defineMessages({
|
||||
followsAndFollowers: { id: 'navigation_bar.follows_and_followers', defaultMessage: 'Follows and followers' },
|
||||
about: { id: 'navigation_bar.about', defaultMessage: 'About' },
|
||||
search: { id: 'navigation_bar.search', defaultMessage: 'Search' },
|
||||
advancedInterface: { id: 'navigation_bar.advanced_interface', defaultMessage: 'Open in advanced web interface' },
|
||||
});
|
||||
|
||||
class NavigationPanel extends Component {
|
||||
@ -54,6 +56,12 @@ class NavigationPanel extends Component {
|
||||
<div className='navigation-panel'>
|
||||
<div className='navigation-panel__logo'>
|
||||
<Link to='/' className='column-link column-link--logo'><WordmarkLogo /></Link>
|
||||
|
||||
{transientSingleColumn && (
|
||||
<a href={`/deck${location.pathname}`} className='button button--block'>
|
||||
{intl.formatMessage(messages.advancedInterface)}
|
||||
</a>
|
||||
)}
|
||||
<hr />
|
||||
</div>
|
||||
|
||||
|
@ -126,11 +126,11 @@ class SwitchingColumnsArea extends PureComponent {
|
||||
static propTypes = {
|
||||
children: PropTypes.node,
|
||||
location: PropTypes.object,
|
||||
mobile: PropTypes.bool,
|
||||
singleColumn: PropTypes.bool,
|
||||
};
|
||||
|
||||
UNSAFE_componentWillMount () {
|
||||
if (this.props.mobile) {
|
||||
if (this.props.singleColumn) {
|
||||
document.body.classList.toggle('layout-single-column', true);
|
||||
document.body.classList.toggle('layout-multiple-columns', false);
|
||||
} else {
|
||||
@ -144,9 +144,9 @@ class SwitchingColumnsArea extends PureComponent {
|
||||
this.node.handleChildrenContentChange();
|
||||
}
|
||||
|
||||
if (prevProps.mobile !== this.props.mobile) {
|
||||
document.body.classList.toggle('layout-single-column', this.props.mobile);
|
||||
document.body.classList.toggle('layout-multiple-columns', !this.props.mobile);
|
||||
if (prevProps.singleColumn !== this.props.singleColumn) {
|
||||
document.body.classList.toggle('layout-single-column', this.props.singleColumn);
|
||||
document.body.classList.toggle('layout-multiple-columns', !this.props.singleColumn);
|
||||
}
|
||||
}
|
||||
|
||||
@ -157,16 +157,17 @@ class SwitchingColumnsArea extends PureComponent {
|
||||
};
|
||||
|
||||
render () {
|
||||
const { children, mobile } = this.props;
|
||||
const { children, singleColumn } = this.props;
|
||||
const { signedIn } = this.context.identity;
|
||||
const pathName = this.props.location.pathname;
|
||||
|
||||
let redirect;
|
||||
|
||||
if (signedIn) {
|
||||
if (mobile) {
|
||||
if (singleColumn) {
|
||||
redirect = <Redirect from='/' to='/home' exact />;
|
||||
} else {
|
||||
redirect = <Redirect from='/' to='/getting-started' exact />;
|
||||
redirect = <Redirect from='/' to='/deck/getting-started' exact />;
|
||||
}
|
||||
} else if (singleUserMode && owner && initialState?.accounts[owner]) {
|
||||
redirect = <Redirect from='/' to={`/@${initialState.accounts[owner].username}`} exact />;
|
||||
@ -177,10 +178,13 @@ class SwitchingColumnsArea extends PureComponent {
|
||||
}
|
||||
|
||||
return (
|
||||
<ColumnsAreaContainer ref={this.setRef} singleColumn={mobile}>
|
||||
<ColumnsAreaContainer ref={this.setRef} singleColumn={singleColumn}>
|
||||
<WrappedSwitch>
|
||||
{redirect}
|
||||
|
||||
{singleColumn ? <Redirect from='/deck' to='/home' exact /> : null}
|
||||
{singleColumn && pathName.startsWith('/deck/') ? <Redirect from={pathName} to={pathName.slice(5)} /> : null}
|
||||
|
||||
<WrappedRoute path='/getting-started' component={GettingStarted} content={children} />
|
||||
<WrappedRoute path='/keyboard-shortcuts' component={KeyboardShortcuts} content={children} />
|
||||
<WrappedRoute path='/about' component={About} content={children} />
|
||||
@ -573,7 +577,7 @@ class UI extends PureComponent {
|
||||
<div className={classNames('ui', { 'is-composing': isComposing })} ref={this.setRef} style={{ pointerEvents: dropdownMenuIsOpen ? 'none' : null }}>
|
||||
<Header />
|
||||
|
||||
<SwitchingColumnsArea location={location} mobile={layout === 'mobile' || layout === 'single-column'}>
|
||||
<SwitchingColumnsArea location={location} singleColumn={layout === 'mobile' || layout === 'single-column'}>
|
||||
{children}
|
||||
</SwitchingColumnsArea>
|
||||
|
||||
|
@ -11,13 +11,21 @@ import BundleContainer from '../containers/bundle_container';
|
||||
|
||||
// Small wrapper to pass multiColumn to the route components
|
||||
export class WrappedSwitch extends PureComponent {
|
||||
static contextTypes = {
|
||||
router: PropTypes.object,
|
||||
};
|
||||
|
||||
render () {
|
||||
const { multiColumn, children } = this.props;
|
||||
const { location } = this.context.router.route;
|
||||
|
||||
const decklessLocation = multiColumn && location.pathname.startsWith('/deck')
|
||||
? {...location, pathname: location.pathname.slice(5)}
|
||||
: location;
|
||||
|
||||
return (
|
||||
<Switch>
|
||||
{Children.map(children, child => cloneElement(child, { multiColumn }))}
|
||||
<Switch location={decklessLocation}>
|
||||
{Children.map(children, child => child ? cloneElement(child, { multiColumn }) : null)}
|
||||
</Switch>
|
||||
);
|
||||
}
|
||||
|
Reference in New Issue
Block a user