feat: user name with target

src/modules/contact/session/session.module.ts

@@ -5,13 +5,15 @@ import { FormsModule } from '@angular/forms';
 import { SessionPage } from './session.page';
 
 import { SessionPageRoutingModule } from './session-routing.module';
+import { UserNamePipe } from '../user-name.pipe';
 
 @NgModule({
   imports: [
     IonicModule,
     CommonModule,
     FormsModule,
-    SessionPageRoutingModule
+    SessionPageRoutingModule,
+    UserNamePipe,
   ],
   declarations: [SessionPage]
 })

src/modules/contact/session/session.page.html

@@ -14,23 +14,23 @@
         <img [src]="'/assets/img/clock.png'">
       </ion-avatar>
       <ion-label>
-        <h2>111</h2>
-        <p>111</p>
-        <p>11</p>
+        <h2>{{targetUser(session) | userName}}</h2>
+        <p>{{session?.get('message')?.get("contentJson")?.content}}</p>
+        <p>{{session?.createdAt | date:"MM-dd HH:mm"}}</p>
       </ion-label>
     </ion-item>
   </ion-list>
 
 
-  <ion-list lines="full">
-    <ion-item *ngFor="let contact of contacts" (click)="openChat(contact)">
+  <ion-list lines="full" *ngIf="!sessionList?.length">
+    <ion-item *ngFor="let item of skeletonList">
       <ion-avatar slot="start">
-        <img [src]="contact.avatar">
+        <img [src]="item.avatar">
       </ion-avatar>
       <ion-label>
-        <h2>{{ contact.username }}</h2>
-        <p>{{ contact.lastMessageTime }}</p>
-        <p>{{ contact.lastMessage }}</p>
+        <h2>{{ item.username }}</h2>
+        <p>{{ item.lastMessageTime }}</p>
+        <p>{{ item.lastMessage }}</p>
       </ion-label>
     </ion-item>
   </ion-list>

src/modules/contact/session/session.page.ts

@@ -8,7 +8,7 @@ import Parse from "parse";
   styleUrls: ['session.page.scss']
 })
 export class SessionPage {
-  contacts: { username: string, avatar: string, lastMessageTime: string, lastMessage: string }[] = [
+  skeletonList: { username: string, avatar: string, lastMessageTime: string, lastMessage: string }[] = [
     {
       username: 'Alice',
       avatar: '/assets/img/female.png',
@@ -21,18 +21,23 @@ export class SessionPage {
       lastMessageTime: 'Yesterday',
       lastMessage: 'Let\'s meet tomorrow.',
     },
-    // Add more contacts as needed
   ];
 
   constructor(private navCtrl: NavController) {
-    console.log("start loadSessions")
     this.loadSessions()
   }
 
-  openChat(contact: { username: string, avatar: string, lastMessageTime: string, lastMessage: string }) {
-    this.navCtrl.navigateForward(`/contact/chat/${contact.username}`);
+  targetUser(session:Parse.Object){
+    let user = Parse.User.current();
+    let target = null
+    if(session?.get("sendUser")?.id==user?.id){
+      target = session?.get("receiveUser")
+    }
+    if(session?.get("receiveUser")?.id==user?.id){
+      target = session?.get("sendUser")
+    }
+    return target
   }
-
   goSession(session:Parse.Object){
     let user = Parse.User.current();
     if(session?.get("sendUser")?.id==user?.id){
@@ -56,7 +61,7 @@ export class SessionPage {
         }
       ]
     }})
-    query.include("sendUser","sendUser");
+    query.include("sendUser","receiveUser");
     this.sessionList = await query.find();
   }
 

src/modules/contact/user-name.pipe.spec.ts

@@ -0,0 +1,8 @@
+import { UserNamePipe } from './user-name.pipe';
+
+describe('UserNamePipe', () => {
+  it('create an instance', () => {
+    const pipe = new UserNamePipe();
+    expect(pipe).toBeTruthy();
+  });
+});

src/modules/contact/user-name.pipe.ts

@@ -0,0 +1,19 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+  name: 'userName',
+  pure:true,
+  standalone: true
+})
+export class UserNamePipe implements PipeTransform {
+
+  transform(user: Parse.Object, ...args: unknown[]): unknown {
+    let nickname = user?.get("nickname");
+    let username = user?.get("username");
+    let name = user?.get("name");
+    let mobile = user?.get("mobile");
+    console.log(user?.toJSON())
+    return nickname || name || mobile  || username;
+  }
+
+}