github/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2025-02-02 16:11:31 +00:00
Code Issues Projects Releases Packages Wiki Activity

Add support for editor-mode URL parameters (#873)

Browse source
This commit is contained in:
Erik Michelson 2020-12-22 21:45:11 +01:00 committed by GitHub
parent 721c8c0e5a
commit 95c563255d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 33 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
cypress/integration/editorMode.spec.ts Normal file
View file

@ -0,0 +1,24 @@
/*
* SPDX-FileCopyrightText: 2020 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
describe('Editor mode from URL parameter is used', () => {
it('mode view', () => {
cy.visit('/n/features?view')
cy.get('.splitter.left').should('have.class', 'd-none')
cy.get('.splitter.right').should('not.have.class', 'd-none')
})
it('mode both', () => {
cy.visit('/n/features?both')
cy.get('.splitter.left').should('not.have.class', 'd-none')
cy.get('.splitter.separator').should('exist')
cy.get('.splitter.right').should('not.have.class', 'd-none')
})
it('mode edit', () => {
cy.visit('/n/features?edit')
cy.get('.splitter.left').should('not.have.class', 'd-none')
cy.get('.splitter.right').should('have.class', 'd-none')
})
})

2
src/components/editor/app-bar/editor-view-mode.tsx
View file

@ -15,7 +15,7 @@ import { ForkAwesomeIcon } from '../../common/fork-awesome/fork-awesome-icon'
export enum EditorMode {
PREVIEW = 'view',
BOTH = 'both',
EDITOR = 'edit',
EDITOR = 'edit'
}
export const EditorViewMode: React.FC = () => {

10
src/components/editor/editor.tsx
View file

@ -7,7 +7,7 @@ SPDX-License-Identifier: AGPL-3.0-only
import React, { Fragment, useCallback, useEffect, useRef, useState } from 'react'
import { useTranslation } from 'react-i18next'
import { useSelector } from 'react-redux'
import { useParams } from 'react-router'
import { useLocation, useParams } from 'react-router'
import useMedia from 'use-media'
import { useApplyDarkMode } from '../../hooks/common/use-apply-dark-mode'
import { useDocumentTitle } from '../../hooks/common/use-document-title'
@ -42,6 +42,7 @@ const TASK_REGEX = /(\s*[-*] )(\[[ xX]])( .*)/
export const Editor: React.FC = () => {
const { t } = useTranslation()
const { id } = useParams<EditorPathParams>()
const { search } = useLocation()
const untitledNote = t('editor.untitledNote')
const markdownContent = useSelector((state: ApplicationState) => state.documentContent.content)
const isWide = useMedia({ minWidth: 576 })
@ -60,7 +61,12 @@ export const Editor: React.FC = () => {
useEffect(() => {
setDocumentContent(editorTestContent)
}, [])
const requestedMode = search.substr(1)
const mode = Object.values(EditorMode).find(mode => mode === requestedMode)
if (mode) {
setEditorMode(mode)
}
}, [search])
const updateDocumentTitle = useCallback(() => {
const noteTitle = extractNoteTitle(untitledNote, noteMetadata.current, firstHeading.current)