Move frontmatter types (#1664)

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

src/components/editor-page/app-bar/app-bar.tsx

@@ -14,11 +14,11 @@ import { EditorViewMode } from './editor-view-mode'
 import { HelpButton } from './help-button/help-button'
 import { NavbarBranding } from './navbar-branding'
 import { SyncScrollButtons } from './sync-scroll-buttons/sync-scroll-buttons'
-import { NoteType } from '../../common/note-frontmatter/types'
 import { SlideModeButton } from './slide-mode-button'
 import { ReadOnlyModeButton } from './read-only-mode-button'
 import { NewNoteButton } from './new-note-button'
 import { useApplicationState } from '../../../hooks/common/use-application-state'
+import { NoteType } from '../../../redux/note-details/types/note-details'
 
 export enum AppBarMode {
   BASIC,

src/components/editor-page/document-bar/share/share-modal.tsx

@@ -14,8 +14,8 @@ import type { ModalVisibilityProps } from '../../../common/modals/common-modal'
 import { CommonModal } from '../../../common/modals/common-modal'
 import { ShowIf } from '../../../common/show-if/show-if'
 import type { EditorPagePathParams } from '../../editor-page'
-import { NoteType } from '../../../common/note-frontmatter/types'
 import { useApplicationState } from '../../../../hooks/common/use-application-state'
+import { NoteType } from '../../../../redux/note-details/types/note-details'
 
 export const ShareModal: React.FC<ModalVisibilityProps> = ({ show, onHide }) => {
   useTranslation()
@@ -37,7 +37,7 @@ export const ShareModal: React.FC<ModalVisibilityProps> = ({ show, onHide }) =>
           <Trans i18nKey={'editor.modal.shareLink.slidesDescription'} />
           <CopyableField content={`${baseUrl}p/${id}`} nativeShareButton={true} url={`${baseUrl}p/${id}`} />
         </ShowIf>
-        <ShowIf condition={noteFrontmatter.type === ''}>
+        <ShowIf condition={noteFrontmatter.type === NoteType.DOCUMENT}>
           <Trans i18nKey={'editor.modal.shareLink.viewOnlyDescription'} />
           <CopyableField content={`${baseUrl}s/${id}`} nativeShareButton={true} url={`${baseUrl}s/${id}`} />
         </ShowIf>

src/components/editor-page/editor-page.tsx

@@ -29,7 +29,7 @@ import { useApplicationState } from '../../hooks/common/use-application-state'
 import { EditorDocumentRenderer } from './editor-document-renderer/editor-document-renderer'
 import { EditorToRendererCommunicatorContextProvider } from './render-context/editor-to-renderer-communicator-context-provider'
 import { Logger } from '../../utils/logger'
-import { NoteType } from '../common/note-frontmatter/types'
+import { NoteType } from '../../redux/note-details/types/note-details'
 
 export interface EditorPagePathParams {
   id: string

src/components/editor-page/renderer-pane/hooks/use-send-frontmatter-info-from-redux-to-renderer.ts

@@ -8,8 +8,8 @@ import { useSendToRenderer } from '../../../render-page/window-post-message-comm
 import { useMemo, useRef } from 'react'
 import { CommunicationMessageType } from '../../../render-page/window-post-message-communicator/rendering-message'
 import { useApplicationState } from '../../../../hooks/common/use-application-state'
-import type { RendererFrontmatterInfo } from '../../../common/note-frontmatter/types'
 import equal from 'fast-deep-equal'
+import type { RendererFrontmatterInfo } from '../../../../redux/note-details/types/note-details'
 
 /**
  * Extracts the {@link RendererFrontmatterInfo frontmatter data}

src/components/markdown-renderer/hooks/use-reveal.ts

@@ -7,7 +7,7 @@
 import { useEffect, useRef, useState } from 'react'
 import Reveal from 'reveal.js'
 import { Logger } from '../../../utils/logger'
-import type { SlideOptions } from '../../common/note-frontmatter/types'
+import type { SlideOptions } from '../../../redux/note-details/types/slide-show-options'
 
 const log = new Logger('reveal.js')
 

src/components/markdown-renderer/slideshow-markdown-renderer.tsx

@@ -15,11 +15,11 @@ import { REVEAL_STATUS, useReveal } from './hooks/use-reveal'
 import './slideshow.scss'
 import type { ScrollProps } from '../editor-page/synced-scroll/scroll-props'
 import { DocumentLengthLimitReachedAlert } from './document-length-limit-reached-alert'
-import type { SlideOptions } from '../common/note-frontmatter/types'
 import type { CommonMarkdownRendererProps } from './common-markdown-renderer-props'
 import { LoadingSlide } from './loading-slide'
 import { RevealMarkdownExtension } from './markdown-extension/reveal/reveal-markdown-extension'
 import { useMarkdownExtensions } from './hooks/use-markdown-extensions'
+import type { SlideOptions } from '../../redux/note-details/types/slide-show-options'
 
 export interface SlideshowMarkdownRendererProps extends CommonMarkdownRendererProps {
   slideOptions: SlideOptions

src/components/render-page/iframe-markdown-renderer.tsx

@@ -13,11 +13,11 @@ import type { ImageClickHandler } from '../markdown-renderer/markdown-extension/
 import { useImageClickHandler } from './hooks/use-image-click-handler'
 import { MarkdownDocument } from './markdown-document'
 import { countWords } from './word-counter'
-import type { RendererFrontmatterInfo } from '../common/note-frontmatter/types'
 import { useRendererToEditorCommunicator } from '../editor-page/render-context/renderer-to-editor-communicator-context-provider'
 import { useRendererReceiveHandler } from './window-post-message-communicator/hooks/use-renderer-receive-handler'
 import { SlideshowMarkdownRenderer } from '../markdown-renderer/slideshow-markdown-renderer'
 import { initialState } from '../../redux/note-details/initial-state'
+import type { RendererFrontmatterInfo } from '../../redux/note-details/types/note-details'
 
 export const IframeMarkdownRenderer: React.FC = () => {
   const [markdownContent, setMarkdownContent] = useState('')

src/components/render-page/markdown-document.tsx

@@ -17,8 +17,8 @@ import './markdown-document.scss'
 import { WidthBasedTableOfContents } from './width-based-table-of-contents'
 import { ShowIf } from '../common/show-if/show-if'
 import { useApplicationState } from '../../hooks/common/use-application-state'
-import type { RendererFrontmatterInfo } from '../common/note-frontmatter/types'
 import { InvalidYamlAlert } from '../markdown-renderer/invalid-yaml-alert'
+import type { RendererFrontmatterInfo } from '../../redux/note-details/types/note-details'
 
 export interface RendererProps extends ScrollProps {
   onFirstHeadingChange?: (firstHeading: string | undefined) => void

src/components/render-page/window-post-message-communicator/rendering-message.ts

@@ -4,7 +4,7 @@
  * SPDX-License-Identifier: AGPL-3.0-only
  */
 import type { ScrollState } from '../../editor-page/synced-scroll/scroll-props'
-import type { RendererFrontmatterInfo } from '../../common/note-frontmatter/types'
+import type { RendererFrontmatterInfo } from '../../../redux/note-details/types/note-details'
 
 export enum CommunicationMessageType {
   SET_MARKDOWN_CONTENT = 'SET_MARKDOWN_CONTENT',

src/redux/index.ts

@@ -17,7 +17,6 @@ import type { DarkModeConfig } from './dark-mode/types'
 import { EditorConfigReducer } from './editor/reducers'
 import type { EditorConfig } from './editor/types'
 import { NoteDetailsReducer } from './note-details/reducer'
-import type { NoteDetails } from './note-details/types'
 import { UserReducer } from './user/reducers'
 import type { OptionalUserState } from './user/types'
 import type { UiNotificationState } from './ui-notifications/types'
@@ -27,6 +26,7 @@ import { HistoryReducer } from './history/reducers'
 import { RendererStatusReducer } from './renderer-status/reducers'
 import type { RendererStatus } from './renderer-status/types'
 import { composeWithDevTools } from 'redux-devtools-extension/developmentOnly'
+import type { NoteDetails } from './note-details/types/note-details'
 
 export interface ApplicationState {
   user: OptionalUserState

src/redux/note-details/frontmatter-extractor/extractor.test.ts

@@ -4,7 +4,7 @@
  * SPDX-License-Identifier: AGPL-3.0-only
  */
 
-import { extractFrontmatter } from './extract-frontmatter'
+import { extractFrontmatter } from './extractor'
 import type { PresentFrontmatterExtractionResult } from './types'
 
 describe('frontmatter extraction', () => {

src/redux/note-details/frontmatter-extractor/types.d.ts

@@ -0,0 +1,17 @@
+/*
+ * SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ *
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+export type FrontmatterExtractionResult = PresentFrontmatterExtractionResult | NonPresentFrontmatterExtractionResult
+
+export interface PresentFrontmatterExtractionResult {
+  isPresent: true
+  rawText: string
+  lineOffset: number
+}
+
+interface NonPresentFrontmatterExtractionResult {
+  isPresent: false
+}

src/redux/note-details/initial-state.ts

@@ -4,10 +4,10 @@
  * SPDX-License-Identifier: AGPL-3.0-only
  */
 
-import type { NoteDetails } from './types'
 import { DateTime } from 'luxon'
-import type { SlideOptions } from '../../components/common/note-frontmatter/types'
+import type { NoteDetails } from './types/note-details'
-import { NoteTextDirection, NoteType } from '../../components/common/note-frontmatter/types'
+import type { SlideOptions } from './types/slide-show-options'
+import { NoteTextDirection, NoteType } from './types/note-details'
 
 export const initialSlideOptions: SlideOptions = {
   transition: 'zoom',

src/redux/note-details/raw-note-frontmatter-parser/parser.test.ts

@@ -4,7 +4,7 @@
  * SPDX-License-Identifier: AGPL-3.0-only
  */
 
-import { createNoteFrontmatterFromYaml } from './note-frontmatter'
+import { createNoteFrontmatterFromYaml } from './parser'
 
 describe('yaml frontmatter', () => {
   it('should parse "title"', () => {

src/redux/note-details/raw-note-frontmatter-parser/parser.ts

@@ -4,36 +4,30 @@
  * SPDX-License-Identifier: AGPL-3.0-only
  */
 
-// import { RevealOptions } from 'reveal.js'
 import { load } from 'js-yaml'
-import type { RawNoteFrontmatter, SlideOptions } from './types'
+import type { SlideOptions } from '../types/slide-show-options'
-import { ISO6391, NoteTextDirection, NoteType } from './types'
+import type { NoteFrontmatter } from '../types/note-details'
-import { initialSlideOptions } from '../../../redux/note-details/initial-state'
+import { NoteTextDirection, NoteType } from '../types/note-details'
+import { ISO6391 } from '../types/iso6391'
+import type { RawNoteFrontmatter } from './types'
+import { initialSlideOptions } from '../initial-state'
 
 /**
- * Class that represents the parsed frontmatter metadata of a note.
+ * Creates a new frontmatter metadata instance based on a raw yaml string.
+ * @param rawYaml The frontmatter content in yaml format.
+ * @throws Error when the content string is invalid yaml.
+ * @return Frontmatter metadata instance containing the parsed properties from the yaml content.
  */
-export interface NoteFrontmatter {
+export const createNoteFrontmatterFromYaml = (rawYaml: string): NoteFrontmatter => {
-  title: string
+  const rawNoteFrontmatter = load(rawYaml) as RawNoteFrontmatter
-  description: string
+  return parseRawNoteFrontmatter(rawNoteFrontmatter)
-  tags: string[]
-  deprecatedTagsSyntax: boolean
-  robots: string
-  lang: typeof ISO6391[number]
-  dir: NoteTextDirection
-  newlinesAreBreaks: boolean
-  GA: string
-  disqus: string
-  type: NoteType
-  opengraph: Map<string, string>
-  slideOptions: SlideOptions
 }
 
 /**
  * Creates a new frontmatter metadata instance based on the given raw metadata properties.
  * @param rawData A {@link RawNoteFrontmatter} object containing the properties of the parsed yaml frontmatter.
  */
-export const parseRawNoteFrontmatter = (rawData: RawNoteFrontmatter): NoteFrontmatter => {
+const parseRawNoteFrontmatter = (rawData: RawNoteFrontmatter): NoteFrontmatter => {
   let tags: string[]
   let deprecatedTagsSyntax: boolean
   if (typeof rawData?.tags === 'string') {
@@ -55,11 +49,8 @@ export const parseRawNoteFrontmatter = (rawData: RawNoteFrontmatter): NoteFrontm
     GA: rawData.GA ?? '',
     disqus: rawData.disqus ?? '',
     lang: (rawData.lang ? ISO6391.find((lang) => lang === rawData.lang) : undefined) ?? 'en',
-    type:
+    type: rawData.type === NoteType.SLIDE ? NoteType.SLIDE : NoteType.DOCUMENT,
-      (rawData.type ? Object.values(NoteType).find((type) => type === rawData.type) : undefined) ?? NoteType.DOCUMENT,
+    dir: rawData.dir === NoteTextDirection.LTR ? NoteTextDirection.LTR : NoteTextDirection.RTL,
-    dir:
-      (rawData.dir ? Object.values(NoteTextDirection).find((dir) => dir === rawData.dir) : undefined) ??
-      NoteTextDirection.LTR,
     opengraph: rawData?.opengraph
       ? new Map<string, string>(Object.entries(rawData.opengraph))
       : new Map<string, string>(),
@@ -110,14 +101,3 @@ const parseNumber = (rawData: unknown | undefined): number | undefined => {
   const numValue = Number(rawData)
   return isNaN(numValue) ? undefined : numValue
 }
-
-/**
- * Creates a new frontmatter metadata instance based on a raw yaml string.
- * @param rawYaml The frontmatter content in yaml format.
- * @throws Error when the content string is invalid yaml.
- * @return Frontmatter metadata instance containing the parsed properties from the yaml content.
- */
-export const createNoteFrontmatterFromYaml = (rawYaml: string): NoteFrontmatter => {
-  const rawNoteFrontmatter = load(rawYaml) as RawNoteFrontmatter
-  return parseRawNoteFrontmatter(rawNoteFrontmatter)
-}

src/redux/note-details/raw-note-frontmatter-parser/types.d.ts

@@ -0,0 +1,20 @@
+/*
+ * SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ *
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+export interface RawNoteFrontmatter {
+  title: string | undefined
+  description: string | undefined
+  tags: string | string[] | undefined
+  robots: string | undefined
+  lang: string | undefined
+  dir: string | undefined
+  breaks: boolean | undefined
+  GA: string | undefined
+  disqus: string | undefined
+  type: string | undefined
+  slideOptions: { [key: string]: string } | null
+  opengraph: { [key: string]: string } | null
+}

src/redux/note-details/reducer.ts

@@ -5,15 +5,15 @@
  */
 
 import type { Reducer } from 'redux'
-import type { PresentFrontmatterExtractionResult } from '../../components/common/note-frontmatter/types'
+import { createNoteFrontmatterFromYaml } from './raw-note-frontmatter-parser/parser'
-import type { NoteFrontmatter } from '../../components/common/note-frontmatter/note-frontmatter'
+import type { NoteDetailsActions } from './types'
-import { createNoteFrontmatterFromYaml } from '../../components/common/note-frontmatter/note-frontmatter'
-import type { NoteDetails, NoteDetailsActions } from './types'
 import { NoteDetailsActionType } from './types'
-import { extractFrontmatter } from '../../components/common/note-frontmatter/extract-frontmatter'
+import { extractFrontmatter } from './frontmatter-extractor/extractor'
 import type { NoteDto } from '../../api/notes/types'
 import { initialState } from './initial-state'
 import { DateTime } from 'luxon'
+import type { NoteDetails, NoteFrontmatter } from './types/note-details'
+import type { PresentFrontmatterExtractionResult } from './frontmatter-extractor/types'
 
 export const NoteDetailsReducer: Reducer<NoteDetails, NoteDetailsActions> = (
   state: NoteDetails = initialState,
@@ -75,7 +75,15 @@ const buildStateFromTaskListUpdate = (
  */
 const buildStateFromMarkdownContentUpdate = (state: NoteDetails, markdownContent: string): NoteDetails => {
   const frontmatterExtraction = extractFrontmatter(markdownContent)
-  if (!frontmatterExtraction.isPresent) {
+  if (frontmatterExtraction.isPresent) {
+    return buildStateFromFrontmatterUpdate(
+      {
+        ...state,
+        markdownContent: markdownContent
+      },
+      frontmatterExtraction
+    )
+  } else {
     return {
       ...state,
       markdownContent: markdownContent,
@@ -85,13 +93,6 @@ const buildStateFromMarkdownContentUpdate = (state: NoteDetails, markdownContent
       frontmatterRendererInfo: initialState.frontmatterRendererInfo
     }
   }
-  return buildStateFromFrontmatterUpdate(
-    {
-      ...state,
-      markdownContent: markdownContent
-    },
-    frontmatterExtraction
-  )
 }
 
 /**

src/redux/note-details/types.ts

@@ -4,11 +4,8 @@
  * SPDX-License-Identifier: AGPL-3.0-only
  */
 
-import type { DateTime } from 'luxon'
 import type { Action } from 'redux'
-import type { NoteFrontmatter } from '../../components/common/note-frontmatter/note-frontmatter'
 import type { NoteDto } from '../../api/notes/types'
-import type { RendererFrontmatterInfo } from '../../components/common/note-frontmatter/types'
 
 export enum NoteDetailsActionType {
   SET_DOCUMENT_CONTENT = 'note-details/content/set',
@@ -16,28 +13,6 @@ export enum NoteDetailsActionType {
   UPDATE_NOTE_TITLE_BY_FIRST_HEADING = 'note-details/update-note-title-by-first-heading',
   UPDATE_TASK_LIST_CHECKBOX = 'note-details/update-task-list-checkbox'
 }
-interface LastChange {
-  userName: string
-  timestamp: DateTime
-}
-
-/**
- * Redux state containing the currently loaded note with its content and metadata.
- */
-export interface NoteDetails {
-  markdownContent: string
-  rawFrontmatter: string
-  frontmatter: NoteFrontmatter
-  frontmatterRendererInfo: RendererFrontmatterInfo
-  id: string
-  createTime: DateTime
-  lastChange: LastChange
-  viewCount: number
-  alias: string
-  authorship: string[]
-  noteTitle: string
-  firstHeading?: string
-}
 
 export type NoteDetailsActions =
   | SetNoteDocumentContentAction

src/redux/note-details/types/iso6391.ts

@@ -4,50 +4,6 @@
  * SPDX-License-Identifier: AGPL-3.0-only
  */
 
-import type { RevealOptions } from 'reveal.js'
-
-export type FrontmatterExtractionResult = PresentFrontmatterExtractionResult | NonPresentFrontmatterExtractionResult
-
-export type WantedRevealOptions =
-  | 'autoSlide'
-  | 'autoSlideStoppable'
-  | 'transition'
-  | 'backgroundTransition'
-  | 'slideNumber'
-export type SlideOptions = Required<Pick<RevealOptions, WantedRevealOptions>>
-
-export interface RendererFrontmatterInfo {
-  lineOffset: number
-  frontmatterInvalid: boolean
-  deprecatedSyntax: boolean
-  slideOptions: SlideOptions
-}
-
-export interface PresentFrontmatterExtractionResult {
-  isPresent: true
-  rawText: string
-  lineOffset: number
-}
-
-interface NonPresentFrontmatterExtractionResult {
-  isPresent: false
-}
-
-export interface RawNoteFrontmatter {
-  title: string | undefined
-  description: string | undefined
-  tags: string | string[] | undefined
-  robots: string | undefined
-  lang: string | undefined
-  dir: string | undefined
-  breaks: boolean | undefined
-  GA: string | undefined
-  disqus: string | undefined
-  type: string | undefined
-  slideOptions: { [key: string]: string } | null
-  opengraph: { [key: string]: string } | null
-}
-
 export const ISO6391 = [
   'aa',
   'ab',
@@ -252,13 +208,3 @@ export const ISO6391 = [
   'zh-tw',
   'zu'
 ] as const
-
-export enum NoteType {
-  DOCUMENT = '',
-  SLIDE = 'slide'
-}
-
-export enum NoteTextDirection {
-  LTR = 'ltr',
-  RTL = 'rtl'
-}

src/redux/note-details/types/note-details.ts

@@ -0,0 +1,63 @@
+/*
+ * SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ *
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import type { DateTime } from 'luxon'
+import type { SlideOptions } from './slide-show-options'
+import type { ISO6391 } from './iso6391'
+
+/**
+ * Redux state containing the currently loaded note with its content and metadata.
+ */
+export interface NoteDetails {
+  markdownContent: string
+  rawFrontmatter: string
+  frontmatter: NoteFrontmatter
+  frontmatterRendererInfo: RendererFrontmatterInfo
+  id: string
+  createTime: DateTime
+  lastChange: {
+    userName: string
+    timestamp: DateTime
+  }
+  viewCount: number
+  alias: string
+  authorship: string[]
+  noteTitle: string
+  firstHeading?: string
+}
+
+export interface NoteFrontmatter {
+  title: string
+  description: string
+  tags: string[]
+  deprecatedTagsSyntax: boolean
+  robots: string
+  lang: typeof ISO6391[number]
+  dir: NoteTextDirection
+  newlinesAreBreaks: boolean
+  GA: string
+  disqus: string
+  type: NoteType
+  opengraph: Map<string, string>
+  slideOptions: SlideOptions
+}
+
+export enum NoteTextDirection {
+  LTR = 'ltr',
+  RTL = 'rtl'
+}
+
+export enum NoteType {
+  DOCUMENT = '',
+  SLIDE = 'slide'
+}
+
+export interface RendererFrontmatterInfo {
+  lineOffset: number
+  frontmatterInvalid: boolean
+  deprecatedSyntax: boolean
+  slideOptions: SlideOptions
+}

src/redux/note-details/types/slide-show-options.d.ts

@@ -0,0 +1,11 @@
+/*
+ * SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ *
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import type { RevealOptions } from 'reveal.js'
+
+type WantedRevealOptions = 'autoSlide' | 'autoSlideStoppable' | 'transition' | 'backgroundTransition' | 'slideNumber'
+
+export type SlideOptions = Required<Pick<RevealOptions, WantedRevealOptions>>