diff --git a/projects/v3/src/app/pages/chat/chat-room/chat-room.component.html b/projects/v3/src/app/pages/chat/chat-room/chat-room.component.html
index 0d589f6bb..f0f6ad587 100644
--- a/projects/v3/src/app/pages/chat/chat-room/chat-room.component.html
+++ b/projects/v3/src/app/pages/chat/chat-room/chat-room.component.html
@@ -59,13 +59,13 @@
             <p class="seen-text caption gray-2">{{ utils.getUserRolesForUI(message.senderRole) }}</p>
           </ng-container>
 
-          <ng-container *ngIf="message.message || !message.fileObject;">
+          <ng-container *ngIf="message.message || !message.fileObject">
             <!-- Quill read only view/ use to render html content -->
-            <quill-view id="message-content"
-              [content]="message.message"
-              [strict]="true"
+            <quill-view-html id="message-content"
+              [content]="message?.message"
+              [sanitize]="true"
               tabindex="0"
-            ></quill-view>
+            ></quill-view-html>
           </ng-container>
 
           <ng-container *ngIf="message.fileObject">
@@ -139,12 +139,12 @@
   </ng-container>
 </ion-content>
 
-<ion-footer *ngIf="!chatChannel.readonly && !chatChannel.isAnnouncement" class="footer" [ngClass]="{'ion-footer-absolute': !isMobile, 'attach-preview': (selectedAttachments.length > 0 && !isMobile)}">
-  <div *ngIf="whoIsTyping" style="position: absolute;
-    z-index: 9999;
-    top: -2em;
-    margin: 0 1em;
-    width: 100%;">
+<ion-footer *ngIf="!chatChannel.readonly && !chatChannel.isAnnouncement" class="footer"
+  [ngClass]="{'ion-footer-absolute': !isMobile, 'attach-preview': (selectedAttachments.length > 0 && !isMobile)}"
+>
+  <div *ngIf="whoIsTyping"
+    style="position: absolute; z-index: 9999; top: -2em; margin: 0 1em; width: 100%;"
+  >
     <ion-label class="received-messages no-avatar" color="medium">
       <p class="message-typing">
         <i>{{ whoIsTyping }}</i>
@@ -160,6 +160,8 @@
           customToolbarPosition="top"
           [modules]="editorModules"
           [classes]="isMobile ? 'editor-class' : 'editor-class desktop'"
+          [preserveWhitespace]="false"
+          [trimOnValidation]="true"
           [required]="true"
           class="message-text-editor"
           placeholder="Enter your message"
diff --git a/projects/v3/src/app/pages/chat/chat-room/chat-room.component.ts b/projects/v3/src/app/pages/chat/chat-room/chat-room.component.ts
index 725ac1938..015898e89 100644
--- a/projects/v3/src/app/pages/chat/chat-room/chat-room.component.ts
+++ b/projects/v3/src/app/pages/chat/chat-room/chat-room.component.ts
@@ -12,8 +12,8 @@ import { ChatInfoComponent } from '../chat-info/chat-info.component';
 import { AttachmentPopoverComponent } from '../attachment-popover/attachment-popover.component';
 import { Subject, timer } from 'rxjs';
 import { debounceTime, switchMap, takeUntil, tap } from 'rxjs/operators';
-import { debounce } from 'lodash';
 import { DomSanitizer } from '@angular/platform-browser';
+import { QuillModules } from 'ngx-quill';
 
 
 enum ScrollPosition {
@@ -73,7 +73,7 @@ export class ChatRoomComponent implements OnInit, OnDestroy, AfterViewInit {
 
   // quill editor modules
   private isMatcherApplied = false;
-  editorModules = {
+  editorModules: QuillModules = {
     magicUrl: {
       globalRegularExpression: /(https?:\/\/|www\.)[\S]+/g,
       urlRegularExpression: /(https?:\/\/[\S]+)|(www.[\S]+)/g,