extract code into useFirstDraw hook (#689)

This commit is contained in:
mrdrogdrog 2020-10-28 11:34:21 +01:00 committed by GitHub
parent 819b36a137
commit c6d2aa76ca
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 7 deletions

View file

@ -14,6 +14,7 @@ import { DocumentBar } from './document-bar/document-bar'
import { ScrollingDocumentRenderPane } from './document-renderer-pane/scrolling-document-render-pane'
import { EditorPane } from './editor-pane/editor-pane'
import { editorTestContent } from './editorTestContent'
import { useFirstDraw } from './hooks/useFirstDraw'
import { DualScrollState, ScrollState } from './scroll/scroll-props'
import { shortcutHandler } from './shortcut/shortcut'
import { Splitter } from './splitter/splitter'
@ -35,7 +36,6 @@ export const Editor: React.FC = () => {
const untitledNote = t('editor.untitledNote')
const [markdownContent, setMarkdownContent] = useState(editorTestContent)
const isWide = useMedia({ minWidth: 576 })
const [firstDraw, setFirstDraw] = useState(true)
const [documentTitle, setDocumentTitle] = useState(untitledNote)
const noteMetadata = useRef<YAMLMetaData>()
const firstHeading = useRef<string>()
@ -82,15 +82,13 @@ export const Editor: React.FC = () => {
}
}, [])
useEffect(() => {
setFirstDraw(false)
}, [])
const isFirstDraw = useFirstDraw()
useEffect(() => {
if (!firstDraw && !isWide && editorMode === EditorMode.BOTH) {
if (!isFirstDraw && !isWide && editorMode === EditorMode.BOTH) {
setEditorMode(EditorMode.PREVIEW)
}
}, [editorMode, firstDraw, isWide])
}, [editorMode, isFirstDraw, isWide])
const onMarkdownRendererScroll = useCallback((newScrollState: ScrollState) => {
if (scrollSource.current === ScrollSource.RENDERER && editorSyncScroll) {
@ -129,7 +127,9 @@ export const Editor: React.FC = () => {
<ScrollingDocumentRenderPane
content={markdownContent}
onFirstHeadingChange={onFirstHeadingChange}
onMakeScrollSource={() => { scrollSource.current = ScrollSource.RENDERER }}
onMakeScrollSource={() => {
scrollSource.current = ScrollSource.RENDERER
}}
onMetadataChange={onMetadataChange}
onScroll={onMarkdownRendererScroll}
onTaskCheckedChange={onTaskCheckedChange}

View file

@ -0,0 +1,11 @@
import { useEffect, useState } from 'react'
export const useFirstDraw = ():boolean => {
const [firstDraw, setFirstDraw] = useState(true)
useEffect(() => {
setFirstDraw(false)
}, [])
return firstDraw
}