Adjust editor config (#976)

* Adjust editor config

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>
Co-authored-by: Erik Michelson <github@erik.michelson.eu>

src/components/common/branding/branding.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import equal from 'fast-deep-equal'
 import React from 'react'
@@ -21,18 +21,18 @@ export const Branding: React.FC<BrandingProps> = ({ inline = false, delimiter =
   const showBranding = !!branding.name || !!branding.logo
 
   return (
-    <ShowIf condition={showBranding}>
-      <ShowIf condition={delimiter}>
-        <strong className={`mx-1 ${inline ? 'inline-size' : 'regular-size'}`}>@</strong>
+    <ShowIf condition={ showBranding }>
+      <ShowIf condition={ delimiter }>
+        <strong className={ `mx-1 ${ inline ? 'inline-size' : 'regular-size' }` }>@</strong>
       </ShowIf>
       {
         branding.logo
           ? <img
-              src={branding.logo}
-              alt={branding.name}
-              title={branding.name}
-              className={inline ? 'inline-size' : 'regular-size'}
-            />
+            src={ branding.logo }
+            alt={ branding.name }
+            title={ branding.name }
+            className={ inline ? 'inline-size' : 'regular-size' }
+          />
           : branding.name
       }
     </ShowIf>

src/components/common/cache/cache.test.ts

@@ -16,68 +16,88 @@ describe('Test caching functionality', () => {
   it('initialize with right lifetime, no entry limit', () => {
     const lifetime = 1000
     const lifetimedCache = new Cache<string, string>(lifetime)
-    expect(lifetimedCache.entryLifetime).toEqual(lifetime)
-    expect(lifetimedCache.maxEntries).toEqual(0)
+    expect(lifetimedCache.entryLifetime)
+      .toEqual(lifetime)
+    expect(lifetimedCache.maxEntries)
+      .toEqual(0)
   })
 
   it('initialize with right lifetime, given entry limit', () => {
     const lifetime = 1000
     const maxEntries = 10
     const limitedCache = new Cache<string, string>(lifetime, maxEntries)
-    expect(limitedCache.entryLifetime).toEqual(lifetime)
-    expect(limitedCache.maxEntries).toEqual(maxEntries)
+    expect(limitedCache.entryLifetime)
+      .toEqual(lifetime)
+    expect(limitedCache.maxEntries)
+      .toEqual(maxEntries)
   })
 
   it('entry exists after inserting', () => {
     testCache.put('test', 123)
-    expect(testCache.has('test')).toBe(true)
+    expect(testCache.has('test'))
+      .toBe(true)
   })
 
   it('entry does not exist prior inserting', () => {
-    expect(testCache.has('test')).toBe(false)
+    expect(testCache.has('test'))
+      .toBe(false)
   })
 
   it('entry does expire', () => {
     const shortLivingCache = new Cache<string, number>(2)
     shortLivingCache.put('test', 123)
-    expect(shortLivingCache.has('test')).toBe(true)
+    expect(shortLivingCache.has('test'))
+      .toBe(true)
     setTimeout(() => {
-      expect(shortLivingCache.has('test')).toBe(false)
+      expect(shortLivingCache.has('test'))
+        .toBe(false)
     }, 2000)
   })
 
   it('entry value does not change', () => {
     const testValue = Date.now()
     testCache.put('test', testValue)
-    expect(testCache.get('test')).toEqual(testValue)
+    expect(testCache.get('test'))
+      .toEqual(testValue)
   })
 
   it('error is thrown on non-existent entry', () => {
     const accessNonExistentEntry = () => {
       testCache.get('test')
     }
-    expect(accessNonExistentEntry).toThrow(Error)
+    expect(accessNonExistentEntry)
+      .toThrow(Error)
   })
 
   it('newer item replaces older item', () => {
     testCache.put('test', 123)
     testCache.put('test', 456)
-    expect(testCache.get('test')).toEqual(456)
+    expect(testCache.get('test'))
+      .toEqual(456)
   })
 
   it('entry limit is respected', () => {
     const limitedCache = new Cache<string, number>(1000, 2)
     limitedCache.put('first', 1)
-    expect(limitedCache.has('first')).toBe(true)
-    expect(limitedCache.has('second')).toBe(false)
-    expect(limitedCache.has('third')).toBe(false)
+    expect(limitedCache.has('first'))
+      .toBe(true)
+    expect(limitedCache.has('second'))
+      .toBe(false)
+    expect(limitedCache.has('third'))
+      .toBe(false)
     limitedCache.put('second', 2)
-    expect(limitedCache.has('first')).toBe(true)
-    expect(limitedCache.has('second')).toBe(true)
-    expect(limitedCache.has('third')).toBe(false)
+    expect(limitedCache.has('first'))
+      .toBe(true)
+    expect(limitedCache.has('second'))
+      .toBe(true)
+    expect(limitedCache.has('third'))
+      .toBe(false)
     limitedCache.put('third', 3)
-    expect(limitedCache.has('first')).toBe(false)
-    expect(limitedCache.has('second')).toBe(true)
-    expect(limitedCache.has('third')).toBe(true)
+    expect(limitedCache.has('first'))
+      .toBe(false)
+    expect(limitedCache.has('second'))
+      .toBe(true)
+    expect(limitedCache.has('third'))
+      .toBe(true)
   })
 })

src/components/common/cache/cache.ts

@@ -10,12 +10,11 @@ export interface CacheEntry<T> {
 }
 
 export class Cache<K, V> {
-  private store = new Map<K, CacheEntry<V>>()
-
   readonly entryLifetime: number
   readonly maxEntries: number
+  private store = new Map<K, CacheEntry<V>>()
 
-  constructor (lifetime: number, maxEntries = 0) {
+  constructor(lifetime: number, maxEntries = 0) {
     if (lifetime < 0) {
       throw new Error('Cache entry lifetime can not be less than 0 seconds.')
     }
@@ -23,7 +22,7 @@ export class Cache<K, V> {
     this.maxEntries = maxEntries
   }
 
-  has (key: K): boolean {
+  has(key: K): boolean {
     if (!this.store.has(key)) {
       return false
     }
@@ -31,7 +30,7 @@ export class Cache<K, V> {
     return (!!entry && entry.entryCreated >= (Date.now() - this.entryLifetime * 1000))
   }
 
-  get (key: K): V {
+  get(key: K): V {
     const entry = this.store.get(key)
     if (!entry) {
       throw new Error('This cache entry does not exist. Check with ".has()" before using ".get()".')
@@ -39,9 +38,10 @@ export class Cache<K, V> {
     return entry.data
   }
 
-  put (key: K, value: V): void {
+  put(key: K, value: V): void {
     if (this.maxEntries > 0 && this.store.size === this.maxEntries) {
-      this.store.delete(this.store.keys().next().value)
+      this.store.delete(this.store.keys()
+                            .next().value)
     }
     this.store.set(key, {
       entryCreated: Date.now(),

src/components/common/copyable/copy-overlay.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React, { RefObject, useCallback, useEffect, useState } from 'react'
 import { Overlay, Tooltip } from 'react-bootstrap'
@@ -22,15 +22,20 @@ export const CopyOverlay: React.FC<CopyOverlayProps> = ({ content, clickComponen
   const [tooltipId] = useState<string>(() => uuid())
 
   const copyToClipboard = useCallback((content: string) => {
-    navigator.clipboard.writeText(content).then(() => {
-      setError(false)
-    }).catch(() => {
-      setError(true)
-      console.error("couldn't copy")
-    }).finally(() => {
-      setShowCopiedTooltip(true)
-      setTimeout(() => { setShowCopiedTooltip(false) }, 2000)
-    })
+    navigator.clipboard.writeText(content)
+             .then(() => {
+               setError(false)
+             })
+             .catch(() => {
+               setError(true)
+               console.error('couldn\'t copy')
+             })
+             .finally(() => {
+               setShowCopiedTooltip(true)
+               setTimeout(() => {
+                 setShowCopiedTooltip(false)
+               }, 2000)
+             })
   }, [])
 
   useEffect(() => {
@@ -46,17 +51,17 @@ export const CopyOverlay: React.FC<CopyOverlayProps> = ({ content, clickComponen
   }, [clickComponent, copyToClipboard, content])
 
   return (
-    <Overlay target={clickComponent} show={showCopiedTooltip} placement="top">
-      {(props) => (
-        <Tooltip id={`copied_${tooltipId}`} {...props}>
-          <ShowIf condition={error}>
-            <Trans i18nKey={'common.copyError'}/>
+    <Overlay target={ clickComponent } show={ showCopiedTooltip } placement="top">
+      { (props) => (
+        <Tooltip id={ `copied_${ tooltipId }` } { ...props }>
+          <ShowIf condition={ error }>
+            <Trans i18nKey={ 'common.copyError' }/>
           </ShowIf>
-          <ShowIf condition={!error}>
-            <Trans i18nKey={'common.successfullyCopied'}/>
+          <ShowIf condition={ !error }>
+            <Trans i18nKey={ 'common.successfullyCopied' }/>
           </ShowIf>
         </Tooltip>
-      )}
+      ) }
     </Overlay>
   )
 }

src/components/common/copyable/copy-to-clipboard-button/copy-to-clipboard-button.tsx

@@ -15,25 +15,25 @@ export interface CopyToClipboardButtonProps {
   content: string
   size?: 'sm' | 'lg'
   variant?: Variant
-  "data-cy"?: string
+  'data-cy'?: string
 }
 
 export const CopyToClipboardButton: React.FC<CopyToClipboardButtonProps> = ({
-                                                                              content,
-                                                                              size = 'sm',
-                                                                              variant = 'dark',
-                                                                              ...props
-                                                                            }) => {
+  content,
+  size = 'sm',
+  variant = 'dark',
+  ...props
+}) => {
   const { t } = useTranslation()
   const button = useRef<HTMLButtonElement>(null)
 
   return (
     <Fragment>
-      <Button ref={button} size={size} variant={variant} title={t('renderer.highlightCode.copyCode')}
-              data-cy={props["data-cy"]}>
+      <Button ref={ button } size={ size } variant={ variant } title={ t('renderer.highlightCode.copyCode') }
+              data-cy={ props['data-cy'] }>
         <ForkAwesomeIcon icon='files-o'/>
       </Button>
-      <CopyOverlay content={content} clickComponent={button}/>
+      <CopyOverlay content={ content } clickComponent={ button }/>
     </Fragment>
   )
 }

src/components/common/copyable/copyable-field/copyable-field.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React, { Fragment, useCallback, useRef } from 'react'
 import { Button, FormControl, InputGroup } from 'react-bootstrap'
@@ -25,9 +25,10 @@ export const CopyableField: React.FC<CopyableFieldProps> = ({ content, nativeSha
     navigator.share({
       text: content,
       url: url
-    }).catch(err => {
-      console.error('Native sharing failed: ', err)
     })
+             .catch(err => {
+               console.error('Native sharing failed: ', err)
+             })
   }, [content, url])
 
   const sharingSupported = typeof navigator.share === 'function'
@@ -35,21 +36,21 @@ export const CopyableField: React.FC<CopyableFieldProps> = ({ content, nativeSha
   return (
     <Fragment>
       <InputGroup className="my-3">
-        <FormControl readOnly={true} className={'text-center'} value={content} />
+        <FormControl readOnly={ true } className={ 'text-center' } value={ content }/>
         <InputGroup.Append>
-          <Button variant="outline-secondary" ref={copyButton} title={'Copy'}>
+          <Button variant="outline-secondary" ref={ copyButton } title={ 'Copy' }>
             <ForkAwesomeIcon icon='files-o'/>
           </Button>
         </InputGroup.Append>
-        <ShowIf condition={!!nativeShareButton && sharingSupported}>
+        <ShowIf condition={ !!nativeShareButton && sharingSupported }>
           <InputGroup.Append>
-            <Button variant="outline-secondary" title={'Share'} onClick={doShareAction}>
+            <Button variant="outline-secondary" title={ 'Share' } onClick={ doShareAction }>
               <ForkAwesomeIcon icon='share-alt'/>
             </Button>
           </InputGroup.Append>
         </ShowIf>
       </InputGroup>
-      <CopyOverlay content={content} clickComponent={copyButton}/>
+      <CopyOverlay content={ content } clickComponent={ copyButton }/>
     </Fragment>
   )
 }

src/components/common/fork-awesome/fork-awesome-icon.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React from 'react'
 import { IconName, IconSize } from './types'
@@ -17,10 +17,10 @@ export interface ForkAwesomeIconProps {
 
 export const ForkAwesomeIcon: React.FC<ForkAwesomeIconProps> = ({ icon, fixedWidth = false, size, className, stacked = false }) => {
   const fixedWithClass = fixedWidth ? 'fa-fw' : ''
-  const sizeClass = size ? `-${size}` : (stacked ? '-1x' : '')
+  const sizeClass = size ? `-${ size }` : (stacked ? '-1x' : '')
   const stackClass = stacked ? '-stack' : ''
-  const extraClasses = `${className ?? ''} ${sizeClass || stackClass ? `fa${stackClass}${sizeClass}` : ''}`
+  const extraClasses = `${ className ?? '' } ${ sizeClass || stackClass ? `fa${ stackClass }${ sizeClass }` : '' }`
   return (
-    <i className={`fa ${fixedWithClass} fa-${icon} ${extraClasses}`}/>
+    <i className={ `fa ${ fixedWithClass } fa-${ icon } ${ extraClasses }` }/>
   )
 }

src/components/common/fork-awesome/fork-awesome-stack.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React, { ReactElement } from 'react'
 import { ForkAwesomeIcon, ForkAwesomeIconProps } from './fork-awesome-icon'
@@ -15,13 +15,13 @@ export interface ForkAwesomeStackProps {
 
 export const ForkAwesomeStack: React.FC<ForkAwesomeStackProps> = ({ size, children }) => {
   return (
-    <span className={`fa-stack ${size ? 'fa-' : ''}${size ?? ''}`}>
+    <span className={ `fa-stack ${ size ? 'fa-' : '' }${ size ?? '' }` }>
       {
         React.Children.map(children, (child) => {
           if (!React.isValidElement<ForkAwesomeIconProps>(child)) {
             return null
           }
-          return <ForkAwesomeIcon {...child.props} stacked={true}/>
+          return <ForkAwesomeIcon { ...child.props } stacked={ true }/>
         })
       }
     </span>

src/components/common/hedge-doc-logo/hedge-doc-logo-with-text.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React from 'react'
 import { ReactComponent as LogoBwHorizontal } from './logo_text_bw_horizontal.svg'
@@ -12,7 +12,7 @@ import { ReactComponent as LogoWbHorizontal } from './logo_text_wb_horizontal.sv
 export enum HedgeDocLogoSize {
   SMALL = 32,
   MEDIUM = 64,
-  BIG= 256
+  BIG = 256
 }
 
 export interface HedgeDocLogoProps {
@@ -29,11 +29,11 @@ export enum HedgeDocLogoType {
 export const HedgeDocLogoWithText: React.FC<HedgeDocLogoProps> = ({ size = HedgeDocLogoSize.MEDIUM, logoType }) => {
   switch (logoType) {
     case HedgeDocLogoType.COLOR_VERTICAL:
-      return <LogoColorVertical className={'w-auto'} title={'HedgeDoc logo with text'} style={{ height: size }}/>
+      return <LogoColorVertical className={ 'w-auto' } title={ 'HedgeDoc logo with text' } style={ { height: size } }/>
     case HedgeDocLogoType.BW_HORIZONTAL:
-      return <LogoBwHorizontal className={'w-auto'} title={'HedgeDoc logo with text'} style={{ height: size }}/>
+      return <LogoBwHorizontal className={ 'w-auto' } title={ 'HedgeDoc logo with text' } style={ { height: size } }/>
     case HedgeDocLogoType.WB_HORIZONTAL:
-      return <LogoWbHorizontal className={'w-auto'} title={'HedgeDoc logo with text'} style={{ height: size }}/>
+      return <LogoWbHorizontal className={ 'w-auto' } title={ 'HedgeDoc logo with text' } style={ { height: size } }/>
     default:
       return null
   }

src/components/common/hedge-doc-logo/hedge-doc-logo.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React from 'react'
 import { ReactComponent as LogoColor } from './logo_color.svg'
@@ -18,5 +18,5 @@ export interface HedgeDocLogoProps {
 }
 
 export const HedgeDocLogo: React.FC<HedgeDocLogoProps> = ({ size = HedgeDocLogoSize.MEDIUM }) => {
-  return <LogoColor className={'w-auto'} title={'HedgeDoc logo with text'} style={{ height: size }}/>
+  return <LogoColor className={ 'w-auto' } title={ 'HedgeDoc logo with text' } style={ { height: size } }/>
 }

src/components/common/hedge-doc-logo/logo_color.svg

@@ -1 +1,29 @@
-<svg clip-rule="evenodd" fill-rule="evenodd" height="1486" stroke-linejoin="round" stroke-miterlimit="2" viewBox="0 0 1486 1486" width="1486" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><linearGradient id="a" gradientTransform="matrix(200 -420 420 200 660 1340)" gradientUnits="userSpaceOnUse" x1="0" x2="1" y1="0" y2="0"><stop offset="0" stop-color="#fcca8c"/><stop offset="1" stop-color="#dca055"/></linearGradient><g fill-rule="nonzero" transform="translate(-142.756 -142.754)"><path d="m1553.66 961.083 75.25-75.258-75.25-75.246 56.61-90.096-90.1-56.616 35.15-100.446-100.44-35.142 11.91-105.746-105.74-11.912-11.92-105.75-105.74 11.912-35.15-100.445-100.43 35.145-56.63-90.1-90.107 56.617-75.242-75.246-75.242 75.25-90.104-56.612-56.612 90.096-100.442-35.15-35.142 100.441-105.75-11.916-11.912 105.741-105.742 11.913 11.917 105.741-100.454 35.15 35.145 100.438-90.1 56.612 56.621 90.117-75.258 75.25 75.25 75.258-56.613 90.107 90.1 56.61-35.145 100.44 100.45 35.15-11.913 105.73 105.742 11.92 11.912 105.74 105.75-11.91 35.142 100.43 100.437-35.13 56.617 90.1 90.096-56.62 75.25 74.55 75.25-74.53 90.099 56.61 56.61-90.11 100.45 35.15 35.14-100.44 105.75 11.91 11.91-105.75 105.75-11.91-11.92-105.74 100.45-35.15-35.15-100.45 90.1-56.61z" fill="#b51f08"/><path d="m1401.3 1004.78c0-145.437-117.9-263.341-263.34-263.341-72.24 0-137.68 29.112-185.252 76.225l-.033-.034-67.096 67.1-54.862-54.862c-48.267-55.067-119.071-89.879-198.042-89.879-145.442 0-263.342 117.904-263.342 263.341 0 76 32.23 144.43 83.721 192.49l432.779 432.55 423.217-423.49c52.88-49.77 92.25-120 92.25-200.1" fill="#fcca8c"/><path d="m885.579 884.73-54.862-54.862c-48.267-55.067-119.071-89.879-198.042-89.879-145.442 0-263.342 117.904-263.342 263.341 0 76 32.23 144.43 83.721 192.49l432.779 432.55" fill="url(#a)"/></g><path d="m743.077 1485.616-.254-743.64" fill="none"/><g fill-rule="nonzero" transform="translate(-142.756 -142.754)"><path d="m961.011 1553.59c-19.279-19.35-45.917-31.31-75.325-31.31-29.417 0-56.046 11.96-75.329 31.31.308 41.34 33.908 74.76 75.325 74.76 41.416 0 75.02-33.43 75.329-74.76" fill="#010007"/><path d="m797.707 1098.22c0 31.8-25.767 57.57-57.571 57.57-31.787 0-57.558-25.77-57.558-57.57s25.771-57.57 57.558-57.57c31.804 0 57.571 25.77 57.571 57.57" fill="#010007"/><path d="m777.962 1089.59c0 8.82-7.146 15.94-15.95 15.94-8.808 0-15.958-7.12-15.958-15.94 0-8.81 7.15-15.96 15.958-15.96 8.804 0 15.95 7.15 15.95 15.96" fill="#fffffa"/><path d="m1089.65 1098.22c0 31.8-25.77 57.57-57.57 57.57-31.79 0-57.567-25.77-57.567-57.57s25.777-57.57 57.567-57.57c31.8 0 57.57 25.77 57.57 57.57" fill="#010007"/><path d="m1069.9 1089.59c0 8.82-7.15 15.94-15.95 15.94-8.81 0-15.96-7.12-15.96-15.94 0-8.81 7.15-15.96 15.96-15.96 8.8 0 15.95 7.15 15.95 15.96" fill="#fffffa"/></g></svg>
+<svg clip-rule="evenodd" fill-rule="evenodd" height="1486" stroke-linejoin="round" stroke-miterlimit="2"
+     viewBox="0 0 1486 1486" width="1486" xmlns="http://www.w3.org/2000/svg">
+    <linearGradient id="a" gradientTransform="matrix(200 -420 420 200 660 1340)" gradientUnits="userSpaceOnUse" x1="0"
+                    x2="1" y1="0" y2="0">
+        <stop offset="0" stop-color="#fcca8c"/>
+        <stop offset="1" stop-color="#dca055"/>
+    </linearGradient>
+    <g fill-rule="nonzero" transform="translate(-142.756 -142.754)">
+        <path d="m1553.66 961.083 75.25-75.258-75.25-75.246 56.61-90.096-90.1-56.616 35.15-100.446-100.44-35.142 11.91-105.746-105.74-11.912-11.92-105.75-105.74 11.912-35.15-100.445-100.43 35.145-56.63-90.1-90.107 56.617-75.242-75.246-75.242 75.25-90.104-56.612-56.612 90.096-100.442-35.15-35.142 100.441-105.75-11.916-11.912 105.741-105.742 11.913 11.917 105.741-100.454 35.15 35.145 100.438-90.1 56.612 56.621 90.117-75.258 75.25 75.25 75.258-56.613 90.107 90.1 56.61-35.145 100.44 100.45 35.15-11.913 105.73 105.742 11.92 11.912 105.74 105.75-11.91 35.142 100.43 100.437-35.13 56.617 90.1 90.096-56.62 75.25 74.55 75.25-74.53 90.099 56.61 56.61-90.11 100.45 35.15 35.14-100.44 105.75 11.91 11.91-105.75 105.75-11.91-11.92-105.74 100.45-35.15-35.15-100.45 90.1-56.61z"
+              fill="#b51f08"/>
+        <path d="m1401.3 1004.78c0-145.437-117.9-263.341-263.34-263.341-72.24 0-137.68 29.112-185.252 76.225l-.033-.034-67.096 67.1-54.862-54.862c-48.267-55.067-119.071-89.879-198.042-89.879-145.442 0-263.342 117.904-263.342 263.341 0 76 32.23 144.43 83.721 192.49l432.779 432.55 423.217-423.49c52.88-49.77 92.25-120 92.25-200.1"
+              fill="#fcca8c"/>
+        <path d="m885.579 884.73-54.862-54.862c-48.267-55.067-119.071-89.879-198.042-89.879-145.442 0-263.342 117.904-263.342 263.341 0 76 32.23 144.43 83.721 192.49l432.779 432.55"
+              fill="url(#a)"/>
+    </g>
+    <path d="m743.077 1485.616-.254-743.64" fill="none"/>
+    <g fill-rule="nonzero" transform="translate(-142.756 -142.754)">
+        <path d="m961.011 1553.59c-19.279-19.35-45.917-31.31-75.325-31.31-29.417 0-56.046 11.96-75.329 31.31.308 41.34 33.908 74.76 75.325 74.76 41.416 0 75.02-33.43 75.329-74.76"
+              fill="#010007"/>
+        <path d="m797.707 1098.22c0 31.8-25.767 57.57-57.571 57.57-31.787 0-57.558-25.77-57.558-57.57s25.771-57.57 57.558-57.57c31.804 0 57.571 25.77 57.571 57.57"
+              fill="#010007"/>
+        <path d="m777.962 1089.59c0 8.82-7.146 15.94-15.95 15.94-8.808 0-15.958-7.12-15.958-15.94 0-8.81 7.15-15.96 15.958-15.96 8.804 0 15.95 7.15 15.95 15.96"
+              fill="#fffffa"/>
+        <path d="m1089.65 1098.22c0 31.8-25.77 57.57-57.57 57.57-31.79 0-57.567-25.77-57.567-57.57s25.777-57.57 57.567-57.57c31.8 0 57.57 25.77 57.57 57.57"
+              fill="#010007"/>
+        <path d="m1069.9 1089.59c0 8.82-7.15 15.94-15.95 15.94-8.81 0-15.96-7.12-15.96-15.94 0-8.81 7.15-15.96 15.96-15.96 8.8 0 15.95 7.15 15.95 15.96"
+              fill="#fffffa"/>
+    </g>
+</svg>

src/components/common/hljs/hljs.ts

@@ -1,9 +1,9 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
-import hljs from 'highlight.js/lib/core';
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
+import hljs from 'highlight.js/lib/core'
 import abnf from 'highlight.js/lib/languages/abnf'
 import accesslog from 'highlight.js/lib/languages/accesslog'
 import actionscript from 'highlight.js/lib/languages/actionscript'
@@ -194,196 +194,196 @@ import xl from 'highlight.js/lib/languages/xl'
 import xquery from 'highlight.js/lib/languages/xquery'
 import zephir from 'highlight.js/lib/languages/zephir'
 
-hljs.registerLanguage('abnf', abnf);
-hljs.registerLanguage('accesslog', accesslog);
-hljs.registerLanguage('actionscript', actionscript);
-hljs.registerLanguage('ada', ada);
-hljs.registerLanguage('angelscript', angelscript);
-hljs.registerLanguage('apache', apache);
-hljs.registerLanguage('applescript', applescript);
-hljs.registerLanguage('arcade', arcade);
-hljs.registerLanguage('arduino', arduino);
-hljs.registerLanguage('armasm', armasm);
-hljs.registerLanguage('xml', xml);
-hljs.registerLanguage('asciidoc', asciidoc);
-hljs.registerLanguage('aspectj', aspectj);
-hljs.registerLanguage('autohotkey', autohotkey);
-hljs.registerLanguage('autoit', autoit);
-hljs.registerLanguage('avrasm', avrasm);
-hljs.registerLanguage('awk', awk);
-hljs.registerLanguage('axapta', axapta);
-hljs.registerLanguage('bash', bash);
-hljs.registerLanguage('basic', basic);
-hljs.registerLanguage('bnf', bnf);
-hljs.registerLanguage('brainfuck', brainfuck);
-hljs.registerLanguage('c-like', c_like);
-hljs.registerLanguage('c', c);
-hljs.registerLanguage('cal', cal);
-hljs.registerLanguage('capnproto', capnproto);
-hljs.registerLanguage('ceylon', ceylon);
-hljs.registerLanguage('clean', clean);
-hljs.registerLanguage('clojure', clojure);
-hljs.registerLanguage('clojure-repl', clojure_repl);
-hljs.registerLanguage('cmake', cmake);
-hljs.registerLanguage('coffeescript', coffeescript);
-hljs.registerLanguage('coq', coq);
-hljs.registerLanguage('cos', cos);
-hljs.registerLanguage('cpp', cpp);
-hljs.registerLanguage('crmsh', crmsh);
-hljs.registerLanguage('crystal', crystal);
-hljs.registerLanguage('csharp', csharp);
-hljs.registerLanguage('csp', csp);
-hljs.registerLanguage('css', css);
-hljs.registerLanguage('d', d);
-hljs.registerLanguage('markdown', markdown);
-hljs.registerLanguage('dart', dart);
-hljs.registerLanguage('delphi', delphi);
-hljs.registerLanguage('diff', diff);
-hljs.registerLanguage('django', django);
-hljs.registerLanguage('dns', dns);
-hljs.registerLanguage('dockerfile', dockerfile);
-hljs.registerLanguage('dos', dos);
-hljs.registerLanguage('dsconfig', dsconfig);
-hljs.registerLanguage('dts', dts);
-hljs.registerLanguage('dust', dust);
-hljs.registerLanguage('ebnf', ebnf);
-hljs.registerLanguage('elixir', elixir);
-hljs.registerLanguage('elm', elm);
-hljs.registerLanguage('ruby', ruby);
-hljs.registerLanguage('erb', erb);
-hljs.registerLanguage('erlang-repl', erlang_repl);
-hljs.registerLanguage('erlang', erlang);
-hljs.registerLanguage('excel', excel);
-hljs.registerLanguage('fix', fix);
-hljs.registerLanguage('flix', flix);
-hljs.registerLanguage('fortran', fortran);
-hljs.registerLanguage('fsharp', fsharp);
-hljs.registerLanguage('gams', gams);
-hljs.registerLanguage('gauss', gauss);
-hljs.registerLanguage('gcode', gcode);
-hljs.registerLanguage('gherkin', gherkin);
-hljs.registerLanguage('glsl', glsl);
-hljs.registerLanguage('gml', gml);
-hljs.registerLanguage('go', go);
-hljs.registerLanguage('golo', golo);
-hljs.registerLanguage('gradle', gradle);
-hljs.registerLanguage('groovy', groovy);
-hljs.registerLanguage('haml', haml);
-hljs.registerLanguage('handlebars', handlebars);
-hljs.registerLanguage('haskell', haskell);
-hljs.registerLanguage('haxe', haxe);
-hljs.registerLanguage('hsp', hsp);
-hljs.registerLanguage('html', xml);
-hljs.registerLanguage('htmlbars', htmlbars);
-hljs.registerLanguage('http', http);
-hljs.registerLanguage('hy', hy);
-hljs.registerLanguage('inform7', inform7);
-hljs.registerLanguage('ini', ini);
-hljs.registerLanguage('irpf90', irpf90);
-hljs.registerLanguage('isbl', isbl);
-hljs.registerLanguage('java', java);
-hljs.registerLanguage('javascript', javascript);
-hljs.registerLanguage('jboss-cli', jboss_cli);
-hljs.registerLanguage('js', javascript);
-hljs.registerLanguage('json', json);
-hljs.registerLanguage('julia', julia);
-hljs.registerLanguage('julia-repl', julia_repl);
-hljs.registerLanguage('kotlin', kotlin);
-hljs.registerLanguage('lasso', lasso);
-hljs.registerLanguage('latex', latex);
-hljs.registerLanguage('ldif', ldif);
-hljs.registerLanguage('leaf', leaf);
-hljs.registerLanguage('less', less);
-hljs.registerLanguage('lisp', lisp);
-hljs.registerLanguage('livecodeserver', livecodeserver);
-hljs.registerLanguage('livescript', livescript);
-hljs.registerLanguage('llvm', llvm);
-hljs.registerLanguage('lsl', lsl);
-hljs.registerLanguage('lua', lua);
-hljs.registerLanguage('makefile', makefile);
-hljs.registerLanguage('mathematica', mathematica);
-hljs.registerLanguage('matlab', matlab);
-hljs.registerLanguage('maxima', maxima);
-hljs.registerLanguage('mel', mel);
-hljs.registerLanguage('mercury', mercury);
-hljs.registerLanguage('mipsasm', mipsasm);
-hljs.registerLanguage('mizar', mizar);
-hljs.registerLanguage('perl', perl);
-hljs.registerLanguage('mojolicious', mojolicious);
-hljs.registerLanguage('monkey', monkey);
-hljs.registerLanguage('moonscript', moonscript);
-hljs.registerLanguage('n1ql', n1ql);
-hljs.registerLanguage('nginx', nginx);
-hljs.registerLanguage('nim', nim);
-hljs.registerLanguage('nix', nix);
-hljs.registerLanguage('node-repl', node_repl);
-hljs.registerLanguage('nsis', nsis);
-hljs.registerLanguage('objectivec', objectivec);
-hljs.registerLanguage('ocaml', ocaml);
-hljs.registerLanguage('openscad', openscad);
-hljs.registerLanguage('oxygene', oxygene);
-hljs.registerLanguage('parser3', parser3);
-hljs.registerLanguage('pf', pf);
-hljs.registerLanguage('pgsql', pgsql);
-hljs.registerLanguage('php', php);
-hljs.registerLanguage('php-template', php_template);
-hljs.registerLanguage('plaintext', plaintext);
-hljs.registerLanguage('pony', pony);
-hljs.registerLanguage('powershell', powershell);
-hljs.registerLanguage('processing', processing);
-hljs.registerLanguage('profile', profile);
-hljs.registerLanguage('prolog', prolog);
-hljs.registerLanguage('properties', properties);
-hljs.registerLanguage('protobuf', protobuf);
-hljs.registerLanguage('puppet', puppet);
-hljs.registerLanguage('purebasic', purebasic);
-hljs.registerLanguage('python', python);
-hljs.registerLanguage('python-repl', python_repl);
-hljs.registerLanguage('q', q);
-hljs.registerLanguage('qml', qml);
-hljs.registerLanguage('r', r);
-hljs.registerLanguage('reasonml', reasonml);
-hljs.registerLanguage('rib', rib);
-hljs.registerLanguage('roboconf', roboconf);
-hljs.registerLanguage('routeros', routeros);
-hljs.registerLanguage('rsl', rsl);
-hljs.registerLanguage('ruleslanguage', ruleslanguage);
-hljs.registerLanguage('rust', rust);
-hljs.registerLanguage('sas', sas);
-hljs.registerLanguage('scala', scala);
-hljs.registerLanguage('scheme', scheme);
-hljs.registerLanguage('scilab', scilab);
-hljs.registerLanguage('scss', scss);
-hljs.registerLanguage('shell', shell);
-hljs.registerLanguage('smali', smali);
-hljs.registerLanguage('smalltalk', smalltalk);
-hljs.registerLanguage('sml', sml);
-hljs.registerLanguage('sqf', sqf);
-hljs.registerLanguage('sql', sql);
-hljs.registerLanguage('stan', stan);
-hljs.registerLanguage('stata', stata);
-hljs.registerLanguage('step21', step21);
-hljs.registerLanguage('stylus', stylus);
-hljs.registerLanguage('subunit', subunit);
-hljs.registerLanguage('swift', swift);
-hljs.registerLanguage('taggerscript', taggerscript);
-hljs.registerLanguage('yaml', yaml);
-hljs.registerLanguage('tap', tap);
-hljs.registerLanguage('tcl', tcl);
-hljs.registerLanguage('thrift', thrift);
-hljs.registerLanguage('tp', tp);
-hljs.registerLanguage('twig', twig);
-hljs.registerLanguage('typescript', typescript);
-hljs.registerLanguage('vala', vala);
-hljs.registerLanguage('vbnet', vbnet);
-hljs.registerLanguage('vbscript', vbscript);
-hljs.registerLanguage('vbscript-html', vbscript_html);
-hljs.registerLanguage('verilog', verilog);
-hljs.registerLanguage('vhdl', vhdl);
-hljs.registerLanguage('vim', vim);
-hljs.registerLanguage('x86asm', x86asm);
-hljs.registerLanguage('xl', xl);
-hljs.registerLanguage('xquery', xquery);
-hljs.registerLanguage('zephir', zephir);
+hljs.registerLanguage('abnf', abnf)
+hljs.registerLanguage('accesslog', accesslog)
+hljs.registerLanguage('actionscript', actionscript)
+hljs.registerLanguage('ada', ada)
+hljs.registerLanguage('angelscript', angelscript)
+hljs.registerLanguage('apache', apache)
+hljs.registerLanguage('applescript', applescript)
+hljs.registerLanguage('arcade', arcade)
+hljs.registerLanguage('arduino', arduino)
+hljs.registerLanguage('armasm', armasm)
+hljs.registerLanguage('xml', xml)
+hljs.registerLanguage('asciidoc', asciidoc)
+hljs.registerLanguage('aspectj', aspectj)
+hljs.registerLanguage('autohotkey', autohotkey)
+hljs.registerLanguage('autoit', autoit)
+hljs.registerLanguage('avrasm', avrasm)
+hljs.registerLanguage('awk', awk)
+hljs.registerLanguage('axapta', axapta)
+hljs.registerLanguage('bash', bash)
+hljs.registerLanguage('basic', basic)
+hljs.registerLanguage('bnf', bnf)
+hljs.registerLanguage('brainfuck', brainfuck)
+hljs.registerLanguage('c-like', c_like)
+hljs.registerLanguage('c', c)
+hljs.registerLanguage('cal', cal)
+hljs.registerLanguage('capnproto', capnproto)
+hljs.registerLanguage('ceylon', ceylon)
+hljs.registerLanguage('clean', clean)
+hljs.registerLanguage('clojure', clojure)
+hljs.registerLanguage('clojure-repl', clojure_repl)
+hljs.registerLanguage('cmake', cmake)
+hljs.registerLanguage('coffeescript', coffeescript)
+hljs.registerLanguage('coq', coq)
+hljs.registerLanguage('cos', cos)
+hljs.registerLanguage('cpp', cpp)
+hljs.registerLanguage('crmsh', crmsh)
+hljs.registerLanguage('crystal', crystal)
+hljs.registerLanguage('csharp', csharp)
+hljs.registerLanguage('csp', csp)
+hljs.registerLanguage('css', css)
+hljs.registerLanguage('d', d)
+hljs.registerLanguage('markdown', markdown)
+hljs.registerLanguage('dart', dart)
+hljs.registerLanguage('delphi', delphi)
+hljs.registerLanguage('diff', diff)
+hljs.registerLanguage('django', django)
+hljs.registerLanguage('dns', dns)
+hljs.registerLanguage('dockerfile', dockerfile)
+hljs.registerLanguage('dos', dos)
+hljs.registerLanguage('dsconfig', dsconfig)
+hljs.registerLanguage('dts', dts)
+hljs.registerLanguage('dust', dust)
+hljs.registerLanguage('ebnf', ebnf)
+hljs.registerLanguage('elixir', elixir)
+hljs.registerLanguage('elm', elm)
+hljs.registerLanguage('ruby', ruby)
+hljs.registerLanguage('erb', erb)
+hljs.registerLanguage('erlang-repl', erlang_repl)
+hljs.registerLanguage('erlang', erlang)
+hljs.registerLanguage('excel', excel)
+hljs.registerLanguage('fix', fix)
+hljs.registerLanguage('flix', flix)
+hljs.registerLanguage('fortran', fortran)
+hljs.registerLanguage('fsharp', fsharp)
+hljs.registerLanguage('gams', gams)
+hljs.registerLanguage('gauss', gauss)
+hljs.registerLanguage('gcode', gcode)
+hljs.registerLanguage('gherkin', gherkin)
+hljs.registerLanguage('glsl', glsl)
+hljs.registerLanguage('gml', gml)
+hljs.registerLanguage('go', go)
+hljs.registerLanguage('golo', golo)
+hljs.registerLanguage('gradle', gradle)
+hljs.registerLanguage('groovy', groovy)
+hljs.registerLanguage('haml', haml)
+hljs.registerLanguage('handlebars', handlebars)
+hljs.registerLanguage('haskell', haskell)
+hljs.registerLanguage('haxe', haxe)
+hljs.registerLanguage('hsp', hsp)
+hljs.registerLanguage('html', xml)
+hljs.registerLanguage('htmlbars', htmlbars)
+hljs.registerLanguage('http', http)
+hljs.registerLanguage('hy', hy)
+hljs.registerLanguage('inform7', inform7)
+hljs.registerLanguage('ini', ini)
+hljs.registerLanguage('irpf90', irpf90)
+hljs.registerLanguage('isbl', isbl)
+hljs.registerLanguage('java', java)
+hljs.registerLanguage('javascript', javascript)
+hljs.registerLanguage('jboss-cli', jboss_cli)
+hljs.registerLanguage('js', javascript)
+hljs.registerLanguage('json', json)
+hljs.registerLanguage('julia', julia)
+hljs.registerLanguage('julia-repl', julia_repl)
+hljs.registerLanguage('kotlin', kotlin)
+hljs.registerLanguage('lasso', lasso)
+hljs.registerLanguage('latex', latex)
+hljs.registerLanguage('ldif', ldif)
+hljs.registerLanguage('leaf', leaf)
+hljs.registerLanguage('less', less)
+hljs.registerLanguage('lisp', lisp)
+hljs.registerLanguage('livecodeserver', livecodeserver)
+hljs.registerLanguage('livescript', livescript)
+hljs.registerLanguage('llvm', llvm)
+hljs.registerLanguage('lsl', lsl)
+hljs.registerLanguage('lua', lua)
+hljs.registerLanguage('makefile', makefile)
+hljs.registerLanguage('mathematica', mathematica)
+hljs.registerLanguage('matlab', matlab)
+hljs.registerLanguage('maxima', maxima)
+hljs.registerLanguage('mel', mel)
+hljs.registerLanguage('mercury', mercury)
+hljs.registerLanguage('mipsasm', mipsasm)
+hljs.registerLanguage('mizar', mizar)
+hljs.registerLanguage('perl', perl)
+hljs.registerLanguage('mojolicious', mojolicious)
+hljs.registerLanguage('monkey', monkey)
+hljs.registerLanguage('moonscript', moonscript)
+hljs.registerLanguage('n1ql', n1ql)
+hljs.registerLanguage('nginx', nginx)
+hljs.registerLanguage('nim', nim)
+hljs.registerLanguage('nix', nix)
+hljs.registerLanguage('node-repl', node_repl)
+hljs.registerLanguage('nsis', nsis)
+hljs.registerLanguage('objectivec', objectivec)
+hljs.registerLanguage('ocaml', ocaml)
+hljs.registerLanguage('openscad', openscad)
+hljs.registerLanguage('oxygene', oxygene)
+hljs.registerLanguage('parser3', parser3)
+hljs.registerLanguage('pf', pf)
+hljs.registerLanguage('pgsql', pgsql)
+hljs.registerLanguage('php', php)
+hljs.registerLanguage('php-template', php_template)
+hljs.registerLanguage('plaintext', plaintext)
+hljs.registerLanguage('pony', pony)
+hljs.registerLanguage('powershell', powershell)
+hljs.registerLanguage('processing', processing)
+hljs.registerLanguage('profile', profile)
+hljs.registerLanguage('prolog', prolog)
+hljs.registerLanguage('properties', properties)
+hljs.registerLanguage('protobuf', protobuf)
+hljs.registerLanguage('puppet', puppet)
+hljs.registerLanguage('purebasic', purebasic)
+hljs.registerLanguage('python', python)
+hljs.registerLanguage('python-repl', python_repl)
+hljs.registerLanguage('q', q)
+hljs.registerLanguage('qml', qml)
+hljs.registerLanguage('r', r)
+hljs.registerLanguage('reasonml', reasonml)
+hljs.registerLanguage('rib', rib)
+hljs.registerLanguage('roboconf', roboconf)
+hljs.registerLanguage('routeros', routeros)
+hljs.registerLanguage('rsl', rsl)
+hljs.registerLanguage('ruleslanguage', ruleslanguage)
+hljs.registerLanguage('rust', rust)
+hljs.registerLanguage('sas', sas)
+hljs.registerLanguage('scala', scala)
+hljs.registerLanguage('scheme', scheme)
+hljs.registerLanguage('scilab', scilab)
+hljs.registerLanguage('scss', scss)
+hljs.registerLanguage('shell', shell)
+hljs.registerLanguage('smali', smali)
+hljs.registerLanguage('smalltalk', smalltalk)
+hljs.registerLanguage('sml', sml)
+hljs.registerLanguage('sqf', sqf)
+hljs.registerLanguage('sql', sql)
+hljs.registerLanguage('stan', stan)
+hljs.registerLanguage('stata', stata)
+hljs.registerLanguage('step21', step21)
+hljs.registerLanguage('stylus', stylus)
+hljs.registerLanguage('subunit', subunit)
+hljs.registerLanguage('swift', swift)
+hljs.registerLanguage('taggerscript', taggerscript)
+hljs.registerLanguage('yaml', yaml)
+hljs.registerLanguage('tap', tap)
+hljs.registerLanguage('tcl', tcl)
+hljs.registerLanguage('thrift', thrift)
+hljs.registerLanguage('tp', tp)
+hljs.registerLanguage('twig', twig)
+hljs.registerLanguage('typescript', typescript)
+hljs.registerLanguage('vala', vala)
+hljs.registerLanguage('vbnet', vbnet)
+hljs.registerLanguage('vbscript', vbscript)
+hljs.registerLanguage('vbscript-html', vbscript_html)
+hljs.registerLanguage('verilog', verilog)
+hljs.registerLanguage('vhdl', vhdl)
+hljs.registerLanguage('vim', vim)
+hljs.registerLanguage('x86asm', x86asm)
+hljs.registerLanguage('xl', xl)
+hljs.registerLanguage('xquery', xquery)
+hljs.registerLanguage('zephir', zephir)
 
-export default hljs;
+export default hljs

src/components/common/icon-button/icon-button.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React from 'react'
 import { Button, ButtonProps } from 'react-bootstrap'
@@ -19,13 +19,14 @@ export interface IconButtonProps extends ButtonProps {
 
 export const IconButton: React.FC<IconButtonProps> = ({ icon, children, border = false, ...props }) => {
   return (
-    <Button {...props} className={`btn-icon p-0 d-inline-flex align-items-stretch ${border ? 'with-border' : ''}`}>
+    <Button { ...props }
+            className={ `btn-icon p-0 d-inline-flex align-items-stretch ${ border ? 'with-border' : '' }` }>
       <span className="icon-part d-flex align-items-center">
-        <ForkAwesomeIcon icon={icon} className={'icon'}/>
+        <ForkAwesomeIcon icon={ icon } className={ 'icon' }/>
       </span>
-      <ShowIf condition={!!children}>
+      <ShowIf condition={ !!children }>
         <span className="text-part d-flex align-items-center">
-          {children}
+          { children }
         </span>
       </ShowIf>
     </Button>

src/components/common/icon-button/translated-icon-button.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React from 'react'
 import { Trans } from 'react-i18next'
@@ -14,8 +14,8 @@ export interface TranslatedIconButtonProps extends IconButtonProps {
 
 export const TranslatedIconButton: React.FC<TranslatedIconButtonProps> = ({ i18nKey, ...props }) => {
   return (
-    <IconButton {...props}>
-      <Trans i18nKey={i18nKey}/>
+    <IconButton { ...props }>
+      <Trans i18nKey={ i18nKey }/>
     </IconButton>
   )
 }

src/components/common/links/external-link.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React from 'react'
 import { ForkAwesomeIcon } from '../fork-awesome/fork-awesome-icon'
@@ -12,18 +12,18 @@ import { LinkWithTextProps } from './types'
 
 export const ExternalLink: React.FC<LinkWithTextProps> = ({ href, text, icon, id, className = 'text-light', title }) => {
   return (
-    <a href={href}
-      target="_blank"
-      rel="noopener noreferrer"
-      id={id}
-      className={className}
-      title={title}
-      dir='auto'
+    <a href={ href }
+       target="_blank"
+       rel="noopener noreferrer"
+       id={ id }
+       className={ className }
+       title={ title }
+       dir='auto'
     >
-      <ShowIf condition={!!icon}>
-        <ForkAwesomeIcon icon={icon as IconName} fixedWidth={true}/>&nbsp;
+      <ShowIf condition={ !!icon }>
+        <ForkAwesomeIcon icon={ icon as IconName } fixedWidth={ true }/>&nbsp;
       </ShowIf>
-      {text}
+      { text }
     </a>
   )
 }

src/components/common/links/internal-link.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React from 'react'
 import { Link } from 'react-router-dom'
@@ -13,15 +13,15 @@ import { LinkWithTextProps } from './types'
 
 export const InternalLink: React.FC<LinkWithTextProps> = ({ href, text, icon, id, className = 'text-light', title }) => {
   return (
-    <Link to={href}
-      className={className}
-      id={id}
-      title={title}
+    <Link to={ href }
+          className={ className }
+          id={ id }
+          title={ title }
     >
-      <ShowIf condition={!!icon}>
-        <ForkAwesomeIcon icon={icon as IconName} fixedWidth={true}/>&nbsp;
+      <ShowIf condition={ !!icon }>
+        <ForkAwesomeIcon icon={ icon as IconName } fixedWidth={ true }/>&nbsp;
       </ShowIf>
-      {text}
+      { text }
     </Link>
   )
 }

src/components/common/links/translated-external-link.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React from 'react'
 import { useTranslation } from 'react-i18next'
@@ -12,6 +12,6 @@ import { TranslatedLinkProps } from './types'
 export const TranslatedExternalLink: React.FC<TranslatedLinkProps> = ({ i18nKey, i18nOption, ...props }) => {
   const { t } = useTranslation()
   return (
-    <ExternalLink text={t(i18nKey, i18nOption)} {...props}/>
+    <ExternalLink text={ t(i18nKey, i18nOption) } { ...props }/>
   )
 }

src/components/common/links/translated-internal-link.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React from 'react'
 import { useTranslation } from 'react-i18next'
@@ -12,6 +12,6 @@ import { TranslatedLinkProps } from './types'
 export const TranslatedInternalLink: React.FC<TranslatedLinkProps> = ({ i18nKey, i18nOption, ...props }) => {
   const { t } = useTranslation()
   return (
-    <InternalLink text={t(i18nKey, i18nOption)} {...props}/>
+    <InternalLink text={ t(i18nKey, i18nOption) } { ...props }/>
   )
 }

src/components/common/links/types.d.ts

@@ -19,7 +19,7 @@ export interface LinkWithTextProps extends GeneralLinkProp {
   text: string
 }
 
-export interface TranslatedLinkProps extends GeneralLinkProp{
+export interface TranslatedLinkProps extends GeneralLinkProp {
   i18nKey: string
   i18nOption?: (TOptionsBase & StringMap) | string
 }

src/components/common/lock-button/lock-button.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React from 'react'
 import { Button } from 'react-bootstrap'
@@ -16,7 +16,7 @@ export interface LockButtonProps {
 
 export const LockButton: React.FC<LockButtonProps> = ({ locked, onLockedChanged, title }) => {
   return (
-    <Button variant='dark' size='sm' onClick={() => onLockedChanged(!locked)} title={title}>
+    <Button variant='dark' size='sm' onClick={ () => onLockedChanged(!locked) } title={ title }>
       { locked
         ? <ForkAwesomeIcon icon='lock'/>
         : <ForkAwesomeIcon icon='unlock'/>

src/components/common/modals/common-modal.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React from 'react'
 import { Modal } from 'react-bootstrap'
@@ -26,15 +26,16 @@ export const CommonModal: React.FC<CommonModalProps> = ({ show, onHide, titleI18
   useTranslation()
 
   return (
-    <Modal data-cy={'limitReachedModal'} show={show} onHide={onHide} animation={true} dialogClassName={`text-dark ${additionalClasses ?? ''}`} size={size}>
-      <Modal.Header closeButton={!!closeButton}>
+    <Modal data-cy={ 'limitReachedModal' } show={ show } onHide={ onHide } animation={ true }
+           dialogClassName={ `text-dark ${ additionalClasses ?? '' }` } size={ size }>
+      <Modal.Header closeButton={ !!closeButton }>
         <Modal.Title>
-          <ShowIf condition={!!icon}>
-            <ForkAwesomeIcon icon={icon as IconName}/>&nbsp;
+          <ShowIf condition={ !!icon }>
+            <ForkAwesomeIcon icon={ icon as IconName }/>&nbsp;
           </ShowIf>
           { titleI18nKey
-            ? <Trans i18nKey={titleI18nKey}/>
-            : <span>{title}</span>
+            ? <Trans i18nKey={ titleI18nKey }/>
+            : <span>{ title }</span>
           }
         </Modal.Title>
       </Modal.Header>

src/components/common/modals/deletion-modal.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React from 'react'
 import { Button, Modal } from 'react-bootstrap'
@@ -18,13 +18,13 @@ export const DeletionModal: React.FC<DeletionModalProps> = ({ show, onHide, titl
   useTranslation()
 
   return (
-    <CommonModal show={show} onHide={onHide} titleI18nKey={titleI18nKey} icon={icon} closeButton={true}>
+    <CommonModal show={ show } onHide={ onHide } titleI18nKey={ titleI18nKey } icon={ icon } closeButton={ true }>
       <Modal.Body className="text-dark">
         { children }
       </Modal.Body>
       <Modal.Footer>
-        <Button variant="danger" onClick={onConfirm}>
-          <Trans i18nKey={deletionButtonI18nKey}/>
+        <Button variant="danger" onClick={ onConfirm }>
+          <Trans i18nKey={ deletionButtonI18nKey }/>
         </Button>
       </Modal.Footer>
     </CommonModal>

src/components/common/modals/error-modal.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React from 'react'
 import { Modal } from 'react-bootstrap'
@@ -10,7 +10,7 @@ import { CommonModal, CommonModalProps } from './common-modal'
 
 export const ErrorModal: React.FC<CommonModalProps> = ({ show, onHide, titleI18nKey, icon, children }) => {
   return (
-    <CommonModal show={show} onHide={onHide} titleI18nKey={titleI18nKey} icon={icon} closeButton={true}>
+    <CommonModal show={ show } onHide={ onHide } titleI18nKey={ titleI18nKey } icon={ icon } closeButton={ true }>
       <Modal.Body className="text-dark text-center">
         { children }
       </Modal.Body>

src/components/common/motd-banner/motd-banner.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import equal from 'fast-deep-equal'
 import React from 'react'
@@ -23,16 +23,16 @@ export const MotdBanner: React.FC = () => {
   }
 
   return (
-    <ShowIf condition={bannerState.show}>
+    <ShowIf condition={ bannerState.show }>
       <Alert variant='primary' dir='auto' className='mb-0 text-center d-flex flex-row justify-content-center'>
         <Link to='/s/banner' className='flex-grow-1 align-self-center text-black'>
-          {bannerState.text}
+          { bannerState.text }
         </Link>
         <Button
           variant='outline-primary'
           size='sm'
           className='mx-2'
-          onClick={dismissBanner}>
+          onClick={ dismissBanner }>
           <ForkAwesomeIcon icon='times'/>
         </Button>
       </Alert>

src/components/common/number-range/number-range.ts

@@ -4,6 +4,7 @@
  * SPDX-License-Identifier: AGPL-3.0-only
  */
 
-export const createNumberRangeArray = (length: number) : number[] => {
-  return Array.from(Array(length).keys())
+export const createNumberRangeArray = (length: number): number[] => {
+  return Array.from(Array(length)
+    .keys())
 }

src/components/common/pagination/pager-item.tsx

@@ -1,21 +1,21 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React from 'react'
 
 export interface PageItemProps {
-    onClick: (index: number) => void
-    index: number
+  onClick: (index: number) => void
+  index: number
 }
 
 export const PagerItem: React.FC<PageItemProps> = ({ index, onClick }) => {
   return (
     <li className="page-item">
-      <span className="page-link" role="button" onClick={() => onClick(index)}>
-        {index + 1}
+      <span className="page-link" role="button" onClick={ () => onClick(index) }>
+        { index + 1 }
       </span>
     </li>
   )

src/components/common/pagination/pager-pagination.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React, { useEffect, useState } from 'react'
 import { Pagination } from 'react-bootstrap'
@@ -53,28 +53,31 @@ export const PagerPagination: React.FC<PaginationProps> = ({ numberOfPageButtons
       0
     )
 
-  const paginationItemsBefore = Array.from(new Array(correctedPageIndex - correctedLowerPageIndex)).map((k, index) => {
-    const itemIndex = correctedLowerPageIndex + index
-    return <PagerItem key={itemIndex} index={itemIndex} onClick={setPageIndex}/>
-  })
+  const paginationItemsBefore = Array.from(new Array(correctedPageIndex - correctedLowerPageIndex))
+                                     .map((k, index) => {
+                                       const itemIndex = correctedLowerPageIndex + index
+                                       return <PagerItem key={ itemIndex } index={ itemIndex }
+                                                         onClick={ setPageIndex }/>
+                                     })
 
-  const paginationItemsAfter = Array.from(new Array(correctedUpperPageIndex - correctedPageIndex)).map((k, index) => {
-    const itemIndex = correctedPageIndex + index + 1
-    return <PagerItem key={itemIndex} index={itemIndex} onClick={setPageIndex}/>
-  })
+  const paginationItemsAfter = Array.from(new Array(correctedUpperPageIndex - correctedPageIndex))
+                                    .map((k, index) => {
+                                      const itemIndex = correctedPageIndex + index + 1
+                                      return <PagerItem key={ itemIndex } index={ itemIndex } onClick={ setPageIndex }/>
+                                    })
 
   return (
     <Pagination dir='ltr'>
-      <ShowIf condition={correctedLowerPageIndex > 0}>
-        <PagerItem key={0} index={0} onClick={setPageIndex}/>
+      <ShowIf condition={ correctedLowerPageIndex > 0 }>
+        <PagerItem key={ 0 } index={ 0 } onClick={ setPageIndex }/>
         <Pagination.Ellipsis disabled/>
       </ShowIf>
-      {paginationItemsBefore}
-      <Pagination.Item active>{correctedPageIndex + 1}</Pagination.Item>
-      {paginationItemsAfter}
-      <ShowIf condition={correctedUpperPageIndex < lastPageIndex}>
+      { paginationItemsBefore }
+      <Pagination.Item active>{ correctedPageIndex + 1 }</Pagination.Item>
+      { paginationItemsAfter }
+      <ShowIf condition={ correctedUpperPageIndex < lastPageIndex }>
         <Pagination.Ellipsis disabled/>
-        <PagerItem key={lastPageIndex} index={lastPageIndex} onClick={setPageIndex}/>
+        <PagerItem key={ lastPageIndex } index={ lastPageIndex } onClick={ setPageIndex }/>
       </ShowIf>
     </Pagination>
   )

src/components/common/pagination/pager.tsx

@@ -1,15 +1,15 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React, { Fragment, useEffect } from 'react'
 
 export interface PagerPageProps {
-    pageIndex: number
-    numberOfElementsPerPage: number
-    onLastPageIndexChange: (lastPageIndex: number) => void
+  pageIndex: number
+  numberOfElementsPerPage: number
+  onLastPageIndexChange: (lastPageIndex: number) => void
 }
 
 export const Pager: React.FC<PagerPageProps> = ({ children, numberOfElementsPerPage, pageIndex, onLastPageIndexChange }) => {
@@ -22,10 +22,11 @@ export const Pager: React.FC<PagerPageProps> = ({ children, numberOfElementsPerP
 
   return <Fragment>
     {
-      React.Children.toArray(children).filter((value, index) => {
-        const pageOfElement = Math.floor((index) / numberOfElementsPerPage)
-        return (pageOfElement === correctedPageIndex)
-      })
+      React.Children.toArray(children)
+           .filter((value, index) => {
+             const pageOfElement = Math.floor((index) / numberOfElementsPerPage)
+             return (pageOfElement === correctedPageIndex)
+           })
     }
   </Fragment>
 }

src/components/common/routing/not-found-error-screen.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React from 'react'
 import { LandingLayout } from '../../landing-layout/landing-layout'

src/components/common/routing/redirector.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React, { useEffect, useState } from 'react'
 import { Redirect } from 'react-router'
@@ -27,7 +27,7 @@ export const Redirector: React.FC = () => {
   if (error) {
     return (<NotFoundErrorScreen/>)
   } else if (!error && error != null) {
-    return (<Redirect to={`/n/${id}`}/>)
+    return (<Redirect to={ `/n/${ id }` }/>)
   } else {
     return (<span>Loading</span>)
   }

src/components/common/show-if/show-if.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React, { Fragment } from 'react'
 
@@ -11,5 +11,5 @@ export interface ShowIfProps {
 }
 
 export const ShowIf: React.FC<ShowIfProps> = ({ children, condition }) => {
-  return condition ? <Fragment>{children}</Fragment> : null
+  return condition ? <Fragment>{ children }</Fragment> : null
 }

src/components/common/user-avatar/user-avatar.tsx

@@ -1,8 +1,8 @@
 /*
-SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
 
-SPDX-License-Identifier: AGPL-3.0-only
-*/
+ SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import React from 'react'
 import { useTranslation } from 'react-i18next'
@@ -21,15 +21,15 @@ const UserAvatar: React.FC<UserAvatarProps> = ({ name, photo, size, additionalCl
   const { t } = useTranslation()
 
   return (
-    <span className={'d-inline-flex align-items-center ' + additionalClasses}>
+    <span className={ 'd-inline-flex align-items-center ' + additionalClasses }>
       <img
-        src={photo}
-        className={`user-avatar rounded mr-1 ${size ?? ''}`}
-        alt={t('common.avatarOf', { name })}
-        title={name}
+        src={ photo }
+        className={ `user-avatar rounded mr-1 ${ size ?? '' }` }
+        alt={ t('common.avatarOf', { name }) }
+        title={ name }
       />
-      <ShowIf condition={showName}>
-        <span className="mx-1 user-line-name">{name}</span>
+      <ShowIf condition={ showName }>
+        <span className="mx-1 user-line-name">{ name }</span>
       </ShowIf>
     </span>
   )