Moving redirects to declarative method

This commit is contained in:
Tom Moor
2019-01-19 00:23:39 -08:00
parent d21dd710bb
commit 13501b6d76
17 changed files with 105 additions and 115 deletions

View File

@@ -1,6 +1,7 @@
// @flow
import * as React from 'react';
import { withRouter } from 'react-router-dom';
import { Redirect } from 'react-router-dom';
import { observable } from 'mobx';
import { inject, observer } from 'mobx-react';
import UiStore from 'stores/UiStore';
import AuthStore from 'stores/AuthStore';
@@ -15,19 +16,20 @@ import {
type Props = {
label: React.Node,
history: Object,
ui: UiStore,
auth: AuthStore,
};
@observer
class AccountMenu extends React.Component<Props> {
@observable redirectTo: ?string;
handleOpenKeyboardShortcuts = () => {
this.props.ui.setActiveModal('keyboard-shortcuts');
};
handleOpenSettings = () => {
this.props.history.push('/settings');
this.redirectTo = '/settings';
};
handleLogout = () => {
@@ -35,6 +37,8 @@ class AccountMenu extends React.Component<Props> {
};
render() {
if (this.redirectTo) return <Redirect to={this.redirectTo} />;
return (
<DropdownMenu
style={{ marginRight: 10, marginTop: -10 }}
@@ -69,4 +73,4 @@ class AccountMenu extends React.Component<Props> {
}
}
export default withRouter(inject('ui', 'auth')(AccountMenu));
export default inject('ui', 'auth')(AccountMenu);

View File

@@ -2,6 +2,7 @@
import * as React from 'react';
import { observable } from 'mobx';
import { inject, observer } from 'mobx-react';
import { Redirect } from 'react-router-dom';
import styled from 'styled-components';
import { MoreIcon } from 'outline-icons';
import Modal from 'components/Modal';
@@ -18,7 +19,6 @@ type Props = {
label?: React.Node,
onOpen?: () => *,
onClose?: () => *,
history: Object,
ui: UiStore,
documents: DocumentsStore,
collection: Collection,
@@ -28,11 +28,12 @@ type Props = {
class CollectionMenu extends React.Component<Props> {
file: ?HTMLInputElement;
@observable permissionsModalOpen: boolean = false;
@observable redirectTo: ?string;
onNewDocument = (ev: SyntheticEvent<*>) => {
ev.preventDefault();
const { collection, history } = this.props;
history.push(`${collection.url}/new`);
const { collection } = this.props;
this.redirectTo = `${collection.url}/new`;
};
onImportDocument = (ev: SyntheticEvent<*>) => {
@@ -51,7 +52,7 @@ class CollectionMenu extends React.Component<Props> {
documents: this.props.documents,
collectionId: this.props.collection.id,
});
this.props.history.push(document.url);
this.redirectTo = document.url;
} catch (err) {
this.props.ui.showToast(err.message);
}
@@ -85,6 +86,8 @@ class CollectionMenu extends React.Component<Props> {
};
render() {
if (this.redirectTo) return <Redirect to={this.redirectTo} />;
const { collection, label, onOpen, onClose } = this.props;
return (

View File

@@ -1,6 +1,7 @@
// @flow
import * as React from 'react';
import { withRouter } from 'react-router-dom';
import { Redirect } from 'react-router-dom';
import { observable } from 'mobx';
import { inject, observer } from 'mobx-react';
import { MoreIcon } from 'outline-icons';
@@ -14,7 +15,6 @@ type Props = {
ui: UiStore,
auth: AuthStore,
label?: React.Node,
history: Object,
document: Document,
className: string,
showPrint?: boolean,
@@ -23,11 +23,13 @@ type Props = {
@observer
class DocumentMenu extends React.Component<Props> {
@observable redirectTo: ?string;
handleNewChild = (ev: SyntheticEvent<*>) => {
const { history, document } = this.props;
history.push(
`${document.collection.url}/new?parentDocument=${document.id}`
);
const { document } = this.props;
this.redirectTo = `${document.collection.url}/new?parentDocument=${
document.id
}`;
};
handleDelete = (ev: SyntheticEvent<*>) => {
@@ -36,16 +38,16 @@ class DocumentMenu extends React.Component<Props> {
};
handleDocumentHistory = () => {
this.props.history.push(documentHistoryUrl(this.props.document));
this.redirectTo = documentHistoryUrl(this.props.document);
};
handleMove = (ev: SyntheticEvent<*>) => {
this.props.history.push(documentMoveUrl(this.props.document));
this.redirectTo = documentMoveUrl(this.props.document);
};
handleDuplicate = async (ev: SyntheticEvent<*>) => {
const duped = await this.props.document.duplicate();
this.props.history.push(duped.url);
this.redirectTo = duped.url;
};
handlePin = (ev: SyntheticEvent<*>) => {
@@ -76,6 +78,8 @@ class DocumentMenu extends React.Component<Props> {
};
render() {
if (this.redirectTo) return <Redirect to={this.redirectTo} />;
const { document, label, className, showPrint, auth } = this.props;
const canShareDocuments = auth.team && auth.team.sharing;
@@ -136,4 +140,4 @@ class DocumentMenu extends React.Component<Props> {
}
}
export default withRouter(inject('ui', 'auth')(DocumentMenu));
export default inject('ui', 'auth')(DocumentMenu);

View File

@@ -1,6 +1,8 @@
// @flow
import * as React from 'react';
import { withRouter } from 'react-router-dom';
import { Redirect } from 'react-router-dom';
import { observable } from 'mobx';
import { observer } from 'mobx-react';
import { MoreIcon } from 'outline-icons';
import { newDocumentUrl } from 'utils/routeHelpers';
@@ -9,25 +11,28 @@ import { DropdownMenu, DropdownMenuItem } from 'components/DropdownMenu';
type Props = {
label?: React.Node,
history: Object,
document: Document,
};
@observer
class NewChildDocumentMenu extends React.Component<Props> {
@observable redirectTo: ?string;
handleNewDocument = () => {
const { history, document } = this.props;
history.push(newDocumentUrl(document.collection));
this.redirectTo = newDocumentUrl(this.props.document.collection);
};
handleNewChild = () => {
const { history, document } = this.props;
history.push(
`${document.collection.url}/new?parentDocument=${document.id}`
);
const { document } = this.props;
this.redirectTo = `${document.collection.url}/new?parentDocument=${
document.id
}`;
};
render() {
const { label, document, history, ...rest } = this.props;
if (this.redirectTo) return <Redirect to={this.redirectTo} />;
const { label, document, ...rest } = this.props;
const { collection } = document;
return (
@@ -45,4 +50,4 @@ class NewChildDocumentMenu extends React.Component<Props> {
}
}
export default withRouter(NewChildDocumentMenu);
export default NewChildDocumentMenu;

View File

@@ -1,7 +1,8 @@
// @flow
import * as React from 'react';
import { withRouter } from 'react-router-dom';
import { inject } from 'mobx-react';
import { observable } from 'mobx';
import { inject, observer } from 'mobx-react';
import { Redirect } from 'react-router-dom';
import { MoreIcon, CollectionIcon, PrivateCollectionIcon } from 'outline-icons';
import { newDocumentUrl } from 'utils/routeHelpers';
@@ -10,13 +11,15 @@ import { DropdownMenu, DropdownMenuItem } from 'components/DropdownMenu';
type Props = {
label?: React.Node,
history: Object,
collections: CollectionsStore,
};
@observer
class NewDocumentMenu extends React.Component<Props> {
@observable redirectTo: ?string;
handleNewDocument = collection => {
this.props.history.push(newDocumentUrl(collection));
this.redirectTo = newDocumentUrl(collection);
};
onOpen = () => {
@@ -28,7 +31,9 @@ class NewDocumentMenu extends React.Component<Props> {
};
render() {
const { collections, label, history, ...rest } = this.props;
if (this.redirectTo) return <Redirect to={this.redirectTo} />;
const { collections, label, ...rest } = this.props;
return (
<DropdownMenu
@@ -55,4 +60,4 @@ class NewDocumentMenu extends React.Component<Props> {
}
}
export default withRouter(inject('collections')(NewDocumentMenu));
export default inject('collections')(NewDocumentMenu);

View File

@@ -1,12 +1,12 @@
// @flow
import * as React from 'react';
import { withRouter } from 'react-router-dom';
import { inject } from 'mobx-react';
import { Redirect } from 'react-router-dom';
import { inject, observer } from 'mobx-react';
import { observable } from 'mobx';
import { MoreIcon } from 'outline-icons';
import CopyToClipboard from 'components/CopyToClipboard';
import { DropdownMenu, DropdownMenuItem } from 'components/DropdownMenu';
import SharesStore from 'stores/SharesStore';
import UiStore from 'stores/UiStore';
import Share from 'models/Share';
@@ -15,16 +15,18 @@ type Props = {
label?: React.Node,
onOpen?: () => *,
onClose: () => *,
history: Object,
shares: SharesStore,
ui: UiStore,
share: Share,
};
@observer
class ShareMenu extends React.Component<Props> {
@observable redirectTo: ?string;
handleGoToDocument = (ev: SyntheticEvent<*>) => {
ev.preventDefault();
this.props.history.push(this.props.share.documentUrl);
this.redirectTo = this.props.share.documentUrl;
};
handleRevoke = (ev: SyntheticEvent<*>) => {
@@ -38,6 +40,8 @@ class ShareMenu extends React.Component<Props> {
};
render() {
if (this.redirectTo) return <Redirect to={this.redirectTo} />;
const { share, label, onOpen, onClose } = this.props;
return (
@@ -61,4 +65,4 @@ class ShareMenu extends React.Component<Props> {
}
}
export default withRouter(inject('shares', 'ui')(ShareMenu));
export default inject('shares', 'ui')(ShareMenu);