mirror of
https://github.com/hedgedoc/hedgedoc.git
synced 2025-05-23 11:37:02 -04:00
Add read-only view (/s/note) (#563)
* Update Link classes to allow tooltips/titles * Added read-only-view, Move note title extraction into separate file (cherry picked from commit be23083ca3966f26b1b841d5cf4f21e299c8a55a) (cherry picked from commit cbc595d3fc336b0a649c396dfae30fa08082384c) * Optimized look of document-infobar (cherry picked from commit 0176668b156da3fd7c534161a839ca0e3495119c) # Conflicts: # src/components/editor/document-bar/document-info/document-info-time-line.tsx * Show help-button only in Editor-variant of AppBar (cherry picked from commit 3c26e1619c774fe162cb3d8fae9e79ced92c9c3e) * Update CHANGELOG (cherry picked from commit d0d29e7d408515cc8f86df45d13fff60d741873e) * Move motd-banner to top of page (cherry picked from commit 43a9a274bf5da3fdf640ec905ab38153c81b014b) * Refactor isInline to size property (cherry picked from commit cb4ee74b7c97ec9711946f28924e9c890b752ea3) # Conflicts: # src/components/editor/document-bar/document-info/document-info-time-line.tsx * Add size attribute to user-avatar (cherry picked from commit 9629b58911b9d4f3aed81ef8c271fbc8e5a15aa4) * Add mode-enum to app-bar (cherry picked from commit 08f95be58974468c1e2897b475e5e3235b79c230) * Split DocumentRenderPane into scrollable- and non-scrollable variant (cherry picked from commit 44dd27edfd967745c548f7ae1fd2047e812cdc22) * Removed unnecessary className
This commit is contained in:
parent
36679753d7
commit
9e9108ec9a
23 changed files with 379 additions and 143 deletions
|
@ -6,11 +6,12 @@ import { ApplicationState } from '../../redux'
|
|||
import { setEditorMode } from '../../redux/editor/methods'
|
||||
import { ApplyDarkMode } from '../common/apply-dark-mode/apply-dark-mode'
|
||||
import { DocumentTitle } from '../common/document-title/document-title'
|
||||
import { extractNoteTitle } from '../common/document-title/note-title-extractor'
|
||||
import { MotdBanner } from '../common/motd-banner/motd-banner'
|
||||
import { AppBar } from './app-bar/app-bar'
|
||||
import { AppBar, AppBarMode } from './app-bar/app-bar'
|
||||
import { EditorMode } from './app-bar/editor-view-mode'
|
||||
import { DocumentBar } from './document-bar/document-bar'
|
||||
import { DocumentRenderPane } from './document-renderer-pane/document-render-pane'
|
||||
import { ScrollingDocumentRenderPane } from './document-renderer-pane/scrolling-document-render-pane'
|
||||
import { EditorPane } from './editor-pane/editor-pane'
|
||||
import { editorTestContent } from './editorTestContent'
|
||||
import { DualScrollState, ScrollState } from './scroll/scroll-props'
|
||||
|
@ -49,14 +50,9 @@ export const Editor: React.FC = () => {
|
|||
}))
|
||||
|
||||
const updateDocumentTitle = useCallback(() => {
|
||||
if (noteMetadata.current?.title && noteMetadata.current?.title !== '') {
|
||||
setDocumentTitle(noteMetadata.current.title)
|
||||
} else if (noteMetadata.current?.opengraph && noteMetadata.current?.opengraph.get('title') && noteMetadata.current?.opengraph.get('title') !== '') {
|
||||
setDocumentTitle(noteMetadata.current.opengraph.get('title') ?? untitledNote)
|
||||
} else {
|
||||
setDocumentTitle((firstHeading.current ?? untitledNote).trim())
|
||||
}
|
||||
}, [untitledNote])
|
||||
const noteTitle = extractNoteTitle(untitledNote, noteMetadata.current, firstHeading.current)
|
||||
setDocumentTitle(noteTitle)
|
||||
}, [noteMetadata, firstHeading, untitledNote])
|
||||
|
||||
const onFirstHeadingChange = useCallback((newFirstHeading: string | undefined) => {
|
||||
firstHeading.current = newFirstHeading
|
||||
|
@ -114,7 +110,7 @@ export const Editor: React.FC = () => {
|
|||
<MotdBanner/>
|
||||
<DocumentTitle title={documentTitle}/>
|
||||
<div className={'d-flex flex-column vh-100'}>
|
||||
<AppBar/>
|
||||
<AppBar mode={AppBarMode.EDITOR}/>
|
||||
<DocumentBar title={documentTitle} noteContent={markdownContent} updateNoteContent={(newContent) => setMarkdownContent(newContent)}/>
|
||||
<Splitter
|
||||
showLeft={editorMode === EditorMode.EDITOR || editorMode === EditorMode.BOTH}
|
||||
|
@ -129,7 +125,7 @@ export const Editor: React.FC = () => {
|
|||
}
|
||||
showRight={editorMode === EditorMode.PREVIEW || (editorMode === EditorMode.BOTH)}
|
||||
right={
|
||||
<DocumentRenderPane
|
||||
<ScrollingDocumentRenderPane
|
||||
content={markdownContent}
|
||||
onFirstHeadingChange={onFirstHeadingChange}
|
||||
onMakeScrollSource={() => { scrollSource.current = ScrollSource.RENDERER }}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue