SDN-R add updated odlux

Updates all odlux framework and app components.

Issue-ID: SDNC-1032
Signed-off-by: herbert <herbert.eiselt@highstreet-technologies.com>
Change-Id: I13c520489fd40d05b7fd5215f5941af6238e9cae

1 files changed, 64 insertions, 13 deletions

diff --git a/sdnr/wt/odlux/framework/src/views/about.tsx b/sdnr/wt/odlux/framework/src/views/about.tsx
index d47e09c3a..59a71512c 100644
--- a/sdnr/wt/odlux/framework/src/views/about.tsx
+++ b/sdnr/wt/odlux/framework/src/views/about.tsx
@@ -15,17 +15,68 @@
  * the License.
  * ============LICENSE_END==========================================================================
  */
-import * as React from 'react';

-

-const AboutComponent = () => {

-

-  return (

-    <div>

-      <h2>About</h2>

-      <div style={{ margin: "0 auto" }}>##odlux.version##</div>

-    </div>

-  );

-};

-

-export const About = AboutComponent;

+import * as React from 'react';
+import * as marked from 'marked';
+import * as hljs from 'highlight.js';
+import { requestRestExt } from '../services/restService';
+const defaultRenderer = new marked.Renderer();
+defaultRenderer.link = (href, title, text) => (
+  `<a target="_blank" rel="noopener noreferrer" href="${href}" title="${title}">${text}</a>`
+);
+interface AboutState {
+  content: string | null;
+}
+
+class AboutComponent extends React.Component<any, AboutState> {
+
+
+  constructor(props: any) {
+    super(props);
+    this.state = { content: null }
+    this.loadAboutContent();
+  }
+  private loadAboutContent(): void {
+    requestRestExt<string>('/about').then((response) => {
+      this.setState({ content: response.status == 200 ? response.data : `${response.status} ${response.message}` || "Server error" })
+    }).catch((error) => {
+      this.setState({ content: error })
+    })
+  }
+  render() {
+
+    const markedOptions: marked.MarkedOptions = {
+      gfm: true,
+      breaks: false,
+      pedantic: false,
+      sanitize: true,
+      smartLists: true,
+      smartypants: false,
+      langPrefix: 'hljs ',
+      ...({}),
+      highlight: (code, lang) => {
+        if (!!(lang && hljs.getLanguage(lang))) {
+          return hljs.highlight(lang, code).value;
+        }
+        return code;
+      }
+    };
+
+
+    const className = "about-table"
+    const style: React.CSSProperties = {};
+
+    const html = (marked(this.state.content || 'loading', { renderer: markedOptions && markedOptions.renderer || defaultRenderer }));
+
+    return (
+      <div
+        dangerouslySetInnerHTML={{ __html: html }}
+        className={className}
+        style={style}
+      />
+
+    );
+  }
+};
+
+export const About = AboutComponent;
 export default About;
\ No newline at end of file