feat: enabel live edit

src/app/presentation/ledge-helper/ledge-helper.component.scss

@@ -10,3 +10,8 @@
 .source {
   flex: 1;
 }
+
+.sample {
+  height: 100%;
+  overflow-y: scroll;
+}

src/app/presentation/ledge-helper/ledge-helper.component.spec.ts

@@ -1,16 +1,18 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 
 import { LedgeHelperComponent } from './ledge-helper.component';
+import { SharedModule } from '../../shared/shared.module';
 
 describe('LedgeHelperComponent', () => {
   let component: LedgeHelperComponent;
   let fixture: ComponentFixture<LedgeHelperComponent>;
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
-      declarations: [ LedgeHelperComponent ]
+      imports: [SharedModule],
+      declarations: [LedgeHelperComponent]
     })
-    .compileComponents();
+      .compileComponents();
   }));
 
   beforeEach(() => {

src/app/shared/components/ledge-render/ledge-render.component.ts

@@ -1,4 +1,4 @@
-import { AfterViewInit, Component, Input, OnInit } from '@angular/core';
+import { AfterViewInit, Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core';
 import marked from 'marked/lib/marked';
 import { ReporterChartModel } from '../model/reporter-chart.model';
 import * as d3 from 'd3';
@@ -10,7 +10,7 @@ import LedgeMarkdownConverter from '../model/ledge-markdown-converter';
   templateUrl: './ledge-render.component.html',
   styleUrls: ['./ledge-render.component.scss']
 })
-export class LedgeRenderComponent implements OnInit, AfterViewInit {
+export class LedgeRenderComponent implements OnInit, AfterViewInit, OnChanges {
   @Input()
   content: string;
 
@@ -21,14 +21,21 @@ export class LedgeRenderComponent implements OnInit, AfterViewInit {
   }
 
   ngOnInit(): void {
-    this.buildChartData(this.content);
+    this.renderContent(this.content);
   }
 
   ngAfterViewInit(): void {
 
   }
 
-  private buildChartData(content: string) {
+  ngOnChanges(changes: SimpleChanges): void {
+    const { content } = changes;
+    this.content = content.currentValue;
+    this.renderContent(this.content);
+  }
+
+  private renderContent(content: string) {
+    this.markdownData = [];
     const tokens = marked.lexer(content);
     this.buildData(tokens);
   }