Stop filtering JS code in bot messages

src/app/app.module.ts

@@ -17,7 +17,7 @@ import { TerminalComponent } from './terminal/terminal.component';
 import { AppRoutingModule } from './app-routing.module';
 import { TestmessengerComponent } from './testmessenger/testmessenger.component';
 import { DeploymentNotificationService } from './services/deployment-notification.service';
-import { SafePipe } from './pipes/safe.pipe';
+import { SafePipe, SafeHtmlPipe } from './pipes/safe.pipe';
 import { ConsoleComponent } from './console/console.component';
 import { MonacoEditorModule } from 'ngx-monaco-editor';
 import {
@@ -41,6 +41,7 @@ import { LoaderComponent } from './loader/loader.component';
     DashboardComponent,
     TestmessengerComponent,
     SafePipe,
+    SafeHtmlPipe,
     ConsoleComponent,
     LoaderComponent
   ],

src/app/ide/ide.component.scss

@@ -75,7 +75,8 @@
 
     .loader {
       border-radius: 50%;
-      border: 2px solid;
+      border: 2px solid $tao-warm-yellow-600;
+      border-top: 2px solid $tao-warm-yellow-200;
       width: 15px;
       height: 15px;
       animation: spin 2s linear infinite;

src/app/ide/language-map.ts

@@ -30,5 +30,7 @@ export const LanguageMap: { [extension: string]: string; } = {
     css: 'css',
     less: 'less',
     scss: 'scss',
-    sh: 'shell'
+    sh: 'shell',
+    kt: 'kotlin',
+    kts: 'kotlin'
 };

src/app/message-types/bot-messages.ts

@@ -4,6 +4,7 @@ export interface MessageData {
   originator?: string;
   timestamp?: Date;
   typing?: boolean;
+  command?: any;
   message: string;
 }
 

src/app/messages/messages.component.html

@@ -1,15 +1,18 @@
 <div class="tfw-messages-main">
   <div class="tfw-grid-message"
        *ngFor="let message of messages.slice(); let last = last"
-       [class.highlighted-message]="last">
+       [class.highlighted-message]="last"
+       (click)="sendMessageCommand(message)">
     <div class="tfw-grid-message-header">
       <img class="tao-grid-center-left" src="images/avataobot.svg"/>
       <div class="tao-grid-center-left originator">{{message.originator}}</div>
       <div class="timestamp tao-grid-center-right">{{message.timestamp | date:'HH:mm:ss'}}</div>
     </div>
-    <div class="tfw-grid-message-body" [innerHtml]="message.message"></div>
+    <div class="tfw-grid-message-body" [innerHtml]="message.message | safeHtml"></div>
   </div>
-  <div *ngIf="showTypingIndicator" class="tfw-grid-message jumping-circle-container">
+  <div *ngIf="showTypingIndicator" 
+        class="tfw-grid-message jumping-circle-container"
+        (click)="drainMessageQueue()">
     <div class="jumping-circle" id="jc1"></div>
     <div class="jumping-circle" id="jc2"></div>
     <div class="jumping-circle" id="jc3"></div>

src/app/messages/messages.component.ts

@@ -59,4 +59,16 @@ export class MessagesComponent implements OnInit {
   convertMarkdownToHTML(text: string) {
     return this.markdownService.convertToHtml(text);
   }
+
+  drainMessageQueue() {
+    this.websocketService.send({
+      'key': 'message.queue.drain'
+    });
+  }
+
+  sendMessageCommand(message: MessageData) {
+    if ('command' in message) {
+      this.websocketService.send(message.command);
+    }
+  }
 }

src/app/pipes/safe.pipe.ts

@@ -11,3 +11,14 @@ export class SafePipe implements PipeTransform {
     return this.sanitizer.bypassSecurityTrustResourceUrl(value);
   }
 }
+
+@Pipe({
+  name: 'safeHtml'
+})
+export class SafeHtmlPipe implements PipeTransform  {
+  constructor(private sanitized: DomSanitizer) {}
+
+  transform(value) {
+    return this.sanitized.bypassSecurityTrustHtml(value);
+  }
+}

src/app/services/config.service.ts

@@ -9,7 +9,7 @@ export class DashboardConfigService extends ConfigServiceBase {
 
   layout = new BehaviorSubject<string>('terminal-ide-web');
   hideMessages = new BehaviorSubject<boolean>(false);
-  iframeUrl = new BehaviorSubject<string>('/webservice');
+  iframeUrl = new BehaviorSubject<string>('');
   showUrlBar = new BehaviorSubject<boolean>(false);
   terminalMenuItem = new BehaviorSubject<string>('terminal');
   reloadIframeOnDeploy = new BehaviorSubject<boolean>(false);