[UXP-114] Refactoring markdown-viewer.component by using markdown.pipe

Author: atarix83

src/app/shared/markdown-viewer/markdown-viewer.component.html

@@ -1 +1,2 @@
-<nu-markdown-preview [style]="'color: inherit'" [value]="value"></nu-markdown-preview>
+<span class="dont-break-out" [innerHTML]="value | dsMarkdown: true | async">
+</span>

src/app/shared/markdown-viewer/markdown-viewer.component.spec.ts

@@ -1,14 +1,16 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 
 import { MarkdownViewerComponent } from './markdown-viewer.component';
+import { MarkdownPipe } from '../utils/markdown.pipe';
+import { By } from '@angular/platform-browser';
 
 describe('DsMarkdownViewerComponent', () => {
   let component: MarkdownViewerComponent;
   let fixture: ComponentFixture<MarkdownViewerComponent>;
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      declarations: [ MarkdownViewerComponent ]
+      declarations: [ MarkdownViewerComponent, MarkdownPipe ]
     })
     .compileComponents();
   });
@@ -20,6 +22,7 @@ describe('DsMarkdownViewerComponent', () => {
   });
 
   it('should create', () => {
-    expect(component).toBeTruthy();
+    const span = fixture.debugElement.query(By.css('span'));
+    expect(span).toBeTruthy();
   });
 });

src/app/shared/markdown-viewer/markdown-viewer.module.ts

@@ -2,10 +2,11 @@ import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { MarkdownViewerComponent } from './markdown-viewer.component';
 import { NuMarkdownModule } from '@ng-util/markdown';
+import { SharedModule } from '../shared.module';
 
 @NgModule({
   declarations: [ MarkdownViewerComponent ],
   exports: [ MarkdownViewerComponent ],
-  imports: [ CommonModule, NuMarkdownModule ]
+    imports: [CommonModule, NuMarkdownModule, SharedModule]
 })
 export class MarkdownViewerModule { }

src/app/shared/utils/markdown.pipe.ts

@@ -49,8 +49,8 @@ export class MarkdownPipe implements PipeTransform {
   ) {
   }
 
-  async transform(value: string): Promise<SafeHtml> {
-    if (!environment.markdown.enabled) {
+  async transform(value: string, forcePreview = false): Promise<SafeHtml> {
+    if (!environment.markdown.enabled && !forcePreview) {
       return value;
     }
     const MarkdownIt = await this.markdownIt;