Fix Communication between frontend and backend (#1201)

Co-authored-by: Tilman Vatteroth <git@tilmanvatteroth.de>
Signed-off-by: Philip Molares <philip.molares@udo.edu>
Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>

cypress/integration/history.spec.ts

@@ -26,7 +26,7 @@ describe('History', () => {
   describe('Pinning', () => {
     describe('working', () => {
       beforeEach(() => {
-        cy.intercept('PUT', '/api/private/history/features', (req) => {
+        cy.intercept('PUT', '/api/private/me/history/features', (req) => {
           req.reply(200, req.body)
         })
       })
@@ -60,7 +60,7 @@ describe('History', () => {
 
     describe('failing', () => {
       beforeEach(() => {
-        cy.intercept('PUT', '/api/private/history/features', {
+        cy.intercept('PUT', '/api/private/me/history/features', {
           statusCode: 401
         })
       })

cypress/support/config.ts

@@ -45,7 +45,7 @@ export const config = {
     saml: 'aufSAMLn.de'
   },
   maxDocumentLength: 200,
-  specialLinks: {
+  specialUrls: {
     privacy: 'https://example.com/privacy',
     termsOfUse: 'https://example.com/termsOfUse',
     imprint: 'https://example.com/imprint'
@@ -57,8 +57,8 @@ export const config = {
     issueTrackerUrl: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ'
   },
   'iframeCommunication': {
-    'editorOrigin': 'http://127.0.0.1:3001',
-    'rendererOrigin': 'http://127.0.0.1:3001'
+    'editorOrigin': 'http://127.0.0.1:3001/',
+    'rendererOrigin': 'http://127.0.0.1:3001/'
   }
 }
 

cypress/support/visit-test-editor.ts

@@ -18,16 +18,21 @@ Cypress.Commands.add('visitTestEditor', (query?: string) => {
 
 beforeEach(() => {
   cy.intercept(`/api/private/notes/${ testNoteId }-get`, {
-    'id': 'ABC123',
-    'alias': 'banner',
-    'lastChange': {
-      'userId': 'test',
-      'timestamp': 1600033920
-    },
-    'viewCount': 0,
-    'createTime': 1600033920,
-    'content': '',
-    'authorship': [],
-    'preVersionTwoNote': true
+    "content": "",
+    "metadata": {
+      "id": "ABC11",
+      "alias": "banner",
+      "version": 2,
+      "viewCount": 0,
+      "updateTime": "2021-04-24T09:27:51.000Z",
+      "updateUser": {
+        "userName": "test",
+        "displayName": "Testy",
+        "photo": "",
+        "email": ""
+      },
+      "createTime": "2021-04-24T09:27:51.000Z",
+      "editedBy": []
+    }
   })
 })

public/api/private/config

@@ -30,18 +30,19 @@
   "maxDocumentLength": 100000,
   "useImageProxy": false,
   "plantumlServer": "https://www.plantuml.com/plantuml",
-  "specialLinks": {
+  "specialUrls": {
     "privacy": "https://example.com/privacy",
     "termsOfUse": "https://example.com/termsOfUse",
     "imprint": "https://example.com/imprint"
   },
   "version": {
-    "version": "mock",
-    "sourceCodeUrl": "https://www.youtube.com/watch?v=dQw4w9WgXcQ",
-    "issueTrackerUrl": "https://www.youtube.com/watch?v=dQw4w9WgXcQ"
+      "major": -1,
+      "minor": -1,
+      "patch": -1,
+      "commit": "mock"
   },
   "iframeCommunication": {
-    "editorOrigin": "http://localhost:3001",
-    "rendererOrigin": "http://localhost:3001"
+    "editorOrigin": "http://localhost:3001/",
+    "rendererOrigin": "http://localhost:3001/"
   }
 }

public/api/private/notes/banner

@@ -1,13 +0,0 @@
-{
-    "id": "ABC123",
-    "alias": "banner",
-    "lastChange": {
-        "userId": "test",
-        "timestamp": 1600033920
-    },
-    "viewcount": 0,
-    "createtime": 1600033920,
-    "content": "This is the test banner text",
-    "authorship": [],
-    "preVersionTwoNote": true
-}

public/api/private/notes/banner-get

@@ -0,0 +1,18 @@
+{
+    "content": "This is the test banner text",
+    "metadata": {
+        "id": "ABC11",
+        "alias": "banner",
+        "version": 2,
+        "viewCount": 0,
+        "updateTime": "2021-04-24T09:27:51.000Z",
+        "updateUser": {
+            "userName": "test",
+            "displayName": "Testy",
+            "photo": "",
+            "email": ""
+        },
+        "createTime": "2021-04-24T09:27:51.000Z",
+        "editedBy": []
+    }
+}

public/api/private/notes/old

@@ -1,13 +0,0 @@
-{
-    "id": "ABC123",
-    "alias": "old",
-    "lastChange": {
-        "userId": "test",
-        "timestamp": 1600033920
-    },
-    "viewcount": 0,
-    "createtime": 1600033920,
-    "content": "test123",
-    "authorship": [],
-    "preVersionTwoNote": false
-}

public/api/private/notes/old-get

@@ -0,0 +1,18 @@
+{
+    "content": "test123",
+    "metadata": {
+        "id": "ABC3",
+        "alias": "old",
+        "version": 1,
+        "viewCount": 0,
+        "updateTime": "2021-04-24T09:27:51.000Z",
+        "updateUser": {
+            "userName": "test",
+            "displayName": "Testy",
+            "photo": "",
+            "email": ""
+        },
+        "createTime": "2021-04-24T09:27:51.000Z",
+        "editedBy": []
+    }
+}

src/api/config/types.d.ts

@@ -12,7 +12,7 @@ export interface Config {
   banner: BannerConfig,
   customAuthNames: CustomAuthNames,
   useImageProxy: boolean,
-  specialLinks: SpecialLinks,
+  specialUrls: SpecialUrls,
   version: BackendVersion,
   plantumlServer: string | null,
   maxDocumentLength: number,
@@ -35,9 +35,11 @@ export interface BannerConfig {
 }
 
 export interface BackendVersion {
-  version: string,
-  sourceCodeUrl: string
-  issueTrackerUrl: string
+  major: number
+  minor: number
+  patch: number
+  preRelease?: string
+  commit?: string
 }
 
 export interface AuthProvidersState {
@@ -60,7 +62,7 @@ export interface CustomAuthNames {
   saml: string;
 }
 
-export interface SpecialLinks {
+export interface SpecialUrls {
   privacy: string,
   termsOfUse: string,
   imprint: string,

src/api/group/types.d.ts

@@ -0,0 +1,11 @@
+/*
+ * SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ *
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+export interface GroupInfoDto {
+  name: string
+  displayName: string
+  special: boolean
+}

src/api/history/index.ts

@@ -8,13 +8,13 @@ import { defaultFetchConfig, expectResponseCode, getApiUrl } from '../utils'
 import { HistoryEntryDto, HistoryEntryPutDto, HistoryEntryUpdateDto } from './types'
 
 export const getHistory = async (): Promise<HistoryEntryDto[]> => {
-  const response = await fetch(getApiUrl() + '/history')
+  const response = await fetch(getApiUrl() + '/me/history')
   expectResponseCode(response)
   return await response.json() as Promise<HistoryEntryDto[]>
 }
 
 export const postHistory = async (entries: HistoryEntryPutDto[]): Promise<void> => {
-  const response = await fetch(getApiUrl() + '/history', {
+  const response = await fetch(getApiUrl() + '/me/history', {
     ...defaultFetchConfig,
     method: 'POST',
     body: JSON.stringify(entries)
@@ -23,7 +23,7 @@ export const postHistory = async (entries: HistoryEntryPutDto[]): Promise<void>
 }
 
 export const updateHistoryEntryPinStatus = async (noteId: string, entry: HistoryEntryUpdateDto): Promise<void> => {
-  const response = await fetch(getApiUrl() + '/history/' + noteId, {
+  const response = await fetch(getApiUrl() + '/me/history/' + noteId, {
     ...defaultFetchConfig,
     method: 'PUT',
     body: JSON.stringify(entry)
@@ -32,7 +32,7 @@ export const updateHistoryEntryPinStatus = async (noteId: string, entry: History
 }
 
 export const deleteHistoryEntry = async (noteId: string): Promise<void> => {
-  const response = await fetch(getApiUrl() + '/history/' + noteId, {
+  const response = await fetch(getApiUrl() + '/me/history/' + noteId, {
     ...defaultFetchConfig,
     method: 'DELETE'
   })
@@ -40,7 +40,7 @@ export const deleteHistoryEntry = async (noteId: string): Promise<void> => {
 }
 
 export const deleteHistory = async (): Promise<void> => {
-  const response = await fetch(getApiUrl() + '/history', {
+  const response = await fetch(getApiUrl() + '/me/history', {
     ...defaultFetchConfig,
     method: 'DELETE'
   })

src/api/me/index.ts

@@ -6,9 +6,10 @@
 
 import { UserResponse } from '../users/types'
 import { defaultFetchConfig, expectResponseCode, getApiUrl } from '../utils'
+import { isMockMode } from '../../utils/test-modes'
 
 export const getMe = async (): Promise<UserResponse> => {
-  const response = await fetch(getApiUrl() + '/me', {
+  const response = await fetch(getApiUrl() + `/me${ isMockMode() ? '-get' : '' }`, {
     ...defaultFetchConfig
   })
   expectResponseCode(response)

src/api/notes/dto-methods.ts

@@ -0,0 +1,28 @@
+/*
+ * SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ *
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import { NoteDto } from './types'
+import { NoteDetails } from '../../redux/note-details/types'
+import { DateTime } from 'luxon'
+import { initialState } from '../../redux/note-details/reducers'
+
+export const noteDtoToNoteDetails = (note: NoteDto): NoteDetails => {
+  return {
+    markdownContent: note.content,
+    frontmatter: initialState.frontmatter,
+    id: note.metadata.id,
+    noteTitle: initialState.noteTitle,
+    createTime: DateTime.fromISO(note.metadata.createTime),
+    lastChange: {
+      userName: note.metadata.updateUser.userName,
+      timestamp: DateTime.fromISO(note.metadata.updateTime)
+    },
+    firstHeading: initialState.firstHeading,
+    viewCount: note.metadata.viewCount,
+    alias: note.metadata.alias,
+    authorship: note.metadata.editedBy
+  }
+}

src/api/notes/index.ts

@@ -5,31 +5,17 @@
  */
 
 import { defaultFetchConfig, expectResponseCode, getApiUrl } from '../utils'
+import { NoteDto } from './types'
+import { isMockMode } from '../../utils/test-modes'
 
-interface LastChange {
-  userId: string
-  timestamp: number
-}
-
-export interface Note {
-  id: string
-  alias: string
-  lastChange: LastChange
-  viewCount: number
-  createTime: number
-  content: string
-  authorship: number[]
-  preVersionTwoNote: boolean
-}
-
-export const getNote = async (noteId: string): Promise<Note> => {
+export const getNote = async (noteId: string): Promise<NoteDto> => {
   // The "-get" suffix is necessary, because in our mock api (filesystem) the note id might already be a folder.
   // TODO: [mrdrogdrog] replace -get with actual api route as soon as api backend is ready.
-  const response = await fetch(getApiUrl() + `/notes/${ noteId }-get`, {
+  const response = await fetch(getApiUrl() + `/notes/${ noteId }${ isMockMode() ? '-get' : '' }`, {
     ...defaultFetchConfig
   })
   expectResponseCode(response)
-  return await response.json() as Promise<Note>
+  return await response.json() as Promise<NoteDto>
 }
 
 export const deleteNote = async (noteId: string): Promise<void> => {

src/api/notes/types.d.ts

@@ -0,0 +1,53 @@
+/*
+ * SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ *
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import { UserInfoDto } from '../users/types'
+import { GroupInfoDto } from '../group/types'
+
+export interface NoteDto {
+  content: string
+  metadata: NoteMetadataDto
+  editedByAtPosition: NoteAuthorshipDto[]
+}
+
+export interface NoteMetadataDto {
+  id: string
+  alias: string
+  version: number
+  title: string
+  description: string
+  tags: string[]
+  updateTime: string
+  updateUser: UserInfoDto
+  viewCount: number
+  createTime: string
+  editedBy: string[]
+  permissions: NotePermissionsDto
+}
+
+export interface NoteAuthorshipDto {
+  userName: string
+  startPos: number
+  endPos: number
+  createdAt: string
+  updatedAt: string
+}
+
+export interface NotePermissionsDto {
+  owner: UserInfoDto
+  sharedToUsers: NoteUserPermissionEntryDto[]
+  sharedToGroups: NoteGroupPermissionEntryDto[]
+}
+
+export interface NoteUserPermissionEntryDto {
+  user: UserInfoDto
+  canEdit: boolean
+}
+
+export interface NoteGroupPermissionEntryDto {
+  group: GroupInfoDto
+  canEdit: boolean
+}

src/api/users/types.d.ts

@@ -12,3 +12,10 @@ export interface UserResponse {
   photo: string
   provider: LoginProvider
 }
+
+export interface UserInfoDto {
+  userName: string
+  displayName: string
+  photo: string
+  email: string
+}

src/components/common/routing/redirector.tsx

@@ -9,6 +9,7 @@ import { Redirect } from 'react-router'
 import { useParams } from 'react-router-dom'
 import { getNote } from '../../../api/notes'
 import { NotFoundErrorScreen } from './not-found-error-screen'
+import { NoteDto } from '../../../api/notes/types'
 
 interface RouteParameters {
   id: string
@@ -20,7 +21,7 @@ export const Redirector: React.FC = () => {
 
   useEffect(() => {
     getNote(id)
-      .then((noteFromAPI) => setError(!noteFromAPI.preVersionTwoNote))
+      .then((noteFromAPI: NoteDto) => setError(noteFromAPI.metadata.version !== 1))
       .catch(() => setError(true))
   }, [id])
 

src/components/document-read-only-page/document-read-only-page.tsx

@@ -48,7 +48,7 @@ export const DocumentReadOnlyPage: React.FC = () => {
       </div>
       <ShowIf condition={ !error && !loading }>
         <DocumentInfobar
-          changedAuthor={ noteDetails.lastChange.userId ?? '' }
+          changedAuthor={ noteDetails.lastChange.userName ?? '' }
           changedTime={ noteDetails.lastChange.timestamp }
           createdAuthor={ 'Test' }
           createdTime={ noteDetails.createTime }

src/components/editor-page/app-bar/help-button/links.tsx

@@ -7,16 +7,13 @@
 import React from 'react'
 import { Col, Row } from 'react-bootstrap'
 import { Trans, useTranslation } from 'react-i18next'
-import { useSelector } from 'react-redux'
 import links from '../../../../links.json'
-import { ApplicationState } from '../../../../redux'
 import { TranslatedExternalLink } from '../../../common/links/translated-external-link'
 import { TranslatedInternalLink } from '../../../common/links/translated-internal-link'
 
 export const Links: React.FC = () => {
   useTranslation()
 
-  const backendIssueTracker = useSelector((state: ApplicationState) => state.config.version.issueTrackerUrl)
   return (
     <Row className={ 'justify-content-center pt-4' }>
       <Col lg={ 4 }>
@@ -43,7 +40,7 @@ export const Links: React.FC = () => {
             <li>
               <TranslatedExternalLink
                 i18nKey='editor.help.contacts.reportIssue'
-                href={ backendIssueTracker }
+                href={ links.backendIssues }
                 icon='tag'
                 className='text-primary'
               />

src/components/editor-page/renderer-pane/render-iframe.tsx

@@ -8,7 +8,7 @@ import React, { Fragment, useCallback, useEffect, useRef, useState } from 'react
 import { useSelector } from 'react-redux'
 import { useIsDarkModeActivated } from '../../../hooks/common/use-is-dark-mode-activated'
 import { ApplicationState } from '../../../redux'
-import { isTestMode } from '../../../utils/is-test-mode'
+import { isTestMode } from '../../../utils/test-modes'
 import { RendererProps } from '../../render-page/markdown-document'
 import { ImageDetails, RendererType } from '../../render-page/rendering-message'
 import { useContextOrStandaloneIframeCommunicator } from '../render-context/iframe-communicator-context-provider'
@@ -44,7 +44,7 @@ export const RenderIframe: React.FC<RenderIframeProps> = (
 
   const frameReference = useRef<HTMLIFrameElement>(null)
   const rendererOrigin = useSelector((state: ApplicationState) => state.config.iframeCommunication.rendererOrigin)
-  const renderPageUrl = `${ rendererOrigin }/render`
+  const renderPageUrl = `${ rendererOrigin }render`
   const resetRendererReady = useCallback(() => setRendererReady(false), [])
   const iframeCommunicator = useContextOrStandaloneIframeCommunicator()
   const onIframeLoad = useOnIframeLoad(frameReference, iframeCommunicator, rendererOrigin, renderPageUrl, resetRendererReady)

src/components/history-page/history-content/history-content.tsx

@@ -1,7 +1,7 @@
 /*
- SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
-
- SPDX-License-Identifier: AGPL-3.0-only
+ * SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ *
+ * SPDX-License-Identifier: AGPL-3.0-only
  */
 
 import React, { Fragment, useCallback, useState } from 'react'
@@ -46,23 +46,19 @@ export const HistoryContent: React.FC<HistoryContentProps> = ({ viewState, entri
   const [lastPageIndex, setLastPageIndex] = useState(0)
 
   const onPinClick = useCallback((noteId: string) => {
-    toggleHistoryEntryPinning(noteId).catch(
-      showErrorNotification(t('landing.history.error.updateEntry.text'))
-    )
+    toggleHistoryEntryPinning(noteId)
+      .catch(showErrorNotification(t('landing.history.error.updateEntry.text')))
   }, [t])
 
   const onDeleteClick = useCallback((noteId: string) => {
-    deleteNote(noteId).then(() => {
-      return removeHistoryEntry(noteId)
-    }).catch(
-      showErrorNotification(t('landing.history.error.deleteNote.text'))
-    )
+    deleteNote(noteId)
+      .then(() => removeHistoryEntry(noteId))
+      .catch(showErrorNotification(t('landing.history.error.deleteNote.text')))
   }, [t])
 
   const onRemoveClick = useCallback((noteId: string) => {
-    removeHistoryEntry(noteId).catch(
-      showErrorNotification(t('landing.history.error.deleteEntry.text'))
-    )
+    removeHistoryEntry(noteId)
+      .catch(showErrorNotification(t('landing.history.error.deleteEntry.text')))
   }, [t])
 
   if (entries.length === 0) {

src/components/landing-layout/footer/powered-by-links.tsx

@@ -18,7 +18,7 @@ import equal from 'fast-deep-equal'
 export const PoweredByLinks: React.FC = () => {
   useTranslation()
 
-  const specialLinks = useSelector((state: ApplicationState) => Object.entries(state.config.specialLinks) as [string, string][], equal)
+  const specialUrls: [string, string][] = useSelector((state: ApplicationState) => Object.entries(state.config.specialUrls) as [string, string][], equal)
 
   return (
     <p>
@@ -28,7 +28,7 @@ export const PoweredByLinks: React.FC = () => {
       &nbsp;|&nbsp;
       <TranslatedInternalLink href='/n/release-notes' i18nKey='landing.footer.releases'/>
       {
-        specialLinks.map(([i18nKey, href]) =>
+        specialUrls.map(([i18nKey, href]) =>
           <Fragment key={ i18nKey }>
             &nbsp;|&nbsp;
             <TranslatedExternalLink href={ href } i18nKey={ 'landing.footer.' + i18nKey }/>

src/components/landing-layout/footer/version-info/version-info-modal.tsx

@@ -4,17 +4,32 @@
  * SPDX-License-Identifier: AGPL-3.0-only
  */
 
-import React from 'react'
+import React, { useMemo } from 'react'
 import { CommonModal, CommonModalProps } from '../../../common/modals/common-modal'
 import { Modal, Row } from 'react-bootstrap'
 import { VersionInfoModalColumn } from './version-info-modal-column'
 import frontendVersion from '../../../../version.json'
+import links from '../../../../links.json'
 import { useSelector } from 'react-redux'
 import { ApplicationState } from '../../../../redux'
 import equal from 'fast-deep-equal'
+import { BackendVersion } from '../../../../api/config/types'
 
 export const VersionInfoModal: React.FC<CommonModalProps> = ({ onHide, show }) => {
-  const serverVersion = useSelector((state: ApplicationState) => state.config.version, equal)
+  const serverVersion: BackendVersion = useSelector((state: ApplicationState) => state.config.version, equal)
+  const backendVersion = useMemo(() => {
+    const version = `${serverVersion.major}.${serverVersion.minor}.${serverVersion.patch}`
+
+    if (serverVersion.preRelease) {
+      return `${version}-${serverVersion.preRelease}`
+    }
+
+    if (serverVersion.commit) {
+      return serverVersion.commit
+    }
+    return version
+  }, [serverVersion])
+
 
   return (
     <CommonModal data-cy={ 'version-modal' } show={ show } onHide={ onHide } closeButton={ true }
@@ -23,9 +38,9 @@ export const VersionInfoModal: React.FC<CommonModalProps> = ({ onHide, show }) =
         <Row>
           <VersionInfoModalColumn
             titleI18nKey={ 'landing.versionInfo.serverVersion' }
-            version={ serverVersion.version }
-            issueTrackerLink={ serverVersion.issueTrackerUrl }
-            sourceCodeLink={ serverVersion.sourceCodeUrl }/>
+            version={ backendVersion }
+            issueTrackerLink={ links.backendIssues }
+            sourceCodeLink={ links.backendSourceCode }/>
           <VersionInfoModalColumn
             titleI18nKey={ 'landing.versionInfo.clientVersion' }
             version={ frontendVersion.version }

src/components/register-page/register-page.tsx

@@ -14,6 +14,7 @@ import { ApplicationState } from '../../redux'
 import { TranslatedExternalLink } from '../common/links/translated-external-link'
 import { ShowIf } from '../common/show-if/show-if'
 import { getAndSetUser } from '../login-page/auth/utils'
+import { SpecialUrls } from '../../api/config/types'
 
 export enum RegisterError {
   NONE = 'none',
@@ -24,7 +25,7 @@ export enum RegisterError {
 export const RegisterPage: React.FC = () => {
   const { t } = useTranslation()
   const allowRegister = useSelector((state: ApplicationState) => state.config.allowRegister)
-  const specialLinks = useSelector((state: ApplicationState) => state.config.specialLinks)
+  const specialUrls: SpecialUrls = useSelector((state: ApplicationState) => state.config.specialUrls)
   const userExists = useSelector((state: ApplicationState) => !!state.user)
 
   const [username, setUsername] = useState('')
@@ -112,17 +113,17 @@ export const RegisterPage: React.FC = () => {
                     required
                   />
                 </Form.Group>
-                <ShowIf condition={ !!specialLinks?.termsOfUse || !!specialLinks?.privacy }>
+                <ShowIf condition={ !!specialUrls?.termsOfUse || !!specialUrls?.privacy }>
                   <Trans i18nKey='login.register.infoTermsPrivacy'/>
                   <ul>
-                    <ShowIf condition={ !!specialLinks?.termsOfUse }>
+                    <ShowIf condition={ !!specialUrls?.termsOfUse }>
                       <li>
-                        <TranslatedExternalLink i18nKey='landing.footer.termsOfUse' href={ specialLinks.termsOfUse }/>
+                        <TranslatedExternalLink i18nKey='landing.footer.termsOfUse' href={ specialUrls.termsOfUse }/>
                       </li>
                     </ShowIf>
-                    <ShowIf condition={ !!specialLinks?.privacy }>
+                    <ShowIf condition={ !!specialUrls?.privacy }>
                       <li>
-                        <TranslatedExternalLink i18nKey='landing.footer.privacy' href={ specialLinks.privacy }/>
+                        <TranslatedExternalLink i18nKey='landing.footer.privacy' href={ specialUrls.privacy }/>
                       </li>
                     </ShowIf>
                   </ul>

src/index.tsx

@@ -22,7 +22,7 @@ import { store } from './redux'
 import * as serviceWorkerRegistration from './service-worker-registration'
 import './style/dark.scss'
 import './style/index.scss'
-import { isTestMode } from './utils/is-test-mode'
+import { isTestMode } from './utils/test-modes'
 
 const EditorPage = React.lazy(() => import(/* webpackPrefetch: true *//* webpackChunkName: "editor" */ './components/editor-page/editor-page'))
 const RenderPage = React.lazy(() => import (/* webpackPrefetch: true *//* webpackChunkName: "renderPage" */ './components/render-page/render-page'))

src/links.json

@@ -3,6 +3,8 @@
   "community": "https://community.hedgedoc.org",
   "faq": "https://hedgedoc.org/faq/",
   "githubOrg": "https://github.com/hedgedoc/",
+  "backendSourceCode": "https://github.com/hedgedoc/hedgedoc",
+  "backendIssues": "https://github.com/hedgedoc/hedgedoc/issues",
   "mastodon": "https://social.hedgedoc.org",
   "translate": "https://translate.hedgedoc.org",
   "webpage": "https://hedgedoc.org"

src/redux/banner/reducers.ts

@@ -8,7 +8,7 @@ import { Reducer } from 'redux'
 import { BannerActions, BannerActionType, BannerState, SetBannerAction } from './types'
 
 export const initialState: BannerState = {
-  show: true,
+  show: false,
   text: '',
   timestamp: ''
 }

src/redux/config/reducers.ts

@@ -40,15 +40,15 @@ export const initialState: Config = {
   maxDocumentLength: 0,
   useImageProxy: false,
   plantumlServer: null,
-  specialLinks: {
+  specialUrls: {
     privacy: '',
     termsOfUse: '',
     imprint: ''
   },
   version: {
-    version: '',
-    sourceCodeUrl: '',
-    issueTrackerUrl: ''
+    major: -1,
+    minor: -1,
+    patch: -1,
   },
   iframeCommunication: {
     editorOrigin: '',

src/redux/history/methods.ts

@@ -91,8 +91,8 @@ export const toggleHistoryEntryPinning = async (noteId: string): Promise<void> =
     updateLocalHistoryEntry(noteId, entryToUpdate)
   } else {
     const historyUpdateDto = historyEntryToHistoryEntryUpdateDto(entryToUpdate)
-    updateHistoryEntryRedux(noteId, entryToUpdate)
     await updateHistoryEntryPinStatus(noteId, historyUpdateDto)
+    updateHistoryEntryRedux(noteId, entryToUpdate)
   }
 }
 

src/redux/note-details/methods.ts

@@ -5,7 +5,7 @@
  */
 
 import { store } from '..'
-import { Note } from '../../api/notes'
+import { NoteDto } from '../../api/notes/types'
 import { NoteFrontmatter } from '../../components/editor-page/note-frontmatter/note-frontmatter'
 import { initialState } from './reducers'
 import {
@@ -24,7 +24,7 @@ export const setNoteMarkdownContent = (content: string): void => {
   } as SetNoteDetailsAction)
 }
 
-export const setNoteDataFromServer = (apiResponse: Note): void => {
+export const setNoteDataFromServer = (apiResponse: NoteDto): void => {
   store.dispatch({
     type: NoteDetailsActionType.SET_NOTE_DATA_FROM_SERVER,
     note: apiResponse

src/redux/note-details/reducers.ts

@@ -6,7 +6,6 @@
 
 import { DateTime } from 'luxon'
 import { Reducer } from 'redux'
-import { Note } from '../../api/notes'
 import {
   NoteFrontmatter,
   NoteTextDirection,
@@ -22,6 +21,7 @@ import {
   SetNoteFrontmatterFromRenderingAction,
   UpdateNoteTitleByFirstHeadingAction
 } from './types'
+import { noteDtoToNoteDetails } from '../../api/notes/dto-methods'
 
 export const initialState: NoteDetails = {
   markdownContent: '',
@@ -29,10 +29,9 @@ export const initialState: NoteDetails = {
   createTime: DateTime.fromSeconds(0),
   lastChange: {
     timestamp: DateTime.fromSeconds(0),
-    userId: ''
+    userName: ''
   },
   alias: '',
-  preVersionTwoNote: false,
   viewCount: 0,
   authorship: [],
   noteTitle: '',
@@ -67,7 +66,7 @@ export const NoteDetailsReducer: Reducer<NoteDetails, NoteDetailsAction> = (stat
         noteTitle: generateNoteTitle(state.frontmatter, (action as UpdateNoteTitleByFirstHeadingAction).firstHeading)
       }
     case NoteDetailsActionType.SET_NOTE_DATA_FROM_SERVER:
-      return convertNoteToNoteDetails((action as SetNoteDetailsFromServerAction).note)
+      return noteDtoToNoteDetails((action as SetNoteDetailsFromServerAction).note)
     case NoteDetailsActionType.SET_NOTE_FRONTMATTER:
       return {
         ...state,
@@ -111,21 +110,4 @@ const generateNoteTitle = (frontmatter: NoteFrontmatter, firstHeading?: string)
   }
 }
 
-const convertNoteToNoteDetails = (note: Note): NoteDetails => {
-  return {
-    markdownContent: note.content,
-    frontmatter: initialState.frontmatter,
-    id: note.id,
-    noteTitle: initialState.noteTitle,
-    createTime: DateTime.fromSeconds(note.createTime),
-    lastChange: {
-      userId: note.lastChange.userId,
-      timestamp: DateTime.fromSeconds(note.lastChange.timestamp)
-    },
-    firstHeading: initialState.firstHeading,
-    preVersionTwoNote: note.preVersionTwoNote,
-    viewCount: note.viewCount,
-    alias: note.alias,
-    authorship: note.authorship
-  }
-}
+

src/redux/note-details/types.ts

@@ -6,8 +6,8 @@
 
 import { DateTime } from 'luxon'
 import { Action } from 'redux'
-import { Note } from '../../api/notes'
 import { NoteFrontmatter } from '../../components/editor-page/note-frontmatter/note-frontmatter'
+import { NoteDto } from '../../api/notes/types'
 
 export enum NoteDetailsActionType {
   SET_DOCUMENT_CONTENT = 'note-details/set',
@@ -18,7 +18,7 @@ export enum NoteDetailsActionType {
 }
 
 interface LastChange {
-  userId: string
+  userName: string
   timestamp: DateTime
 }
 
@@ -27,10 +27,9 @@ export interface NoteDetails {
   id: string
   createTime: DateTime
   lastChange: LastChange
-  preVersionTwoNote: boolean
   viewCount: number
   alias: string
-  authorship: number[]
+  authorship: string[]
   noteTitle: string
   firstHeading?: string
   frontmatter: NoteFrontmatter
@@ -47,7 +46,7 @@ export interface SetNoteDetailsAction extends NoteDetailsAction {
 
 export interface SetNoteDetailsFromServerAction extends NoteDetailsAction {
   type: NoteDetailsActionType.SET_NOTE_DATA_FROM_SERVER
-  note: Note
+  note: NoteDto
 }
 
 export interface UpdateNoteTitleByFirstHeadingAction extends NoteDetailsAction {

src/redux/ui-notifications/methods.ts

@@ -39,9 +39,7 @@ export const dismissUiNotification = (notificationId: number): void => {
   } as DismissUiNotificationAction)
 }
 
-// Promises catch errors as any.
-// eslint-disable-next-line @typescript-eslint/no-explicit-any,@typescript-eslint/explicit-module-boundary-types
-export const showErrorNotification = (message: string) => (error: any): void => {
+export const showErrorNotification = (message: string) => (error: Error): void => {
   console.error(message, error)
   dispatchUiNotification(i18n.t('common.errorOccurred'), message, DEFAULT_DURATION_IN_SECONDS, 'exclamation-triangle')
 }

src/utils/test-modes.ts

@@ -7,3 +7,7 @@
 export const isTestMode = (): boolean => {
   return !!process.env.REACT_APP_TEST_MODE
 }
+
+export const isMockMode = (): boolean => {
+  return process.env.REACT_APP_BACKEND === undefined
+}

src/version.json

@@ -1,5 +1,5 @@
 {
   "version": "0.0",
-  "sourceCodeUrl": "https://www.youtube.com/watch?v=dQw4w9WgXcQ",
-  "issueTrackerUrl": "https://www.youtube.com/watch?v=dQw4w9WgXcQ"
+  "sourceCodeUrl": "https://github.com/hedgedoc/react-client",
+  "issueTrackerUrl": "https://github.com/hedgedoc/react-client/issues"
 }