Include front matter

src/components/PreferencesModal/MarkdownTab.tsx

@@ -17,6 +17,7 @@ import { capitalize } from '../../lib/string'
 import { useTranslation } from 'react-i18next'
 import { usePreviewStyle, defaultPreviewStyle } from '../../lib/preview'
 import { borderRight, border } from '../../lib/styled/styleFunctions'
+import { FormCheckItem } from '../atoms/form'
 
 const EditorContainer = styled.div`
   ${border}
@@ -80,6 +81,15 @@ const MarkdownTab = () => {
     [setPreviewContent]
   )
 
+  const toggleFrontMatterExport: React.ChangeEventHandler<HTMLInputElement> = useCallback(
+    (event) => {
+      setPreferences({
+        'markdown.includeFrontMatter': event.target.checked,
+      })
+    },
+    [setPreferences]
+  )
+
   const { t } = useTranslation()
 
   return (
@@ -132,6 +142,19 @@ const MarkdownTab = () => {
           </div>
         </PreviewContainer>
       </Section>
+      <Section>
+        <SectionHeader>Export</SectionHeader>
+        <SectionControl>
+          <FormCheckItem
+            id='checkbox-include-front-matter'
+            type='checkbox'
+            checked={preferences['markdown.includeFrontMatter']}
+            onChange={toggleFrontMatterExport}
+          >
+            Include Front Matter
+          </FormCheckItem>
+        </SectionControl>
+      </Section>
     </div>
   )
 }

src/components/molecules/NoteDetailToolbar.tsx

@@ -98,7 +98,10 @@ const NoteDetailToolbar = ({
         {
           type: MenuTypes.Normal,
           label: 'Markdown export',
-          onClick: async () => await exportNoteAsMarkdownFile(note),
+          onClick: async () =>
+            await exportNoteAsMarkdownFile(note, {
+              includeFrontMatter: preferences['markdown.includeFrontMatter'],
+            }),
         },
       ])
     },

src/components/organisms/Navigator.tsx

@@ -7,7 +7,7 @@ import { useDialog, DialogIconTypes } from '../../lib/dialog'
 import { useContextMenu, MenuTypes } from '../../lib/contextMenu'
 import { usePreferences } from '../../lib/preferences'
 import StorageNavigatorFragment from '../molecules/StorageNavigatorFragment'
-import { mdiPlus, mdiHammerWrench, mdiBookPlusMultiple } from '@mdi/js'
+import { mdiHammerWrench, mdiBookPlusMultiple } from '@mdi/js'
 import NavigatorButton from '../atoms/NavigatorButton'
 import Spacer from '../atoms/Spacer'
 import { usePathnameWithoutNoteId } from '../../lib/router'

src/lib/exports.ts

@@ -14,6 +14,7 @@ import { rehypeCodeMirror } from './../components/atoms/MarkdownPreviewer'
 import { downloadString } from './download'
 import { NoteDoc } from './db/types'
 import { Preferences } from './preferences'
+import { filenamify } from './string'
 
 const sanitizeSchema = mergeDeepRight(gh, {
   attributes: { '*': ['className'] },
@@ -51,15 +52,16 @@ export const exportNoteAsHtmlFile = async (
 
       downloadString(
         file.toString(),
-        `${note.title.toLowerCase().replace(/\s+/g, '-')}.html`,
+        `${filenamify(note.title.toLowerCase().replace(/\s+/g, '-'))}.html`,
         'text/html'
       )
       return
     })
 }
 
 export const exportNoteAsMarkdownFile = async (
-  note: NoteDoc
+  note: NoteDoc,
+  { includeFrontMatter }: { includeFrontMatter: boolean }
 ): Promise<void> => {
   await unified()
     .use(remarkParse)
@@ -70,15 +72,22 @@ export const exportNoteAsMarkdownFile = async (
         console.error(err)
         return
       }
+      let content = file.toString().trim() + '\n'
+      if (includeFrontMatter) {
+        content =
+          [
+            '---',
+            `title: "${note.title}"`,
+            `tags: "${note.tags.join()}"`,
+            '---',
+            '',
+            '',
+          ].join('\n') + content
+      }
+
       downloadString(
-        [
-          '---',
-          `title: "${note.title}"`,
-          `tags: "${note.tags.join()}"`,
-          '---',
-          file.toString(),
-        ].join('\n'),
-        `${note.title.toLowerCase().replace(/\s+/g, '-')}.md`,
+        content,
+        `${filenamify(note.title.toLowerCase().replace(/\s+/g, '-'))}.md`,
         'text/markdown'
       )
       return

src/lib/preferences.ts

@@ -52,6 +52,7 @@ export interface Preferences {
   // Markdown
   'markdown.previewStyle': string
   'markdown.codeBlockTheme': string
+  'markdown.includeFrontMatter': boolean
 }
 
 function loadPreferences() {
@@ -93,6 +94,7 @@ const basePreferences: Preferences = {
   // Markdown
   'markdown.previewStyle': 'default',
   'markdown.codeBlockTheme': 'material-darker',
+  'markdown.includeFrontMatter': true,
 }
 
 function usePreferencesStore() {

src/lib/string.ts

@@ -1,5 +1,6 @@
 import shortid from 'shortid'
 import { randomBytes } from 'crypto'
+import originalFilenamify from 'filenamify'
 
 export function capitalize(value: string): string {
   return value.charAt(0).toUpperCase() + value.slice(1)
@@ -11,6 +12,10 @@ export function generateId(): string {
 
 export const generateRandomHex = () => randomBytes(32).toString('hex')
 
-export function escapeRegExp(str: string) {
-  return str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
+export function escapeRegExp(value: string) {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
+}
+
+export function filenamify(value: string) {
+  return originalFilenamify(value, { replacement: '-' })
 }

src/locales/de.ts

@@ -20,12 +20,12 @@ export default {
     'storage.rename': 'Speicherort umbenennen',
     'storage.renameMessage': 'Name des Speicherorts ändern',
     'storage.remove': 'Speicherort entfernen',
-    'storage.removeMessage': 'Achtung! Alle Notizen dieses Speicherorts werden dauerhaft gelöscht.',
+    'storage.removeMessage':
+      'Achtung! Alle Notizen dieses Speicherorts werden dauerhaft gelöscht.',
     'storage.delete': 'Speicherort {{storage}} löschen',
     'storage.move': 'Speicherort verschieben',
     'storage.moveTitle': 'Speicherort wird verschoben',
-    'storage.moveMessage':
-      'Es wird versucht, den Speicherort zu verschieben.',
+    'storage.moveMessage': 'Es wird versucht, den Speicherort zu verschieben.',
     'storage.copy': 'Speicherort kopieren',
     'storage.typeLocal': 'Lokal',
     'storage.typeCloud': 'Cloud',
@@ -152,7 +152,8 @@ export default {
 
     // Preferences ImportTab
     'preferences.import': 'Importieren',
-    'preferences.description': 'Importiert .cson Dateien vom alten Boostnote Ordner.',
+    'preferences.description':
+      'Importiert .cson Dateien vom alten Boostnote Ordner.',
     'preferences.importFlow1':
       '1. Öffne den alten Boostnote Ordner auf deinem PC.',
     'preferences.importFlow2': '2. Ziehe die .cson Dateien in das Feld unten.',