yuuza/outline
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore: Move to prettier standard double quotes (#1309)

Browse Source
This commit is contained in:
Tom Moor
2020-06-20 13:59:15 -07:00
committed by GitHub
parent 2a3b9e2104
commit f43deb7940
444 changed files with 5988 additions and 5977 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
app/scenes/Archive.js
View File

@@ -1,14 +1,14 @@
// @flow
import * as React from 'react';
import { observer, inject } from 'mobx-react';
import * as React from "react";
import { observer, inject } from "mobx-react";
import CenteredContent from 'components/CenteredContent';
import Empty from 'components/Empty';
import PageTitle from 'components/PageTitle';
import Heading from 'components/Heading';
import PaginatedDocumentList from 'components/PaginatedDocumentList';
import Subheading from 'components/Subheading';
import DocumentsStore from 'stores/DocumentsStore';
import CenteredContent from "components/CenteredContent";
import Empty from "components/Empty";
import PageTitle from "components/PageTitle";
import Heading from "components/Heading";
import PaginatedDocumentList from "components/PaginatedDocumentList";
import Subheading from "components/Subheading";
import DocumentsStore from "stores/DocumentsStore";
type Props = {
documents: DocumentsStore,
@@ -35,4 +35,4 @@ class Archive extends React.Component<Props> {
}
}
export default inject('documents')(Archive);
export default inject("documents")(Archive);

86
app/scenes/Collection.js
View File

@@ -1,42 +1,42 @@
// @flow
import * as React from 'react';
import { observable } from 'mobx';
import { observer, inject } from 'mobx-react';
import { Redirect, Link, Switch, Route } from 'react-router-dom';
import * as React from "react";
import { observable } from "mobx";
import { observer, inject } from "mobx-react";
import { Redirect, Link, Switch, Route } from "react-router-dom";
import styled, { withTheme } from 'styled-components';
import { NewDocumentIcon, PlusIcon, PinIcon } from 'outline-icons';
import RichMarkdownEditor from 'rich-markdown-editor';
import styled, { withTheme } from "styled-components";
import { NewDocumentIcon, PlusIcon, PinIcon } from "outline-icons";
import RichMarkdownEditor from "rich-markdown-editor";
import { newDocumentUrl, collectionUrl } from 'utils/routeHelpers';
import CollectionsStore from 'stores/CollectionsStore';
import DocumentsStore from 'stores/DocumentsStore';
import PoliciesStore from 'stores/PoliciesStore';
import UiStore from 'stores/UiStore';
import Collection from 'models/Collection';
import { newDocumentUrl, collectionUrl } from "utils/routeHelpers";
import CollectionsStore from "stores/CollectionsStore";
import DocumentsStore from "stores/DocumentsStore";
import PoliciesStore from "stores/PoliciesStore";
import UiStore from "stores/UiStore";
import Collection from "models/Collection";
import Search from 'scenes/Search';
import CollectionEdit from 'scenes/CollectionEdit';
import CollectionMenu from 'menus/CollectionMenu';
import Actions, { Action, Separator } from 'components/Actions';
import Heading from 'components/Heading';
import Tooltip from 'components/Tooltip';
import CenteredContent from 'components/CenteredContent';
import { ListPlaceholder } from 'components/LoadingPlaceholder';
import InputSearch from 'components/InputSearch';
import Mask from 'components/Mask';
import Button from 'components/Button';
import HelpText from 'components/HelpText';
import DocumentList from 'components/DocumentList';
import Subheading from 'components/Subheading';
import PageTitle from 'components/PageTitle';
import Flex from 'shared/components/Flex';
import Modal from 'components/Modal';
import CollectionMembers from 'scenes/CollectionMembers';
import Tabs from 'components/Tabs';
import Tab from 'components/Tab';
import PaginatedDocumentList from 'components/PaginatedDocumentList';
import CollectionIcon from 'components/CollectionIcon';
import Search from "scenes/Search";
import CollectionEdit from "scenes/CollectionEdit";
import CollectionMenu from "menus/CollectionMenu";
import Actions, { Action, Separator } from "components/Actions";
import Heading from "components/Heading";
import Tooltip from "components/Tooltip";
import CenteredContent from "components/CenteredContent";
import { ListPlaceholder } from "components/LoadingPlaceholder";
import InputSearch from "components/InputSearch";
import Mask from "components/Mask";
import Button from "components/Button";
import HelpText from "components/HelpText";
import DocumentList from "components/DocumentList";
import Subheading from "components/Subheading";
import PageTitle from "components/PageTitle";
import Flex from "shared/components/Flex";
import Modal from "components/Modal";
import CollectionMembers from "scenes/CollectionMembers";
import Tabs from "components/Tabs";
import Tab from "components/Tab";
import PaginatedDocumentList from "components/PaginatedDocumentList";
import CollectionIcon from "components/CollectionIcon";
type Props = {
ui: UiStore,
@@ -205,7 +205,7 @@ class CollectionScene extends React.Component<Props> {
) : (
<React.Fragment>
<Heading>
<CollectionIcon collection={collection} size={40} expanded />{' '}
<CollectionIcon collection={collection} size={40} expanded />{" "}
{collection.name}
</Heading>
@@ -232,18 +232,18 @@ class CollectionScene extends React.Component<Props> {
<Tab to={collectionUrl(collection.id)} exact>
Recently updated
</Tab>
<Tab to={collectionUrl(collection.id, 'recent')} exact>
<Tab to={collectionUrl(collection.id, "recent")} exact>
Recently published
</Tab>
<Tab to={collectionUrl(collection.id, 'old')} exact>
<Tab to={collectionUrl(collection.id, "old")} exact>
Least recently updated
</Tab>
<Tab to={collectionUrl(collection.id, 'alphabetical')} exact>
<Tab to={collectionUrl(collection.id, "alphabetical")} exact>
A–Z
</Tab>
</Tabs>
<Switch>
<Route path={collectionUrl(collection.id, 'alphabetical')}>
<Route path={collectionUrl(collection.id, "alphabetical")}>
<PaginatedDocumentList
key="alphabetical"
documents={documents.alphabeticalInCollection(
@@ -254,7 +254,7 @@ class CollectionScene extends React.Component<Props> {
showPin
/>
</Route>
<Route path={collectionUrl(collection.id, 'old')}>
<Route path={collectionUrl(collection.id, "old")}>
<PaginatedDocumentList
key="old"
documents={documents.leastRecentlyUpdatedInCollection(
@@ -265,7 +265,7 @@ class CollectionScene extends React.Component<Props> {
showPin
/>
</Route>
<Route path={collectionUrl(collection.id, 'recent')}>
<Route path={collectionUrl(collection.id, "recent")}>
<PaginatedDocumentList
key="recent"
documents={documents.recentlyPublishedInCollection(
@@ -324,6 +324,6 @@ const Wrapper = styled(Flex)`
margin: 10px 0;
`;
export default inject('collections', 'policies', 'documents', 'ui')(
export default inject("collections", "policies", "documents", "ui")(
withTheme(CollectionScene)
);

28
app/scenes/CollectionDelete.js
View File

@@ -1,15 +1,15 @@
// @flow
import * as React from 'react';
import { withRouter, type RouterHistory } from 'react-router-dom';
import { observable } from 'mobx';
import { inject, observer } from 'mobx-react';
import { homeUrl } from 'utils/routeHelpers';
import Button from 'components/Button';
import Flex from 'shared/components/Flex';
import HelpText from 'components/HelpText';
import Collection from 'models/Collection';
import CollectionsStore from 'stores/CollectionsStore';
import UiStore from 'stores/UiStore';
import * as React from "react";
import { withRouter, type RouterHistory } from "react-router-dom";
import { observable } from "mobx";
import { inject, observer } from "mobx-react";
import { homeUrl } from "utils/routeHelpers";
import Button from "components/Button";
import Flex from "shared/components/Flex";
import HelpText from "components/HelpText";
import Collection from "models/Collection";
import CollectionsStore from "stores/CollectionsStore";
import UiStore from "stores/UiStore";
type Props = {
history: RouterHistory,
@@ -45,12 +45,12 @@ class CollectionDelete extends React.Component<Props> {
<Flex column>
<form onSubmit={this.handleSubmit}>
<HelpText>
Are you sure about that? Deleting the{' '}
Are you sure about that? Deleting the{" "}
<strong>{collection.name}</strong> collection is permanent and will
also delete all of the documents within it, so be extra careful.
</HelpText>
<Button type="submit" danger>
{this.isDeleting ? 'Deleting…' : 'I’m sure – Delete'}
{this.isDeleting ? "Deleting…" : "I’m sure – Delete"}
</Button>
</form>
</Flex>
@@ -58,4 +58,4 @@ class CollectionDelete extends React.Component<Props> {
}
}
export default inject('collections', 'ui')(withRouter(CollectionDelete));
export default inject("collections", "ui")(withRouter(CollectionDelete));

38
app/scenes/CollectionEdit.js
View File

@@ -1,16 +1,16 @@
// @flow
import * as React from 'react';
import { observable } from 'mobx';
import { inject, observer } from 'mobx-react';
import Input from 'components/Input';
import InputRich from 'components/InputRich';
import Button from 'components/Button';
import Switch from 'components/Switch';
import Flex from 'shared/components/Flex';
import HelpText from 'components/HelpText';
import IconPicker from 'components/IconPicker';
import Collection from 'models/Collection';
import UiStore from 'stores/UiStore';
import * as React from "react";
import { observable } from "mobx";
import { inject, observer } from "mobx-react";
import Input from "components/Input";
import InputRich from "components/InputRich";
import Button from "components/Button";
import Switch from "components/Switch";
import Flex from "shared/components/Flex";
import HelpText from "components/HelpText";
import IconPicker from "components/IconPicker";
import Collection from "models/Collection";
import UiStore from "stores/UiStore";
type Props = {
collection: Collection,
@@ -21,9 +21,9 @@ type Props = {
@observer
class CollectionEdit extends React.Component<Props> {
@observable name: string;
@observable description: string = '';
@observable icon: string = '';
@observable color: string = '#4E5C6E';
@observable description: string = "";
@observable icon: string = "";
@observable color: string = "#4E5C6E";
@observable isSaving: boolean;
@observable private: boolean = false;
@@ -48,7 +48,7 @@ class CollectionEdit extends React.Component<Props> {
private: this.private,
});
this.props.onSubmit();
this.props.ui.showToast('The collection was updated');
this.props.ui.showToast("The collection was updated");
} catch (err) {
this.props.ui.showToast(err.message);
} finally {
@@ -102,7 +102,7 @@ class CollectionEdit extends React.Component<Props> {
id={this.props.collection.id}
label="Description"
onChange={this.handleDescriptionChange}
defaultValue={this.description || ''}
defaultValue={this.description || ""}
placeholder="More details about this collection…"
minHeight={68}
maxHeight={200}
@@ -120,7 +120,7 @@ class CollectionEdit extends React.Component<Props> {
type="submit"
disabled={this.isSaving || !this.props.collection.name}
>
{this.isSaving ? 'Saving…' : 'Save'}
{this.isSaving ? "Saving…" : "Save"}
</Button>
</form>
</Flex>
@@ -128,4 +128,4 @@ class CollectionEdit extends React.Component<Props> {
}
}
export default inject('ui')(CollectionEdit);
export default inject("ui")(CollectionEdit);

22
app/scenes/CollectionExport.js
View File

@@ -1,13 +1,13 @@
// @flow
import * as React from 'react';
import { observable } from 'mobx';
import { inject, observer } from 'mobx-react';
import Button from 'components/Button';
import Flex from 'shared/components/Flex';
import HelpText from 'components/HelpText';
import Collection from 'models/Collection';
import AuthStore from 'stores/AuthStore';
import UiStore from 'stores/UiStore';
import * as React from "react";
import { observable } from "mobx";
import { inject, observer } from "mobx-react";
import Button from "components/Button";
import Flex from "shared/components/Flex";
import HelpText from "components/HelpText";
import Collection from "models/Collection";
import AuthStore from "stores/AuthStore";
import UiStore from "stores/UiStore";
type Props = {
collection: Collection,
@@ -42,7 +42,7 @@ class CollectionExport extends React.Component<Props> {
with files in Markdown format.
</HelpText>
<Button type="submit" disabled={this.isLoading} primary>
{this.isLoading ? 'Exporting…' : 'Export Collection'}
{this.isLoading ? "Exporting…" : "Export Collection"}
</Button>
</form>
</Flex>
@@ -50,4 +50,4 @@ class CollectionExport extends React.Component<Props> {
}
}
export default inject('ui', 'auth')(CollectionExport);
export default inject("ui", "auth")(CollectionExport);

48
app/scenes/CollectionMembers/AddGroupsToCollection.js
View File

@@ -1,23 +1,23 @@
// @flow
import * as React from 'react';
import styled from 'styled-components';
import { inject, observer } from 'mobx-react';
import { observable } from 'mobx';
import { debounce } from 'lodash';
import Button from 'components/Button';
import Flex from 'shared/components/Flex';
import HelpText from 'components/HelpText';
import Input from 'components/Input';
import Modal from 'components/Modal';
import Empty from 'components/Empty';
import PaginatedList from 'components/PaginatedList';
import GroupNew from 'scenes/GroupNew';
import Collection from 'models/Collection';
import UiStore from 'stores/UiStore';
import AuthStore from 'stores/AuthStore';
import GroupsStore from 'stores/GroupsStore';
import CollectionGroupMembershipsStore from 'stores/CollectionGroupMembershipsStore';
import GroupListItem from 'components/GroupListItem';
import * as React from "react";
import styled from "styled-components";
import { inject, observer } from "mobx-react";
import { observable } from "mobx";
import { debounce } from "lodash";
import Button from "components/Button";
import Flex from "shared/components/Flex";
import HelpText from "components/HelpText";
import Input from "components/Input";
import Modal from "components/Modal";
import Empty from "components/Empty";
import PaginatedList from "components/PaginatedList";
import GroupNew from "scenes/GroupNew";
import Collection from "models/Collection";
import UiStore from "stores/UiStore";
import AuthStore from "stores/AuthStore";
import GroupsStore from "stores/GroupsStore";
import CollectionGroupMembershipsStore from "stores/CollectionGroupMembershipsStore";
import GroupListItem from "components/GroupListItem";
type Props = {
ui: UiStore,
@@ -31,7 +31,7 @@ type Props = {
@observer
class AddGroupsToCollection extends React.Component<Props> {
@observable newGroupModalOpen: boolean = false;
@observable query: string = '';
@observable query: string = "";
handleNewGroupModalOpen = () => {
this.newGroupModalOpen = true;
@@ -57,11 +57,11 @@ class AddGroupsToCollection extends React.Component<Props> {
this.props.collectionGroupMemberships.create({
collectionId: this.props.collection.id,
groupId: group.id,
permission: 'read_write',
permission: "read_write",
});
this.props.ui.showToast(`${group.name} was added to the collection`);
} catch (err) {
this.props.ui.showToast('Could not add user');
this.props.ui.showToast("Could not add user");
console.error(err);
}
};
@@ -74,7 +74,7 @@ class AddGroupsToCollection extends React.Component<Props> {
return (
<Flex column>
<HelpText>
Can’t find the group you’re looking for?{' '}
Can’t find the group you’re looking for?{" "}
<a role="button" onClick={this.handleNewGroupModalOpen}>
Create a group
</a>.
@@ -130,6 +130,6 @@ const ButtonWrap = styled.div`
margin-left: 6px;
`;
export default inject('auth', 'groups', 'collectionGroupMemberships', 'ui')(
export default inject("auth", "groups", "collectionGroupMemberships", "ui")(
AddGroupsToCollection
);

44
app/scenes/CollectionMembers/AddPeopleToCollection.js
View File

@@ -1,21 +1,21 @@
// @flow
import * as React from 'react';
import { inject, observer } from 'mobx-react';
import { observable } from 'mobx';
import { debounce } from 'lodash';
import Flex from 'shared/components/Flex';
import HelpText from 'components/HelpText';
import Input from 'components/Input';
import Modal from 'components/Modal';
import Empty from 'components/Empty';
import PaginatedList from 'components/PaginatedList';
import Invite from 'scenes/Invite';
import Collection from 'models/Collection';
import UiStore from 'stores/UiStore';
import AuthStore from 'stores/AuthStore';
import UsersStore from 'stores/UsersStore';
import MembershipsStore from 'stores/MembershipsStore';
import MemberListItem from './components/MemberListItem';
import * as React from "react";
import { inject, observer } from "mobx-react";
import { observable } from "mobx";
import { debounce } from "lodash";
import Flex from "shared/components/Flex";
import HelpText from "components/HelpText";
import Input from "components/Input";
import Modal from "components/Modal";
import Empty from "components/Empty";
import PaginatedList from "components/PaginatedList";
import Invite from "scenes/Invite";
import Collection from "models/Collection";
import UiStore from "stores/UiStore";
import AuthStore from "stores/AuthStore";
import UsersStore from "stores/UsersStore";
import MembershipsStore from "stores/MembershipsStore";
import MemberListItem from "./components/MemberListItem";
type Props = {
ui: UiStore,
@@ -29,7 +29,7 @@ type Props = {
@observer
class AddPeopleToCollection extends React.Component<Props> {
@observable inviteModalOpen: boolean = false;
@observable query: string = '';
@observable query: string = "";
handleInviteModalOpen = () => {
this.inviteModalOpen = true;
@@ -55,11 +55,11 @@ class AddPeopleToCollection extends React.Component<Props> {
this.props.memberships.create({
collectionId: this.props.collection.id,
userId: user.id,
permission: 'read_write',
permission: "read_write",
});
this.props.ui.showToast(`${user.name} was added to the collection`);
} catch (err) {
this.props.ui.showToast('Could not add user');
this.props.ui.showToast("Could not add user");
}
};
@@ -71,7 +71,7 @@ class AddPeopleToCollection extends React.Component<Props> {
return (
<Flex column>
<HelpText>
Need to add someone who’s not yet on the team yet?{' '}
Need to add someone who’s not yet on the team yet?{" "}
<a role="button" onClick={this.handleInviteModalOpen}>
Invite people to {team.name}
</a>.
@@ -118,6 +118,6 @@ class AddPeopleToCollection extends React.Component<Props> {
}
}
export default inject('auth', 'users', 'memberships', 'ui')(
export default inject("auth", "users", "memberships", "ui")(
AddPeopleToCollection
);

74
app/scenes/CollectionMembers/CollectionMembers.js
View File

@@ -1,27 +1,27 @@
// @flow
import * as React from 'react';
import { observable } from 'mobx';
import styled from 'styled-components';
import { inject, observer } from 'mobx-react';
import { PlusIcon } from 'outline-icons';
import Flex from 'shared/components/Flex';
import HelpText from 'components/HelpText';
import Subheading from 'components/Subheading';
import Button from 'components/Button';
import Empty from 'components/Empty';
import PaginatedList from 'components/PaginatedList';
import Modal from 'components/Modal';
import CollectionGroupMemberListItem from './components/CollectionGroupMemberListItem';
import Collection from 'models/Collection';
import UiStore from 'stores/UiStore';
import AuthStore from 'stores/AuthStore';
import MembershipsStore from 'stores/MembershipsStore';
import CollectionGroupMembershipsStore from 'stores/CollectionGroupMembershipsStore';
import UsersStore from 'stores/UsersStore';
import MemberListItem from './components/MemberListItem';
import AddPeopleToCollection from './AddPeopleToCollection';
import AddGroupsToCollection from './AddGroupsToCollection';
import GroupsStore from 'stores/GroupsStore';
import * as React from "react";
import { observable } from "mobx";
import styled from "styled-components";
import { inject, observer } from "mobx-react";
import { PlusIcon } from "outline-icons";
import Flex from "shared/components/Flex";
import HelpText from "components/HelpText";
import Subheading from "components/Subheading";
import Button from "components/Button";
import Empty from "components/Empty";
import PaginatedList from "components/PaginatedList";
import Modal from "components/Modal";
import CollectionGroupMemberListItem from "./components/CollectionGroupMemberListItem";
import Collection from "models/Collection";
import UiStore from "stores/UiStore";
import AuthStore from "stores/AuthStore";
import MembershipsStore from "stores/MembershipsStore";
import CollectionGroupMembershipsStore from "stores/CollectionGroupMembershipsStore";
import UsersStore from "stores/UsersStore";
import MemberListItem from "./components/MemberListItem";
import AddPeopleToCollection from "./AddPeopleToCollection";
import AddGroupsToCollection from "./AddGroupsToCollection";
import GroupsStore from "stores/GroupsStore";
type Props = {
ui: UiStore,
@@ -63,7 +63,7 @@ class CollectionMembers extends React.Component<Props> {
});
this.props.ui.showToast(`${user.name} was removed from the collection`);
} catch (err) {
this.props.ui.showToast('Could not remove user');
this.props.ui.showToast("Could not remove user");
}
};
@@ -76,7 +76,7 @@ class CollectionMembers extends React.Component<Props> {
});
this.props.ui.showToast(`${user.name} permissions were updated`);
} catch (err) {
this.props.ui.showToast('Could not update user');
this.props.ui.showToast("Could not update user");
}
};
@@ -88,7 +88,7 @@ class CollectionMembers extends React.Component<Props> {
});
this.props.ui.showToast(`${group.name} was removed from the collection`);
} catch (err) {
this.props.ui.showToast('Could not remove group');
this.props.ui.showToast("Could not remove group");
}
};
@@ -101,7 +101,7 @@ class CollectionMembers extends React.Component<Props> {
});
this.props.ui.showToast(`${group.name} permissions were updated`);
} catch (err) {
this.props.ui.showToast('Could not update user');
this.props.ui.showToast("Could not update user");
}
};
@@ -120,7 +120,7 @@ class CollectionMembers extends React.Component<Props> {
const key = memberships.orderedData
.map(m => m.permission)
.concat(collection.private)
.join('-');
.join("-");
return (
<Flex column>
@@ -128,9 +128,9 @@ class CollectionMembers extends React.Component<Props> {
<React.Fragment>
<HelpText>
Choose which groups and team members have access to view and edit
documents in the private <strong>{collection.name}</strong>{' '}
documents in the private <strong>{collection.name}</strong>{" "}
collection. You can make this collection visible to the entire
team by{' '}
team by{" "}
<a role="button" onClick={this.props.onEdit}>
changing its visibility
</a>.
@@ -150,7 +150,7 @@ class CollectionMembers extends React.Component<Props> {
<HelpText>
The <strong>{collection.name}</strong> collection is accessible by
everyone on the team. If you want to limit who can view the
collection,{' '}
collection,{" "}
<a role="button" onClick={this.props.onEdit}>
make it private
</a>.
@@ -250,10 +250,10 @@ const GroupsWrap = styled.div`
`;
export default inject(
'auth',
'users',
'memberships',
'collectionGroupMemberships',
'groups',
'ui'
"auth",
"users",
"memberships",
"collectionGroupMemberships",
"groups",
"ui"
)(CollectionMembers);

18
app/scenes/CollectionMembers/components/CollectionGroupMemberListItem.js
View File

@@ -1,15 +1,15 @@
// @flow
import * as React from 'react';
import styled from 'styled-components';
import InputSelect from 'components/InputSelect';
import GroupListItem from 'components/GroupListItem';
import Group from 'models/Group';
import CollectionGroupMembership from 'models/CollectionGroupMembership';
import { DropdownMenu, DropdownMenuItem } from 'components/DropdownMenu';
import * as React from "react";
import styled from "styled-components";
import InputSelect from "components/InputSelect";
import GroupListItem from "components/GroupListItem";
import Group from "models/Group";
import CollectionGroupMembership from "models/CollectionGroupMembership";
import { DropdownMenu, DropdownMenuItem } from "components/DropdownMenu";
const PERMISSIONS = [
{ label: 'Read only', value: 'read' },
{ label: 'Read & Edit', value: 'read_write' },
{ label: "Read only", value: "read" },
{ label: "Read & Edit", value: "read_write" },
];
type Props = {
group: Group,

30
app/scenes/CollectionMembers/components/MemberListItem.js
View File

@@ -1,20 +1,20 @@
// @flow
import * as React from 'react';
import styled from 'styled-components';
import Avatar from 'components/Avatar';
import Flex from 'shared/components/Flex';
import Time from 'shared/components/Time';
import Badge from 'components/Badge';
import Button from 'components/Button';
import InputSelect from 'components/InputSelect';
import ListItem from 'components/List/Item';
import User from 'models/User';
import Membership from 'models/Membership';
import { DropdownMenu, DropdownMenuItem } from 'components/DropdownMenu';
import * as React from "react";
import styled from "styled-components";
import Avatar from "components/Avatar";
import Flex from "shared/components/Flex";
import Time from "shared/components/Time";
import Badge from "components/Badge";
import Button from "components/Button";
import InputSelect from "components/InputSelect";
import ListItem from "components/List/Item";
import User from "models/User";
import Membership from "models/Membership";
import { DropdownMenu, DropdownMenuItem } from "components/DropdownMenu";
const PERMISSIONS = [
{ label: 'Read only', value: 'read' },
{ label: 'Read & Edit', value: 'read_write' },
{ label: "Read only", value: "read" },
{ label: "Read & Edit", value: "read_write" },
];
type Props = {
user: User,
@@ -43,7 +43,7 @@ const MemberListItem = ({
Active <Time dateTime={user.lastActiveAt} /> ago
</React.Fragment>
) : (
'Never signed in'
"Never signed in"
)}
{!user.lastActiveAt && <Badge>Invited</Badge>}
{user.isAdmin && <Badge admin={user.isAdmin}>Admin</Badge>}

18
app/scenes/CollectionMembers/components/UserListItem.js
View File

@@ -1,12 +1,12 @@
// @flow
import * as React from 'react';
import { PlusIcon } from 'outline-icons';
import Time from 'shared/components/Time';
import Avatar from 'components/Avatar';
import Button from 'components/Button';
import Badge from 'components/Badge';
import ListItem from 'components/List/Item';
import User from 'models/User';
import * as React from "react";
import { PlusIcon } from "outline-icons";
import Time from "shared/components/Time";
import Avatar from "components/Avatar";
import Button from "components/Button";
import Badge from "components/Badge";
import ListItem from "components/List/Item";
import User from "models/User";
type Props = {
user: User,
@@ -26,7 +26,7 @@ const UserListItem = ({ user, onAdd, canEdit }: Props) => {
Active <Time dateTime={user.lastActiveAt} /> ago
</React.Fragment>
) : (
'Never signed in'
"Never signed in"
)}
{!user.lastActiveAt && <Badge>Invited</Badge>}
{user.isAdmin && <Badge admin={user.isAdmin}>Admin</Badge>}

2
app/scenes/CollectionMembers/index.js
View File

@@ -1,3 +1,3 @@
// @flow
import CollectionMembers from './CollectionMembers';
import CollectionMembers from "./CollectionMembers";
export default CollectionMembers;

50
app/scenes/CollectionNew.js
View File

@@ -1,20 +1,20 @@
// @flow
import * as React from 'react';
import { withRouter, type RouterHistory } from 'react-router-dom';
import { observable } from 'mobx';
import { inject, observer } from 'mobx-react';
import { intersection } from 'lodash';
import Button from 'components/Button';
import Switch from 'components/Switch';
import Input from 'components/Input';
import InputRich from 'components/InputRich';
import IconPicker, { icons } from 'components/IconPicker';
import HelpText from 'components/HelpText';
import Flex from 'shared/components/Flex';
import * as React from "react";
import { withRouter, type RouterHistory } from "react-router-dom";
import { observable } from "mobx";
import { inject, observer } from "mobx-react";
import { intersection } from "lodash";
import Button from "components/Button";
import Switch from "components/Switch";
import Input from "components/Input";
import InputRich from "components/InputRich";
import IconPicker, { icons } from "components/IconPicker";
import HelpText from "components/HelpText";
import Flex from "shared/components/Flex";
import Collection from 'models/Collection';
import CollectionsStore from 'stores/CollectionsStore';
import UiStore from 'stores/UiStore';
import Collection from "models/Collection";
import CollectionsStore from "stores/CollectionsStore";
import UiStore from "stores/UiStore";
type Props = {
history: RouterHistory,
@@ -25,10 +25,10 @@ type Props = {
@observer
class CollectionNew extends React.Component<Props> {
@observable name: string = '';
@observable description: string = '';
@observable icon: string = '';
@observable color: string = '#4E5C6E';
@observable name: string = "";
@observable description: string = "";
@observable icon: string = "";
@observable color: string = "#4E5C6E";
@observable private: boolean = false;
@observable isSaving: boolean;
hasOpenedIconPicker: boolean = false;
@@ -67,8 +67,8 @@ class CollectionNew extends React.Component<Props> {
const keys = Object.keys(icons);
for (const key of keys) {
const icon = icons[key];
const keywords = icon.keywords.split(' ');
const namewords = this.name.toLowerCase().split(' ');
const keywords = icon.keywords.split(" ");
const namewords = this.name.toLowerCase().split(" ");
const matches = intersection(namewords, keywords);
if (matches.length > 0) {
@@ -77,7 +77,7 @@ class CollectionNew extends React.Component<Props> {
}
}
this.icon = 'collection';
this.icon = "collection";
}
};
@@ -127,7 +127,7 @@ class CollectionNew extends React.Component<Props> {
<InputRich
label="Description"
onChange={this.handleDescriptionChange}
defaultValue={this.description || ''}
defaultValue={this.description || ""}
placeholder="More details about this collection…"
minHeight={68}
maxHeight={200}
@@ -143,11 +143,11 @@ class CollectionNew extends React.Component<Props> {
</HelpText>
<Button type="submit" disabled={this.isSaving || !this.name}>
{this.isSaving ? 'Creating…' : 'Create'}
{this.isSaving ? "Creating…" : "Create"}
</Button>
</form>
);
}
}
export default inject('collections', 'ui')(withRouter(CollectionNew));
export default inject("collections", "ui")(withRouter(CollectionNew));

28
app/scenes/Dashboard.js
View File

@@ -1,18 +1,18 @@
// @flow
import * as React from 'react';
import { Switch, Route } from 'react-router-dom';
import { observer, inject } from 'mobx-react';
import * as React from "react";
import { Switch, Route } from "react-router-dom";
import { observer, inject } from "mobx-react";
import DocumentsStore from 'stores/DocumentsStore';
import AuthStore from 'stores/AuthStore';
import NewDocumentMenu from 'menus/NewDocumentMenu';
import Actions, { Action } from 'components/Actions';
import InputSearch from 'components/InputSearch';
import CenteredContent from 'components/CenteredContent';
import PageTitle from 'components/PageTitle';
import Tabs from 'components/Tabs';
import Tab from 'components/Tab';
import PaginatedDocumentList from '../components/PaginatedDocumentList';
import DocumentsStore from "stores/DocumentsStore";
import AuthStore from "stores/AuthStore";
import NewDocumentMenu from "menus/NewDocumentMenu";
import Actions, { Action } from "components/Actions";
import InputSearch from "components/InputSearch";
import CenteredContent from "components/CenteredContent";
import PageTitle from "components/PageTitle";
import Tabs from "components/Tabs";
import Tab from "components/Tab";
import PaginatedDocumentList from "../components/PaginatedDocumentList";
type Props = {
documents: DocumentsStore,
@@ -78,4 +78,4 @@ class Dashboard extends React.Component<Props> {
}
}
export default inject('documents', 'auth')(Dashboard);
export default inject("documents", "auth")(Dashboard);

12
app/scenes/Document/KeyedDocument.js
View File

@@ -1,7 +1,7 @@
// @flow
import * as React from 'react';
import { inject } from 'mobx-react';
import DataLoader from './components/DataLoader';
import * as React from "react";
import { inject } from "mobx-react";
import DataLoader from "./components/DataLoader";
class KeyedDocument extends React.Component<*> {
componentWillUnmount() {
@@ -15,11 +15,11 @@ class KeyedDocument extends React.Component<*> {
// we only want to force a re-mount of the document component when the
// document changes, not when the title does so only this portion is used
// for the key.
const urlParts = documentSlug ? documentSlug.split('-') : [];
const urlParts = documentSlug ? documentSlug.split("-") : [];
const urlId = urlParts.length ? urlParts[urlParts.length - 1] : undefined;
return <DataLoader key={[urlId, revisionId].join('/')} {...this.props} />;
return <DataLoader key={[urlId, revisionId].join("/")} {...this.props} />;
}
}
export default inject('ui')(KeyedDocument);
export default inject("ui")(KeyedDocument);

6
app/scenes/Document/components/Container.js
View File

@@ -1,10 +1,10 @@
// @flow
import styled from 'styled-components';
import Flex from 'shared/components/Flex';
import styled from "styled-components";
import Flex from "shared/components/Flex";
const Container = styled(Flex)`
position: relative;
margin-top: ${props => (props.isShare ? '50px' : '0')};
margin-top: ${props => (props.isShare ? "50px" : "0")};
`;
export default Container;

28
app/scenes/Document/components/Contents.js
View File

@@ -1,10 +1,10 @@
// @flow
import * as React from 'react';
import { darken } from 'polished';
import breakpoint from 'styled-components-breakpoint';
import useWindowScrollPosition from '@rehooks/window-scroll-position';
import HelpText from 'components/HelpText';
import styled from 'styled-components';
import * as React from "react";
import { darken } from "polished";
import breakpoint from "styled-components-breakpoint";
import useWindowScrollPosition from "@rehooks/window-scroll-position";
import HelpText from "components/HelpText";
import styled from "styled-components";
const HEADING_OFFSET = 20;
@@ -72,7 +72,7 @@ export default function Contents({ headings }: Props) {
);
}
const Wrapper = styled('div')`
const Wrapper = styled("div")`
display: none;
position: sticky;
top: 80px;
@@ -82,16 +82,16 @@ const Wrapper = styled('div')`
margin-right: 2em;
min-height: 40px;
${breakpoint('desktopLarge')`
${breakpoint("desktopLarge")`
margin-left: -16em;
`};
${breakpoint('tablet')`
${breakpoint("tablet")`
display: block;
`};
`;
const Heading = styled('h3')`
const Heading = styled("h3")`
font-size: 11px;
font-weight: 600;
text-transform: uppercase;
@@ -107,16 +107,16 @@ const Empty = styled(HelpText)`
font-size: 14px;
`;
const ListItem = styled('li')`
const ListItem = styled("li")`
margin-left: ${props => (props.level - 1) * 10}px;
margin-bottom: 8px;
padding-right: 2em;
line-height: 1.3;
border-right: 3px solid
${props => (props.active ? props.theme.textSecondary : 'transparent')};
${props => (props.active ? props.theme.textSecondary : "transparent")};
`;
const Link = styled('a')`
const Link = styled("a")`
color: ${props => props.theme.text};
font-size: 14px;
@@ -125,7 +125,7 @@ const Link = styled('a')`
}
`;
const List = styled('ol')`
const List = styled("ol")`
min-width: 14em;
width: 14em;
padding: 0;

48
app/scenes/Document/components/DataLoader.js
View File

@@ -1,24 +1,24 @@
// @flow
import * as React from 'react';
import invariant from 'invariant';
import { withRouter } from 'react-router-dom';
import type { Location, RouterHistory } from 'react-router-dom';
import { observable } from 'mobx';
import { observer, inject } from 'mobx-react';
import { matchDocumentEdit, updateDocumentUrl } from 'utils/routeHelpers';
import DocumentComponent from './Document';
import Revision from 'models/Revision';
import Document from 'models/Document';
import SocketPresence from './SocketPresence';
import Loading from './Loading';
import HideSidebar from './HideSidebar';
import Error404 from 'scenes/Error404';
import ErrorOffline from 'scenes/ErrorOffline';
import DocumentsStore from 'stores/DocumentsStore';
import PoliciesStore from 'stores/PoliciesStore';
import RevisionsStore from 'stores/RevisionsStore';
import UiStore from 'stores/UiStore';
import { OfflineError } from 'utils/errors';
import * as React from "react";
import invariant from "invariant";
import { withRouter } from "react-router-dom";
import type { Location, RouterHistory } from "react-router-dom";
import { observable } from "mobx";
import { observer, inject } from "mobx-react";
import { matchDocumentEdit, updateDocumentUrl } from "utils/routeHelpers";
import DocumentComponent from "./Document";
import Revision from "models/Revision";
import Document from "models/Document";
import SocketPresence from "./SocketPresence";
import Loading from "./Loading";
import HideSidebar from "./HideSidebar";
import Error404 from "scenes/Error404";
import ErrorOffline from "scenes/ErrorOffline";
import DocumentsStore from "stores/DocumentsStore";
import PoliciesStore from "stores/PoliciesStore";
import RevisionsStore from "stores/RevisionsStore";
import UiStore from "stores/UiStore";
import { OfflineError } from "utils/errors";
type Props = {|
match: Object,
@@ -84,13 +84,13 @@ class DataLoader extends React.Component<Props> {
onCreateLink = async (title: string) => {
const document = this.document;
invariant(document, 'document must be loaded to create link');
invariant(document, "document must be loaded to create link");
const newDocument = await this.props.documents.create({
collectionId: document.collectionId,
parentDocumentId: document.parentDocumentId,
title,
text: '',
text: "",
});
return newDocument.url;
@@ -166,7 +166,7 @@ class DataLoader extends React.Component<Props> {
}
const abilities = policies.abilities(document.id);
const key = this.isEditing ? 'editing' : 'read-only';
const key = this.isEditing ? "editing" : "read-only";
return (
<SocketPresence documentId={document.id} isEditing={this.isEditing}>
@@ -187,5 +187,5 @@ class DataLoader extends React.Component<Props> {
}
export default withRouter(
inject('ui', 'auth', 'documents', 'revisions', 'policies')(DataLoader)
inject("ui", "auth", "documents", "revisions", "policies")(DataLoader)
);

100
app/scenes/Document/components/Document.js
View File

@@ -1,42 +1,42 @@
// @flow
import * as React from 'react';
import { debounce } from 'lodash';
import styled, { withTheme } from 'styled-components';
import breakpoint from 'styled-components-breakpoint';
import { observable } from 'mobx';
import { observer, inject } from 'mobx-react';
import { Prompt, Route, withRouter } from 'react-router-dom';
import type { Location, RouterHistory } from 'react-router-dom';
import keydown from 'react-keydown';
import Flex from 'shared/components/Flex';
import * as React from "react";
import { debounce } from "lodash";
import styled, { withTheme } from "styled-components";
import breakpoint from "styled-components-breakpoint";
import { observable } from "mobx";
import { observer, inject } from "mobx-react";
import { Prompt, Route, withRouter } from "react-router-dom";
import type { Location, RouterHistory } from "react-router-dom";
import keydown from "react-keydown";
import Flex from "shared/components/Flex";
import {
collectionUrl,
documentMoveUrl,
documentHistoryUrl,
documentEditUrl,
documentUrl,
} from 'utils/routeHelpers';
import { emojiToUrl } from 'utils/emoji';
} from "utils/routeHelpers";
import { emojiToUrl } from "utils/emoji";
import Header from './Header';
import DocumentMove from './DocumentMove';
import KeyboardShortcutsButton from './KeyboardShortcutsButton';
import References from './References';
import Loading from './Loading';
import Container from './Container';
import Contents from './Contents';
import MarkAsViewed from './MarkAsViewed';
import ErrorBoundary from 'components/ErrorBoundary';
import LoadingIndicator from 'components/LoadingIndicator';
import PageTitle from 'components/PageTitle';
import Branding from 'shared/components/Branding';
import Notice from 'shared/components/Notice';
import Time from 'shared/components/Time';
import Header from "./Header";
import DocumentMove from "./DocumentMove";
import KeyboardShortcutsButton from "./KeyboardShortcutsButton";
import References from "./References";
import Loading from "./Loading";
import Container from "./Container";
import Contents from "./Contents";
import MarkAsViewed from "./MarkAsViewed";
import ErrorBoundary from "components/ErrorBoundary";
import LoadingIndicator from "components/LoadingIndicator";
import PageTitle from "components/PageTitle";
import Branding from "shared/components/Branding";
import Notice from "shared/components/Notice";
import Time from "shared/components/Time";
import UiStore from 'stores/UiStore';
import AuthStore from 'stores/AuthStore';
import Document from 'models/Document';
import Revision from 'models/Revision';
import UiStore from "stores/UiStore";
import AuthStore from "stores/AuthStore";
import Document from "models/Document";
import Revision from "models/Revision";
let EditorImport;
const AUTOSAVE_DELAY = 3000;
@@ -104,7 +104,7 @@ class DocumentScene extends React.Component<Props> {
{
timeout: 30 * 1000,
action: {
text: 'Reload',
text: "Reload",
onClick: () => {
window.location.href = documentUrl(document);
},
@@ -123,7 +123,7 @@ class DocumentScene extends React.Component<Props> {
window.document.body.style.background = this.props.theme.background;
}
@keydown('m')
@keydown("m")
goToMove(ev) {
if (!this.props.readOnly) return;
@@ -135,7 +135,7 @@ class DocumentScene extends React.Component<Props> {
}
}
@keydown('e')
@keydown("e")
goToEdit(ev) {
if (!this.props.readOnly) return;
@@ -147,7 +147,7 @@ class DocumentScene extends React.Component<Props> {
}
}
@keydown('esc')
@keydown("esc")
goBack(ev) {
if (this.props.readOnly) return;
@@ -155,7 +155,7 @@ class DocumentScene extends React.Component<Props> {
this.props.history.goBack();
}
@keydown('h')
@keydown("h")
goToHistory(ev) {
if (!this.props.readOnly) return;
@@ -169,7 +169,7 @@ class DocumentScene extends React.Component<Props> {
}
}
@keydown('meta+shift+p')
@keydown("meta+shift+p")
onPublish(ev) {
ev.preventDefault();
const { document } = this.props;
@@ -177,7 +177,7 @@ class DocumentScene extends React.Component<Props> {
this.onSave({ publish: true, done: true });
}
@keydown('meta+ctrl+h')
@keydown("meta+ctrl+h")
onToggleTableOfContents(ev) {
if (!this.props.readOnly) return;
@@ -195,7 +195,7 @@ class DocumentScene extends React.Component<Props> {
if (this.editorComponent) return;
try {
const EditorImport = await import('./Editor');
const EditorImport = await import("./Editor");
this.editorComponent = EditorImport.default;
} catch (err) {
console.error(err);
@@ -227,7 +227,7 @@ class DocumentScene extends React.Component<Props> {
const title = this.title;
// prevent save before anything has been written (single hash is empty doc)
if (text.trim() === '' && title.trim === '') return;
if (text.trim() === "" && title.trim === "") return;
// prevent autosave if nothing has changed
if (
@@ -278,7 +278,7 @@ class DocumentScene extends React.Component<Props> {
const bodyChanged = editorText !== document.text.trim();
// a single hash is a doc with just an empty title
this.isEmpty = (!editorText || editorText === '#') && !this.title;
this.isEmpty = (!editorText || editorText === "#") && !this.title;
this.isDirty = bodyChanged || titleChanged;
};
@@ -351,7 +351,7 @@ class DocumentScene extends React.Component<Props> {
)}
/>
<PageTitle
title={document.title.replace(document.emoji, '') || 'Untitled'}
title={document.title.replace(document.emoji, "") || "Untitled"}
favicon={document.emoji ? emojiToUrl(document.emoji) : undefined}
/>
{(this.isUploading || this.isSaving) && <LoadingIndicator />}
@@ -394,18 +394,18 @@ class DocumentScene extends React.Component<Props> {
{document.archivedAt &&
!document.deletedAt && (
<Notice muted>
Archived by {document.updatedBy.name}{' '}
Archived by {document.updatedBy.name}{" "}
<Time dateTime={document.archivedAt} /> ago
</Notice>
)}
{document.deletedAt && (
<Notice muted>
Deleted by {document.updatedBy.name}{' '}
Deleted by {document.updatedBy.name}{" "}
<Time dateTime={document.deletedAt} /> ago
{document.permanentlyDeletedAt && (
<React.Fragment>
<br />
This document will be permanently deleted in{' '}
This document will be permanently deleted in{" "}
<Time dateTime={document.permanentlyDeletedAt} /> unless
restored.
</React.Fragment>
@@ -427,7 +427,7 @@ class DocumentScene extends React.Component<Props> {
}
}}
isDraft={document.isDraft}
key={disableEmbeds ? 'embeds-disabled' : 'embeds-enabled'}
key={disableEmbeds ? "embeds-disabled" : "embeds-enabled"}
title={revision ? revision.title : this.title}
document={document}
value={readOnly ? value : undefined}
@@ -470,7 +470,7 @@ const Background = styled(Container)`
transition: ${props => props.theme.backgroundTransition};
`;
const ReferencesWrapper = styled('div')`
const ReferencesWrapper = styled("div")`
margin-top: ${props => (props.isOnlyTitle ? -45 : 16)}px;
@media print {
@@ -485,17 +485,17 @@ const MaxWidth = styled(Flex)`
max-width: 100vw;
width: 100%;
${breakpoint('tablet')`
${breakpoint("tablet")`
padding: 0 24px;
margin: 4px auto 12px;
max-width: calc(48px + ${props => (props.tocVisible ? '64em' : '46em')});
max-width: calc(48px + ${props => (props.tocVisible ? "64em" : "46em")});
`};
${breakpoint('desktopLarge')`
${breakpoint("desktopLarge")`
max-width: calc(48px + 46em);
`};
`;
export default withRouter(
inject('ui', 'auth', 'policies', 'revisions')(withTheme(DocumentScene))
inject("ui", "auth", "policies", "revisions")(withTheme(DocumentScene))
);

18
app/scenes/Document/components/DocumentMeta.js
View File

@@ -1,10 +1,10 @@
// @flow
import * as React from 'react';
import styled from 'styled-components';
import { inject } from 'mobx-react';
import ViewsStore from 'stores/ViewsStore';
import Document from 'models/Document';
import PublishingInfo from 'components/PublishingInfo';
import * as React from "react";
import styled from "styled-components";
import { inject } from "mobx-react";
import ViewsStore from "stores/ViewsStore";
import Document from "models/Document";
import PublishingInfo from "components/PublishingInfo";
type Props = {|
views: ViewsStore,
@@ -19,8 +19,8 @@ function DocumentMeta({ views, isDraft, document }: Props) {
<Meta document={document}>
{totalViews && !isDraft ? (
<React.Fragment>
&nbsp;&middot; Viewed{' '}
{totalViews === 1 ? 'once' : `${totalViews} times`}
&nbsp;&middot; Viewed{" "}
{totalViews === 1 ? "once" : `${totalViews} times`}
</React.Fragment>
) : null}
</Meta>
@@ -36,4 +36,4 @@ const Meta = styled(PublishingInfo)`
}
`;
export default inject('views')(DocumentMeta);
export default inject("views")(DocumentMeta);

42
app/scenes/Document/components/DocumentMove.js
View File

@@ -1,23 +1,23 @@
// @flow
import * as React from 'react';
import ReactDOM from 'react-dom';
import { observable, computed } from 'mobx';
import { observer, inject } from 'mobx-react';
import { Search } from 'js-search';
import { last } from 'lodash';
import ArrowKeyNavigation from 'boundless-arrow-key-navigation';
import styled from 'styled-components';
import * as React from "react";
import ReactDOM from "react-dom";
import { observable, computed } from "mobx";
import { observer, inject } from "mobx-react";
import { Search } from "js-search";
import { last } from "lodash";
import ArrowKeyNavigation from "boundless-arrow-key-navigation";
import styled from "styled-components";
import Modal from 'components/Modal';
import Input from 'components/Input';
import Labeled from 'components/Labeled';
import PathToDocument from 'components/PathToDocument';
import Flex from 'shared/components/Flex';
import Modal from "components/Modal";
import Input from "components/Input";
import Labeled from "components/Labeled";
import PathToDocument from "components/PathToDocument";
import Flex from "shared/components/Flex";
import Document from 'models/Document';
import DocumentsStore from 'stores/DocumentsStore';
import UiStore from 'stores/UiStore';
import CollectionsStore, { type DocumentPath } from 'stores/CollectionsStore';
import Document from "models/Document";
import DocumentsStore from "stores/DocumentsStore";
import UiStore from "stores/UiStore";
import CollectionsStore, { type DocumentPath } from "stores/CollectionsStore";
const MAX_RESULTS = 8;
@@ -39,8 +39,8 @@ class DocumentMove extends React.Component<Props> {
get searchIndex() {
const { collections } = this.props;
const paths = collections.pathsToDocuments;
const index = new Search('id');
index.addIndex('title');
const index = new Search("id");
index.addIndex("title");
// Build index
const indexeableDocuments = [];
@@ -90,7 +90,7 @@ class DocumentMove extends React.Component<Props> {
};
handleSuccess = () => {
this.props.ui.showToast('Document moved');
this.props.ui.showToast("Document moved");
this.props.onRequestClose();
};
@@ -180,4 +180,4 @@ const StyledArrowKeyNavigation = styled(ArrowKeyNavigation)`
flex: 1;
`;
export default inject('documents', 'collections', 'ui')(DocumentMove);
export default inject("documents", "collections", "ui")(DocumentMove);

26
app/scenes/Document/components/Editor.js
View File

@@ -1,14 +1,14 @@
// @flow
import * as React from 'react';
import styled from 'styled-components';
import Textarea from 'react-autosize-textarea';
import { observer } from 'mobx-react';
import Editor from 'components/Editor';
import ClickablePadding from 'components/ClickablePadding';
import Flex from 'shared/components/Flex';
import parseTitle from 'shared/utils/parseTitle';
import Document from 'models/Document';
import DocumentMeta from './DocumentMeta';
import * as React from "react";
import styled from "styled-components";
import Textarea from "react-autosize-textarea";
import { observer } from "mobx-react";
import Editor from "components/Editor";
import ClickablePadding from "components/ClickablePadding";
import Flex from "shared/components/Flex";
import parseTitle from "shared/utils/parseTitle";
import Document from "models/Document";
import DocumentMeta from "./DocumentMeta";
type Props = {
onChangeTitle: (event: SyntheticInputEvent<>) => void,
@@ -44,7 +44,7 @@ class DocumentEditor extends React.Component<Props> {
};
handleTitleKeyDown = (event: SyntheticKeyboardEvent<>) => {
if (event.key === 'Enter' || event.key === 'Tab') {
if (event.key === "Enter" || event.key === "Tab") {
event.preventDefault();
this.focusAtStart();
}
@@ -62,8 +62,8 @@ class DocumentEditor extends React.Component<Props> {
onChange={onChangeTitle}
onKeyDown={this.handleTitleKeyDown}
placeholder="Start with a title…"
value={!title && readOnly ? 'Untitled' : title}
style={startsWithEmojiAndSpace ? { marginLeft: '-1.2em' } : undefined}
value={!title && readOnly ? "Untitled" : title}
style={startsWithEmojiAndSpace ? { marginLeft: "-1.2em" } : undefined}
readOnly={readOnly}
autoFocus={!title}
maxLength={100}

80
app/scenes/Document/components/Header.js
View File

@@ -1,32 +1,32 @@
// @flow
import * as React from 'react';
import { throttle } from 'lodash';
import { observable } from 'mobx';
import { observer, inject } from 'mobx-react';
import { Redirect } from 'react-router-dom';
import styled from 'styled-components';
import breakpoint from 'styled-components-breakpoint';
import { TableOfContentsIcon, EditIcon, PlusIcon } from 'outline-icons';
import { transparentize, darken } from 'polished';
import Document from 'models/Document';
import AuthStore from 'stores/AuthStore';
import { documentEditUrl } from 'utils/routeHelpers';
import { meta } from 'utils/keyboard';
import * as React from "react";
import { throttle } from "lodash";
import { observable } from "mobx";
import { observer, inject } from "mobx-react";
import { Redirect } from "react-router-dom";
import styled from "styled-components";
import breakpoint from "styled-components-breakpoint";
import { TableOfContentsIcon, EditIcon, PlusIcon } from "outline-icons";
import { transparentize, darken } from "polished";
import Document from "models/Document";
import AuthStore from "stores/AuthStore";
import { documentEditUrl } from "utils/routeHelpers";
import { meta } from "utils/keyboard";
import Flex from 'shared/components/Flex';
import Breadcrumb, { Slash } from 'shared/components/Breadcrumb';
import DocumentMenu from 'menus/DocumentMenu';
import NewChildDocumentMenu from 'menus/NewChildDocumentMenu';
import DocumentShare from 'scenes/DocumentShare';
import Button from 'components/Button';
import Tooltip from 'components/Tooltip';
import Modal from 'components/Modal';
import Fade from 'components/Fade';
import Badge from 'components/Badge';
import Collaborators from 'components/Collaborators';
import { Action, Separator } from 'components/Actions';
import PoliciesStore from 'stores/PoliciesStore';
import UiStore from 'stores/UiStore';
import Flex from "shared/components/Flex";
import Breadcrumb, { Slash } from "shared/components/Breadcrumb";
import DocumentMenu from "menus/DocumentMenu";
import NewChildDocumentMenu from "menus/NewChildDocumentMenu";
import DocumentShare from "scenes/DocumentShare";
import Button from "components/Button";
import Tooltip from "components/Tooltip";
import Modal from "components/Modal";
import Fade from "components/Fade";
import Badge from "components/Badge";
import Collaborators from "components/Collaborators";
import { Action, Separator } from "components/Actions";
import PoliciesStore from "stores/PoliciesStore";
import UiStore from "stores/UiStore";
type Props = {
auth: AuthStore,
@@ -55,11 +55,11 @@ class Header extends React.Component<Props> {
@observable redirectTo: ?string;
componentDidMount() {
window.addEventListener('scroll', this.handleScroll);
window.addEventListener("scroll", this.handleScroll);
}
componentWillUnmount() {
window.removeEventListener('scroll', this.handleScroll);
window.removeEventListener("scroll", this.handleScroll);
}
updateIsScrolled = () => {
@@ -95,7 +95,7 @@ class Header extends React.Component<Props> {
handleClickTitle = () => {
window.scrollTo({
top: 0,
behavior: 'smooth',
behavior: "smooth",
});
};
@@ -145,7 +145,7 @@ class Header extends React.Component<Props> {
<React.Fragment>
<Slash />
<Tooltip
tooltip={ui.tocVisible ? 'Hide contents' : 'Show contents'}
tooltip={ui.tocVisible ? "Hide contents" : "Show contents"}
shortcut={`ctrl+${meta}+h`}
delay={250}
placement="bottom"
@@ -215,7 +215,7 @@ class Header extends React.Component<Props> {
neutral={isDraft}
small
>
{isDraft ? 'Save Draft' : 'Done Editing'}
{isDraft ? "Save Draft" : "Done Editing"}
</Button>
</Tooltip>
</Action>
@@ -237,7 +237,7 @@ class Header extends React.Component<Props> {
disabled={publishingIsDisabled}
small
>
{isPublishing ? 'Publishing…' : 'Publish'}
{isPublishing ? "Publishing…" : "Publish"}
</Button>
</Tooltip>
</Action>
@@ -307,7 +307,7 @@ const Status = styled.div`
const BreadcrumbAndContents = styled(Flex)`
display: none;
${breakpoint('tablet')`
${breakpoint("tablet")`
display: flex;
width: 33.3%;
`};
@@ -318,7 +318,7 @@ const Wrapper = styled(Flex)`
align-self: flex-end;
height: 32px;
${breakpoint('tablet')`
${breakpoint("tablet")`
width: 33.3%;
`};
`;
@@ -334,7 +334,7 @@ const Actions = styled(Flex)`
${props =>
props.isCompact
? darken(0.05, props.theme.sidebarBackground)
: 'transparent'};
: "transparent"};
padding: 12px;
transition: all 100ms ease-out;
transform: translate3d(0, 0, 0);
@@ -344,8 +344,8 @@ const Actions = styled(Flex)`
display: none;
}
${breakpoint('tablet')`
padding: ${props => (props.isCompact ? '12px' : `24px 24px 0`)};
${breakpoint("tablet")`
padding: ${props => (props.isCompact ? "12px" : `24px 24px 0`)};
`};
`;
@@ -361,10 +361,10 @@ const Title = styled.div`
display: none;
width: 0;
${breakpoint('tablet')`
${breakpoint("tablet")`
display: flex;
flex-grow: 1;
`};
`;
export default inject('auth', 'ui', 'policies')(Header);
export default inject("auth", "ui", "policies")(Header);

4
app/scenes/Document/components/HideSidebar.js
View File

@@ -1,6 +1,6 @@
// @flow
import * as React from 'react';
import UiStore from 'stores/UiStore';
import * as React from "react";
import UiStore from "stores/UiStore";
type Props = {
ui: UiStore,

22
app/scenes/Document/components/KeyboardShortcutsButton.js
View File

@@ -1,14 +1,14 @@
// @flow
import * as React from 'react';
import styled from 'styled-components';
import breakpoint from 'styled-components-breakpoint';
import { observable } from 'mobx';
import { observer } from 'mobx-react';
import { KeyboardIcon } from 'outline-icons';
import Modal from 'components/Modal';
import Tooltip from 'components/Tooltip';
import NudeButton from 'components/NudeButton';
import KeyboardShortcuts from 'scenes/KeyboardShortcuts';
import * as React from "react";
import styled from "styled-components";
import breakpoint from "styled-components-breakpoint";
import { observable } from "mobx";
import { observer } from "mobx-react";
import { KeyboardIcon } from "outline-icons";
import Modal from "components/Modal";
import Tooltip from "components/Tooltip";
import NudeButton from "components/NudeButton";
import KeyboardShortcuts from "scenes/KeyboardShortcuts";
type Props = {};
@@ -56,7 +56,7 @@ const Button = styled(NudeButton)`
right: 0;
margin: 24px;
${breakpoint('tablet')`
${breakpoint("tablet")`
display: block;
`};

14
app/scenes/Document/components/Loading.js
View File

@@ -1,10 +1,10 @@
// @flow
import * as React from 'react';
import type { Location } from 'react-router-dom';
import Container from './Container';
import LoadingPlaceholder from 'components/LoadingPlaceholder';
import CenteredContent from 'components/CenteredContent';
import PageTitle from 'components/PageTitle';
import * as React from "react";
import type { Location } from "react-router-dom";
import Container from "./Container";
import LoadingPlaceholder from "components/LoadingPlaceholder";
import CenteredContent from "components/CenteredContent";
import PageTitle from "components/PageTitle";
type Props = {|
location: Location,
@@ -13,7 +13,7 @@ type Props = {|
export default function Loading({ location }: Props) {
return (
<Container column auto>
<PageTitle title={location.state ? location.state.title : 'Untitled'} />
<PageTitle title={location.state ? location.state.title : "Untitled"} />
<CenteredContent>
<LoadingPlaceholder />
</CenteredContent>

4
app/scenes/Document/components/MarkAsViewed.js
View File

@@ -1,6 +1,6 @@
// @flow
import * as React from 'react';
import Document from 'models/Document';
import * as React from "react";
import Document from "models/Document";
const MARK_AS_VIEWED_AFTER = 3 * 1000;

18
app/scenes/Document/components/ReferenceListItem.js
View File

@@ -1,11 +1,11 @@
// @flow
import * as React from 'react';
import { observer } from 'mobx-react';
import { Link } from 'react-router-dom';
import styled from 'styled-components';
import PublishingInfo from 'components/PublishingInfo';
import Document from 'models/Document';
import type { NavigationNode } from 'types';
import * as React from "react";
import { observer } from "mobx-react";
import { Link } from "react-router-dom";
import styled from "styled-components";
import PublishingInfo from "components/PublishingInfo";
import Document from "models/Document";
import type { NavigationNode } from "types";
type Props = {
document: Document | NavigationNode,
@@ -39,8 +39,8 @@ const Title = styled.h3`
margin-top: 0;
margin-bottom: 0.25em;
white-space: nowrap;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
`;
@observer

24
app/scenes/Document/components/References.js
View File

@@ -1,14 +1,14 @@
// @flow
import * as React from 'react';
import { observer, inject } from 'mobx-react';
import { withRouter, type Location } from 'react-router-dom';
import Fade from 'components/Fade';
import Tabs from 'components/Tabs';
import Tab from 'components/Tab';
import DocumentsStore from 'stores/DocumentsStore';
import CollectionsStore from 'stores/CollectionsStore';
import Document from 'models/Document';
import ReferenceListItem from './ReferenceListItem';
import * as React from "react";
import { observer, inject } from "mobx-react";
import { withRouter, type Location } from "react-router-dom";
import Fade from "components/Fade";
import Tabs from "components/Tabs";
import Tab from "components/Tab";
import DocumentsStore from "stores/DocumentsStore";
import CollectionsStore from "stores/CollectionsStore";
import Document from "models/Document";
import ReferenceListItem from "./ReferenceListItem";
type Props = {
document: Document,
@@ -34,7 +34,7 @@ class References extends React.Component<Props> {
const showBacklinks = !!backlinks.length;
const showChildren = !!children.length;
const isBacklinksTab =
this.props.location.hash === '#backlinks' || !showChildren;
this.props.location.hash === "#backlinks" || !showChildren;
return (
(showBacklinks || showChildren) && (
@@ -80,4 +80,4 @@ class References extends React.Component<Props> {
}
}
export default withRouter(inject('documents', 'collections')(References));
export default withRouter(inject("documents", "collections")(References));

16
app/scenes/Document/components/SocketPresence.js
View File

@@ -1,7 +1,7 @@
// @flow
import * as React from 'react';
import { SocketContext } from 'components/SocketProvider';
import { USER_PRESENCE_INTERVAL } from 'shared/constants';
import * as React from "react";
import { SocketContext } from "components/SocketProvider";
import { USER_PRESENCE_INTERVAL } from "shared/constants";
type Props = {
children?: React.Node,
@@ -33,8 +33,8 @@ export default class SocketPresence extends React.Component<Props> {
componentWillUnmount() {
if (this.context) {
this.context.emit('leave', { documentId: this.props.documentId });
this.context.off('authenticated', this.emitJoin);
this.context.emit("leave", { documentId: this.props.documentId });
this.context.off("authenticated", this.emitJoin);
}
clearInterval(this.editingInterval);
@@ -47,7 +47,7 @@ export default class SocketPresence extends React.Component<Props> {
if (this.context.authenticated) {
this.emitJoin();
}
this.context.on('authenticated', () => {
this.context.on("authenticated", () => {
this.emitJoin();
});
}
@@ -56,7 +56,7 @@ export default class SocketPresence extends React.Component<Props> {
emitJoin = () => {
if (!this.context) return;
this.context.emit('join', {
this.context.emit("join", {
documentId: this.props.documentId,
isEditing: this.props.isEditing,
});
@@ -65,7 +65,7 @@ export default class SocketPresence extends React.Component<Props> {
emitPresence = () => {
if (!this.context) return;
this.context.emit('presence', {
this.context.emit("presence", {
documentId: this.props.documentId,
isEditing: this.props.isEditing,
});

2
app/scenes/Document/index.js
View File

@@ -1,3 +1,3 @@
// @flow
import DataLoader from './components/DataLoader';
import DataLoader from "./components/DataLoader";
export default DataLoader;

28
app/scenes/DocumentDelete.js
View File

@@ -1,15 +1,15 @@
// @flow
import * as React from 'react';
import { withRouter, type RouterHistory } from 'react-router-dom';
import { observable } from 'mobx';
import { inject, observer } from 'mobx-react';
import Button from 'components/Button';
import Flex from 'shared/components/Flex';
import HelpText from 'components/HelpText';
import Document from 'models/Document';
import DocumentsStore from 'stores/DocumentsStore';
import UiStore from 'stores/UiStore';
import { collectionUrl } from 'utils/routeHelpers';
import * as React from "react";
import { withRouter, type RouterHistory } from "react-router-dom";
import { observable } from "mobx";
import { inject, observer } from "mobx-react";
import Button from "components/Button";
import Flex from "shared/components/Flex";
import HelpText from "components/HelpText";
import Document from "models/Document";
import DocumentsStore from "stores/DocumentsStore";
import UiStore from "stores/UiStore";
import { collectionUrl } from "utils/routeHelpers";
type Props = {
history: RouterHistory,
@@ -49,7 +49,7 @@ class DocumentDelete extends React.Component<Props> {
<Flex column>
<form onSubmit={this.handleSubmit}>
<HelpText>
Are you sure about that? Deleting the{' '}
Are you sure about that? Deleting the{" "}
<strong>{document.title}</strong> document will delete all of its
history, and any nested documents.
</HelpText>
@@ -61,7 +61,7 @@ class DocumentDelete extends React.Component<Props> {
</HelpText>
)}
<Button type="submit" danger>
{this.isDeleting ? 'Deleting…' : 'I’m sure – Delete'}
{this.isDeleting ? "Deleting…" : "I’m sure – Delete"}
</Button>
</form>
</Flex>
@@ -69,4 +69,4 @@ class DocumentDelete extends React.Component<Props> {
}
}
export default inject('documents', 'ui')(withRouter(DocumentDelete));
export default inject("documents", "ui")(withRouter(DocumentDelete));

28
app/scenes/DocumentNew.js
View File

@@ -1,13 +1,13 @@
// @flow
import * as React from 'react';
import { inject } from 'mobx-react';
import type { RouterHistory, Location } from 'react-router-dom';
import Flex from 'shared/components/Flex';
import CenteredContent from 'components/CenteredContent';
import LoadingPlaceholder from 'components/LoadingPlaceholder';
import DocumentsStore from 'stores/DocumentsStore';
import UiStore from 'stores/UiStore';
import { documentEditUrl } from 'utils/routeHelpers';
import * as React from "react";
import { inject } from "mobx-react";
import type { RouterHistory, Location } from "react-router-dom";
import Flex from "shared/components/Flex";
import CenteredContent from "components/CenteredContent";
import LoadingPlaceholder from "components/LoadingPlaceholder";
import DocumentsStore from "stores/DocumentsStore";
import UiStore from "stores/UiStore";
import { documentEditUrl } from "utils/routeHelpers";
type Props = {
history: RouterHistory,
@@ -23,14 +23,14 @@ class DocumentNew extends React.Component<Props> {
const document = await this.props.documents.create({
collectionId: this.props.match.params.id,
parentDocumentId: new URLSearchParams(this.props.location.search).get(
'parentDocumentId'
"parentDocumentId"
),
title: '',
text: '',
title: "",
text: "",
});
this.props.history.replace(documentEditUrl(document));
} catch (err) {
this.props.ui.showToast('Couldn’t create the document, try again?');
this.props.ui.showToast("Couldn’t create the document, try again?");
this.props.history.goBack();
}
}
@@ -46,4 +46,4 @@ class DocumentNew extends React.Component<Props> {
}
}
export default inject('documents', 'ui')(DocumentNew);
export default inject("documents", "ui")(DocumentNew);

26
app/scenes/DocumentShare.js
View File

@@ -1,13 +1,13 @@
// @flow
import * as React from 'react';
import { observable } from 'mobx';
import { observer } from 'mobx-react';
import { Link } from 'react-router-dom';
import Input from 'components/Input';
import Button from 'components/Button';
import CopyToClipboard from 'components/CopyToClipboard';
import HelpText from 'components/HelpText';
import Document from 'models/Document';
import * as React from "react";
import { observable } from "mobx";
import { observer } from "mobx-react";
import { Link } from "react-router-dom";
import Input from "components/Input";
import Button from "components/Button";
import CopyToClipboard from "components/CopyToClipboard";
import HelpText from "components/HelpText";
import Document from "models/Document";
type Props = {
document: Document,
@@ -40,7 +40,7 @@ class DocumentShare extends React.Component<Props> {
<HelpText>
The link below allows anyone in the world to access a read-only
version of the document <strong>{document.title}</strong>. You can
revoke this link in settings at any time.{' '}
revoke this link in settings at any time.{" "}
<Link to="/settings/shares" onClick={onSubmit}>
Manage share links
</Link>.
@@ -48,15 +48,15 @@ class DocumentShare extends React.Component<Props> {
<Input
type="text"
label="Share link"
value={document.shareUrl || 'Loading…'}
value={document.shareUrl || "Loading…"}
readOnly
/>
<CopyToClipboard
text={document.shareUrl || ''}
text={document.shareUrl || ""}
onCopy={this.handleCopied}
>
<Button type="submit" disabled={this.isCopied} primary>
{this.isCopied ? 'Copied!' : 'Copy Link'}
{this.isCopied ? "Copied!" : "Copy Link"}
</Button>
</CopyToClipboard>
</div>

26
app/scenes/Drafts.js
View File

@@ -1,17 +1,17 @@
// @flow
import * as React from 'react';
import { observer, inject } from 'mobx-react';
import * as React from "react";
import { observer, inject } from "mobx-react";
import Heading from 'components/Heading';
import CenteredContent from 'components/CenteredContent';
import Empty from 'components/Empty';
import PageTitle from 'components/PageTitle';
import PaginatedDocumentList from 'components/PaginatedDocumentList';
import Subheading from 'components/Subheading';
import InputSearch from 'components/InputSearch';
import NewDocumentMenu from 'menus/NewDocumentMenu';
import Actions, { Action } from 'components/Actions';
import DocumentsStore from 'stores/DocumentsStore';
import Heading from "components/Heading";
import CenteredContent from "components/CenteredContent";
import Empty from "components/Empty";
import PageTitle from "components/PageTitle";
import PaginatedDocumentList from "components/PaginatedDocumentList";
import Subheading from "components/Subheading";
import InputSearch from "components/InputSearch";
import NewDocumentMenu from "menus/NewDocumentMenu";
import Actions, { Action } from "components/Actions";
import DocumentsStore from "stores/DocumentsStore";
type Props = {
documents: DocumentsStore,
@@ -48,4 +48,4 @@ class Drafts extends React.Component<Props> {
}
}
export default inject('documents')(Drafts);
export default inject("documents")(Drafts);

8
app/scenes/Error404.js
View File

@@ -1,8 +1,8 @@
// @flow
import * as React from 'react';
import CenteredContent from 'components/CenteredContent';
import PageTitle from 'components/PageTitle';
import Empty from 'components/Empty';
import * as React from "react";
import CenteredContent from "components/CenteredContent";
import PageTitle from "components/PageTitle";
import Empty from "components/Empty";
const Error404 = () => {
return (

8
app/scenes/ErrorOffline.js
View File

@@ -1,8 +1,8 @@
// @flow
import * as React from 'react';
import CenteredContent from 'components/CenteredContent';
import PageTitle from 'components/PageTitle';
import Empty from 'components/Empty';
import * as React from "react";
import CenteredContent from "components/CenteredContent";
import PageTitle from "components/PageTitle";
import Empty from "components/Empty";
const ErrorOffline = () => {
return (

14
app/scenes/ErrorSuspended.js
View File

@@ -1,10 +1,10 @@
// @flow
import * as React from 'react';
import { inject, observer } from 'mobx-react';
import * as React from "react";
import { inject, observer } from "mobx-react";
import CenteredContent from 'components/CenteredContent';
import PageTitle from 'components/PageTitle';
import AuthStore from 'stores/AuthStore';
import CenteredContent from "components/CenteredContent";
import PageTitle from "components/PageTitle";
import AuthStore from "stores/AuthStore";
const ErrorSuspended = observer(({ auth }: { auth: AuthStore }) => {
return (
@@ -13,7 +13,7 @@ const ErrorSuspended = observer(({ auth }: { auth: AuthStore }) => {
<h1>
<span role="img" aria-label="Warning sign">
⚠️
</span>{' '}
</span>{" "}
Your account has been suspended
</h1>
@@ -26,4 +26,4 @@ const ErrorSuspended = observer(({ auth }: { auth: AuthStore }) => {
);
});
export default inject('auth')(ErrorSuspended);
export default inject("auth")(ErrorSuspended);

26
app/scenes/GroupDelete.js
View File

@@ -1,14 +1,14 @@
// @flow
import * as React from 'react';
import { withRouter, type RouterHistory } from 'react-router-dom';
import { observable } from 'mobx';
import { inject, observer } from 'mobx-react';
import { groupSettings } from 'shared/utils/routeHelpers';
import Button from 'components/Button';
import Flex from 'shared/components/Flex';
import HelpText from 'components/HelpText';
import Group from 'models/Group';
import UiStore from 'stores/UiStore';
import * as React from "react";
import { withRouter, type RouterHistory } from "react-router-dom";
import { observable } from "mobx";
import { inject, observer } from "mobx-react";
import { groupSettings } from "shared/utils/routeHelpers";
import Button from "components/Button";
import Flex from "shared/components/Flex";
import HelpText from "components/HelpText";
import Group from "models/Group";
import UiStore from "stores/UiStore";
type Props = {
history: RouterHistory,
@@ -43,12 +43,12 @@ class GroupDelete extends React.Component<Props> {
<Flex column>
<form onSubmit={this.handleSubmit}>
<HelpText>
Are you sure about that? Deleting the <strong>{group.name}</strong>{' '}
Are you sure about that? Deleting the <strong>{group.name}</strong>{" "}
group will cause its members to lose access to collections and
documents that it is associated with.
</HelpText>
<Button type="submit" danger>
{this.isDeleting ? 'Deleting…' : 'I’m sure – Delete'}
{this.isDeleting ? "Deleting…" : "I’m sure – Delete"}
</Button>
</form>
</Flex>
@@ -56,4 +56,4 @@ class GroupDelete extends React.Component<Props> {
}
}
export default inject('ui')(withRouter(GroupDelete));
export default inject("ui")(withRouter(GroupDelete));

24
app/scenes/GroupEdit.js
View File

@@ -1,15 +1,15 @@
// @flow
import * as React from 'react';
import { withRouter, type RouterHistory } from 'react-router-dom';
import { observable } from 'mobx';
import { inject, observer } from 'mobx-react';
import Button from 'components/Button';
import Input from 'components/Input';
import HelpText from 'components/HelpText';
import Flex from 'shared/components/Flex';
import * as React from "react";
import { withRouter, type RouterHistory } from "react-router-dom";
import { observable } from "mobx";
import { inject, observer } from "mobx-react";
import Button from "components/Button";
import Input from "components/Input";
import HelpText from "components/HelpText";
import Flex from "shared/components/Flex";
import Group from 'models/Group';
import UiStore from 'stores/UiStore';
import Group from "models/Group";
import UiStore from "stores/UiStore";
type Props = {
history: RouterHistory,
@@ -61,11 +61,11 @@ class GroupEdit extends React.Component<Props> {
</Flex>
<Button type="submit" disabled={this.isSaving || !this.name}>
{this.isSaving ? 'Saving…' : 'Save'}
{this.isSaving ? "Saving…" : "Save"}
</Button>
</form>
);
}
}
export default inject('ui')(withRouter(GroupEdit));
export default inject("ui")(withRouter(GroupEdit));

42
app/scenes/GroupMembers/AddPeopleToGroup.js
View File

@@ -1,21 +1,21 @@
// @flow
import * as React from 'react';
import { inject, observer } from 'mobx-react';
import { observable } from 'mobx';
import { debounce } from 'lodash';
import Flex from 'shared/components/Flex';
import HelpText from 'components/HelpText';
import Input from 'components/Input';
import Modal from 'components/Modal';
import Empty from 'components/Empty';
import PaginatedList from 'components/PaginatedList';
import Invite from 'scenes/Invite';
import Group from 'models/Group';
import UiStore from 'stores/UiStore';
import AuthStore from 'stores/AuthStore';
import UsersStore from 'stores/UsersStore';
import GroupMembershipsStore from 'stores/GroupMembershipsStore';
import GroupMemberListItem from './components/GroupMemberListItem';
import * as React from "react";
import { inject, observer } from "mobx-react";
import { observable } from "mobx";
import { debounce } from "lodash";
import Flex from "shared/components/Flex";
import HelpText from "components/HelpText";
import Input from "components/Input";
import Modal from "components/Modal";
import Empty from "components/Empty";
import PaginatedList from "components/PaginatedList";
import Invite from "scenes/Invite";
import Group from "models/Group";
import UiStore from "stores/UiStore";
import AuthStore from "stores/AuthStore";
import UsersStore from "stores/UsersStore";
import GroupMembershipsStore from "stores/GroupMembershipsStore";
import GroupMemberListItem from "./components/GroupMemberListItem";
type Props = {
ui: UiStore,
@@ -29,7 +29,7 @@ type Props = {
@observer
class AddPeopleToGroup extends React.Component<Props> {
@observable inviteModalOpen: boolean = false;
@observable query: string = '';
@observable query: string = "";
handleInviteModalOpen = () => {
this.inviteModalOpen = true;
@@ -58,7 +58,7 @@ class AddPeopleToGroup extends React.Component<Props> {
});
this.props.ui.showToast(`${user.name} was added to the group`);
} catch (err) {
this.props.ui.showToast('Could not add user');
this.props.ui.showToast("Could not add user");
}
};
@@ -71,7 +71,7 @@ class AddPeopleToGroup extends React.Component<Props> {
<Flex column>
<HelpText>
Add team members below to give them access to the group. Need to add
someone who’s not yet on the team yet?{' '}
someone who’s not yet on the team yet?{" "}
<a role="button" onClick={this.handleInviteModalOpen}>
Invite them to {team.name}
</a>.
@@ -118,6 +118,6 @@ class AddPeopleToGroup extends React.Component<Props> {
}
}
export default inject('auth', 'users', 'groupMemberships', 'ui')(
export default inject("auth", "users", "groupMemberships", "ui")(
AddPeopleToGroup
);

44
app/scenes/GroupMembers/GroupMembers.js
View File

@@ -1,23 +1,23 @@
// @flow
import * as React from 'react';
import { observable } from 'mobx';
import { inject, observer } from 'mobx-react';
import { PlusIcon } from 'outline-icons';
import Flex from 'shared/components/Flex';
import Empty from 'components/Empty';
import HelpText from 'components/HelpText';
import Subheading from 'components/Subheading';
import Button from 'components/Button';
import PaginatedList from 'components/PaginatedList';
import Modal from 'components/Modal';
import Group from 'models/Group';
import UiStore from 'stores/UiStore';
import AuthStore from 'stores/AuthStore';
import GroupMembershipsStore from 'stores/GroupMembershipsStore';
import UsersStore from 'stores/UsersStore';
import PoliciesStore from 'stores/PoliciesStore';
import GroupMemberListItem from './components/GroupMemberListItem';
import AddPeopleToGroup from './AddPeopleToGroup';
import * as React from "react";
import { observable } from "mobx";
import { inject, observer } from "mobx-react";
import { PlusIcon } from "outline-icons";
import Flex from "shared/components/Flex";
import Empty from "components/Empty";
import HelpText from "components/HelpText";
import Subheading from "components/Subheading";
import Button from "components/Button";
import PaginatedList from "components/PaginatedList";
import Modal from "components/Modal";
import Group from "models/Group";
import UiStore from "stores/UiStore";
import AuthStore from "stores/AuthStore";
import GroupMembershipsStore from "stores/GroupMembershipsStore";
import UsersStore from "stores/UsersStore";
import PoliciesStore from "stores/PoliciesStore";
import GroupMemberListItem from "./components/GroupMemberListItem";
import AddPeopleToGroup from "./AddPeopleToGroup";
type Props = {
ui: UiStore,
@@ -48,7 +48,7 @@ class GroupMembers extends React.Component<Props> {
});
this.props.ui.showToast(`${user.name} was removed from the group`);
} catch (err) {
this.props.ui.showToast('Could not remove user');
this.props.ui.showToast("Could not remove user");
}
};
@@ -64,7 +64,7 @@ class GroupMembers extends React.Component<Props> {
{can.update ? (
<React.Fragment>
<HelpText>
Add and remove team members in the <strong>{group.name}</strong>{' '}
Add and remove team members in the <strong>{group.name}</strong>{" "}
group. Adding people to the group will give them access to any
collections this group has been given access to.
</HelpText>
@@ -119,6 +119,6 @@ class GroupMembers extends React.Component<Props> {
}
}
export default inject('auth', 'users', 'policies', 'groupMemberships', 'ui')(
export default inject("auth", "users", "policies", "groupMemberships", "ui")(
GroupMembers
);

22
app/scenes/GroupMembers/components/GroupMemberListItem.js
View File

@@ -1,14 +1,14 @@
// @flow
import * as React from 'react';
import Avatar from 'components/Avatar';
import Flex from 'shared/components/Flex';
import Time from 'shared/components/Time';
import Badge from 'components/Badge';
import Button from 'components/Button';
import ListItem from 'components/List/Item';
import User from 'models/User';
import GroupMembership from 'models/GroupMembership';
import { DropdownMenu, DropdownMenuItem } from 'components/DropdownMenu';
import * as React from "react";
import Avatar from "components/Avatar";
import Flex from "shared/components/Flex";
import Time from "shared/components/Time";
import Badge from "components/Badge";
import Button from "components/Button";
import ListItem from "components/List/Item";
import User from "models/User";
import GroupMembership from "models/GroupMembership";
import { DropdownMenu, DropdownMenuItem } from "components/DropdownMenu";
type Props = {
user: User,
@@ -33,7 +33,7 @@ const GroupMemberListItem = ({
Active <Time dateTime={user.lastActiveAt} /> ago
</React.Fragment>
) : (
'Never signed in'
"Never signed in"
)}
{!user.lastActiveAt && <Badge>Invited</Badge>}
{user.isAdmin && <Badge admin={user.isAdmin}>Admin</Badge>}

18
app/scenes/GroupMembers/components/UserListItem.js
View File

@@ -1,12 +1,12 @@
// @flow
import * as React from 'react';
import { PlusIcon } from 'outline-icons';
import Time from 'shared/components/Time';
import Avatar from 'components/Avatar';
import Button from 'components/Button';
import Badge from 'components/Badge';
import ListItem from 'components/List/Item';
import User from 'models/User';
import * as React from "react";
import { PlusIcon } from "outline-icons";
import Time from "shared/components/Time";
import Avatar from "components/Avatar";
import Button from "components/Button";
import Badge from "components/Badge";
import ListItem from "components/List/Item";
import User from "models/User";
type Props = {
user: User,
@@ -26,7 +26,7 @@ const UserListItem = ({ user, onAdd, canEdit }: Props) => {
Active <Time dateTime={user.lastActiveAt} /> ago
</React.Fragment>
) : (
'Never signed in'
"Never signed in"
)}
{!user.lastActiveAt && <Badge>Invited</Badge>}
{user.isAdmin && <Badge admin={user.isAdmin}>Admin</Badge>}

2
app/scenes/GroupMembers/index.js
View File

@@ -1,3 +1,3 @@
// @flow
import GroupMembers from './GroupMembers';
import GroupMembers from "./GroupMembers";
export default GroupMembers;

32
app/scenes/GroupNew.js
View File

@@ -1,18 +1,18 @@
// @flow
import * as React from 'react';
import { withRouter, type RouterHistory } from 'react-router-dom';
import { observable } from 'mobx';
import { inject, observer } from 'mobx-react';
import Button from 'components/Button';
import Input from 'components/Input';
import HelpText from 'components/HelpText';
import Modal from 'components/Modal';
import GroupMembers from 'scenes/GroupMembers';
import Flex from 'shared/components/Flex';
import * as React from "react";
import { withRouter, type RouterHistory } from "react-router-dom";
import { observable } from "mobx";
import { inject, observer } from "mobx-react";
import Button from "components/Button";
import Input from "components/Input";
import HelpText from "components/HelpText";
import Modal from "components/Modal";
import GroupMembers from "scenes/GroupMembers";
import Flex from "shared/components/Flex";
import Group from 'models/Group';
import GroupsStore from 'stores/GroupsStore';
import UiStore from 'stores/UiStore';
import Group from "models/Group";
import GroupsStore from "stores/GroupsStore";
import UiStore from "stores/UiStore";
type Props = {
history: RouterHistory,
@@ -23,7 +23,7 @@ type Props = {
@observer
class GroupNew extends React.Component<Props> {
@observable name: string = '';
@observable name: string = "";
@observable isSaving: boolean;
@observable group: Group;
@@ -73,7 +73,7 @@ class GroupNew extends React.Component<Props> {
<HelpText>You’ll be able to add people to the group next.</HelpText>
<Button type="submit" disabled={this.isSaving || !this.name}>
{this.isSaving ? 'Creating…' : 'Continue'}
{this.isSaving ? "Creating…" : "Continue"}
</Button>
</form>
<Modal
@@ -88,4 +88,4 @@ class GroupNew extends React.Component<Props> {
}
}
export default inject('groups', 'ui')(withRouter(GroupNew));
export default inject("groups", "ui")(withRouter(GroupNew));

10
app/scenes/Home.js
View File

@@ -1,8 +1,8 @@
// @flow
import * as React from 'react';
import { observer, inject } from 'mobx-react';
import { Redirect } from 'react-router-dom';
import AuthStore from 'stores/AuthStore';
import * as React from "react";
import { observer, inject } from "mobx-react";
import { Redirect } from "react-router-dom";
import AuthStore from "stores/AuthStore";
type Props = {
auth: AuthStore,
@@ -14,4 +14,4 @@ const Home = observer(({ auth }: Props) => {
return null;
});
export default inject('auth')(Home);
export default inject("auth")(Home);

68
app/scenes/Invite.js
View File

@@ -1,23 +1,23 @@
// @flow
import * as React from 'react';
import { Link, withRouter, type RouterHistory } from 'react-router-dom';
import { observable, action } from 'mobx';
import { inject, observer } from 'mobx-react';
import { CloseIcon } from 'outline-icons';
import styled from 'styled-components';
import Flex from 'shared/components/Flex';
import Button from 'components/Button';
import Input from 'components/Input';
import CopyToClipboard from 'components/CopyToClipboard';
import Checkbox from 'components/Checkbox';
import HelpText from 'components/HelpText';
import Tooltip from 'components/Tooltip';
import NudeButton from 'components/NudeButton';
import * as React from "react";
import { Link, withRouter, type RouterHistory } from "react-router-dom";
import { observable, action } from "mobx";
import { inject, observer } from "mobx-react";
import { CloseIcon } from "outline-icons";
import styled from "styled-components";
import Flex from "shared/components/Flex";
import Button from "components/Button";
import Input from "components/Input";
import CopyToClipboard from "components/CopyToClipboard";
import Checkbox from "components/Checkbox";
import HelpText from "components/HelpText";
import Tooltip from "components/Tooltip";
import NudeButton from "components/NudeButton";
import UiStore from 'stores/UiStore';
import AuthStore from 'stores/AuthStore';
import UsersStore from 'stores/UsersStore';
import PoliciesStore from 'stores/PoliciesStore';
import UiStore from "stores/UiStore";
import AuthStore from "stores/AuthStore";
import UsersStore from "stores/UsersStore";
import PoliciesStore from "stores/PoliciesStore";
const MAX_INVITES = 20;
@@ -42,9 +42,9 @@ class Invite extends React.Component<Props> {
@observable linkCopied: boolean = false;
@observable
invites: InviteRequest[] = [
{ email: '', name: '', guest: false },
{ email: '', name: '', guest: false },
{ email: '', name: '', guest: false },
{ email: "", name: "", guest: false },
{ email: "", name: "", guest: false },
{ email: "", name: "", guest: false },
];
handleSubmit = async (ev: SyntheticEvent<>) => {
@@ -54,7 +54,7 @@ class Invite extends React.Component<Props> {
try {
await this.props.users.invite(this.invites);
this.props.onSubmit();
this.props.ui.showToast('We sent out your invites!');
this.props.ui.showToast("We sent out your invites!");
} catch (err) {
this.props.ui.showToast(err.message);
} finally {
@@ -80,7 +80,7 @@ class Invite extends React.Component<Props> {
);
}
this.invites.push({ email: '', name: '', guest: false });
this.invites.push({ email: "", name: "", guest: false });
};
@action
@@ -91,14 +91,14 @@ class Invite extends React.Component<Props> {
handleCopy = () => {
this.linkCopied = true;
this.props.ui.showToast('A link was copied to your clipboard');
this.props.ui.showToast("A link was copied to your clipboard");
};
render() {
const { team, user } = this.props.auth;
if (!team || !user) return null;
const predictedDomain = user.email.split('@')[1];
const predictedDomain = user.email.split("@")[1];
const can = this.props.policies.abilities(team.id);
return (
@@ -112,10 +112,10 @@ class Invite extends React.Component<Props> {
) : (
<HelpText>
Invite team members to join your knowledge base. They will need to
sign in with {team.signinMethods}.{' '}
sign in with {team.signinMethods}.{" "}
{can.update && (
<React.Fragment>
As an admin you can also{' '}
As an admin you can also{" "}
<Link to="/settings/security">enable guest invites</Link>.
</React.Fragment>
)}
@@ -128,7 +128,7 @@ class Invite extends React.Component<Props> {
<Input type="text" value={team.url} readOnly flex />&nbsp;&nbsp;
<CopyToClipboard text={team.url} onCopy={this.handleCopy}>
<Button type="button" neutral>
{this.linkCopied ? 'Link copied' : 'Copy link'}
{this.linkCopied ? "Link copied" : "Copy link"}
</Button>
</CopyToClipboard>
</Flex>
@@ -165,7 +165,7 @@ class Invite extends React.Component<Props> {
<Tooltip
tooltip={
<span>
Guests can sign in with email and <br />do not require{' '}
Guests can sign in with email and <br />do not require{" "}
{team.signinMethods} accounts
</span>
}
@@ -210,7 +210,7 @@ class Invite extends React.Component<Props> {
data-event-category="invite"
data-event-action="sendInvites"
>
{this.isSaving ? 'Inviting…' : 'Send Invites'}
{this.isSaving ? "Inviting…" : "Send Invites"}
</Button>
</Flex>
<br />
@@ -219,7 +219,7 @@ class Invite extends React.Component<Props> {
}
}
const CopyBlock = styled('div')`
const CopyBlock = styled("div")`
font-size: 14px;
background: ${props => props.theme.secondaryBackground};
padding: 8px 16px 4px;
@@ -232,16 +232,16 @@ const CopyBlock = styled('div')`
}
`;
const Guest = styled('div')`
const Guest = styled("div")`
padding-top: 4px;
margin: 0 4px 16px;
align-self: flex-end;
`;
const Remove = styled('div')`
const Remove = styled("div")`
margin-top: 6px;
position: absolute;
right: -32px;
`;
export default inject('auth', 'users', 'policies', 'ui')(withRouter(Invite));
export default inject("auth", "users", "policies", "ui")(withRouter(Invite));

16
app/scenes/KeyboardShortcuts.js
View File

@@ -1,10 +1,10 @@
// @flow
import * as React from 'react';
import styled from 'styled-components';
import Key from 'components/Key';
import Flex from 'shared/components/Flex';
import HelpText from 'components/HelpText';
import { meta } from 'utils/keyboard';
import * as React from "react";
import styled from "styled-components";
import Key from "components/Key";
import Flex from "shared/components/Flex";
import HelpText from "components/HelpText";
import { meta } from "utils/keyboard";
function KeyboardShortcuts() {
return (
@@ -136,7 +136,7 @@ function KeyboardShortcuts() {
</Keys>
<Label>Horizontal divider</Label>
<Keys>
<Key>{'```'}</Key>
<Key>{"```"}</Key>
</Keys>
<Label>Code block</Label>
@@ -146,7 +146,7 @@ function KeyboardShortcuts() {
<Label>Bold</Label>
<Keys>~~strikethrough~~</Keys>
<Label>Strikethrough</Label>
<Keys>{'`code`'}</Keys>
<Keys>{"`code`"}</Keys>
<Label>Inline code</Label>
<Keys>==highlight==</Keys>
<Label>highlight</Label>

92
app/scenes/Search/Search.js
View File

@@ -1,39 +1,39 @@
// @flow
import * as React from 'react';
import ReactDOM from 'react-dom';
import keydown from 'react-keydown';
import { Waypoint } from 'react-waypoint';
import { withRouter, Link } from 'react-router-dom';
import type { Location, RouterHistory } from 'react-router-dom';
import { PlusIcon } from 'outline-icons';
import { observable, action } from 'mobx';
import { observer, inject } from 'mobx-react';
import { debounce } from 'lodash';
import queryString from 'query-string';
import styled from 'styled-components';
import ArrowKeyNavigation from 'boundless-arrow-key-navigation';
import * as React from "react";
import ReactDOM from "react-dom";
import keydown from "react-keydown";
import { Waypoint } from "react-waypoint";
import { withRouter, Link } from "react-router-dom";
import type { Location, RouterHistory } from "react-router-dom";
import { PlusIcon } from "outline-icons";
import { observable, action } from "mobx";
import { observer, inject } from "mobx-react";
import { debounce } from "lodash";
import queryString from "query-string";
import styled from "styled-components";
import ArrowKeyNavigation from "boundless-arrow-key-navigation";
import { DEFAULT_PAGINATION_LIMIT } from 'stores/BaseStore';
import DocumentsStore from 'stores/DocumentsStore';
import UsersStore from 'stores/UsersStore';
import { newDocumentUrl, searchUrl } from 'utils/routeHelpers';
import { meta } from 'utils/keyboard';
import { DEFAULT_PAGINATION_LIMIT } from "stores/BaseStore";
import DocumentsStore from "stores/DocumentsStore";
import UsersStore from "stores/UsersStore";
import { newDocumentUrl, searchUrl } from "utils/routeHelpers";
import { meta } from "utils/keyboard";
import Flex from 'shared/components/Flex';
import Button from 'components/Button';
import Empty from 'components/Empty';
import Fade from 'components/Fade';
import HelpText from 'components/HelpText';
import CenteredContent from 'components/CenteredContent';
import LoadingIndicator from 'components/LoadingIndicator';
import DocumentPreview from 'components/DocumentPreview';
import NewDocumentMenu from 'menus/NewDocumentMenu';
import PageTitle from 'components/PageTitle';
import SearchField from './components/SearchField';
import StatusFilter from './components/StatusFilter';
import CollectionFilter from './components/CollectionFilter';
import UserFilter from './components/UserFilter';
import DateFilter from './components/DateFilter';
import Flex from "shared/components/Flex";
import Button from "components/Button";
import Empty from "components/Empty";
import Fade from "components/Fade";
import HelpText from "components/HelpText";
import CenteredContent from "components/CenteredContent";
import LoadingIndicator from "components/LoadingIndicator";
import DocumentPreview from "components/DocumentPreview";
import NewDocumentMenu from "menus/NewDocumentMenu";
import PageTitle from "components/PageTitle";
import SearchField from "./components/SearchField";
import StatusFilter from "./components/StatusFilter";
import CollectionFilter from "./components/CollectionFilter";
import UserFilter from "./components/UserFilter";
import DateFilter from "./components/DateFilter";
type Props = {
history: RouterHistory,
@@ -49,7 +49,7 @@ class Search extends React.Component<Props> {
firstDocument: ?DocumentPreview;
@observable
query: string = decodeURIComponent(this.props.match.params.term || '');
query: string = decodeURIComponent(this.props.match.params.term || "");
@observable params: URLSearchParams = new URLSearchParams();
@observable offset: number = 0;
@observable allowLoadMore: boolean = true;
@@ -73,7 +73,7 @@ class Search extends React.Component<Props> {
}
}
@keydown('esc')
@keydown("esc")
goBack() {
this.props.history.goBack();
}
@@ -107,8 +107,8 @@ class Search extends React.Component<Props> {
};
handleTermChange = () => {
const query = decodeURIComponent(this.props.match.params.term || '');
this.query = query ? query : '';
const query = decodeURIComponent(this.props.match.params.term || "");
this.query = query ? query : "";
this.offset = 0;
this.allowLoadMore = true;
@@ -135,21 +135,21 @@ class Search extends React.Component<Props> {
};
get includeArchived() {
return this.params.get('includeArchived') === 'true';
return this.params.get("includeArchived") === "true";
}
get collectionId() {
const id = this.params.get('collectionId');
const id = this.params.get("collectionId");
return id ? id : undefined;
}
get userId() {
const id = this.params.get('userId');
const id = this.params.get("userId");
return id ? id : undefined;
}
get dateFilter() {
const id = this.params.get('dateFilter');
const id = this.params.get("dateFilter");
return id ? id : undefined;
}
@@ -164,7 +164,7 @@ class Search extends React.Component<Props> {
get title() {
const query = this.query;
const title = 'Search';
const title = "Search";
if (query) return `${query} – ${title}`;
return title;
}
@@ -361,14 +361,14 @@ const Container = styled(CenteredContent)`
const ResultsWrapper = styled(Flex)`
position: absolute;
transition: all 300ms cubic-bezier(0.65, 0.05, 0.36, 1);
top: ${props => (props.pinToTop ? '0%' : '50%')};
margin-top: ${props => (props.pinToTop ? '40px' : '-75px')};
top: ${props => (props.pinToTop ? "0%" : "50%")};
margin-top: ${props => (props.pinToTop ? "40px" : "-75px")};
width: 100%;
`;
const ResultList = styled(Flex)`
margin-bottom: 150px;
opacity: ${props => (props.visible ? '1' : '0')};
opacity: ${props => (props.visible ? "1" : "0")};
transition: all 400ms cubic-bezier(0.65, 0.05, 0.36, 1);
`;
@@ -388,4 +388,4 @@ const Filters = styled(Flex)`
}
`;
export default withRouter(inject('documents')(Search));
export default withRouter(inject("documents")(Search));

12
app/scenes/Search/components/CollectionFilter.js
View File

@@ -1,12 +1,12 @@
// @flow
import * as React from 'react';
import { observer, inject } from 'mobx-react';
import FilterOptions from './FilterOptions';
import CollectionsStore from 'stores/CollectionsStore';
import * as React from "react";
import { observer, inject } from "mobx-react";
import FilterOptions from "./FilterOptions";
import CollectionsStore from "stores/CollectionsStore";
const defaultOption = {
key: undefined,
label: 'Any collection',
label: "Any collection",
};
type Props = {
@@ -36,4 +36,4 @@ class CollectionFilter extends React.Component<Props> {
}
}
export default inject('collections')(CollectionFilter);
export default inject("collections")(CollectionFilter);

14
app/scenes/Search/components/DateFilter.js
View File

@@ -1,13 +1,13 @@
// @flow
import * as React from 'react';
import FilterOptions from './FilterOptions';
import * as React from "react";
import FilterOptions from "./FilterOptions";
const options = [
{ key: undefined, label: 'Any time' },
{ key: 'day', label: 'Past day' },
{ key: 'week', label: 'Past week' },
{ key: 'month', label: 'Past month' },
{ key: 'year', label: 'Past year' },
{ key: undefined, label: "Any time" },
{ key: "day", label: "Past day" },
{ key: "week", label: "Past week" },
{ key: "month", label: "Past month" },
{ key: "year", label: "Past year" },
];
type Props = {

16
app/scenes/Search/components/FilterOption.js
View File

@@ -1,9 +1,9 @@
// @flow
import * as React from 'react';
import { CheckmarkIcon } from 'outline-icons';
import styled from 'styled-components';
import HelpText from 'components/HelpText';
import Flex from 'shared/components/Flex';
import * as React from "react";
import { CheckmarkIcon } from "outline-icons";
import styled from "styled-components";
import HelpText from "components/HelpText";
import Flex from "shared/components/Flex";
type Props = {
label: string,
@@ -34,7 +34,7 @@ const Checkmark = styled(CheckmarkIcon)`
fill: ${props => props.theme.text};
`;
const Anchor = styled('a')`
const Anchor = styled("a")`
display: flex;
flex-direction: column;
font-size: 15px;
@@ -52,9 +52,9 @@ const Anchor = styled('a')`
}
`;
const ListItem = styled('li')`
const ListItem = styled("li")`
list-style: none;
font-weight: ${props => (props.active ? '600' : 'normal')};
font-weight: ${props => (props.active ? "600" : "normal")};
`;
export default FilterOption;

20
app/scenes/Search/components/FilterOptions.js
View File

@@ -1,10 +1,10 @@
// @flow
import * as React from 'react';
import { find } from 'lodash';
import styled from 'styled-components';
import Button, { Inner } from 'components/Button';
import { DropdownMenu } from 'components/DropdownMenu';
import FilterOption from './FilterOption';
import * as React from "react";
import { find } from "lodash";
import styled from "styled-components";
import Button, { Inner } from "components/Button";
import { DropdownMenu } from "components/DropdownMenu";
import FilterOption from "./FilterOption";
type Props = {
options: {
@@ -22,11 +22,11 @@ const FilterOptions = ({
options,
activeKey,
defaultLabel,
selectedPrefix = '',
selectedPrefix = "",
onSelect,
}: Props) => {
const selected = find(options, { key: activeKey }) || options[0];
const selectedLabel = selected ? `${selectedPrefix} ${selected.label}` : '';
const selectedLabel = selected ? `${selectedPrefix} ${selected.label}` : "";
return (
<DropdownButton label={activeKey ? selectedLabel : defaultLabel}>
@@ -49,7 +49,7 @@ const FilterOptions = ({
);
};
const Content = styled('div')`
const Content = styled("div")`
padding: 0 8px;
width: 250px;
@@ -95,7 +95,7 @@ const DropdownButton = styled(SearchFilter)`
margin-right: 8px;
`;
const List = styled('ol')`
const List = styled("ol")`
list-style: none;
margin: 0;
padding: 0;

12
app/scenes/Search/components/SearchField.js
View File

@@ -1,8 +1,8 @@
// @flow
import * as React from 'react';
import styled, { withTheme } from 'styled-components';
import { SearchIcon } from 'outline-icons';
import Flex from 'shared/components/Flex';
import * as React from "react";
import styled, { withTheme } from "styled-components";
import { SearchIcon } from "outline-icons";
import Flex from "shared/components/Flex";
type Props = {
onChange: string => void,
@@ -16,13 +16,13 @@ class SearchField extends React.Component<Props> {
componentDidMount() {
if (this.props && this.input) {
// ensure that focus is placed at end of input
const len = (this.props.defaultValue || '').length;
const len = (this.props.defaultValue || "").length;
this.input.setSelectionRange(len, len);
}
}
handleChange = (ev: SyntheticEvent<HTMLInputElement>) => {
this.props.onChange(ev.currentTarget.value ? ev.currentTarget.value : '');
this.props.onChange(ev.currentTarget.value ? ev.currentTarget.value : "");
};
focusInput = (ev: SyntheticEvent<>) => {

16
app/scenes/Search/components/StatusFilter.js
View File

@@ -1,17 +1,17 @@
// @flow
import * as React from 'react';
import FilterOptions from './FilterOptions';
import * as React from "react";
import FilterOptions from "./FilterOptions";
const options = [
{
key: undefined,
label: 'Active documents',
note: 'Documents in collections you are able to access',
label: "Active documents",
note: "Documents in collections you are able to access",
},
{
key: 'true',
label: 'All documents',
note: 'Include documents that are in the archive',
key: "true",
label: "All documents",
note: "Include documents that are in the archive",
},
];
@@ -24,7 +24,7 @@ const StatusFilter = ({ includeArchived, onSelect }: Props) => {
return (
<FilterOptions
options={options}
activeKey={includeArchived ? 'true' : undefined}
activeKey={includeArchived ? "true" : undefined}
onSelect={onSelect}
defaultLabel="Active documents"
/>

12
app/scenes/Search/components/UserFilter.js
View File

@@ -1,12 +1,12 @@
// @flow
import * as React from 'react';
import { observer, inject } from 'mobx-react';
import FilterOptions from './FilterOptions';
import UsersStore from 'stores/UsersStore';
import * as React from "react";
import { observer, inject } from "mobx-react";
import FilterOptions from "./FilterOptions";
import UsersStore from "stores/UsersStore";
const defaultOption = {
key: undefined,
label: 'Any author',
label: "Any author",
};
type Props = {
@@ -40,4 +40,4 @@ class UserFilter extends React.Component<Props> {
}
}
export default inject('users')(UserFilter);
export default inject("users")(UserFilter);

2
app/scenes/Search/index.js
View File

@@ -1,3 +1,3 @@
// @flow
import Search from './Search';
import Search from "./Search";
export default Search;

38
app/scenes/Settings/Details.js
View File

@@ -1,18 +1,18 @@
// @flow
import * as React from 'react';
import { observable } from 'mobx';
import { observer, inject } from 'mobx-react';
import styled from 'styled-components';
import * as React from "react";
import { observable } from "mobx";
import { observer, inject } from "mobx-react";
import styled from "styled-components";
import AuthStore from 'stores/AuthStore';
import UiStore from 'stores/UiStore';
import ImageUpload from './components/ImageUpload';
import Input, { LabelText } from 'components/Input';
import Button from 'components/Button';
import CenteredContent from 'components/CenteredContent';
import PageTitle from 'components/PageTitle';
import HelpText from 'components/HelpText';
import Flex from 'shared/components/Flex';
import AuthStore from "stores/AuthStore";
import UiStore from "stores/UiStore";
import ImageUpload from "./components/ImageUpload";
import Input, { LabelText } from "components/Input";
import Button from "components/Button";
import CenteredContent from "components/CenteredContent";
import PageTitle from "components/PageTitle";
import HelpText from "components/HelpText";
import Flex from "shared/components/Flex";
type Props = {
auth: AuthStore,
@@ -49,7 +49,7 @@ class Details extends React.Component<Props> {
avatarUrl: this.avatarUrl,
subdomain: this.subdomain,
});
this.props.ui.showToast('Settings saved');
this.props.ui.showToast("Settings saved");
} catch (err) {
this.props.ui.showToast(err.message);
}
@@ -68,7 +68,7 @@ class Details extends React.Component<Props> {
};
handleAvatarError = (error: ?string) => {
this.props.ui.showToast(error || 'Unable to upload new logo');
this.props.ui.showToast(error || "Unable to upload new logo");
};
get isValid() {
@@ -120,7 +120,7 @@ class Details extends React.Component<Props> {
<Input
label="Subdomain"
name="subdomain"
value={this.subdomain || ''}
value={this.subdomain || ""}
onChange={this.handleSubdomainChange}
autoComplete="off"
minLength={4}
@@ -129,14 +129,14 @@ class Details extends React.Component<Props> {
/>
{this.subdomain && (
<HelpText small>
Your knowledgebase will be accessible at{' '}
Your knowledgebase will be accessible at{" "}
<strong>{this.subdomain}.getoutline.com</strong>
</HelpText>
)}
</React.Fragment>
)}
<Button type="submit" disabled={isSaving || !this.isValid}>
{isSaving ? 'Saving…' : 'Save'}
{isSaving ? "Saving…" : "Save"}
</Button>
</form>
</CenteredContent>
@@ -183,4 +183,4 @@ const Avatar = styled.img`
${avatarStyles};
`;
export default inject('auth', 'ui')(Details);
export default inject("auth", "ui")(Details);

30
app/scenes/Settings/Events.js
View File

@@ -1,19 +1,19 @@
// @flow
import * as React from 'react';
import { observable, action } from 'mobx';
import { observer, inject } from 'mobx-react';
import { Waypoint } from 'react-waypoint';
import * as React from "react";
import { observable, action } from "mobx";
import { observer, inject } from "mobx-react";
import { Waypoint } from "react-waypoint";
import { DEFAULT_PAGINATION_LIMIT } from 'stores/BaseStore';
import EventsStore from 'stores/EventsStore';
import CenteredContent from 'components/CenteredContent';
import PageTitle from 'components/PageTitle';
import HelpText from 'components/HelpText';
import List from 'components/List';
import Tabs from 'components/Tabs';
import Tab from 'components/Tab';
import { ListPlaceholder } from 'components/LoadingPlaceholder';
import EventListItem from './components/EventListItem';
import { DEFAULT_PAGINATION_LIMIT } from "stores/BaseStore";
import EventsStore from "stores/EventsStore";
import CenteredContent from "components/CenteredContent";
import PageTitle from "components/PageTitle";
import HelpText from "components/HelpText";
import List from "components/List";
import Tabs from "components/Tabs";
import Tab from "components/Tab";
import { ListPlaceholder } from "components/LoadingPlaceholder";
import EventListItem from "./components/EventListItem";
type Props = {
events: EventsStore,
@@ -96,4 +96,4 @@ class Events extends React.Component<Props> {
}
}
export default inject('events')(Events);
export default inject("events")(Events);

28
app/scenes/Settings/Export.js
View File

@@ -1,15 +1,15 @@
// @flow
import * as React from 'react';
import { observable } from 'mobx';
import { observer, inject } from 'mobx-react';
import AuthStore from 'stores/AuthStore';
import CollectionsStore from 'stores/CollectionsStore';
import UiStore from 'stores/UiStore';
import * as React from "react";
import { observable } from "mobx";
import { observer, inject } from "mobx-react";
import AuthStore from "stores/AuthStore";
import CollectionsStore from "stores/CollectionsStore";
import UiStore from "stores/UiStore";
import CenteredContent from 'components/CenteredContent';
import PageTitle from 'components/PageTitle';
import HelpText from 'components/HelpText';
import Button from 'components/Button';
import CenteredContent from "components/CenteredContent";
import PageTitle from "components/PageTitle";
import HelpText from "components/HelpText";
import Button from "components/Button";
type Props = {
auth: AuthStore,
@@ -29,7 +29,7 @@ class Export extends React.Component<Props> {
try {
await this.props.collections.export();
this.isExporting = true;
this.props.ui.showToast('Export in progress…');
this.props.ui.showToast("Export in progress…");
} finally {
this.isLoading = false;
}
@@ -60,12 +60,12 @@ class Export extends React.Component<Props> {
primary
>
{this.isExporting
? 'Export Requested'
: this.isLoading ? 'Requesting Export…' : 'Export All Data'}
? "Export Requested"
: this.isLoading ? "Requesting Export…" : "Export All Data"}
</Button>
</CenteredContent>
);
}
}
export default inject('auth', 'ui', 'collections')(Export);
export default inject("auth", "ui", "collections")(Export);

48
app/scenes/Settings/Groups.js
View File

@@ -1,27 +1,27 @@
// @flow
import * as React from 'react';
import invariant from 'invariant';
import { observable } from 'mobx';
import { observer, inject } from 'mobx-react';
import { PlusIcon } from 'outline-icons';
import * as React from "react";
import invariant from "invariant";
import { observable } from "mobx";
import { observer, inject } from "mobx-react";
import { PlusIcon } from "outline-icons";
import Empty from 'components/Empty';
import { ListPlaceholder } from 'components/LoadingPlaceholder';
import Modal from 'components/Modal';
import Button from 'components/Button';
import GroupNew from 'scenes/GroupNew';
import CenteredContent from 'components/CenteredContent';
import PageTitle from 'components/PageTitle';
import HelpText from 'components/HelpText';
import GroupListItem from 'components/GroupListItem';
import List from 'components/List';
import Tabs from 'components/Tabs';
import Tab from 'components/Tab';
import GroupMenu from 'menus/GroupMenu';
import Empty from "components/Empty";
import { ListPlaceholder } from "components/LoadingPlaceholder";
import Modal from "components/Modal";
import Button from "components/Button";
import GroupNew from "scenes/GroupNew";
import CenteredContent from "components/CenteredContent";
import PageTitle from "components/PageTitle";
import HelpText from "components/HelpText";
import GroupListItem from "components/GroupListItem";
import List from "components/List";
import Tabs from "components/Tabs";
import Tab from "components/Tab";
import GroupMenu from "menus/GroupMenu";
import AuthStore from 'stores/AuthStore';
import GroupsStore from 'stores/GroupsStore';
import PoliciesStore from 'stores/PoliciesStore';
import AuthStore from "stores/AuthStore";
import GroupsStore from "stores/GroupsStore";
import PoliciesStore from "stores/PoliciesStore";
type Props = {
auth: AuthStore,
@@ -51,8 +51,8 @@ class Groups extends React.Component<Props> {
const currentUser = auth.user;
const team = auth.team;
invariant(currentUser, 'User should exist');
invariant(team, 'Team should exist');
invariant(currentUser, "User should exist");
invariant(team, "Team should exist");
const showLoading = groups.isFetching && !groups.orderedData.length;
const showEmpty = groups.isLoaded && !groups.orderedData.length;
@@ -111,4 +111,4 @@ class Groups extends React.Component<Props> {
}
}
export default inject('auth', 'groups', 'policies')(Groups);
export default inject("auth", "groups", "policies")(Groups);

68
app/scenes/Settings/Notifications.js
View File

@@ -1,19 +1,19 @@
// @flow
import * as React from 'react';
import { debounce } from 'lodash';
import { observer, inject } from 'mobx-react';
import styled from 'styled-components';
import CenteredContent from 'components/CenteredContent';
import PageTitle from 'components/PageTitle';
import HelpText from 'components/HelpText';
import Input from 'components/Input';
import Subheading from 'components/Subheading';
import NotificationListItem from './components/NotificationListItem';
import Notice from 'shared/components/Notice';
import * as React from "react";
import { debounce } from "lodash";
import { observer, inject } from "mobx-react";
import styled from "styled-components";
import CenteredContent from "components/CenteredContent";
import PageTitle from "components/PageTitle";
import HelpText from "components/HelpText";
import Input from "components/Input";
import Subheading from "components/Subheading";
import NotificationListItem from "./components/NotificationListItem";
import Notice from "shared/components/Notice";
import UiStore from 'stores/UiStore';
import AuthStore from 'stores/AuthStore';
import NotificationSettingsStore from 'stores/NotificationSettingsStore';
import UiStore from "stores/UiStore";
import AuthStore from "stores/AuthStore";
import NotificationSettingsStore from "stores/NotificationSettingsStore";
type Props = {
ui: UiStore,
@@ -23,33 +23,33 @@ type Props = {
const options = [
{
event: 'documents.publish',
title: 'Document published',
description: 'Receive a notification whenever a new document is published',
event: "documents.publish",
title: "Document published",
description: "Receive a notification whenever a new document is published",
},
{
event: 'documents.update',
title: 'Document updated',
description: 'Receive a notification when a document you created is edited',
event: "documents.update",
title: "Document updated",
description: "Receive a notification when a document you created is edited",
},
{
event: 'collections.create',
title: 'Collection created',
description: 'Receive a notification whenever a new collection is created',
event: "collections.create",
title: "Collection created",
description: "Receive a notification whenever a new collection is created",
},
{
separator: true,
},
{
event: 'emails.onboarding',
title: 'Getting started',
event: "emails.onboarding",
title: "Getting started",
description:
'Tips on getting started with Outline`s features and functionality',
"Tips on getting started with Outline`s features and functionality",
},
{
event: 'emails.features',
title: 'New features',
description: 'Receive an email when new features of note are added',
event: "emails.features",
title: "New features",
description: "Receive an email when new features of note are added",
},
];
@@ -75,12 +75,12 @@ class Notifications extends React.Component<Props> {
};
showSuccessMessage = debounce(() => {
this.props.ui.showToast('Notifications saved');
this.props.ui.showToast("Notifications saved");
}, 500);
render() {
const { notificationSettings, auth } = this.props;
const showSuccessNotice = window.location.search === '?success';
const showSuccessNotice = window.location.search === "?success";
const { user, team } = auth;
if (!team || !user) return null;
@@ -97,8 +97,8 @@ class Notifications extends React.Component<Props> {
<HelpText>
Manage when and where you receive email notifications from Outline.
Your email address can be updated in your{' '}
{team.slackConnected ? 'Slack' : 'Google'} account.
Your email address can be updated in your{" "}
{team.slackConnected ? "Slack" : "Google"} account.
</HelpText>
<Input
@@ -137,4 +137,4 @@ const Separator = styled.hr`
padding-bottom: 12px;
`;
export default inject('notificationSettings', 'auth', 'ui')(Notifications);
export default inject("notificationSettings", "auth", "ui")(Notifications);

52
app/scenes/Settings/People.js
View File

@@ -1,25 +1,25 @@
// @flow
import * as React from 'react';
import invariant from 'invariant';
import { observable } from 'mobx';
import { observer, inject } from 'mobx-react';
import { PlusIcon } from 'outline-icons';
import * as React from "react";
import invariant from "invariant";
import { observable } from "mobx";
import { observer, inject } from "mobx-react";
import { PlusIcon } from "outline-icons";
import Empty from 'components/Empty';
import Modal from 'components/Modal';
import Button from 'components/Button';
import Invite from 'scenes/Invite';
import CenteredContent from 'components/CenteredContent';
import PageTitle from 'components/PageTitle';
import HelpText from 'components/HelpText';
import PaginatedList from 'components/PaginatedList';
import Tabs, { Separator } from 'components/Tabs';
import Tab from 'components/Tab';
import UserListItem from './components/UserListItem';
import Empty from "components/Empty";
import Modal from "components/Modal";
import Button from "components/Button";
import Invite from "scenes/Invite";
import CenteredContent from "components/CenteredContent";
import PageTitle from "components/PageTitle";
import HelpText from "components/HelpText";
import PaginatedList from "components/PaginatedList";
import Tabs, { Separator } from "components/Tabs";
import Tab from "components/Tab";
import UserListItem from "./components/UserListItem";
import AuthStore from 'stores/AuthStore';
import UsersStore from 'stores/UsersStore';
import PoliciesStore from 'stores/PoliciesStore';
import AuthStore from "stores/AuthStore";
import UsersStore from "stores/UsersStore";
import PoliciesStore from "stores/PoliciesStore";
type Props = {
auth: AuthStore,
@@ -49,17 +49,17 @@ class People extends React.Component<Props> {
const { filter } = match.params;
const currentUser = auth.user;
const team = auth.team;
invariant(currentUser, 'User should exist');
invariant(team, 'Team should exist');
invariant(currentUser, "User should exist");
invariant(team, "Team should exist");
let users = this.props.users.active;
if (filter === 'all') {
if (filter === "all") {
users = this.props.users.all;
} else if (filter === 'admins') {
} else if (filter === "admins") {
users = this.props.users.admins;
} else if (filter === 'suspended') {
} else if (filter === "suspended") {
users = this.props.users.suspended;
} else if (filter === 'invited') {
} else if (filter === "invited") {
users = this.props.users.invited;
}
@@ -136,4 +136,4 @@ class People extends React.Component<Props> {
}
}
export default inject('auth', 'users', 'policies')(People);
export default inject("auth", "users", "policies")(People);

38
app/scenes/Settings/Profile.js
View File

@@ -1,18 +1,18 @@
// @flow
import * as React from 'react';
import { observable } from 'mobx';
import { observer, inject } from 'mobx-react';
import styled from 'styled-components';
import * as React from "react";
import { observable } from "mobx";
import { observer, inject } from "mobx-react";
import styled from "styled-components";
import AuthStore from 'stores/AuthStore';
import UiStore from 'stores/UiStore';
import ImageUpload from './components/ImageUpload';
import Input, { LabelText } from 'components/Input';
import Button from 'components/Button';
import CenteredContent from 'components/CenteredContent';
import PageTitle from 'components/PageTitle';
import UserDelete from 'scenes/UserDelete';
import Flex from 'shared/components/Flex';
import AuthStore from "stores/AuthStore";
import UiStore from "stores/UiStore";
import ImageUpload from "./components/ImageUpload";
import Input, { LabelText } from "components/Input";
import Button from "components/Button";
import CenteredContent from "components/CenteredContent";
import PageTitle from "components/PageTitle";
import UserDelete from "scenes/UserDelete";
import Flex from "shared/components/Flex";
type Props = {
auth: AuthStore,
@@ -45,7 +45,7 @@ class Profile extends React.Component<Props> {
name: this.name,
avatarUrl: this.avatarUrl,
});
this.props.ui.showToast('Profile saved');
this.props.ui.showToast("Profile saved");
};
handleNameChange = (ev: SyntheticInputEvent<*>) => {
@@ -58,11 +58,11 @@ class Profile extends React.Component<Props> {
await this.props.auth.updateUser({
avatarUrl: this.avatarUrl,
});
this.props.ui.showToast('Profile picture updated');
this.props.ui.showToast("Profile picture updated");
};
handleAvatarError = (error: ?string) => {
this.props.ui.showToast(error || 'Unable to upload new avatar');
this.props.ui.showToast(error || "Unable to upload new avatar");
};
toggleDeleteAccount = () => {
@@ -106,7 +106,7 @@ class Profile extends React.Component<Props> {
short
/>
<Button type="submit" disabled={isSaving || !this.isValid}>
{isSaving ? 'Saving…' : 'Save'}
{isSaving ? "Saving…" : "Save"}
</Button>
</form>
@@ -114,7 +114,7 @@ class Profile extends React.Component<Props> {
<LabelText>Delete Account</LabelText>
<p>
You may delete your account at any time, note that this is
unrecoverable.{' '}
unrecoverable.{" "}
<a onClick={this.toggleDeleteAccount}>Delete account</a>.
</p>
</DangerZone>
@@ -170,4 +170,4 @@ const Avatar = styled.img`
${avatarStyles};
`;
export default inject('auth', 'ui')(Profile);
export default inject("auth", "ui")(Profile);

32
app/scenes/Settings/Security.js
View File

@@ -1,15 +1,15 @@
// @flow
import * as React from 'react';
import { observable } from 'mobx';
import { observer, inject } from 'mobx-react';
import { debounce } from 'lodash';
import * as React from "react";
import { observable } from "mobx";
import { observer, inject } from "mobx-react";
import { debounce } from "lodash";
import AuthStore from 'stores/AuthStore';
import UiStore from 'stores/UiStore';
import Checkbox from 'components/Checkbox';
import CenteredContent from 'components/CenteredContent';
import PageTitle from 'components/PageTitle';
import HelpText from 'components/HelpText';
import AuthStore from "stores/AuthStore";
import UiStore from "stores/UiStore";
import Checkbox from "components/Checkbox";
import CenteredContent from "components/CenteredContent";
import PageTitle from "components/PageTitle";
import HelpText from "components/HelpText";
type Props = {
auth: AuthStore,
@@ -35,13 +35,13 @@ class Security extends React.Component<Props> {
handleChange = async (ev: SyntheticInputEvent<*>) => {
switch (ev.target.name) {
case 'sharing':
case "sharing":
this.sharing = ev.target.checked;
break;
case 'documentEmbeds':
case "documentEmbeds":
this.documentEmbeds = ev.target.checked;
break;
case 'guestSignin':
case "guestSignin":
this.guestSignin = ev.target.checked;
break;
default:
@@ -56,7 +56,7 @@ class Security extends React.Component<Props> {
};
showSuccessMessage = debounce(() => {
this.props.ui.showToast('Settings saved');
this.props.ui.showToast("Settings saved");
}, 500);
render() {
@@ -77,7 +77,7 @@ class Security extends React.Component<Props> {
checked={this.guestSignin}
onChange={this.handleChange}
note={`When enabled guests can be invited by email address and are able to signin without ${
team ? team.signinMethods : 'SSO'
team ? team.signinMethods : "SSO"
}`}
/>
<Checkbox
@@ -99,4 +99,4 @@ class Security extends React.Component<Props> {
}
}
export default inject('auth', 'ui')(Security);
export default inject("auth", "ui")(Security);

30
app/scenes/Settings/Shares.js
View File

@@ -1,17 +1,17 @@
// @flow
import * as React from 'react';
import { observer, inject } from 'mobx-react';
import { Link } from 'react-router-dom';
import SharesStore from 'stores/SharesStore';
import AuthStore from 'stores/AuthStore';
import * as React from "react";
import { observer, inject } from "mobx-react";
import { Link } from "react-router-dom";
import SharesStore from "stores/SharesStore";
import AuthStore from "stores/AuthStore";
import ShareListItem from './components/ShareListItem';
import Empty from 'components/Empty';
import List from 'components/List';
import CenteredContent from 'components/CenteredContent';
import Subheading from 'components/Subheading';
import PageTitle from 'components/PageTitle';
import HelpText from 'components/HelpText';
import ShareListItem from "./components/ShareListItem";
import Empty from "components/Empty";
import List from "components/List";
import CenteredContent from "components/CenteredContent";
import Subheading from "components/Subheading";
import PageTitle from "components/PageTitle";
import HelpText from "components/HelpText";
type Props = {
shares: SharesStore,
@@ -44,8 +44,8 @@ class Shares extends React.Component<Props> {
<HelpText>
{!canShareDocuments && (
<strong>Sharing is currently disabled.</strong>
)}{' '}
You can turn {canShareDocuments ? 'off' : 'on'} public document
)}{" "}
You can turn {canShareDocuments ? "off" : "on"} public document
sharing in <Link to="/settings/security">security settings</Link>.
</HelpText>
)}
@@ -64,4 +64,4 @@ class Shares extends React.Component<Props> {
}
}
export default inject('shares', 'auth')(Shares);
export default inject("shares", "auth")(Shares);

48
app/scenes/Settings/Slack.js
View File

@@ -1,19 +1,19 @@
// @flow
import * as React from 'react';
import { inject, observer } from 'mobx-react';
import { find } from 'lodash';
import styled from 'styled-components';
import * as React from "react";
import { inject, observer } from "mobx-react";
import { find } from "lodash";
import styled from "styled-components";
import Button from 'components/Button';
import CenteredContent from 'components/CenteredContent';
import PageTitle from 'components/PageTitle';
import HelpText from 'components/HelpText';
import SlackButton from './components/SlackButton';
import CollectionsStore from 'stores/CollectionsStore';
import IntegrationsStore from 'stores/IntegrationsStore';
import AuthStore from 'stores/AuthStore';
import Notice from 'shared/components/Notice';
import getQueryVariable from 'shared/utils/getQueryVariable';
import Button from "components/Button";
import CenteredContent from "components/CenteredContent";
import PageTitle from "components/PageTitle";
import HelpText from "components/HelpText";
import SlackButton from "./components/SlackButton";
import CollectionsStore from "stores/CollectionsStore";
import IntegrationsStore from "stores/IntegrationsStore";
import AuthStore from "stores/AuthStore";
import Notice from "shared/components/Notice";
import getQueryVariable from "shared/utils/getQueryVariable";
type Props = {
collections: CollectionsStore,
@@ -26,39 +26,39 @@ class Slack extends React.Component<Props> {
error: ?string;
componentDidMount() {
this.error = getQueryVariable('error');
this.error = getQueryVariable("error");
this.props.collections.fetchPage({ limit: 100 });
this.props.integrations.fetchPage();
}
get commandIntegration() {
return find(this.props.integrations.slackIntegrations, {
type: 'command',
type: "command",
});
}
render() {
const { collections, integrations, auth } = this.props;
const teamId = auth.team ? auth.team.id : '';
const teamId = auth.team ? auth.team.id : "";
return (
<CenteredContent>
<PageTitle title="Slack" />
<h1>Slack</h1>
{this.error === 'access_denied' && (
{this.error === "access_denied" && (
<Notice>
Whoops, you need to accept the permissions in Slack to connect
Outline to your team. Try again?
</Notice>
)}
{this.error === 'unauthenticated' && (
{this.error === "unauthenticated" && (
<Notice>
Something went wrong while authenticating your request. Please try
logging in again?
</Notice>
)}
<HelpText>
Preview Outline links your team mates share and use the{' '}
Preview Outline links your team mates share and use the{" "}
<Code>/outline</Code> slash command in Slack to search for documents
in your team’s wiki.
</HelpText>
@@ -67,7 +67,7 @@ class Slack extends React.Component<Props> {
<Button onClick={this.commandIntegration.delete}>Disconnect</Button>
) : (
<SlackButton
scopes={['commands', 'links:read', 'links:write']}
scopes={["commands", "links:read", "links:write"]}
redirectUri={`${BASE_URL}/auth/slack.commands`}
state={teamId}
/>
@@ -91,7 +91,7 @@ class Slack extends React.Component<Props> {
return (
<ListItem key={integration.id}>
<span>
<strong>{collection.name}</strong> posting activity to the{' '}
<strong>{collection.name}</strong> posting activity to the{" "}
<strong>{integration.settings.channel}</strong> Slack
channel
</span>
@@ -104,7 +104,7 @@ class Slack extends React.Component<Props> {
<ListItem key={collection.id}>
<strong>{collection.name}</strong>
<SlackButton
scopes={['incoming-webhook']}
scopes={["incoming-webhook"]}
redirectUri={`${BASE_URL}/auth/slack.post`}
state={collection.id}
label="Connect"
@@ -139,4 +139,4 @@ const Code = styled.code`
border-radius: 4px;
`;
export default inject('collections', 'integrations', 'auth')(Slack);
export default inject("collections", "integrations", "auth")(Slack);

30
app/scenes/Settings/Tokens.js
View File

@@ -1,16 +1,16 @@
// @flow
import * as React from 'react';
import { observable } from 'mobx';
import { observer, inject } from 'mobx-react';
import ApiKeysStore from 'stores/ApiKeysStore';
import * as React from "react";
import { observable } from "mobx";
import { observer, inject } from "mobx-react";
import ApiKeysStore from "stores/ApiKeysStore";
import Button from 'components/Button';
import Input from 'components/Input';
import CenteredContent from 'components/CenteredContent';
import PageTitle from 'components/PageTitle';
import HelpText from 'components/HelpText';
import List from 'components/List';
import TokenListItem from './components/TokenListItem';
import Button from "components/Button";
import Input from "components/Input";
import CenteredContent from "components/CenteredContent";
import PageTitle from "components/PageTitle";
import HelpText from "components/HelpText";
import List from "components/List";
import TokenListItem from "./components/TokenListItem";
type Props = {
apiKeys: ApiKeysStore,
@@ -18,7 +18,7 @@ type Props = {
@observer
class Tokens extends React.Component<Props> {
@observable name: string = '';
@observable name: string = "";
componentDidMount() {
this.props.apiKeys.fetchPage({ limit: 100 });
@@ -31,7 +31,7 @@ class Tokens extends React.Component<Props> {
handleSubmit = async (ev: SyntheticEvent<>) => {
ev.preventDefault();
await this.props.apiKeys.create({ name: this.name });
this.name = '';
this.name = "";
};
render() {
@@ -45,7 +45,7 @@ class Tokens extends React.Component<Props> {
<HelpText>
You can create an unlimited amount of personal tokens to authenticate
with the API. For more details about the API take a look at the{' '}
with the API. For more details about the API take a look at the{" "}
<a href="/developers">developer documentation</a>.
</HelpText>
@@ -79,4 +79,4 @@ class Tokens extends React.Component<Props> {
}
}
export default inject('apiKeys')(Tokens);
export default inject("apiKeys")(Tokens);

16
app/scenes/Settings/Zapier.js
View File

@@ -1,14 +1,14 @@
// @flow
import * as React from 'react';
import CenteredContent from 'components/CenteredContent';
import PageTitle from 'components/PageTitle';
import HelpText from 'components/HelpText';
import Button from 'components/Button';
import * as React from "react";
import CenteredContent from "components/CenteredContent";
import PageTitle from "components/PageTitle";
import HelpText from "components/HelpText";
import Button from "components/Button";
class Zapier extends React.Component<*> {
goToZapier = () => {
window.open(
'https://zapier.com/platform/public-invite/5927/a0b2747dbb017723b55fc54f4f0cdcae/'
"https://zapier.com/platform/public-invite/5927/a0b2747dbb017723b55fc54f4f0cdcae/"
);
};
render() {
@@ -17,14 +17,14 @@ class Zapier extends React.Component<*> {
<PageTitle title="Zapier" />
<h1>Zapier</h1>
<HelpText>
There is now an Outline app on{' '}
There is now an Outline app on{" "}
<a
href="https://zapier.com"
rel="noopener noreferrer"
target="_blank"
>
Zapier
</a>{' '}
</a>{" "}
to allow easy integration with hundreds of other business services. It
is currently in early access, to use the integration and hook up to
your wiki simply accept the public invite below. All configuration is

94
app/scenes/Settings/components/EventListItem.js
View File

@@ -1,12 +1,12 @@
// @flow
import * as React from 'react';
import { Link } from 'react-router-dom';
import { capitalize } from 'lodash';
import styled from 'styled-components';
import Time from 'shared/components/Time';
import ListItem from 'components/List/Item';
import Avatar from 'components/Avatar';
import Event from 'models/Event';
import * as React from "react";
import { Link } from "react-router-dom";
import { capitalize } from "lodash";
import styled from "styled-components";
import Time from "shared/components/Time";
import ListItem from "components/List/Item";
import Avatar from "components/Avatar";
import Event from "models/Event";
type Props = {
event: Event,
@@ -14,104 +14,104 @@ type Props = {
const description = event => {
switch (event.name) {
case 'api_keys.create':
case "api_keys.create":
return (
<React.Fragment>
Created the API token <strong>{event.data.name}</strong>
</React.Fragment>
);
case 'api_keys.delete':
case "api_keys.delete":
return (
<React.Fragment>
Revoked the API token <strong>{event.data.name}</strong>
</React.Fragment>
);
case 'teams.create':
return 'Created the team';
case 'shares.create':
case 'shares.revoke':
case "teams.create":
return "Created the team";
case "shares.create":
case "shares.revoke":
return (
<React.Fragment>
{capitalize(event.verbPastTense)} a{' '}
<Link to={`/share/${event.modelId || ''}`}>public link</Link> to the{' '}
<Link to={`/doc/${event.documentId}`}>{event.data.name}</Link>{' '}
{capitalize(event.verbPastTense)} a{" "}
<Link to={`/share/${event.modelId || ""}`}>public link</Link> to the{" "}
<Link to={`/doc/${event.documentId}`}>{event.data.name}</Link>{" "}
document
</React.Fragment>
);
case 'users.create':
case "users.create":
return (
<React.Fragment>{event.data.name} created an account</React.Fragment>
);
case 'users.invite':
case "users.invite":
return (
<React.Fragment>
{capitalize(event.verbPastTense)} {event.data.name} (<a
href={`mailto:${event.data.email || ''}`}
href={`mailto:${event.data.email || ""}`}
>
{event.data.email || ''}
{event.data.email || ""}
</a>)
</React.Fragment>
);
case 'users.suspend':
case "users.suspend":
return (
<React.Fragment>
Suspended <strong>{event.data.name}’s</strong> account
</React.Fragment>
);
case 'users.activate':
case "users.activate":
return (
<React.Fragment>
Unsuspended <strong>{event.data.name}’s</strong> account
</React.Fragment>
);
case 'users.promote':
case "users.promote":
return (
<React.Fragment>
Made <strong>{event.data.name}</strong> an admin
</React.Fragment>
);
case 'users.demote':
case "users.demote":
return (
<React.Fragment>
Made <strong>{event.data.name}</strong> a member
</React.Fragment>
);
case 'users.delete':
return 'Deleted their account';
case 'groups.create':
case "users.delete":
return "Deleted their account";
case "groups.create":
return (
<React.Fragment>
Created the group <strong>{event.data.name}</strong>
</React.Fragment>
);
case 'groups.update':
case "groups.update":
return (
<React.Fragment>
Update the group <strong>{event.data.name}</strong>
</React.Fragment>
);
case 'groups.delete':
case "groups.delete":
return (
<React.Fragment>
Deleted the group <strong>{event.data.name}</strong>
</React.Fragment>
);
case 'collections.add_user':
case 'collections.add_group':
case "collections.add_user":
case "collections.add_group":
return (
<React.Fragment>
Granted <strong>{event.data.name}</strong> access to a{' '}
<Link to={`/collections/${event.collectionId || ''}`}>
Granted <strong>{event.data.name}</strong> access to a{" "}
<Link to={`/collections/${event.collectionId || ""}`}>
collection
</Link>
</React.Fragment>
);
case 'collections.remove_user':
case 'collections.remove_group':
case "collections.remove_user":
case "collections.remove_group":
return (
<React.Fragment>
Revoked <strong>{event.data.name}</strong> access to a{' '}
<Link to={`/collections/${event.collectionId || ''}`}>
Revoked <strong>{event.data.name}</strong> access to a{" "}
<Link to={`/collections/${event.collectionId || ""}`}>
collection
</Link>
</React.Fragment>
@@ -120,7 +120,7 @@ const description = event => {
}
if (event.documentId) {
if (event.name === 'documents.delete') {
if (event.name === "documents.delete") {
return (
<React.Fragment>
Deleted the <strong>{event.data.title}</strong> document
@@ -129,13 +129,13 @@ const description = event => {
}
return (
<React.Fragment>
{capitalize(event.verbPastTense)} the{' '}
{capitalize(event.verbPastTense)} the{" "}
<Link to={`/doc/${event.documentId}`}>{event.data.title}</Link> document
</React.Fragment>
);
}
if (event.collectionId) {
if (event.name === 'collections.delete') {
if (event.name === "collections.delete") {
return (
<React.Fragment>
Deleted the <strong>{event.data.name}</strong> collection
@@ -144,10 +144,10 @@ const description = event => {
}
return (
<React.Fragment>
{capitalize(event.verbPastTense)} the{' '}
<Link to={`/collections/${event.collectionId || ''}`}>
{capitalize(event.verbPastTense)} the{" "}
<Link to={`/collections/${event.collectionId || ""}`}>
{event.data.name}
</Link>{' '}
</Link>{" "}
collection
</React.Fragment>
);
@@ -159,7 +159,7 @@ const description = event => {
</React.Fragment>
);
}
return '';
return "";
};
const EventListItem = ({ event }: Props) => {
@@ -170,7 +170,7 @@ const EventListItem = ({ event }: Props) => {
image={<Avatar src={event.actor.avatarUrl} size={32} />}
subtitle={
<React.Fragment>
{description(event)} <Time dateTime={event.createdAt} /> ago &middot;{' '}
{description(event)} <Time dateTime={event.createdAt} /> ago &middot;{" "}
<strong>{event.name}</strong>
</React.Fragment>
}
@@ -193,7 +193,7 @@ const EventListItem = ({ event }: Props) => {
);
};
const IP = styled('span')`
const IP = styled("span")`
color: ${props => props.theme.textTertiary};
font-size: 12px;
`;

32
app/scenes/Settings/components/ImageUpload.js
View File

@@ -1,16 +1,16 @@
// @flow
import * as React from 'react';
import { observable } from 'mobx';
import { observer, inject } from 'mobx-react';
import styled from 'styled-components';
import Dropzone from 'react-dropzone';
import LoadingIndicator from 'components/LoadingIndicator';
import Flex from 'shared/components/Flex';
import Modal from 'components/Modal';
import Button from 'components/Button';
import AvatarEditor from 'react-avatar-editor';
import { uploadFile, dataUrlToBlob } from 'utils/uploadFile';
import UiStore from 'stores/UiStore';
import * as React from "react";
import { observable } from "mobx";
import { observer, inject } from "mobx-react";
import styled from "styled-components";
import Dropzone from "react-dropzone";
import LoadingIndicator from "components/LoadingIndicator";
import Flex from "shared/components/Flex";
import Modal from "components/Modal";
import Button from "components/Button";
import AvatarEditor from "react-avatar-editor";
import { uploadFile, dataUrlToBlob } from "utils/uploadFile";
import UiStore from "stores/UiStore";
type Props = {
children?: React.Node,
@@ -30,7 +30,7 @@ class ImageUpload extends React.Component<Props> {
avatarEditorRef: AvatarEditor;
static defaultProps = {
submitText: 'Crop Picture',
submitText: "Crop Picture",
borderRadius: 150,
};
@@ -92,7 +92,7 @@ class ImageUpload extends React.Component<Props> {
border={25}
borderRadius={this.props.borderRadius}
color={
ui.theme === 'light' ? [255, 255, 255, 0.6] : [0, 0, 0, 0.6]
ui.theme === "light" ? [255, 255, 255, 0.6] : [0, 0, 0, 0.6]
} // RGBA
scale={this.zoom}
rotate={0}
@@ -107,7 +107,7 @@ class ImageUpload extends React.Component<Props> {
onChange={this.handleZoom}
/>
<CropButton onClick={this.handleCrop} disabled={this.isUploading}>
{this.isUploading ? 'Uploading…' : submitText}
{this.isUploading ? "Uploading…" : submitText}
</CropButton>
</Flex>
</Modal>
@@ -167,4 +167,4 @@ const CropButton = styled(Button)`
width: 300px;
`;
export default inject('ui')(ImageUpload);
export default inject("ui")(ImageUpload);

6
app/scenes/Settings/components/NotificationListItem.js
View File

@@ -1,7 +1,7 @@
// @flow
import * as React from 'react';
import Checkbox from 'components/Checkbox';
import NotificationSetting from 'models/NotificationSetting';
import * as React from "react";
import Checkbox from "components/Checkbox";
import NotificationSetting from "models/NotificationSetting";
type Props = {
setting?: NotificationSetting,

12
app/scenes/Settings/components/ShareListItem.js
View File

@@ -1,9 +1,9 @@
// @flow
import * as React from 'react';
import ShareMenu from 'menus/ShareMenu';
import ListItem from 'components/List/Item';
import Time from 'shared/components/Time';
import Share from 'models/Share';
import * as React from "react";
import ShareMenu from "menus/ShareMenu";
import ListItem from "components/List/Item";
import Time from "shared/components/Time";
import Share from "models/Share";
type Props = {
share: Share,
@@ -16,7 +16,7 @@ const ShareListItem = ({ share }: Props) => {
title={share.documentTitle}
subtitle={
<React.Fragment>
Shared <Time dateTime={share.createdAt} /> ago by{' '}
Shared <Time dateTime={share.createdAt} /> ago by{" "}
{share.createdBy.name}
</React.Fragment>
}

10
app/scenes/Settings/components/SlackButton.js
View File

@@ -1,9 +1,9 @@
// @flow
import * as React from 'react';
import styled from 'styled-components';
import { slackAuth } from 'shared/utils/routeHelpers';
import SlackLogo from 'shared/components/SlackLogo';
import Button from 'components/Button';
import * as React from "react";
import styled from "styled-components";
import { slackAuth } from "shared/utils/routeHelpers";
import SlackLogo from "shared/components/SlackLogo";
import Button from "components/Button";
type Props = {
scopes?: string[],

8
app/scenes/Settings/components/TokenListItem.js
View File

@@ -1,8 +1,8 @@
// @flow
import * as React from 'react';
import Button from 'components/Button';
import ListItem from 'components/List/Item';
import ApiKey from 'models/ApiKey';
import * as React from "react";
import Button from "components/Button";
import ListItem from "components/List/Item";
import ApiKey from "models/ApiKey";
type Props = {
token: ApiKey,

24
app/scenes/Settings/components/UserListItem.js
View File

@@ -1,15 +1,15 @@
// @flow
import * as React from 'react';
import styled from 'styled-components';
import { observable } from 'mobx';
import { observer } from 'mobx-react';
import UserMenu from 'menus/UserMenu';
import Avatar from 'components/Avatar';
import Badge from 'components/Badge';
import UserProfile from 'scenes/UserProfile';
import ListItem from 'components/List/Item';
import Time from 'shared/components/Time';
import User from 'models/User';
import * as React from "react";
import styled from "styled-components";
import { observable } from "mobx";
import { observer } from "mobx-react";
import UserMenu from "menus/UserMenu";
import Avatar from "components/Avatar";
import Badge from "components/Badge";
import UserProfile from "scenes/UserProfile";
import ListItem from "components/List/Item";
import Time from "shared/components/Time";
import User from "models/User";
type Props = {
user: User,
@@ -56,7 +56,7 @@ class UserListItem extends React.Component<Props> {
Active <Time dateTime={user.lastActiveAt} /> ago
</React.Fragment>
) : (
'Invited'
"Invited"
)}
{user.isAdmin && <Badge admin={user.isAdmin}>Admin</Badge>}
{user.isSuspended && <Badge>Suspended</Badge>}

2
app/scenes/Settings/index.js
View File

@@ -1,3 +1,3 @@
// @flow
import Profile from './Profile';
import Profile from "./Profile";
export default Profile;

30
app/scenes/Starred.js
View File

@@ -1,18 +1,18 @@
// @flow
import * as React from 'react';
import { observer, inject } from 'mobx-react';
import * as React from "react";
import { observer, inject } from "mobx-react";
import CenteredContent from 'components/CenteredContent';
import Empty from 'components/Empty';
import PageTitle from 'components/PageTitle';
import Heading from 'components/Heading';
import PaginatedDocumentList from 'components/PaginatedDocumentList';
import InputSearch from 'components/InputSearch';
import Tabs from 'components/Tabs';
import Tab from 'components/Tab';
import NewDocumentMenu from 'menus/NewDocumentMenu';
import Actions, { Action } from 'components/Actions';
import DocumentsStore from 'stores/DocumentsStore';
import CenteredContent from "components/CenteredContent";
import Empty from "components/Empty";
import PageTitle from "components/PageTitle";
import Heading from "components/Heading";
import PaginatedDocumentList from "components/PaginatedDocumentList";
import InputSearch from "components/InputSearch";
import Tabs from "components/Tabs";
import Tab from "components/Tab";
import NewDocumentMenu from "menus/NewDocumentMenu";
import Actions, { Action } from "components/Actions";
import DocumentsStore from "stores/DocumentsStore";
type Props = {
documents: DocumentsStore,
@@ -42,7 +42,7 @@ class Starred extends React.Component<Props> {
}
empty={<Empty>You’ve not starred any documents yet.</Empty>}
fetch={fetchStarred}
documents={sort === 'alphabetical' ? starredAlphabetical : starred}
documents={sort === "alphabetical" ? starredAlphabetical : starred}
showCollection
/>
@@ -59,4 +59,4 @@ class Starred extends React.Component<Props> {
}
}
export default inject('documents')(Starred);
export default inject("documents")(Starred);

20
app/scenes/Trash.js
View File

@@ -1,14 +1,14 @@
// @flow
import * as React from 'react';
import { observer, inject } from 'mobx-react';
import * as React from "react";
import { observer, inject } from "mobx-react";
import CenteredContent from 'components/CenteredContent';
import Empty from 'components/Empty';
import PageTitle from 'components/PageTitle';
import Heading from 'components/Heading';
import PaginatedDocumentList from 'components/PaginatedDocumentList';
import Subheading from 'components/Subheading';
import DocumentsStore from 'stores/DocumentsStore';
import CenteredContent from "components/CenteredContent";
import Empty from "components/Empty";
import PageTitle from "components/PageTitle";
import Heading from "components/Heading";
import PaginatedDocumentList from "components/PaginatedDocumentList";
import Subheading from "components/Subheading";
import DocumentsStore from "stores/DocumentsStore";
type Props = {
documents: DocumentsStore,
@@ -35,4 +35,4 @@ class Trash extends React.Component<Props> {
}
}
export default inject('documents')(Trash);
export default inject("documents")(Trash);

20
app/scenes/UserDelete.js
View File

@@ -1,12 +1,12 @@
// @flow
import * as React from 'react';
import { observable } from 'mobx';
import { inject, observer } from 'mobx-react';
import Button from 'components/Button';
import Flex from 'shared/components/Flex';
import HelpText from 'components/HelpText';
import Modal from 'components/Modal';
import AuthStore from 'stores/AuthStore';
import * as React from "react";
import { observable } from "mobx";
import { inject, observer } from "mobx-react";
import Button from "components/Button";
import Flex from "shared/components/Flex";
import HelpText from "components/HelpText";
import Modal from "components/Modal";
import AuthStore from "stores/AuthStore";
type Props = {
auth: AuthStore,
@@ -47,7 +47,7 @@ class UserDelete extends React.Component<Props> {
be automatically reprovisioned.
</HelpText>
<Button type="submit" danger>
{this.isDeleting ? 'Deleting…' : 'Delete My Account'}
{this.isDeleting ? "Deleting…" : "Delete My Account"}
</Button>
</form>
</Flex>
@@ -56,4 +56,4 @@ class UserDelete extends React.Component<Props> {
}
}
export default inject('auth')(UserDelete);
export default inject("auth")(UserDelete);

42
app/scenes/UserProfile.js
View File

@@ -1,22 +1,22 @@
// @flow
import * as React from 'react';
import styled from 'styled-components';
import distanceInWordsToNow from 'date-fns/distance_in_words_to_now';
import { inject, observer } from 'mobx-react';
import { withRouter, type RouterHistory } from 'react-router-dom';
import { EditIcon } from 'outline-icons';
import Flex from 'shared/components/Flex';
import HelpText from 'components/HelpText';
import Modal from 'components/Modal';
import Button from 'components/Button';
import Avatar from 'components/Avatar';
import Badge from 'components/Badge';
import PaginatedDocumentList from 'components/PaginatedDocumentList';
import Subheading from 'components/Subheading';
import User from 'models/User';
import DocumentsStore from 'stores/DocumentsStore';
import AuthStore from 'stores/AuthStore';
import { settings } from 'shared/utils/routeHelpers';
import * as React from "react";
import styled from "styled-components";
import distanceInWordsToNow from "date-fns/distance_in_words_to_now";
import { inject, observer } from "mobx-react";
import { withRouter, type RouterHistory } from "react-router-dom";
import { EditIcon } from "outline-icons";
import Flex from "shared/components/Flex";
import HelpText from "components/HelpText";
import Modal from "components/Modal";
import Button from "components/Button";
import Avatar from "components/Avatar";
import Badge from "components/Badge";
import PaginatedDocumentList from "components/PaginatedDocumentList";
import Subheading from "components/Subheading";
import User from "models/User";
import DocumentsStore from "stores/DocumentsStore";
import AuthStore from "stores/AuthStore";
import { settings } from "shared/utils/routeHelpers";
type Props = {
user: User,
@@ -46,8 +46,8 @@ class UserProfile extends React.Component<Props> {
<Flex column>
<Meta>
{isCurrentUser
? 'You joined'
: user.lastActiveAt ? 'Joined' : 'Invited'}{' '}
? "You joined"
: user.lastActiveAt ? "Joined" : "Invited"}{" "}
{distanceInWordsToNow(new Date(user.createdAt))} ago.
{user.isAdmin && (
<StyledBadge admin={user.isAdmin}>Admin</StyledBadge>
@@ -96,4 +96,4 @@ const Meta = styled(HelpText)`
margin-top: -12px;
`;
export default inject('documents', 'auth')(withRouter(UserProfile));
export default inject("documents", "auth")(withRouter(UserProfile));