diff --git a/src/app/item-page/field-components/metadata-values/metadata-values.component.html b/src/app/item-page/field-components/metadata-values/metadata-values.component.html index 824265c5c8..5e146ebf48 100644 --- a/src/app/item-page/field-components/metadata-values/metadata-values.component.html +++ b/src/app/item-page/field-components/metadata-values/metadata-values.component.html @@ -1,6 +1,6 @@ - + diff --git a/src/app/item-page/field-components/metadata-values/metadata-values.component.ts b/src/app/item-page/field-components/metadata-values/metadata-values.component.ts index 1773a42bde..2652e75c12 100644 --- a/src/app/item-page/field-components/metadata-values/metadata-values.component.ts +++ b/src/app/item-page/field-components/metadata-values/metadata-values.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, OnChanges, SimpleChanges } from '@angular/core'; +import { Component, Input } from '@angular/core'; import { MetadataValue } from '../../../core/shared/metadata.models'; import { environment } from '../../../../environments/environment'; @@ -11,7 +11,7 @@ import { environment } from '../../../../environments/environment'; styleUrls: ['./metadata-values.component.scss'], templateUrl: './metadata-values.component.html' }) -export class MetadataValuesComponent implements OnChanges { +export class MetadataValuesComponent { /** * The metadata values to display @@ -29,17 +29,11 @@ export class MetadataValuesComponent implements OnChanges { @Input() label: string; /** - * Whether this metadata should be rendered with markdown. + * Whether the {@link MarkdownPipe} should be used to render these metadata values. + * This will only have effect if {@link MarkdownConfig#enabled} is true. + * Mathjax will only be rendered if {@link MarkdownConfig#mathjax} is true. */ @Input() enableMarkdown = false; - /** - * This variable will be true if this metadata should be rendered with markdown, and if markdown is enabled in the - * environment config. - */ - renderMarkdown = false; - - ngOnChanges(changes: SimpleChanges): void { - this.renderMarkdown = !!environment.enableMarkdown && this.enableMarkdown; - } + env = environment; } diff --git a/src/app/item-page/simple/field-components/specific-field/abstract/item-page-abstract-field.component.ts b/src/app/item-page/simple/field-components/specific-field/abstract/item-page-abstract-field.component.ts index 958158e6bd..f29bef31a7 100644 --- a/src/app/item-page/simple/field-components/specific-field/abstract/item-page-abstract-field.component.ts +++ b/src/app/item-page/simple/field-components/specific-field/abstract/item-page-abstract-field.component.ts @@ -36,5 +36,8 @@ export class ItemPageAbstractFieldComponent extends ItemPageFieldComponent { */ label = 'item.page.abstract'; + /** + * Use the {@link MarkdownPipe} to render dc.description.abstract values + */ enableMarkdown = true; } diff --git a/src/app/item-page/simple/field-components/specific-field/item-page-field.component.spec.ts b/src/app/item-page/simple/field-components/specific-field/item-page-field.component.spec.ts index cf7c12ebb6..385520882a 100644 --- a/src/app/item-page/simple/field-components/specific-field/item-page-field.component.spec.ts +++ b/src/app/item-page/simple/field-components/specific-field/item-page-field.component.spec.ts @@ -57,7 +57,7 @@ describe('ItemPageFieldComponent', () => { describe('when markdown is disabled in the environment config', () => { beforeEach(() => { - environment.enableMarkdown = false; + environment.markdown.enabled = false; }); describe('and markdown is disabled in this component', () => { @@ -88,7 +88,7 @@ describe('ItemPageFieldComponent', () => { describe('when markdown is enabled in the environment config', () => { beforeEach(() => { - environment.enableMarkdown = true; + environment.markdown.enabled = true; }); describe('and markdown is disabled in this component', () => { diff --git a/src/app/item-page/simple/field-components/specific-field/item-page-field.component.ts b/src/app/item-page/simple/field-components/specific-field/item-page-field.component.ts index f424ff195a..681c5e16bc 100644 --- a/src/app/item-page/simple/field-components/specific-field/item-page-field.component.ts +++ b/src/app/item-page/simple/field-components/specific-field/item-page-field.component.ts @@ -1,5 +1,4 @@ import { Component, Input } from '@angular/core'; - import { Item } from '../../../../core/shared/item.model'; /** @@ -19,7 +18,7 @@ export class ItemPageFieldComponent { @Input() item: Item; /** - * Whether this metadata should be rendered with markdown. + * Whether the {@link MarkdownPipe} should be used to render this metadata. */ enableMarkdown = false; diff --git a/src/app/shared/utils/markdown.pipe.spec.ts b/src/app/shared/utils/markdown.pipe.spec.ts index 48505c0d78..50f772097d 100644 --- a/src/app/shared/utils/markdown.pipe.spec.ts +++ b/src/app/shared/utils/markdown.pipe.spec.ts @@ -14,8 +14,10 @@ describe('Markdown Pipe', () => { { provide: APP_CONFIG, useValue: Object.assign(environment, { - enableMarkdown: true, - enableMathjax: true, + markdown: { + enabled: true, + mathjax: true, + } }) }, ], diff --git a/src/app/shared/utils/markdown.pipe.ts b/src/app/shared/utils/markdown.pipe.ts index 4973089c27..f7e1032cac 100644 --- a/src/app/shared/utils/markdown.pipe.ts +++ b/src/app/shared/utils/markdown.pipe.ts @@ -13,6 +13,16 @@ const MATHJAX = new InjectionToken( /** * Pipe for rendering markdown and mathjax. + * - markdown will only be rendered if {@link MarkdownConfig#enabled} is true + * - mathjax will only be rendered if both {@link MarkdownConfig#enabled} and {@link MarkdownConfig#mathjax} are true + * + * This pipe should be used on the 'innerHTML' attribute of a component, in combination with an async pipe. + * Example usage: + * + * Result: + * + *

title

+ *
*/ @Pipe({ name: 'dsMarkdown' @@ -26,11 +36,14 @@ export class MarkdownPipe implements PipeTransform { } async transform(value: string): Promise { + if (!environment.markdown.enabled) { + return value; + } const md = new MarkdownIt({ html: true, linkify: true, }); - if (environment.enableMathjax) { + if (environment.markdown.mathjax) { md.use(await this.mathjax); } return this.sanitizer.bypassSecurityTrustHtml( diff --git a/src/config/app-config.interface.ts b/src/config/app-config.interface.ts index b882b725e6..ce9c8b3bf7 100644 --- a/src/config/app-config.interface.ts +++ b/src/config/app-config.interface.ts @@ -19,6 +19,7 @@ import { ActuatorsConfig } from './actuators.config'; import { InfoConfig } from './info-config.interface'; import { CommunityListConfig } from './community-list-config.interface'; import { HomeConfig } from './homepage-config.interface'; +import { MarkdownConfig } from './markdown-config.interface'; interface AppConfig extends Config { ui: UIServerConfig; @@ -42,8 +43,7 @@ interface AppConfig extends Config { bundle: BundleConfig; actuators: ActuatorsConfig info: InfoConfig; - enableMarkdown: boolean; - enableMathjax: boolean; + markdown: MarkdownConfig; } /** diff --git a/src/config/default-app-config.ts b/src/config/default-app-config.ts index 9709c05ea0..fc519cb7b8 100644 --- a/src/config/default-app-config.ts +++ b/src/config/default-app-config.ts @@ -365,7 +365,8 @@ export class DefaultAppConfig implements AppConfig { enablePrivacyStatement: true }; - enableMarkdown = false; - - enableMathjax = false; + markdown: { + enabled: false, + mathjax: false, + }; } diff --git a/src/config/markdown-config.interface.ts b/src/config/markdown-config.interface.ts new file mode 100644 index 0000000000..6ba40f50fb --- /dev/null +++ b/src/config/markdown-config.interface.ts @@ -0,0 +1,21 @@ +import { Config } from './config.interface'; + +/** + * Config related to the {@link MarkdownPipe}. + */ +export interface MarkdownConfig extends Config { + + /** + * Enable Markdown (https://commonmark.org/) syntax for values passed to the {@link MarkdownPipe}. + * - If this is true, values passed to the MarkdownPipe will be transformed to html according to the markdown syntax + * rules. + * - If this is false, using the MarkdownPipe will have no effect. + */ + enabled: boolean; + + /** + * Enable MathJax (https://www.mathjax.org/) syntax for values passed to the {@link MarkdownPipe}. + * Requires {@link enabled} to also be true before MathJax will display. + */ + mathjax: boolean; +} diff --git a/src/environments/environment.test.ts b/src/environments/environment.test.ts index 42d0832a1d..a7133a8c68 100644 --- a/src/environments/environment.test.ts +++ b/src/environments/environment.test.ts @@ -271,6 +271,8 @@ export const environment: BuildConfig = { enableEndUserAgreement: true, enablePrivacyStatement: true, }, - enableMarkdown: false, - enableMathjax: false, + markdown: { + enabled: false, + mathjax: false, + }, };