Chat data saved on localstorage

src/app/pages/chat/messages/messages.page.ts

@@ -1,6 +1,6 @@
 import { AfterViewChecked, AfterViewInit, ChangeDetectorRef, Component, ElementRef, OnDestroy, OnInit, ViewChild } from '@angular/core';
 import {ActivatedRoute, Router} from '@angular/router'
-import { GestureController, Gesture, ModalController, NavParams, PopoverController, IonSlides } from '@ionic/angular';
+import { GestureController, Gesture, ModalController, NavParams, PopoverController, IonSlides, Platform } from '@ionic/angular';
 import { map } from 'rxjs/operators';
 import { ViewDocumentPage } from 'src/app/modals/view-document/view-document.page';
 import { EventPerson } from 'src/app/models/eventperson.model';
@@ -24,6 +24,8 @@ import { Filesystem, Directory, Encoding } from '@capacitor/filesystem';
 import { VoiceRecorder, VoiceRecorderPlugin, RecordingData, GenericResponse, CurrentRecordingStatus } from 'capacitor-voice-recorder';
 import { Haptics, ImpactStyle } from '@capacitor/haptics';
 import { PreviewCameraPage } from 'src/app/modals/preview-camera/preview-camera.page';
+import { SqliteService } from 'src/app/services/sqlite.service';
+import { elementAt } from 'rxjs-compat/operator/elementAt';
 
 const IMAGE_DIR = 'stored-images';
 
@@ -89,9 +91,12 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
     private processes: ProcessesService,
     public ThemeService: ThemeService,
     private changeDetectorRef: ChangeDetectorRef,
+    private platform: Platform,
+    private sqlservice: SqliteService
   ) {
     this.loggedUser = authService.ValidatedUserChat['data'];
     this.roomId = this.navParams.get('roomId');
+    console.log('ROOM ID', this.roomId)
 
     window.onresize = (event) => {
       if( window.innerWidth > 701){
@@ -111,6 +116,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
       directory: Directory.Data,
       recursive: true
     });
+    this.getRoomMessageDB(this.roomId);
   }
 
   ngAfterViewInit() {
@@ -544,6 +550,71 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
     });
   }
 
+  getRoomMessageDB(roomId) {
+    if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
+    } else {
+      this.sqlservice.getAllChatMSG(roomId).then((msg: any) => {
+        let chatmsgArray = [];
+        let array = []
+        msg.forEach(element => {
+          console.log('CHANNEL ELEMENT',element.channels)
+
+          let msgChat = {
+          _id: element.Id,
+          attachments: this.isJson(element.Attachments), 
+          channels: this.isJson(element.Channels),
+          file: this.isJson(element.File),
+          mentions: this.isJson(element.Mentions),
+          msg: element.Msg,
+          rid: element.Rid,
+          ts: element.Ts,
+          u: this.isJson(element.U),
+          _updatedAt: element.UpdatedAt
+          }
+
+          chatmsgArray.push(msgChat)
+        });
+
+        this.messages = chatmsgArray.reverse();
+        console.log('CHAT MSG FROM DB', chatmsgArray)
+      })
+    }
+  }
+
+  isJson(str) {
+    try {
+        JSON.parse(str);
+    } catch (e) {
+        return "";
+    }
+    return JSON.parse(str);
+}
+
+
+
+  transformDataMSG(res) {
+    if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
+    } else {
+      res.forEach(element => {
+        let chatmsg = {
+          _id: element._id,
+          attachments: element.attachments,
+          channels: element.channels,
+          file: element.file,
+          mentions: element.mentions,
+          msg: element.msg,
+          rid: element.rid,
+          ts: element.ts,
+          u: element.u,
+          _updatedAt: element._updatedAt
+        }
+
+        this.sqlservice.addChatMSG(chatmsg)
+      });
+    }
+    
+  }
+
   async serverLongPull() {
 
     const roomId = this.roomId
@@ -557,6 +628,9 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
     this.chatService.getRoomMessages(roomId).subscribe(async res => {
       console.log("Chat message",res)
 
+       this.transformDataMSG(res['messages'])
+      this.getRoomMessageDB(this.roomId);
+
 
     if (res == 502) {
       // Connection timeout
@@ -568,8 +642,8 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
       // Show Error
       //showMessage(response.statusText);
       //this.loadMessages()
-      this.messages = res['messages'].reverse();
-      this.chatMessageStore.add(roomId, this.messages)
+      //this.messages = res['messages'].reverse();
+      //this.chatMessageStore.add(roomId, this.messages)
 
       //console.log(this.messages);
       // Reconnect in one second