diff --git a/app/components/ClickablePadding.js b/app/components/ClickablePadding.js index dde8c679..7cb739c1 100644 --- a/app/components/ClickablePadding.js +++ b/app/components/ClickablePadding.js @@ -2,9 +2,8 @@ import styled from 'styled-components'; const ClickablePadding = styled.div` - min-height: 50vh; cursor: ${({ onClick }) => (onClick ? 'text' : 'default')}; - ${({ grow }) => grow && `flex-grow: 1;`}; + ${({ grow }) => grow && `flex-grow: 100;`}; `; export default ClickablePadding; diff --git a/app/components/Sidebar/components/Collections.js b/app/components/Sidebar/components/Collections.js index a0205511..c1d938e4 100644 --- a/app/components/Sidebar/components/Collections.js +++ b/app/components/Sidebar/components/Collections.js @@ -1,8 +1,11 @@ // @flow import * as React from 'react'; import { observer, inject } from 'mobx-react'; +import { withRouter } from 'react-router-dom'; +import keydown from 'react-keydown'; import Flex from 'shared/components/Flex'; import { PlusIcon } from 'outline-icons'; +import { newDocumentUrl } from 'utils/routeHelpers'; import Header from './Header'; import SidebarLink from './SidebarLink'; @@ -14,6 +17,7 @@ import UiStore from 'stores/UiStore'; import DocumentsStore from 'stores/DocumentsStore'; type Props = { + history: Object, collections: CollectionsStore, documents: DocumentsStore, onCreateCollection: () => void, @@ -28,8 +32,17 @@ class Collections extends React.Component { this.props.collections.fetchPage({ limit: 100 }); } + @keydown('n') + goToNewDocument() { + const activeCollection = this.props.collections.active; + if (!activeCollection) return; + + this.props.history.push(newDocumentUrl(activeCollection)); + } + render() { const { collections, ui, documents } = this.props; + const content = (
Collections
@@ -57,4 +70,6 @@ class Collections extends React.Component { } } -export default inject('collections', 'ui', 'documents')(Collections); +export default inject('collections', 'ui', 'documents')( + withRouter(Collections) +); diff --git a/app/models/Document.js b/app/models/Document.js index d06bf60a..e6e59332 100644 --- a/app/models/Document.js +++ b/app/models/Document.js @@ -86,7 +86,7 @@ export default class Document extends BaseModel { @computed get isEmpty(): boolean { // Check if the document title has been modified and user generated content exists - return this.text.replace(new RegExp(`^#$`), '').trim().length === 0; + return this.text.replace(/^#/, '').trim().length === 0; } @computed diff --git a/app/scenes/Document/Document.js b/app/scenes/Document/Document.js index 3c829988..f436a1dc 100644 --- a/app/scenes/Document/Document.js +++ b/app/scenes/Document/Document.js @@ -194,6 +194,10 @@ class DocumentScene extends React.Component { handleCloseMoveModal = () => (this.moveModalOpen = false); handleOpenMoveModal = () => (this.moveModalOpen = true); + onSaveAndExit = () => { + this.onSave({ done: true, publish: true }); + }; + onSave = async ( options: { done?: boolean, publish?: boolean, autosave?: boolean } = {} ) => { @@ -367,7 +371,7 @@ class DocumentScene extends React.Component { onImageUploadStop={this.onImageUploadStop} onSearchLink={this.onSearchLink} onChange={this.onChange} - onSave={this.onSave} + onSave={this.onSaveAndExit} onCancel={this.onDiscard} readOnly={!this.isEditing} toc={!revision} @@ -387,7 +391,6 @@ const MaxWidth = styled(Flex)` padding: 0 16px; max-width: 100vw; width: 100%; - height: 100%; ${breakpoint('tablet')` padding: 0 24px; diff --git a/app/scenes/Document/components/Editor.js b/app/scenes/Document/components/Editor.js index 6dd4b517..67cb5879 100644 --- a/app/scenes/Document/components/Editor.js +++ b/app/scenes/Document/components/Editor.js @@ -48,6 +48,8 @@ class DocumentEditor extends React.Component { } const StyledEditor = styled(Editor)` + justify-content: start; + p { ${Placeholder} { visibility: hidden; diff --git a/app/scenes/Document/components/Header.js b/app/scenes/Document/components/Header.js index 54c78847..97239200 100644 --- a/app/scenes/Document/components/Header.js +++ b/app/scenes/Document/components/Header.js @@ -10,6 +10,7 @@ import { NewDocumentIcon } from 'outline-icons'; 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 from './Breadcrumb'; @@ -107,6 +108,7 @@ class Header extends React.Component { justify="space-between" readOnly={!isEditing} isCompact={this.isScrolled} + shrink={false} > {