mirrors/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2025-05-22 19:25:18 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add application state hook (#1308)

Browse source 
* Add application state hook

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>

* Add docs

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Tilman Vatteroth 2021-06-11 15:21:24 +02:00 • committed by GitHub
parent 4720f2d36b
commit 829cc2fe48
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
47 changed files with 149 additions and 195 deletions
Download patch file Download diff file Expand all files Collapse all files

22
src/hooks/common/use-application-state.ts Normal file
View file

@ -0,0 +1,22 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { useSelector } from 'react-redux'
import { ApplicationState } from '../../redux'
import equal from 'fast-deep-equal'
/**
* Accesses the global application state to retrieve information.
*
* @param selector A selector function that extracts the needed information from the state.
* @param checkForEquality An optional custom equality function. If not provided then {@link equal equal from fast-deep-equal} will be used.
*/
export const useApplicationState = <TSelected>(
selector: (state: ApplicationState) => TSelected,
checkForEquality?: (a: TSelected, b: TSelected) => boolean
): TSelected => {
return useSelector<ApplicationState, TSelected>(selector, checkForEquality ? checkForEquality : equal)
}

5
src/hooks/common/use-document-title-with-note-title.ts
View file

@ -5,14 +5,13 @@
*/
import { useTranslation } from 'react-i18next'
import { useSelector } from 'react-redux'
import { ApplicationState } from '../../redux'
import { useApplicationState } from './use-application-state'
import { useDocumentTitle } from './use-document-title'
export const useDocumentTitleWithNoteTitle = (): void => {
const { t } = useTranslation()
const untitledNote = t('editor.untitledNote')
const noteTitle = useSelector((state: ApplicationState) => state.noteDetails.noteTitle)
const noteTitle = useApplicationState((state) => state.noteDetails.noteTitle)
useDocumentTitle(noteTitle === '' ? untitledNote : noteTitle)
}

5
src/hooks/common/use-document-title.ts
View file

@ -5,11 +5,10 @@
*/
import { useEffect } from 'react'
import { useSelector } from 'react-redux'
import { ApplicationState } from '../../redux'
import { useApplicationState } from './use-application-state'
export const useDocumentTitle = (title?: string): void => {
const brandingName = useSelector((state: ApplicationState) => state.config.branding.name)
const brandingName = useApplicationState((state) => state.config.branding.name)
useEffect(() => {
document.title = `${title ? title + ' - ' : ''}HedgeDoc ${brandingName ? ` @ ${brandingName}` : ''}`

5
src/hooks/common/use-is-dark-mode-activated.ts
View file

@ -4,9 +4,8 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { useSelector } from 'react-redux'
import { ApplicationState } from '../../redux'
import { useApplicationState } from './use-application-state'
export const useIsDarkModeActivated = (): boolean => {
return useSelector((state: ApplicationState) => state.darkMode.darkMode)
return useApplicationState((state) => state.darkMode.darkMode)
}

5
src/hooks/common/use-note-markdown-content.ts
View file

@ -4,9 +4,8 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { useSelector } from 'react-redux'
import { ApplicationState } from '../../redux'
import { useApplicationState } from './use-application-state'
export const useNoteMarkdownContent = (): string => {
return useSelector((state: ApplicationState) => state.noteDetails.markdownContent)
return useApplicationState((state) => state.noteDetails.markdownContent)
}