github/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2024-11-25 11:16:31 -05:00
Code Issues Projects Releases Packages Wiki Activity

Refactor handling of environment variables (#2303)

Browse source 
* Refactor environment variables

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Tilman Vatteroth 2022-09-16 11:03:29 +02:00 committed by GitHub
parent e412115a78
commit 39a4125cb0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
85 changed files with 624 additions and 461 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
.env.development
View file

@ -1 +1,3 @@
NEXT_PUBLIC_USE_MOCK_API=true
HD_EDITOR_BASE_URL="http://localhost:3001/"
HD_RENDERER_BASE_URL="http://127.0.0.1:3001/"

1
.env.production
View file

@ -1 +1,2 @@
NEXT_PUBLIC_USE_MOCK_API=false
NEXT_PUBLIC_TEST_MODE=false

2
.env.test
View file

@ -1 +1,3 @@
NEXT_PUBLIC_USE_MOCK_API=true
HD_EDITOR_BASE_URL="http://127.0.0.1:3001/"
HD_RENDERER_BASE_URL="http://127.0.0.1:3001/"

6
.github/workflows/deploy-pr.yml vendored
View file

@ -35,13 +35,13 @@ jobs:
node-version: 18
- name: Patch files
run: bash netlify/patch-files.sh
run: bash netlify/patch-files.sh "${{ github.event.number }}"
- name: Install dependencies
run: yarn install --immutable
- name: Build netlify variant
run: yarn build:netlify
- name: Build mock variant
run: yarn build:mock
- name: Remove Next.js cache to avoid it being deployed
run: rm -r .next/cache

2
.github/workflows/e2e.yml vendored
View file

@ -108,6 +108,8 @@ jobs:
- name: Run server
run: yarn start:ci &
env:
NODE_ENV: test
- name: Wait for server
run: "sleep 3 && curl --max-time 120 http://127.0.0.1:3001/"

4
.reuse/dep5
View file

@ -3,7 +3,7 @@ Upstream-Name: react-client
Upstream-Contact: The HedgeDoc developers <license@hedgedoc.org>
Source: https://github.com/hedgedoc/react-client
Files: public/mock-public/*
Files: public/public/*
Copyright: 2021 The HedgeDoc developers (see AUTHORS file)
License: CC0-1.0
@ -15,7 +15,7 @@ Files: locales/*
Copyright: 2021 The HedgeDoc developers (see AUTHORS file)
License: CC-BY-SA-4.0
Files: public/mock-public/img/highres.jpg
Files: public/public/img/highres.jpg
Copyright: Vincent van Gogh
License: CC0-1.0

13
Dockerfile
View file

@ -4,14 +4,17 @@
# BUILD
FROM node:18-alpine AS builder
ARG BUILD_VERSION=CLIENT_VERSION_MISSING
ENV NODE_ENV=production
ENV NEXT_TELEMETRY_DISABLED=1
ARG BUILD_VERSION=CLIENT_VERSION_MISSING
WORKDIR /app
COPY . ./
RUN yarn install --immutable && \
RUN rm -rf public/public && \
rm -rf src/pages/api && \
yarn install --immutable && \
sed -i "s/CLIENT_VERSION_MISSING/${BUILD_VERSION}/" src/version.json && \
yarn build:for-real-backend
yarn build
# RUNNER
FROM node:18-alpine
@ -27,6 +30,6 @@ COPY --from=builder --chown=node:node /app/.next/standalone ./
USER node
ENV PORT 3000
EXPOSE 3000/tcp
ENV PORT 3001
EXPOSE 3001/tcp
CMD ["node", "server.js"]

2
README.md
View file

@ -72,6 +72,8 @@ This will build the app in production mode and save it into the `.next` folder.
best performance, minimized and the filenames include a hash value of the content. Don't edit them by hand!
You can run the production build using the built-in server with `yarn start`.
You MUST provide the environment variable `HD_EDITOR_BASE_URL` with protocol, domain and (if needed) path (e.g. `http://127.0.0.1:3001/`) so the app knows under which URL it is available in the browser.
You can also provide `HD_RENDERER_BASE_URL` if the renderer should use another domain than the editor. This is recommended for security reasons but not mandatory.
## UI Test

2
cypress/e2e/deleteNote.spec.ts
View file

@ -12,7 +12,7 @@ describe('Delete note', () => {
})
it('correctly deletes a note', () => {
cy.intercept('DELETE', `/api/mock-backend/private/notes/${testNoteId}`, {
cy.intercept('DELETE', `api/private/notes/${testNoteId}`, {
statusCode: 204
})
cy.getByCypressId('sidebar.deleteNote.button').click()

4
cypress/e2e/fileUpload.spec.ts
View file

@ -17,7 +17,7 @@ describe('File upload', () => {
cy.intercept(
{
method: 'POST',
url: '/api/mock-backend/private/media'
url: 'api/private/media'
},
{
statusCode: 201,
@ -74,7 +74,7 @@ describe('File upload', () => {
cy.intercept(
{
method: 'POST',
url: '/api/mock-backend/private/media'
url: 'api/private/media'
},
{
statusCode: 400

10
cypress/e2e/history.spec.ts
View file

@ -24,7 +24,7 @@ describe('History', () => {
describe('is as given when not empty', () => {
beforeEach(() => {
cy.clearLocalStorage('history')
cy.intercept('GET', '/api/mock-backend/private/me/history', {
cy.intercept('GET', 'api/private/me/history', {
body: [
{
identifier: 'cypress',
@ -51,7 +51,7 @@ describe('History', () => {
describe('is untitled when not empty', () => {
beforeEach(() => {
cy.clearLocalStorage('history')
cy.intercept('GET', '/api/mock-backend/private/me/history', {
cy.intercept('GET', 'api/private/me/history', {
body: [
{
identifier: 'cypress-no-title',
@ -84,7 +84,7 @@ describe('History', () => {
describe('working', () => {
beforeEach(() => {
cy.intercept('PUT', '/api/mock-backend/private/me/history/features', (req) => {
cy.intercept('PUT', 'api/private/me/history/features', (req) => {
req.reply(200, req.body)
})
})
@ -106,7 +106,7 @@ describe('History', () => {
describe('failing', () => {
beforeEach(() => {
cy.intercept('PUT', '/api/mock-backend/private/me/history/features', {
cy.intercept('PUT', 'api/private/me/history/features', {
statusCode: 401
})
})
@ -128,7 +128,7 @@ describe('History', () => {
describe('Import', () => {
beforeEach(() => {
cy.clearLocalStorage('history')
cy.intercept('GET', '/api/mock-backend/private/me/history', {
cy.intercept('GET', 'api/private/me/history', {
body: []
})
cy.visitHistory()

4
cypress/e2e/intro.spec.ts
View file

@ -7,7 +7,7 @@
/* eslint-disable @typescript-eslint/no-unsafe-call */
describe('Intro page', () => {
beforeEach(() => {
cy.intercept('/mock-public/intro.md', 'test content')
cy.intercept('public/intro.md', 'test content')
cy.visitHome()
})
@ -17,7 +17,7 @@ describe('Intro page', () => {
})
it("won't show anything if no content was found", () => {
cy.intercept('/mock-public/intro.md', {
cy.intercept('public/intro.md', {
statusCode: 404
})
cy.visitHome()

4
cypress/e2e/motd.spec.ts
View file

@ -11,13 +11,13 @@ const motdMockHtml = 'This is the <strong>mock</strong> Motd call'
describe('Motd', () => {
const mockExistingMotd = (useEtag?: boolean, content = motdMockContent) => {
cy.intercept('GET', '/mock-public/motd.md', {
cy.intercept('GET', 'public/motd.md', {
statusCode: 200,
headers: { [useEtag ? 'etag' : 'Last-Modified']: MOCK_LAST_MODIFIED },
body: content
})
cy.intercept('HEAD', '/mock-public/motd.md', {
cy.intercept('HEAD', 'public/motd.md', {
statusCode: 200,
headers: { [useEtag ? 'etag' : 'Last-Modified']: MOCK_LAST_MODIFIED }
})

6
cypress/e2e/profile.spec.ts
View file

@ -8,7 +8,7 @@ describe('profile page', () => {
beforeEach(() => {
cy.intercept(
{
url: '/api/mock-backend/private/tokens',
url: 'api/private/tokens',
method: 'GET'
},
{
@ -25,7 +25,7 @@ describe('profile page', () => {
)
cy.intercept(
{
url: '/api/mock-backend/private/tokens',
url: 'api/private/tokens',
method: 'POST'
},
{
@ -42,7 +42,7 @@ describe('profile page', () => {
)
cy.intercept(
{
url: '/api/mock-backend/private/tokens/cypress',
url: 'api/private/tokens/cypress',
method: 'DELETE'
},
{

16
cypress/support/config.ts
View file

@ -1,5 +1,5 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
@ -14,7 +14,7 @@ declare namespace Cypress {
export const branding = {
name: 'DEMO Corp',
logo: '/mock-public/img/demo.png'
logo: 'public/img/demo.png'
}
export const authProviders = [
@ -77,15 +77,11 @@ export const config = {
commit: 'MOCK'
},
plantumlServer: 'http://mock-plantuml.local',
maxDocumentLength: 200,
iframeCommunication: {
editorOrigin: 'http://127.0.0.1:3001/',
rendererOrigin: 'http://127.0.0.1:3001/'
}
maxDocumentLength: 200
}
Cypress.Commands.add('loadConfig', (additionalConfig?: Partial<typeof config>) => {
return cy.intercept('/api/mock-backend/private/config', {
return cy.intercept('api/private/config', {
statusCode: 200,
body: {
...config,
@ -97,11 +93,11 @@ Cypress.Commands.add('loadConfig', (additionalConfig?: Partial<typeof config>) =
beforeEach(() => {
cy.loadConfig()
cy.intercept('GET', '/mock-public/motd.md', {
cy.intercept('GET', 'public/motd.md', {
body: '404 Not Found!',
statusCode: 404
})
cy.intercept('HEAD', '/mock-public/motd.md', {
cy.intercept('HEAD', 'public/motd.md', {
statusCode: 404
})
})

4
cypress/support/visit-test-editor.ts
View file

@ -1,12 +1,12 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
export const testNoteId = 'test'
beforeEach(() => {
cy.intercept(`/api/mock-backend/private/notes/${testNoteId}`, {
cy.intercept(`api/private/notes/${testNoteId}`, {
content: '',
metadata: {
id: testNoteId,

3
netlify.toml
View file

@ -4,3 +4,6 @@ command = "echo Pseudo build command because the build is made by the CI"
[[plugins]]
package = "@netlify/plugin-nextjs"
[dev]
targetPort = 3001

2
netlify/intro.md
View file

@ -2,6 +2,6 @@
What you see is an UI-Test! It's filled with dummy data, not connected to a backend and no data will be saved.
:::
![HedgeDoc Screenshot](/mock-public/screenshot.png)
![HedgeDoc Screenshot](public/screenshot.png)
[![Deployed using netlify](https://www.netlify.com/img/global/badges/netlify-color-accent.svg)](https://www.netlify.com)

6
netlify/patch-files.sh
View file

@ -8,9 +8,11 @@
set -e
echo 'Patch intro.md to include netlify banner.'
cp netlify/intro.md public/mock-public/intro.md
cp netlify/intro.md public/public/intro.md
echo 'Patch motd.md to include privacy policy.'
cp netlify/motd.md public/mock-public/motd.md
cp netlify/motd.md public/public/motd.md
echo 'Patch version.json to include git hash'
jq ".version = \"0.0.0+${GITHUB_SHA:0:8}\"" src/version.json > src/_version.json
mv src/_version.json src/version.json
echo "Patch base URL"
echo HD_EDITOR_BASE_URL="https://${1}--hedgedoc-ui-test.netlify.app/" >> .env.production

51
next.config.js
View file

@ -3,47 +3,27 @@
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
const { isMockMode, isTestMode } = require('./src/utils/test-modes')
const path = require('path')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const withBundleAnalyzer = require('@next/bundle-analyzer')({
enabled: process.env.ANALYZE === 'true'
})
//TODO: [mrdrogdrog] The following function and two constants already exist in typescript code.
// However, this file must be a js file and therefore can't access the ts function.
// I have no idea how to resolve this redundancy without extracting it into a node module.
const isPositiveAnswer = (value) => {
const lowerValue = value.toLowerCase()
return lowerValue === 'yes' || lowerValue === '1' || lowerValue === 'true'
}
const isTestMode = !!process.env.NEXT_PUBLIC_TEST_MODE && isPositiveAnswer(process.env.NEXT_PUBLIC_TEST_MODE)
const isMockMode = !!process.env.NEXT_PUBLIC_USE_MOCK_API && isPositiveAnswer(process.env.NEXT_PUBLIC_USE_MOCK_API)
console.log('Node env is', process.env.NODE_ENV)
console.log('Node environment is', process.env.NODE_ENV)
if (isMockMode) {
console.log('Uses mock API')
} else if (!!process.env.NEXT_PUBLIC_BACKEND_BASE_URL) {
console.log('Backend base url is', process.env.NEXT_PUBLIC_BACKEND_BASE_URL)
} else {
console.error(`==============
Neither NEXT_PUBLIC_USE_MOCK_API or NEXT_PUBLIC_BACKEND_BASE_URL is set.
If you want to create a production build we suggest that you set a backend url with NEXT_PUBLIC_BACKEND_BASE_URL.
If you want to create a build that uses the mock api then use build:mock instead or set NEXT_PUBLIC_USE_MOCK_API to "true".
==============`)
process.exit(1)
}
if (!!process.env.NEXT_PUBLIC_IGNORE_IFRAME_ORIGIN_CONFIG) {
console.warn(
'You have set NEXT_PUBLIC_IGNORE_IFRAME_ORIGIN_CONFIG. This flag is ONLY for testing purposes and will decrease the security of the editor if used in production!'
)
console.log('Use mock API')
}
if (isTestMode) {
console.warn(`This build runs in test mode. This means:
- no sandboxed iframe
- Additional data-attributes for e2e tests added to DOM`)
- Additional data-attributes for e2e tests added to DOM
- Editor and renderer are running on the same origin`)
}
if (!!isMockMode) {
if (isMockMode) {
console.warn(`This build runs in mock mode. This means:
- No real data. All API responses are mocked
- No persistent data
@ -51,12 +31,6 @@ if (!!isMockMode) {
`)
}
const path = require('path')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const withBundleAnalyzer = require('@next/bundle-analyzer')({
enabled: process.env.ANALYZE === 'true'
})
/** @type {import('next').NextConfig} */
const rawNextConfig = {
webpack: (config) => {
@ -111,9 +85,8 @@ const rawNextConfig = {
}
])
},
output: 'standalone',
output: 'standalone'
}
const completeNextConfig = withBundleAnalyzer(rawNextConfig)
module.exports = completeNextConfig

16
package.json
View file

@ -3,28 +3,24 @@
"version": "0.0.1",
"license": "AGPL-3.0",
"scripts": {
"build": "next build",
"build:netlify": "cross-env NEXT_PUBLIC_IGNORE_IFRAME_ORIGIN_CONFIG=true yarn build:mock",
"build": "cross-env NODE_ENV=production next build",
"build:mock": "cross-env NEXT_PUBLIC_USE_MOCK_API=true next build",
"build:test": "cross-env NEXT_PUBLIC_USE_MOCK_API=true NEXT_PUBLIC_TEST_MODE=true next build",
"build:for-real-backend": "cross-env NEXT_PUBLIC_USE_MOCK_API=false NEXT_PUBLIC_BACKEND_BASE_URL=/ next build",
"build:test": "cross-env NODE_ENV=test NEXT_PUBLIC_TEST_MODE=true next build",
"analyze": "cross-env ANALYZE=true next build",
"dev": "cross-env PORT=3001 next dev",
"dev:test": "cross-env PORT=3001 NEXT_PUBLIC_TEST_MODE=true next dev",
"dev:test": "cross-env PORT=3001 NODE_ENV=test NEXT_PUBLIC_TEST_MODE=true next dev",
"dev:for-real-backend": "cross-env PORT=3001 NEXT_PUBLIC_USE_MOCK_API=false NEXT_PUBLIC_BACKEND_BASE_URL=http://localhost:8080/ next dev",
"format": "prettier -c \"src/**/*.{ts,tsx,js}\" \"cypress/**/*.{ts,tsx}\"",
"format:fix": "prettier -w \"src/**/*.{ts,tsx,js}\" \"cypress/**/*.{ts,tsx}\"",
"lint": "eslint --max-warnings=0 --ext .ts,.tsx src",
"lint:fix": "eslint --fix --ext .ts,.tsx src",
"start": "cross-env PORT=3001 next start",
"start:for-real-backend": "cross-env PORT=3001 NEXT_PUBLIC_USE_MOCK_API=false NEXT_PUBLIC_BACKEND_BASE_URL=/ next start",
"start:mock": "cross-env PORT=3001 NEXT_PUBLIC_USE_MOCK_API=true next start",
"start:ci": "cross-env NEXT_PUBLIC_USE_MOCK_API=true NEXT_PUBLIC_TEST_MODE=true PORT=3001 next start",
"start:ci": "cross-env NODE_ENV=test PORT=3001 next start",
"cy:open": "cypress open",
"cy:run:chrome": "cypress run --browser chrome",
"cy:run:firefox": "cypress run --browser firefox",
"test": "jest --watch",
"test:ci": "jest --ci"
"test": "cross-env NODE_ENV=test jest --watch",
"test:ci": "cross-env NODE_ENV=test jest --ci"
},
"browserslist": {
"production": [

0
public/mock-public/img/avatar.png → public/public/img/avatar.png
View file

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 18 KiB

0
public/mock-public/img/demo.png → public/public/img/demo.png
View file

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 18 KiB

0
public/mock-public/img/highres.jpg → public/public/img/highres.jpg
View file

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.9 MiB

After

Width:  |  Height:  |  Size: 3.9 MiB

2
public/mock-public/intro.md → public/public/intro.md
View file

@ -2,4 +2,4 @@
What you see is an UI-Test! It's filled with dummy data, not connected to a backend and no data will be saved.
:::
![HedgeDoc Screenshot](/mock-public/screenshot.png)
![HedgeDoc Screenshot](public/screenshot.png)

0
public/mock-public/motd.md → public/public/motd.md
View file

1
public/public/readme.md Normal file
View file

@ -0,0 +1 @@
This directory should only be used in mock mode.

0
public/mock-public/screenshot.png → public/public/screenshot.png
View file

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 250 KiB

After

Width:  |  Height:  |  Size: 250 KiB

3
src/api/common/api-request-builder/api-request-builder.ts
View file

@ -4,7 +4,6 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { apiUrl } from '../../../utils/api-url'
import deepmerge from 'deepmerge'
import { defaultConfig, defaultHeaders } from '../default-config'
import { ApiResponse } from '../api-response'
@ -28,7 +27,7 @@ export abstract class ApiRequestBuilder<ResponseType> {
* @param endpoint The target endpoint without a leading slash.
*/
constructor(endpoint: string) {
this.targetUrl = apiUrl + endpoint
this.targetUrl = `api/private/${endpoint}`
}
protected async sendRequestAndVerifyResponse(

26
src/api/common/api-request-builder/delete-api-request-builder.test.ts
View file

@ -19,14 +19,14 @@ describe('DeleteApiRequestBuilder', () => {
})
describe('sendRequest without body', () => {
it('without headers', async () => {
expectFetch('/api/mock-backend/private/test', 204, { method: 'DELETE' })
expectFetch('api/private/test', 204, { method: 'DELETE' })
await new DeleteApiRequestBuilder<string, undefined>('test').sendRequest()
})
it('with single header', async () => {
const expectedHeaders = new Headers()
expectedHeaders.append('test', 'true')
expectFetch('/api/mock-backend/private/test', 204, {
expectFetch('api/private/test', 204, {
method: 'DELETE',
headers: expectedHeaders
})
@ -36,7 +36,7 @@ describe('DeleteApiRequestBuilder', () => {
it('with overriding single header', async () => {
const expectedHeaders = new Headers()
expectedHeaders.append('test', 'false')
expectFetch('/api/mock-backend/private/test', 204, {
expectFetch('api/private/test', 204, {
method: 'DELETE',
headers: expectedHeaders
})
@ -50,7 +50,7 @@ describe('DeleteApiRequestBuilder', () => {
const expectedHeaders = new Headers()
expectedHeaders.append('test', 'true')
expectedHeaders.append('test2', 'false')
expectFetch('/api/mock-backend/private/test', 204, {
expectFetch('api/private/test', 204, {
method: 'DELETE',
headers: expectedHeaders
})
@ -65,7 +65,7 @@ describe('DeleteApiRequestBuilder', () => {
const expectedHeaders = new Headers()
expectedHeaders.append('Content-Type', 'application/json')
expectFetch('/api/mock-backend/private/test', 204, {
expectFetch('api/private/test', 204, {
method: 'DELETE',
headers: expectedHeaders,
body: '{"test":true,"foo":"bar"}'
@ -79,7 +79,7 @@ describe('DeleteApiRequestBuilder', () => {
})
it('sendRequest with other body', async () => {
expectFetch('/api/mock-backend/private/test', 204, {
expectFetch('api/private/test', 204, {
method: 'DELETE',
body: 'HedgeDoc'
})
@ -87,13 +87,13 @@ describe('DeleteApiRequestBuilder', () => {
})
it('sendRequest with expected status code', async () => {
expectFetch('/api/mock-backend/private/test', 200, { method: 'DELETE' })
expectFetch('api/private/test', 200, { method: 'DELETE' })
await new DeleteApiRequestBuilder<string, undefined>('test').withExpectedStatusCode(200).sendRequest()
})
describe('sendRequest with custom options', () => {
it('with one option', async () => {
expectFetch('/api/mock-backend/private/test', 204, {
expectFetch('api/private/test', 204, {
method: 'DELETE',
cache: 'force-cache'
})
@ -105,7 +105,7 @@ describe('DeleteApiRequestBuilder', () => {
})
it('overriding single option', async () => {
expectFetch('/api/mock-backend/private/test', 204, {
expectFetch('api/private/test', 204, {
method: 'DELETE',
cache: 'no-store'
})
@ -120,7 +120,7 @@ describe('DeleteApiRequestBuilder', () => {
})
it('with multiple options', async () => {
expectFetch('/api/mock-backend/private/test', 204, {
expectFetch('api/private/test', 204, {
method: 'DELETE',
cache: 'force-cache',
integrity: 'test'
@ -136,7 +136,7 @@ describe('DeleteApiRequestBuilder', () => {
describe('sendRequest with custom error map', () => {
it('for valid status code', async () => {
expectFetch('/api/mock-backend/private/test', 204, { method: 'DELETE' })
expectFetch('api/private/test', 204, { method: 'DELETE' })
await new DeleteApiRequestBuilder<string, undefined>('test')
.withStatusCodeErrorMapping({
400: 'noooooo',
@ -146,7 +146,7 @@ describe('DeleteApiRequestBuilder', () => {
})
it('for invalid status code 1', async () => {
expectFetch('/api/mock-backend/private/test', 400, { method: 'DELETE' })
expectFetch('api/private/test', 400, { method: 'DELETE' })
const request = new DeleteApiRequestBuilder<string, undefined>('test')
.withStatusCodeErrorMapping({
400: 'noooooo',
@ -157,7 +157,7 @@ describe('DeleteApiRequestBuilder', () => {
})
it('for invalid status code 2', async () => {
expectFetch('/api/mock-backend/private/test', 401, { method: 'DELETE' })
expectFetch('api/private/test', 401, { method: 'DELETE' })
const request = new DeleteApiRequestBuilder<string, undefined>('test')
.withStatusCodeErrorMapping({
400: 'noooooo',

22
src/api/common/api-request-builder/get-api-request-builder.test.ts
View file

@ -20,14 +20,14 @@ describe('GetApiRequestBuilder', () => {
describe('sendRequest', () => {
it('without headers', async () => {
expectFetch('/api/mock-backend/private/test', 200, { method: 'GET' })
expectFetch('api/private/test', 200, { method: 'GET' })
await new GetApiRequestBuilder<string>('test').sendRequest()
})
it('with single header', async () => {
const expectedHeaders = new Headers()
expectedHeaders.append('test', 'true')
expectFetch('/api/mock-backend/private/test', 200, {
expectFetch('api/private/test', 200, {
method: 'GET',
headers: expectedHeaders
})
@ -37,7 +37,7 @@ describe('GetApiRequestBuilder', () => {
it('with overriding single header', async () => {
const expectedHeaders = new Headers()
expectedHeaders.append('test', 'false')
expectFetch('/api/mock-backend/private/test', 200, {
expectFetch('api/private/test', 200, {
method: 'GET',
headers: expectedHeaders
})
@ -51,7 +51,7 @@ describe('GetApiRequestBuilder', () => {
const expectedHeaders = new Headers()
expectedHeaders.append('test', 'true')
expectedHeaders.append('test2', 'false')
expectFetch('/api/mock-backend/private/test', 200, {
expectFetch('api/private/test', 200, {
method: 'GET',
headers: expectedHeaders
})
@ -63,13 +63,13 @@ describe('GetApiRequestBuilder', () => {
})
it('sendRequest with expected status code', async () => {
expectFetch('/api/mock-backend/private/test', 200, { method: 'GET' })
expectFetch('api/private/test', 200, { method: 'GET' })
await new GetApiRequestBuilder<string>('test').withExpectedStatusCode(200).sendRequest()
})
describe('sendRequest with custom options', () => {
it('with one option', async () => {
expectFetch('/api/mock-backend/private/test', 200, {
expectFetch('api/private/test', 200, {
method: 'GET',
cache: 'force-cache'
})
@ -81,7 +81,7 @@ describe('GetApiRequestBuilder', () => {
})
it('overriding single option', async () => {
expectFetch('/api/mock-backend/private/test', 200, {
expectFetch('api/private/test', 200, {
method: 'GET',
cache: 'no-store'
})
@ -96,7 +96,7 @@ describe('GetApiRequestBuilder', () => {
})
it('with multiple options', async () => {
expectFetch('/api/mock-backend/private/test', 200, {
expectFetch('api/private/test', 200, {
method: 'GET',
cache: 'force-cache',
integrity: 'test'
@ -112,7 +112,7 @@ describe('GetApiRequestBuilder', () => {
describe('sendRequest with custom error map', () => {
it('for valid status code', async () => {
expectFetch('/api/mock-backend/private/test', 200, { method: 'GET' })
expectFetch('api/private/test', 200, { method: 'GET' })
await new GetApiRequestBuilder<string>('test')
.withStatusCodeErrorMapping({
400: 'noooooo',
@ -122,7 +122,7 @@ describe('GetApiRequestBuilder', () => {
})
it('for invalid status code 1', async () => {
expectFetch('/api/mock-backend/private/test', 400, { method: 'GET' })
expectFetch('api/private/test', 400, { method: 'GET' })
const request = new GetApiRequestBuilder<string>('test')
.withStatusCodeErrorMapping({
400: 'noooooo',
@ -133,7 +133,7 @@ describe('GetApiRequestBuilder', () => {
})
it('for invalid status code 2', async () => {
expectFetch('/api/mock-backend/private/test', 401, { method: 'GET' })
expectFetch('api/private/test', 401, { method: 'GET' })
const request = new GetApiRequestBuilder<string>('test')
.withStatusCodeErrorMapping({
400: 'noooooo',

26
src/api/common/api-request-builder/post-api-request-builder.test.ts
View file

@ -20,14 +20,14 @@ describe('PostApiRequestBuilder', () => {
describe('sendRequest without body', () => {
it('without headers', async () => {
expectFetch('/api/mock-backend/private/test', 201, { method: 'POST' })
expectFetch('api/private/test', 201, { method: 'POST' })
await new PostApiRequestBuilder<string, undefined>('test').sendRequest()
})
it('with single header', async () => {
const expectedHeaders = new Headers()
expectedHeaders.append('test', 'true')
expectFetch('/api/mock-backend/private/test', 201, {
expectFetch('api/private/test', 201, {
method: 'POST',
headers: expectedHeaders
})
@ -37,7 +37,7 @@ describe('PostApiRequestBuilder', () => {
it('with overriding single header', async () => {
const expectedHeaders = new Headers()
expectedHeaders.append('test', 'false')
expectFetch('/api/mock-backend/private/test', 201, {
expectFetch('api/private/test', 201, {
method: 'POST',
headers: expectedHeaders
})
@ -51,7 +51,7 @@ describe('PostApiRequestBuilder', () => {
const expectedHeaders = new Headers()
expectedHeaders.append('test', 'true')
expectedHeaders.append('test2', 'false')
expectFetch('/api/mock-backend/private/test', 201, {
expectFetch('api/private/test', 201, {
method: 'POST',
headers: expectedHeaders
})
@ -66,7 +66,7 @@ describe('PostApiRequestBuilder', () => {
const expectedHeaders = new Headers()
expectedHeaders.append('Content-Type', 'application/json')
expectFetch('/api/mock-backend/private/test', 201, {
expectFetch('api/private/test', 201, {
method: 'POST',
headers: expectedHeaders,
body: '{"test":true,"foo":"bar"}'
@ -80,7 +80,7 @@ describe('PostApiRequestBuilder', () => {
})
it('sendRequest with other body', async () => {
expectFetch('/api/mock-backend/private/test', 201, {
expectFetch('api/private/test', 201, {
method: 'POST',
body: 'HedgeDoc'
})
@ -88,13 +88,13 @@ describe('PostApiRequestBuilder', () => {
})
it('sendRequest with expected status code', async () => {
expectFetch('/api/mock-backend/private/test', 200, { method: 'POST' })
expectFetch('api/private/test', 200, { method: 'POST' })
await new PostApiRequestBuilder<string, undefined>('test').withExpectedStatusCode(200).sendRequest()
})
describe('sendRequest with custom options', () => {
it('with one option', async () => {
expectFetch('/api/mock-backend/private/test', 201, {
expectFetch('api/private/test', 201, {
method: 'POST',
cache: 'force-cache'
})
@ -106,7 +106,7 @@ describe('PostApiRequestBuilder', () => {
})
it('overriding single option', async () => {
expectFetch('/api/mock-backend/private/test', 201, {
expectFetch('api/private/test', 201, {
method: 'POST',
cache: 'no-store'
})
@ -121,7 +121,7 @@ describe('PostApiRequestBuilder', () => {
})
it('with multiple options', async () => {
expectFetch('/api/mock-backend/private/test', 201, {
expectFetch('api/private/test', 201, {
method: 'POST',
cache: 'force-cache',
integrity: 'test'
@ -137,7 +137,7 @@ describe('PostApiRequestBuilder', () => {
describe('sendRequest with custom error map', () => {
it('for valid status code', async () => {
expectFetch('/api/mock-backend/private/test', 201, { method: 'POST' })
expectFetch('api/private/test', 201, { method: 'POST' })
await new PostApiRequestBuilder<string, undefined>('test')
.withStatusCodeErrorMapping({
400: 'noooooo',
@ -147,7 +147,7 @@ describe('PostApiRequestBuilder', () => {
})
it('for invalid status code 1', async () => {
expectFetch('/api/mock-backend/private/test', 400, { method: 'POST' })
expectFetch('api/private/test', 400, { method: 'POST' })
const request = new PostApiRequestBuilder<string, undefined>('test')
.withStatusCodeErrorMapping({
400: 'noooooo',
@ -158,7 +158,7 @@ describe('PostApiRequestBuilder', () => {
})
it('for invalid status code 2', async () => {
expectFetch('/api/mock-backend/private/test', 401, { method: 'POST' })
expectFetch('api/private/test', 401, { method: 'POST' })
const request = new PostApiRequestBuilder<string, undefined>('test')
.withStatusCodeErrorMapping({
400: 'noooooo',

26
src/api/common/api-request-builder/put-api-request-builder.test.ts
View file

@ -20,14 +20,14 @@ describe('PutApiRequestBuilder', () => {
describe('sendRequest without body', () => {
it('without headers', async () => {
expectFetch('/api/mock-backend/private/test', 200, { method: 'PUT' })
expectFetch('api/private/test', 200, { method: 'PUT' })
await new PutApiRequestBuilder<string, undefined>('test').sendRequest()
})
it('with single header', async () => {
const expectedHeaders = new Headers()
expectedHeaders.append('test', 'true')
expectFetch('/api/mock-backend/private/test', 200, {
expectFetch('api/private/test', 200, {
method: 'PUT',
headers: expectedHeaders
})
@ -37,7 +37,7 @@ describe('PutApiRequestBuilder', () => {
it('with overriding single header', async () => {
const expectedHeaders = new Headers()
expectedHeaders.append('test', 'false')
expectFetch('/api/mock-backend/private/test', 200, {
expectFetch('api/private/test', 200, {
method: 'PUT',
headers: expectedHeaders
})
@ -51,7 +51,7 @@ describe('PutApiRequestBuilder', () => {
const expectedHeaders = new Headers()
expectedHeaders.append('test', 'true')
expectedHeaders.append('test2', 'false')
expectFetch('/api/mock-backend/private/test', 200, {
expectFetch('api/private/test', 200, {
method: 'PUT',
headers: expectedHeaders
})
@ -66,7 +66,7 @@ describe('PutApiRequestBuilder', () => {
const expectedHeaders = new Headers()
expectedHeaders.append('Content-Type', 'application/json')
expectFetch('/api/mock-backend/private/test', 200, {
expectFetch('api/private/test', 200, {
method: 'PUT',
headers: expectedHeaders,
body: '{"test":true,"foo":"bar"}'
@ -80,7 +80,7 @@ describe('PutApiRequestBuilder', () => {
})
it('sendRequest with other body', async () => {
expectFetch('/api/mock-backend/private/test', 200, {
expectFetch('api/private/test', 200, {
method: 'PUT',
body: 'HedgeDoc'
})
@ -88,13 +88,13 @@ describe('PutApiRequestBuilder', () => {
})
it('sendRequest with expected status code', async () => {
expectFetch('/api/mock-backend/private/test', 200, { method: 'PUT' })
expectFetch('api/private/test', 200, { method: 'PUT' })
await new PutApiRequestBuilder<string, undefined>('test').withExpectedStatusCode(200).sendRequest()
})
describe('sendRequest with custom options', () => {
it('with one option', async () => {
expectFetch('/api/mock-backend/private/test', 200, {
expectFetch('api/private/test', 200, {
method: 'PUT',
cache: 'force-cache'
})
@ -106,7 +106,7 @@ describe('PutApiRequestBuilder', () => {
})
it('overriding single option', async () => {
expectFetch('/api/mock-backend/private/test', 200, {
expectFetch('api/private/test', 200, {
method: 'PUT',
cache: 'no-store'
})
@ -121,7 +121,7 @@ describe('PutApiRequestBuilder', () => {
})
it('with multiple options', async () => {
expectFetch('/api/mock-backend/private/test', 200, {
expectFetch('api/private/test', 200, {
method: 'PUT',
cache: 'force-cache',
integrity: 'test'
@ -137,7 +137,7 @@ describe('PutApiRequestBuilder', () => {
describe('sendRequest with custom error map', () => {
it('for valid status code', async () => {
expectFetch('/api/mock-backend/private/test', 200, { method: 'PUT' })
expectFetch('api/private/test', 200, { method: 'PUT' })
await new PutApiRequestBuilder<string, undefined>('test')
.withStatusCodeErrorMapping({
400: 'noooooo',
@ -147,7 +147,7 @@ describe('PutApiRequestBuilder', () => {
})
it('for invalid status code 1', async () => {
expectFetch('/api/mock-backend/private/test', 400, { method: 'PUT' })
expectFetch('api/private/test', 400, { method: 'PUT' })
const request = new PutApiRequestBuilder<string, undefined>('test')
.withStatusCodeErrorMapping({
400: 'noooooo',
@ -158,7 +158,7 @@ describe('PutApiRequestBuilder', () => {
})
it('for invalid status code 2', async () => {
expectFetch('/api/mock-backend/private/test', 401, { method: 'PUT' })
expectFetch('api/private/test', 401, { method: 'PUT' })
const request = new PutApiRequestBuilder<string, undefined>('test')
.withStatusCodeErrorMapping({
400: 'noooooo',

8
src/api/config/types.ts
View file

@ -1,5 +1,5 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
@ -14,7 +14,6 @@ export interface Config {
version: BackendVersion
plantumlServer?: string
maxDocumentLength: number
iframeCommunication: iframeCommunicationConfig
}
export enum AuthProviderType {
@ -67,11 +66,6 @@ export interface AuthProviderWithoutCustomName {
export type AuthProvider = AuthProviderWithCustomName | AuthProviderWithoutCustomName
export interface iframeCommunicationConfig {
editorOrigin: string
rendererOrigin: string
}
export interface BrandingConfig {
name?: string
logo?: string

3
src/components/application-loader/initializers/fetch-motd.ts
View file

@ -6,7 +6,6 @@
import { setMotd } from '../../../redux/motd/methods'
import { Logger } from '../../../utils/logger'
import { customizeAssetsUrl } from '../../../utils/customize-assets-url'
import { defaultConfig } from '../../../api/common/default-config'
export const MOTD_LOCAL_STORAGE_KEY = 'motd.lastModified'
@ -21,7 +20,7 @@ const log = new Logger('Motd')
*/
export const fetchMotd = async (): Promise<void> => {
const cachedLastModified = window.localStorage.getItem(MOTD_LOCAL_STORAGE_KEY)
const motdUrl = `${customizeAssetsUrl}motd.md`
const motdUrl = `public/motd.md`
if (cachedLastModified) {
const response = await fetch(motdUrl, {

38
src/components/common/base-url/base-url-context-provider.tsx Normal file
View file

@ -0,0 +1,38 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import React, { createContext, useState } from 'react'
import type { PropsWithChildren } from 'react'
export interface BaseUrls {
renderer: string
editor: string
}
interface BaseUrlContextProviderProps {
baseUrls?: BaseUrls
}
export const baseUrlContext = createContext<BaseUrls | undefined>(undefined)
/**
* Provides the given base urls as context content and renders an error message if no base urls have been found.
*
* @param baseUrls The base urls that should be set in the context
* @param children The child components that should receive the context value
*/
export const BaseUrlContextProvider: React.FC<PropsWithChildren<BaseUrlContextProviderProps>> = ({
baseUrls,
children
}) => {
const [baseUrlState] = useState<undefined | BaseUrls>(() => baseUrls)
return baseUrlState === undefined ? (
<div className={'text-white'}>HedgeDoc is not configured correctly! Please check the server log.</div>
) : (
<baseUrlContext.Provider value={baseUrlState}>{children}</baseUrlContext.Provider>
)
}

3
src/components/common/user-avatar/user-avatar-for-username.tsx
View file

@ -6,7 +6,6 @@
import React from 'react'
import { useAsync } from 'react-use'
import { getUser } from '../../../api/users'
import { customizeAssetsUrl } from '../../../utils/customize-assets-url'
import type { UserAvatarProps } from './user-avatar'
import { UserAvatar } from './user-avatar'
import type { UserInfo } from '../../../api/users/types'
@ -34,7 +33,7 @@ export const UserAvatarForUsername: React.FC<UserAvatarForUsernameProps> = ({ us
}
return {
displayName: t('common.guestUser'),
photo: `${customizeAssetsUrl}img/avatar.png`,
photo: `public/img/avatar.png`,
username: ''
}
}, [username, t])

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

@ -13,7 +13,7 @@ import { CommonModal } from '../../../common/modals/common-modal'
import { ShowIf } from '../../../common/show-if/show-if'
import { useApplicationState } from '../../../../hooks/common/use-application-state'
import { NoteType } from '../../../../redux/note-details/types/note-details'
import { useFrontendBaseUrl } from '../../../../hooks/common/use-frontend-base-url'
import { useBaseUrl } from '../../../../hooks/common/use-base-url'
/**
* Renders a modal which provides shareable URLs of this note.
@ -25,7 +25,7 @@ export const ShareModal: React.FC<ModalVisibilityProps> = ({ show, onHide }) =>
useTranslation()
const noteFrontmatter = useApplicationState((state) => state.noteDetails.frontmatter)
const editorMode = useApplicationState((state) => state.editorConfig.editorMode)
const baseUrl = useFrontendBaseUrl()
const baseUrl = useBaseUrl()
const noteIdentifier = useApplicationState((state) => state.noteDetails.primaryAddress)
return (

15
src/components/editor-page/editor-pane/hooks/yjs/use-websocket-url.ts
View file

@ -5,9 +5,9 @@
*/
import { useMemo } from 'react'
import { backendUrl } from '../../../../../utils/backend-url'
import { isMockMode } from '../../../../../utils/test-modes'
import { useApplicationState } from '../../../../../hooks/common/use-application-state'
import { useBaseUrl } from '../../../../../hooks/common/use-base-url'
const LOCAL_FALLBACK_URL = 'ws://localhost:8080/realtime/'
@ -16,13 +16,14 @@ const LOCAL_FALLBACK_URL = 'ws://localhost:8080/realtime/'
*/
export const useWebsocketUrl = (): URL => {
const noteId = useApplicationState((state) => state.noteDetails.id)
const baseUrl = useBaseUrl()
const baseUrl = useMemo(() => {
const websocketUrl = useMemo(() => {
if (isMockMode) {
return process.env.NEXT_PUBLIC_REALTIME_URL ?? LOCAL_FALLBACK_URL
return LOCAL_FALLBACK_URL
}
try {
const backendBaseUrlParsed = new URL(backendUrl, window.location.toString())
const backendBaseUrlParsed = new URL(baseUrl, window.location.toString())
backendBaseUrlParsed.protocol = backendBaseUrlParsed.protocol === 'https:' ? 'wss:' : 'ws:'
backendBaseUrlParsed.pathname += 'realtime'
return backendBaseUrlParsed.toString()
@ -30,11 +31,11 @@ export const useWebsocketUrl = (): URL => {
console.error(e)
return LOCAL_FALLBACK_URL
}
}, [])
}, [baseUrl])
return useMemo(() => {
const url = new URL(baseUrl)
const url = new URL(websocketUrl)
url.search = `?noteId=${noteId}`
return url
}, [baseUrl, noteId])
}, [noteId, websocketUrl])
}

2
src/components/editor-page/editor-pane/tool-bar/emoji-picker/emoji-picker.tsx
View file

@ -21,7 +21,7 @@ const customEmojis: CustomEmoji[] = ForkAwesomeIcons.map((name) => ({
category: 'ForkAwesome'
}))
const EMOJI_DATA_PATH = '/_next/static/js/emoji-data.json'
const EMOJI_DATA_PATH = '_next/static/js/emoji-data.json'
const emojiPickerConfig = {
customEmoji: customEmojis,

9
src/components/editor-page/render-context/renderer-to-editor-communicator-context-provider.tsx
View file

@ -1,5 +1,5 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
@ -8,7 +8,7 @@ import type { PropsWithChildren } from 'react'
import React, { createContext, useContext, useEffect, useMemo } from 'react'
import { RendererToEditorCommunicator } from '../../render-page/window-post-message-communicator/renderer-to-editor-communicator'
import { CommunicationMessageType } from '../../render-page/window-post-message-communicator/rendering-message'
import { ORIGIN_TYPE, useOriginFromConfig } from './use-origin-from-config'
import { ORIGIN, useBaseUrl } from '../../../hooks/common/use-base-url'
const RendererToEditorCommunicatorContext = createContext<RendererToEditorCommunicator | undefined>(undefined)
@ -27,12 +27,13 @@ export const useRendererToEditorCommunicator: () => RendererToEditorCommunicator
}
export const RendererToEditorCommunicatorContextProvider: React.FC<PropsWithChildren<unknown>> = ({ children }) => {
const editorOrigin = useOriginFromConfig(ORIGIN_TYPE.EDITOR)
const editorOrigin = useBaseUrl(ORIGIN.EDITOR)
const communicator = useMemo<RendererToEditorCommunicator>(() => new RendererToEditorCommunicator(), [])
useEffect(() => {
const currentCommunicator = communicator
currentCommunicator.setMessageTarget(window.parent, editorOrigin)
currentCommunicator.setMessageTarget(window.parent, new URL(editorOrigin).origin)
currentCommunicator.registerEventListener()
currentCommunicator.enableCommunication()
currentCommunicator.sendMessageToOtherSide({

30
src/components/editor-page/render-context/use-origin-from-config.ts
View file

@ -1,30 +0,0 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { useApplicationState } from '../../../hooks/common/use-application-state'
import { useMemo } from 'react'
export enum ORIGIN_TYPE {
EDITOR,
RENDERER
}
/**
* Returns the url origin of the editor or the renderer.
*/
export const useOriginFromConfig = (originType: ORIGIN_TYPE): string => {
const originFromConfig = useApplicationState((state) =>
originType === ORIGIN_TYPE.EDITOR
? state.config.iframeCommunication.editorOrigin
: state.config.iframeCommunication.rendererOrigin
)
return useMemo(() => {
return process.env.NEXT_PUBLIC_IGNORE_IFRAME_ORIGIN_CONFIG !== undefined
? window.location.origin + '/'
: originFromConfig ?? ''
}, [originFromConfig])
}

10
src/components/editor-page/renderer-pane/hooks/use-force-render-page-url-on-iframe-load-callback.ts
View file

@ -7,6 +7,7 @@
import type { RefObject } from 'react'
import { useCallback, useEffect, useMemo, useRef } from 'react'
import { Logger } from '../../../../utils/logger'
import { ORIGIN, useBaseUrl } from '../../../../hooks/common/use-base-url'
const log = new Logger('IframeLoader')
@ -14,15 +15,18 @@ const log = new Logger('IframeLoader')
* Generates a callback for an iframe load handler, that enforces a given URL if frame navigates away.
*
* @param iFrameReference A reference to the iframe react dom element.
* @param rendererOrigin The base url that should be enforced.
* @param onNavigateAway An optional callback that is executed when the iframe leaves the enforced URL.
*/
export const useForceRenderPageUrlOnIframeLoadCallback = (
iFrameReference: RefObject<HTMLIFrameElement>,
rendererOrigin: string,
onNavigateAway?: () => void
): (() => void) => {
const forcedUrl = useMemo(() => `${rendererOrigin}render`, [rendererOrigin])
const rendererBaseUrl = useBaseUrl(ORIGIN.RENDERER)
const forcedUrl = useMemo(() => {
const renderUrl = new URL(rendererBaseUrl)
renderUrl.pathname += 'render'
return renderUrl.toString()
}, [rendererBaseUrl])
const redirectionInProgress = useRef<boolean>(false)
const loadCallback = useCallback(() => {

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

@ -26,8 +26,8 @@ import { useSendScrollState } from './hooks/use-send-scroll-state'
import { Logger } from '../../../utils/logger'
import { useEffectOnRenderTypeChange } from './hooks/use-effect-on-render-type-change'
import { cypressAttribute, cypressId } from '../../../utils/cypress-attribute'
import { ORIGIN_TYPE, useOriginFromConfig } from '../render-context/use-origin-from-config'
import { getGlobalState } from '../../../redux'
import { ORIGIN, useBaseUrl } from '../../../hooks/common/use-base-url'
export interface RenderIframeProps extends RendererProps {
rendererType: RendererType
@ -64,14 +64,14 @@ export const RenderIframe: React.FC<RenderIframeProps> = ({
forcedDarkMode
}) => {
const frameReference = useRef<HTMLIFrameElement>(null)
const rendererOrigin = useOriginFromConfig(ORIGIN_TYPE.RENDERER)
const rendererBaseUrl = useBaseUrl(ORIGIN.RENDERER)
const iframeCommunicator = useEditorToRendererCommunicator()
const resetRendererReady = useCallback(() => {
log.debug('Reset render status')
setRendererStatus(false)
}, [])
const rendererReady = useIsRendererReady()
const onIframeLoad = useForceRenderPageUrlOnIframeLoadCallback(frameReference, rendererOrigin, resetRendererReady)
const onIframeLoad = useForceRenderPageUrlOnIframeLoadCallback(frameReference, resetRendererReady)
const [frameHeight, setFrameHeight] = useState<number>(0)
useEffect(() => () => setRendererStatus(false), [iframeCommunicator])
@ -124,8 +124,9 @@ export const RenderIframe: React.FC<RenderIframeProps> = ({
log.error('Load triggered without content window')
return
}
log.debug(`Set iframecommunicator window with origin ${rendererOrigin ?? 'undefined'}`)
iframeCommunicator.setMessageTarget(otherWindow, rendererOrigin)
const origin = new URL(rendererBaseUrl).origin
log.debug(`Set iframecommunicator window with origin ${origin ?? 'undefined'}`)
iframeCommunicator.setMessageTarget(otherWindow, origin)
iframeCommunicator.enableCommunication()
iframeCommunicator.sendMessageToOtherSide({
type: CommunicationMessageType.SET_BASE_CONFIGURATION,
@ -135,7 +136,7 @@ export const RenderIframe: React.FC<RenderIframeProps> = ({
}
})
setRendererStatus(true)
}, [iframeCommunicator, rendererOrigin, rendererType])
}, [iframeCommunicator, rendererBaseUrl, rendererType])
)
useEffectOnRenderTypeChange(rendererType, onIframeLoad)

3
src/components/intro-page/requests.ts
View file

@ -4,7 +4,6 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { customizeAssetsUrl } from '../../utils/customize-assets-url'
import { defaultConfig } from '../../api/common/default-config'
/**
@ -14,7 +13,7 @@ import { defaultConfig } from '../../api/common/default-config'
* @throws {Error} if the content can't be fetched
*/
export const fetchFrontPageContent = async (): Promise<string> => {
const response = await fetch(customizeAssetsUrl + 'intro.md', {
const response = await fetch('public/intro.md', {
...defaultConfig,
method: 'GET'
})

10
src/components/landing-layout/footer/version-info/version-info-link.tsx
View file

@ -9,6 +9,7 @@ import { Trans } from 'react-i18next'
import { VersionInfoModal } from './version-info-modal'
import { cypressId } from '../../../../utils/cypress-attribute'
import { useBooleanState } from '../../../../hooks/common/use-boolean-state'
import { Button } from 'react-bootstrap'
/**
* Renders a link for the version info and the {@link VersionInfoModal}.
@ -18,9 +19,14 @@ export const VersionInfoLink: React.FC = () => {
return (
<Fragment>
<a {...cypressId('show-version-modal')} href={'#'} className={'text-light'} onClick={showModal}>
<Button
size={'sm'}
variant={'link'}
{...cypressId('show-version-modal')}
className={'text-light p-0'}
onClick={showModal}>
<Trans i18nKey={'landing.versionInfo.versionInfo'} />
</a>
</Button>
<VersionInfoModal onHide={closeModal} show={modalVisibility} />
</Fragment>
)

2
src/components/landing-layout/navigation/sign-in-button.tsx
View file

@ -34,7 +34,7 @@ export const SignInButton: React.FC<SignInButtonProps> = ({ variant, ...props })
const metadata = getOneClickProviderMetadata(oneClickProviders[0])
return metadata.url
}
return '/login'
return 'login'
}, [authProviders])
return (

6
src/components/layout/base-head.tsx
View file

@ -1,5 +1,5 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
@ -8,17 +8,19 @@ import React from 'react'
import Head from 'next/head'
import { useAppTitle } from '../../hooks/common/use-app-title'
import { FavIcon } from './fav-icon'
import { useBaseUrl } from '../../hooks/common/use-base-url'
/**
* Sets basic browser meta tags.
*/
export const BaseHead: React.FC = () => {
const appTitle = useAppTitle()
const baseUrl = useBaseUrl()
return (
<Head>
<title>{appTitle}</title>
<FavIcon />
<base href={baseUrl} />
<meta content='width=device-width, initial-scale=1' name='viewport' />
</Head>
)

14
src/components/layout/fav-icon.tsx
View file

@ -12,17 +12,17 @@ import React, { Fragment } from 'react'
export const FavIcon: React.FC = () => {
return (
<Fragment>
<link href='/icons/apple-touch-icon.png' rel='apple-touch-icon' sizes='180x180' />
<link href='/icons/favicon-32x32.png' rel='icon' sizes='32x32' type='image/png' />
<link href='/icons/favicon-16x16.png' rel='icon' sizes='16x16' type='image/png' />
<link href='/icons/site.webmanifest' rel='manifest' />
<link href='/icons/favicon.ico' rel='shortcut icon' />
<link color='#b51f08' href='/icons/safari-pinned-tab.svg' rel='mask-icon' />
<link href='icons/apple-touch-icon.png' rel='apple-touch-icon' sizes='180x180' />
<link href='icons/favicon-32x32.png' rel='icon' sizes='32x32' type='image/png' />
<link href='icons/favicon-16x16.png' rel='icon' sizes='16x16' type='image/png' />
<link href='icons/site.webmanifest' rel='manifest' />
<link href='icons/favicon.ico' rel='shortcut icon' />
<link color='#b51f08' href='icons/safari-pinned-tab.svg' rel='mask-icon' />
<meta name='apple-mobile-web-app-title' content='HedgeDoc' />
<meta name='application-name' content='HedgeDoc' />
<meta name='msapplication-TileColor' content='#b51f08' />
<meta name='theme-color' content='#b51f08' />
<meta content='/icons/browserconfig.xml' name='msapplication-config' />
<meta content='icons/browserconfig.xml' name='msapplication-config' />
<meta content='HedgeDoc - Collaborative markdown notes' name='description' />
</Fragment>
)

3
src/components/login-page/auth/utils/get-one-click-provider-metadata.ts
View file

@ -7,7 +7,6 @@ import type { AuthProvider } from '../../../../api/config/types'
import { AuthProviderType } from '../../../../api/config/types'
import type { IconName } from '../../../common/fork-awesome/types'
import styles from '../via-one-click.module.scss'
import { backendUrl } from '../../../../utils/backend-url'
import { Logger } from '../../../../utils/logger'
export interface OneClickMetadata {
@ -18,7 +17,7 @@ export interface OneClickMetadata {
}
const getBackendAuthUrl = (providerIdentifer: string): string => {
return `${backendUrl}auth/${providerIdentifer}`
return `auth/${providerIdentifer}`
}
const logger = new Logger('GetOneClickProviderMetadata')

3
src/components/profile-page/account-management/profile-account-management.tsx
View file

@ -9,7 +9,6 @@ import { Button, Card } from 'react-bootstrap'
import { Trans, useTranslation } from 'react-i18next'
import { ForkAwesomeIcon } from '../../common/fork-awesome/fork-awesome-icon'
import { AccountDeletionModal } from './account-deletion-modal'
import { apiUrl } from '../../../utils/api-url'
import { useBooleanState } from '../../../hooks/common/use-boolean-state'
/**
@ -26,7 +25,7 @@ export const ProfileAccountManagement: React.FC = () => {
<Card.Title>
<Trans i18nKey='profile.accountManagement' />
</Card.Title>
<Button variant='secondary' block href={apiUrl + 'me/export'} className='mb-2'>
<Button variant='secondary' block href={'me/export'} className='mb-2'>
<ForkAwesomeIcon icon='cloud-download' fixedWidth={true} className='mx-2' />
<Trans i18nKey='profile.exportUserData' />
</Button>

4
src/components/render-page/iframe-markdown-renderer.tsx
View file

@ -128,7 +128,9 @@ export const IframeMarkdownRenderer: React.FC = () => {
)
if (!baseConfiguration) {
return null
return (
<span>This is the render endpoint. If you can read this text then please check your HedgeDoc configuration.</span>
)
}
switch (baseConfiguration.rendererType) {

5
src/handler-utils/respond-to-matching-request.ts
View file

@ -5,6 +5,7 @@
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import { isMockMode } from '../utils/test-modes'
export enum HttpMethod {
GET = 'GET',
@ -31,6 +32,10 @@ export const respondToMatchingRequest = <T>(
response: T,
statusCode = 200
): boolean => {
if (!isMockMode) {
res.status(404).send('Mock API is disabled')
return false
}
if (method !== req.method) {
res.status(405).send('Method not allowed')
return false

33
src/hooks/common/use-base-url.tsx Normal file
View file

@ -0,0 +1,33 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { useContext, useMemo } from 'react'
import { useRouter } from 'next/router'
import { baseUrlContext } from '../../components/common/base-url/base-url-context-provider'
export enum ORIGIN {
EDITOR,
RENDERER,
CURRENT_PAGE
}
/**
* Provides the base urls for the editor and the renderer.
*/
export const useBaseUrl = (origin = ORIGIN.CURRENT_PAGE): string => {
const baseUrls = useContext(baseUrlContext)
if (!baseUrls) {
throw new Error('No base url context received. Did you forget to use the provider component?')
}
const router = useRouter()
return useMemo(() => {
return (router.route === '/render' && origin === ORIGIN.CURRENT_PAGE) || origin === ORIGIN.RENDERER
? baseUrls.renderer
: baseUrls.editor
}, [origin, baseUrls.renderer, baseUrls.editor, router.route])
}

20
src/hooks/common/use-frontend-base-url.ts
View file

@ -1,20 +0,0 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { useRouter } from 'next/router'
import { useMemo } from 'react'
/**
* Retrieves the frontend base url either from an environment variable or from the window location itself.
*
* @return The base url of the frontend.
*/
export const useFrontendBaseUrl = (): string => {
const { asPath } = useRouter()
return useMemo(() => {
return process.env.NEXT_PUBLIC_FRONTEND_ASSETS_URL || window.location.toString().replace(asPath, '') + '/'
}, [asPath])
}

31
src/pages/_app.tsx
View file

@ -3,23 +3,33 @@
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import type { AppProps } from 'next/app'
import type { AppInitialProps, AppProps } from 'next/app'
import { ErrorBoundary } from '../components/error-boundary/error-boundary'
import { ApplicationLoader } from '../components/application-loader/application-loader'
import '../../global-styles/dark.scss'
import '../../global-styles/index.scss'
import type { NextPage } from 'next'
import { BaseHead } from '../components/layout/base-head'
import { StoreProvider } from '../redux/store-provider'
import { UiNotificationBoundary } from '../components/notifications/ui-notification-boundary'
import { ExpectedOriginBoundary } from '../utils/uri-origin-boundary'
import React from 'react'
import { BaseUrlContextProvider } from '../components/common/base-url/base-url-context-provider'
import type { BaseUrls } from '../components/common/base-url/base-url-context-provider'
import { BaseUrlFromEnvExtractor } from '../utils/base-url-from-env-extractor'
interface AppPageProps {
baseUrls: BaseUrls | undefined
}
/**
* The actual hedgedoc next js app.
* Provides necessary wrapper components to every page.
*/
const HedgeDocApp: NextPage<AppProps> = ({ Component, pageProps }: AppProps) => {
function HedgeDocApp({ Component, pageProps }: AppProps<AppPageProps>) {
return (
<BaseUrlContextProvider baseUrls={pageProps.baseUrls}>
<StoreProvider>
<ExpectedOriginBoundary>
<BaseHead />
<ApplicationLoader>
<ErrorBoundary>
@ -28,8 +38,23 @@ const HedgeDocApp: NextPage<AppProps> = ({ Component, pageProps }: AppProps) =>
</UiNotificationBoundary>
</ErrorBoundary>
</ApplicationLoader>
</ExpectedOriginBoundary>
</StoreProvider>
</BaseUrlContextProvider>
)
}
const baseUrlFromEnvExtractor: BaseUrlFromEnvExtractor = new BaseUrlFromEnvExtractor()
HedgeDocApp.getInitialProps = (): AppInitialProps<AppPageProps> => {
const baseUrls = baseUrlFromEnvExtractor.extractBaseUrls().orElse(undefined)
return {
pageProps: {
baseUrls
}
}
}
// noinspection JSUnusedGlobalSymbols
export default HedgeDocApp

54
src/pages/api/mock-backend/private/notes/features/index.ts
View file

File diff suppressed because one or more lines are too long

14
src/pages/api/mock-backend/private/config.ts → src/pages/api/private/config.ts
View file

@ -4,9 +4,9 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import type { Config } from '../../../../api/config/types'
import { AuthProviderType } from '../../../../api/config/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../handler-utils/respond-to-matching-request'
import type { Config } from '../../../api/config/types'
import { AuthProviderType } from '../../../api/config/types'
import { HttpMethod, respondToMatchingRequest } from '../../../handler-utils/respond-to-matching-request'
const handler = (req: NextApiRequest, res: NextApiResponse) => {
respondToMatchingRequest<Config>(HttpMethod.GET, req, res, {
@ -54,7 +54,7 @@ const handler = (req: NextApiRequest, res: NextApiResponse) => {
],
branding: {
name: 'DEMO Corp',
logo: '/mock-public/img/demo.png'
logo: 'public/img/demo.png'
},
useImageProxy: false,
specialUrls: {
@ -69,11 +69,7 @@ const handler = (req: NextApiRequest, res: NextApiResponse) => {
commit: 'mock'
},
plantumlServer: 'https://www.plantuml.com/plantuml',
maxDocumentLength: 1000000,
iframeCommunication: {
editorOrigin: process.env.NEXT_PUBLIC_EDITOR_ORIGIN ?? 'http://localhost:3001/',
rendererOrigin: process.env.NEXT_PUBLIC_RENDERER_ORIGIN ?? 'http://127.0.0.1:3001/'
}
maxDocumentLength: 1000000
})
}

4
src/pages/api/mock-backend/private/groups/_EVERYONE.ts → src/pages/api/private/groups/_EVERYONE.ts
View file

@ -4,8 +4,8 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import { HttpMethod, respondToMatchingRequest } from '../../../../../handler-utils/respond-to-matching-request'
import type { GroupInfo } from '../../../../../api/group/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../handler-utils/respond-to-matching-request'
import type { GroupInfo } from '../../../../api/group/types'
const handler = (req: NextApiRequest, res: NextApiResponse) => {
respondToMatchingRequest<GroupInfo>(HttpMethod.GET, req, res, {

4
src/pages/api/mock-backend/private/groups/_LOGGED_IN.ts → src/pages/api/private/groups/_LOGGED_IN.ts
View file

@ -4,8 +4,8 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import { HttpMethod, respondToMatchingRequest } from '../../../../../handler-utils/respond-to-matching-request'
import type { GroupInfo } from '../../../../../api/group/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../handler-utils/respond-to-matching-request'
import type { GroupInfo } from '../../../../api/group/types'
const handler = (req: NextApiRequest, res: NextApiResponse) => {
respondToMatchingRequest<GroupInfo>(HttpMethod.GET, req, res, {

4
src/pages/api/mock-backend/private/groups/hedgedoc-devs.ts → src/pages/api/private/groups/hedgedoc-devs.ts
View file

@ -4,8 +4,8 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import { HttpMethod, respondToMatchingRequest } from '../../../../../handler-utils/respond-to-matching-request'
import type { GroupInfo } from '../../../../../api/group/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../handler-utils/respond-to-matching-request'
import type { GroupInfo } from '../../../../api/group/types'
const handler = (req: NextApiRequest, res: NextApiResponse) => {
respondToMatchingRequest<GroupInfo>(HttpMethod.GET, req, res, {

4
src/pages/api/mock-backend/private/me/history.ts → src/pages/api/private/me/history.ts
View file

@ -5,8 +5,8 @@
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import { HttpMethod, respondToMatchingRequest } from '../../../../../handler-utils/respond-to-matching-request'
import type { HistoryEntry } from '../../../../../api/history/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../handler-utils/respond-to-matching-request'
import type { HistoryEntry } from '../../../../api/history/types'
const handler = (req: NextApiRequest, res: NextApiResponse) => {
respondToMatchingRequest<HistoryEntry[]>(HttpMethod.GET, req, res, [

6
src/pages/api/mock-backend/private/me/index.ts → src/pages/api/private/me/index.ts
View file

@ -5,13 +5,13 @@
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import { HttpMethod, respondToMatchingRequest } from '../../../../../handler-utils/respond-to-matching-request'
import type { LoginUserInfo } from '../../../../../api/me/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../handler-utils/respond-to-matching-request'
import type { LoginUserInfo } from '../../../../api/me/types'
const handler = (req: NextApiRequest, res: NextApiResponse): void => {
respondToMatchingRequest<LoginUserInfo>(HttpMethod.GET, req, res, {
username: 'mock',
photo: '/mock-public/img/avatar.png',
photo: 'public/img/avatar.png',
displayName: 'Mock User',
authProvider: 'local',
email: 'mock@hedgedoc.test'

4
src/pages/api/mock-backend/private/me/media.ts → src/pages/api/private/me/media.ts
View file

@ -5,8 +5,8 @@
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import { HttpMethod, respondToMatchingRequest } from '../../../../../handler-utils/respond-to-matching-request'
import type { MediaUpload } from '../../../../../api/media/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../handler-utils/respond-to-matching-request'
import type { MediaUpload } from '../../../../api/media/types'
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)

8
src/pages/api/mock-backend/private/media.ts → src/pages/api/private/media.ts
View file

@ -5,9 +5,9 @@
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import type { MediaUpload } from '../../../../api/media/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../handler-utils/respond-to-matching-request'
import { isMockMode, isTestMode } from '../../../../utils/test-modes'
import type { MediaUpload } from '../../../api/media/types'
import { HttpMethod, respondToMatchingRequest } from '../../../handler-utils/respond-to-matching-request'
import { isMockMode, isTestMode } from '../../../utils/test-modes'
const handler = async (req: NextApiRequest, res: NextApiResponse): Promise<void> => {
if (isMockMode && !isTestMode) {
@ -21,7 +21,7 @@ const handler = async (req: NextApiRequest, res: NextApiResponse): Promise<void>
req,
res,
{
url: '/mock-public/img/avatar.png',
url: 'public/img/avatar.png',
noteId: null,
username: 'test',
createdAt: '2022-02-27T21:54:23.856Z'

54
src/pages/api/private/notes/features/index.ts Normal file
View file

File diff suppressed because one or more lines are too long

4
src/pages/api/mock-backend/private/notes/features/revisions/0.ts → src/pages/api/private/notes/features/revisions/0.ts
View file

@ -5,8 +5,8 @@
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import { HttpMethod, respondToMatchingRequest } from '../../../../../../../handler-utils/respond-to-matching-request'
import type { RevisionDetails } from '../../../../../../../api/revisions/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../../../handler-utils/respond-to-matching-request'
import type { RevisionDetails } from '../../../../../../api/revisions/types'
const handler = (req: NextApiRequest, res: NextApiResponse): void => {
respondToMatchingRequest<RevisionDetails>(HttpMethod.GET, req, res, {

4
src/pages/api/mock-backend/private/notes/features/revisions/1.ts → src/pages/api/private/notes/features/revisions/1.ts
View file

@ -4,8 +4,8 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import { HttpMethod, respondToMatchingRequest } from '../../../../../../../handler-utils/respond-to-matching-request'
import type { RevisionDetails } from '../../../../../../../api/revisions/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../../../handler-utils/respond-to-matching-request'
import type { RevisionDetails } from '../../../../../../api/revisions/types'
const handler = (req: NextApiRequest, res: NextApiResponse): void => {
respondToMatchingRequest<RevisionDetails>(HttpMethod.GET, req, res, {

4
src/pages/api/mock-backend/private/notes/features/revisions/index.ts → src/pages/api/private/notes/features/revisions/index.ts
View file

@ -5,8 +5,8 @@
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import { HttpMethod, respondToMatchingRequest } from '../../../../../../../handler-utils/respond-to-matching-request'
import type { RevisionMetadata } from '../../../../../../../api/revisions/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../../../handler-utils/respond-to-matching-request'
import type { RevisionMetadata } from '../../../../../../api/revisions/types'
const handler = (req: NextApiRequest, res: NextApiResponse): void => {
respondToMatchingRequest<RevisionMetadata[]>(HttpMethod.GET, req, res, [

4
src/pages/api/mock-backend/private/notes/index.ts → src/pages/api/private/notes/index.ts
View file

@ -5,8 +5,8 @@
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import { HttpMethod, respondToMatchingRequest } from '../../../../../handler-utils/respond-to-matching-request'
import type { Note } from '../../../../../api/notes/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../handler-utils/respond-to-matching-request'
import type { Note } from '../../../../api/notes/types'
const handler = (req: NextApiRequest, res: NextApiResponse): void => {
respondToMatchingRequest<Note>(

4
src/pages/api/mock-backend/private/notes/slide-example/index.ts → src/pages/api/private/notes/slide-example/index.ts
View file

@ -5,8 +5,8 @@
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import { HttpMethod, respondToMatchingRequest } from '../../../../../../handler-utils/respond-to-matching-request'
import type { Note } from '../../../../../../api/notes/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../../handler-utils/respond-to-matching-request'
import type { Note } from '../../../../../api/notes/types'
const handler = (req: NextApiRequest, res: NextApiResponse): void => {
respondToMatchingRequest<Note>(HttpMethod.GET, req, res, {

4
src/pages/api/mock-backend/private/tokens.ts → src/pages/api/private/tokens.ts
View file

@ -4,8 +4,8 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import type { AccessToken } from '../../../../api/tokens/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../handler-utils/respond-to-matching-request'
import type { AccessToken } from '../../../api/tokens/types'
import { HttpMethod, respondToMatchingRequest } from '../../../handler-utils/respond-to-matching-request'
const handler = (req: NextApiRequest, res: NextApiResponse) => {
respondToMatchingRequest<AccessToken[]>(HttpMethod.GET, req, res, [

6
src/pages/api/mock-backend/private/users/erik.ts → src/pages/api/private/users/erik.ts
View file

@ -4,14 +4,14 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import { HttpMethod, respondToMatchingRequest } from '../../../../../handler-utils/respond-to-matching-request'
import type { UserInfo } from '../../../../../api/users/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../handler-utils/respond-to-matching-request'
import type { UserInfo } from '../../../../api/users/types'
const handler = (req: NextApiRequest, res: NextApiResponse): void => {
respondToMatchingRequest<UserInfo>(HttpMethod.GET, req, res, {
username: 'erik',
displayName: 'Erik',
photo: '/mock-public/img/avatar.png'
photo: 'public/img/avatar.png'
})
}

6
src/pages/api/mock-backend/private/users/molly.ts → src/pages/api/private/users/molly.ts
View file

@ -5,14 +5,14 @@
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import { HttpMethod, respondToMatchingRequest } from '../../../../../handler-utils/respond-to-matching-request'
import type { UserInfo } from '../../../../../api/users/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../handler-utils/respond-to-matching-request'
import type { UserInfo } from '../../../../api/users/types'
const handler = (req: NextApiRequest, res: NextApiResponse): void => {
respondToMatchingRequest<UserInfo>(HttpMethod.GET, req, res, {
username: 'molly',
displayName: 'Molly',
photo: '/mock-public/img/avatar.png'
photo: 'public/img/avatar.png'
})
}

6
src/pages/api/mock-backend/private/users/tilman.ts → src/pages/api/private/users/tilman.ts
View file

@ -4,14 +4,14 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import type { NextApiRequest, NextApiResponse } from 'next'
import { HttpMethod, respondToMatchingRequest } from '../../../../../handler-utils/respond-to-matching-request'
import type { UserInfo } from '../../../../../api/users/types'
import { HttpMethod, respondToMatchingRequest } from '../../../../handler-utils/respond-to-matching-request'
import type { UserInfo } from '../../../../api/users/types'
const handler = (req: NextApiRequest, res: NextApiResponse): void => {
respondToMatchingRequest<UserInfo>(HttpMethod.GET, req, res, {
username: 'tilman',
displayName: 'Tilman',
photo: '/mock-public/img/avatar.png'
photo: 'public/img/avatar.png'
})
}

8
src/redux/config/reducers.ts
View file

@ -1,5 +1,5 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
@ -29,11 +29,7 @@ export const initialState: Config = {
patch: 0
},
plantumlServer: undefined,
maxDocumentLength: 0,
iframeCommunication: {
editorOrigin: '',
rendererOrigin: ''
}
maxDocumentLength: 0
}
export const ConfigReducer: Reducer<Config, ConfigActions> = (state: Config = initialState, action: ConfigActions) => {

13
src/utils/api-url.ts
View file

@ -1,13 +0,0 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { isMockMode } from './test-modes'
import { backendUrl } from './backend-url'
/**
* Generates the url to the api.
*/
export const apiUrl = isMockMode ? `/api/mock-backend/private/` : `${backendUrl}api/private/`

30
src/utils/backend-url.ts
View file

@ -1,30 +0,0 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { isMockMode } from './test-modes'
/**
* Generates the backend URL from the environment variable `NEXT_PUBLIC_BACKEND_BASE_URL` or the mock default if mock mode is activated.
*
* @throws Error if the environment variable is unset or doesn't end with "/"
* @return the backend url that should be used in the app
*/
const generateBackendUrl = (): string => {
if (!isMockMode) {
const backendUrl = process.env.NEXT_PUBLIC_BACKEND_BASE_URL
if (backendUrl === undefined) {
throw new Error('NEXT_PUBLIC_BACKEND_BASE_URL is unset and mock mode is disabled')
} else if (!backendUrl.endsWith('/')) {
throw new Error("NEXT_PUBLIC_BACKEND_BASE_URL must end with an '/'")
} else {
return backendUrl
}
} else {
return '/'
}
}
export const backendUrl = generateBackendUrl()

68
src/utils/base-url-from-env-extractor.test.ts Normal file
View file

@ -0,0 +1,68 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { BaseUrlFromEnvExtractor } from './base-url-from-env-extractor'
describe('BaseUrlFromEnvExtractor', () => {
it('should return the base urls if both are valid urls', () => {
process.env.HD_EDITOR_BASE_URL = 'https://editor.example.org/'
process.env.HD_RENDERER_BASE_URL = 'https://renderer.example.org/'
const baseUrlFromEnvExtractor = new BaseUrlFromEnvExtractor()
const result = baseUrlFromEnvExtractor.extractBaseUrls()
expect(result.isPresent()).toBeTruthy()
expect(result.get()).toStrictEqual({
renderer: 'https://renderer.example.org/',
editor: 'https://editor.example.org/'
})
})
it('should return an empty optional if no var is set', () => {
process.env.HD_EDITOR_BASE_URL = undefined
process.env.HD_RENDERER_BASE_URL = undefined
const baseUrlFromEnvExtractor = new BaseUrlFromEnvExtractor()
expect(baseUrlFromEnvExtractor.extractBaseUrls().isEmpty()).toBeTruthy()
})
it("should return an empty optional if editor base url isn't an URL", () => {
process.env.HD_EDITOR_BASE_URL = 'bibedibabedibu'
process.env.HD_RENDERER_BASE_URL = 'https://renderer.example.org/'
const baseUrlFromEnvExtractor = new BaseUrlFromEnvExtractor()
expect(baseUrlFromEnvExtractor.extractBaseUrls().isEmpty()).toBeTruthy()
})
it("should return an empty optional if renderer base url isn't an URL", () => {
process.env.HD_EDITOR_BASE_URL = 'https://editor.example.org/'
process.env.HD_RENDERER_BASE_URL = 'bibedibabedibu'
const baseUrlFromEnvExtractor = new BaseUrlFromEnvExtractor()
expect(baseUrlFromEnvExtractor.extractBaseUrls().isEmpty()).toBeTruthy()
})
it("should return an empty optional if editor base url isn't ending with a slash", () => {
process.env.HD_EDITOR_BASE_URL = 'https://editor.example.org'
process.env.HD_RENDERER_BASE_URL = 'https://renderer.example.org/'
const baseUrlFromEnvExtractor = new BaseUrlFromEnvExtractor()
expect(baseUrlFromEnvExtractor.extractBaseUrls().isEmpty()).toBeTruthy()
})
it("should return an empty optional if renderer base url isn't ending with a slash", () => {
process.env.HD_EDITOR_BASE_URL = 'https://editor.example.org/'
process.env.HD_RENDERER_BASE_URL = 'https://renderer.example.org'
const baseUrlFromEnvExtractor = new BaseUrlFromEnvExtractor()
expect(baseUrlFromEnvExtractor.extractBaseUrls().isEmpty()).toBeTruthy()
})
it('should copy editor base url to renderer base url if renderer base url is omitted', () => {
process.env.HD_EDITOR_BASE_URL = 'https://editor.example.org/'
delete process.env.HD_RENDERER_BASE_URL
const baseUrlFromEnvExtractor = new BaseUrlFromEnvExtractor()
const result = baseUrlFromEnvExtractor.extractBaseUrls()
expect(result.isPresent()).toBeTruthy()
expect(result.get()).toStrictEqual({
renderer: 'https://editor.example.org/',
editor: 'https://editor.example.org/'
})
})
})

89
src/utils/base-url-from-env-extractor.ts Normal file
View file

@ -0,0 +1,89 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { Optional } from '@mrdrogdrog/optional'
import type { BaseUrls } from '../components/common/base-url/base-url-context-provider'
import { Logger } from './logger'
import { isTestMode } from './test-modes'
/**
* Extracts the editor and renderer base urls from the environment variables.
*/
export class BaseUrlFromEnvExtractor {
private baseUrls: Optional<BaseUrls> | undefined
private logger = new Logger('Base URL Configuration')
private extractUrlFromEnvVar(envVarName: string, envVarValue: string | undefined): Optional<URL> {
return Optional.ofNullable(envVarValue)
.filter((value) => {
const endsWithSlash = value.endsWith('/')
if (!endsWithSlash) {
this.logger.error(`${envVarName} must end with an '/'`)
}
return endsWithSlash
})
.map((value) => {
try {
return new URL(value)
} catch (error) {
return null
}
})
}
private extractEditorBaseUrlFromEnv(): Optional<URL> {
const envValue = this.extractUrlFromEnvVar('HD_EDITOR_BASE_URL', process.env.HD_EDITOR_BASE_URL)
if (envValue.isEmpty()) {
this.logger.error("HD_EDITOR_BASE_URL isn't a valid URL!")
}
return envValue
}
private extractRendererBaseUrlFromEnv(editorBaseUrl: URL): Optional<URL> {
if (isTestMode) {
this.logger.info('Test mode activated. Using editor base url for renderer.')
return Optional.of(editorBaseUrl)
}
if (!process.env.HD_RENDERER_BASE_URL) {
this.logger.info('HD_RENDERER_BASE_URL is unset. Using editor base url for renderer.')
return Optional.of(editorBaseUrl)
}
return this.extractUrlFromEnvVar('HD_RENDERER_BASE_URL', process.env.HD_RENDERER_BASE_URL)
}
private renewBaseUrls(): void {
this.baseUrls = this.extractEditorBaseUrlFromEnv().flatMap((editorBaseUrl) =>
this.extractRendererBaseUrlFromEnv(editorBaseUrl).map((rendererBaseUrl) => {
return {
editor: editorBaseUrl.toString(),
renderer: rendererBaseUrl.toString()
}
})
)
this.baseUrls.ifPresent((urls) => {
this.logger.info('Editor base URL', urls.editor.toString())
this.logger.info('Renderer base URL', urls.renderer.toString())
})
}
private isEnvironmentExtractDone(): boolean {
return this.baseUrls !== undefined
}
/**
* Extracts the editor and renderer base urls from the environment variables.
*
* @return An {@link Optional} with the base urls.
*/
public extractBaseUrls(): Optional<BaseUrls> {
if (!this.isEnvironmentExtractDone()) {
this.renewBaseUrls()
}
return Optional.ofNullable(this.baseUrls).flatMap((value) => value)
}
}

15
src/utils/customize-assets-url.ts
View file

@ -1,15 +0,0 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { backendUrl } from './backend-url'
import { isMockMode } from './test-modes'
/**
* Generates the url to the assets.
*/
export const customizeAssetsUrl = isMockMode
? `/mock-public/`
: process.env.NEXT_PUBLIC_CUSTOMIZE_ASSETS_URL || `${backendUrl}public/`

15
src/utils/is-positive-answer.ts
View file

@ -1,15 +0,0 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
/**
* Checks if the given string is a positive answer (yes, true or 1).
*
* @param value The value to check
*/
export const isPositiveAnswer = (value: string) => {
const lowerValue = value.toLowerCase()
return lowerValue === 'yes' || lowerValue === '1' || lowerValue === 'true'
}

44
src/utils/test-modes.js Normal file
View file

@ -0,0 +1,44 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
/**
* This file is intentionally a js and not a ts file because it is used in `next.config.js`
*/
/**
* Checks if the given string is a positive answer (yes, true or 1).
*
* @param {string} value The value to check
* @return {boolean} {@code true} if the value describes a positive answer string
*/
const isPositiveAnswer = (value) => {
const lowerValue = value.toLowerCase()
return lowerValue === 'yes' || lowerValue === '1' || lowerValue === 'true'
}
/**
* Defines if the current runtime is built in e2e test mode.
* @type boolean
*/
const isTestMode = !!process.env.NEXT_PUBLIC_TEST_MODE && isPositiveAnswer(process.env.NEXT_PUBLIC_TEST_MODE)
/**
* Defines if the current runtime should use the mocked backend.
* @type boolean
*/
const isMockMode = !!process.env.NEXT_PUBLIC_USE_MOCK_API && isPositiveAnswer(process.env.NEXT_PUBLIC_USE_MOCK_API)
/**
* Defines if the current runtime was built in development mode.
* @type boolean
*/
const isDevMode = process.env.NODE_ENV === 'development'
module.exports = {
isTestMode,
isMockMode,
isDevMode
}

23
src/utils/test-modes.ts
View file

@ -1,23 +0,0 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { isPositiveAnswer } from './is-positive-answer'
/**
* Checks if the current runtime is built in e2e test mode.
*/
export const isTestMode = !!process.env.NEXT_PUBLIC_TEST_MODE && isPositiveAnswer(process.env.NEXT_PUBLIC_TEST_MODE)
/**
* Checks if the current runtime should use the mocked backend.
*/
export const isMockMode =
!!process.env.NEXT_PUBLIC_USE_MOCK_API && isPositiveAnswer(process.env.NEXT_PUBLIC_USE_MOCK_API)
/**
* Checks if the current runtime was built in development mode.
*/
export const isDevMode = process.env.NODE_ENV === 'development'

27
src/utils/uri-origin-boundary.tsx Normal file
View file

@ -0,0 +1,27 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import React, { Fragment, useMemo } from 'react'
import type { PropsWithChildren } from 'react'
import { isClientSideRendering } from './is-client-side-rendering'
import { useBaseUrl } from '../hooks/common/use-base-url'
/**
* Checks if the url of the current browser window matches the expected origin.
* This is necessary to ensure that the render endpoint is only opened from the rendering origin.
*
* @param children The children react element that should be rendered if the origin is correct
*/
export const ExpectedOriginBoundary: React.FC<PropsWithChildren> = ({ children }) => {
const baseUrl = useBaseUrl()
const expectedOrigin = useMemo(() => new URL(baseUrl).origin, [baseUrl])
if (isClientSideRendering() && window.location.origin !== expectedOrigin) {
return <span>{`You can't open this page using this URL. For this endpoint "${expectedOrigin}" is expected.`}</span>
} else {
return <Fragment>{children}</Fragment>
}
}