created a new service for search, implemented directmessages in searc…

…h and fixed some bugs
Kakar21 · Sep 9, 2024 · 40fa6de · 40fa6de
1 parent f1854ea
commit 40fa6de
Show file tree

Hide file tree

Showing 9 changed files with 266 additions and 62 deletions.
diff --git a/src/app/main/chat/chat.service.ts b/src/app/main/chat/chat.service.ts
@@ -56,7 +56,7 @@ export class ChatService {
 
     constructor(
         public firestore: FirestoreService,
-        public currentUser: CurrentuserService,
+        public currentUser: CurrentuserService
     ) {
         this.subUsersList();
         this.subChannelsList();
@@ -464,51 +464,5 @@ export class ChatService {
             this.mobileOpen = "directmessage";
         }
     }
-
-    searchMessagesAndChannels(query: string): SearchResult[] {
-        const results: SearchResult[] = [];
-
-        // Channels durchsuchen
-        this.channelsList.forEach(channel => {
-            const messages = channel.channelData.messages 
-                ? Array.from(channel.channelData.messages.values()).filter(message => {
-                    return message.message.toLowerCase().includes(query.toLowerCase());
-                }) 
-                : [];
-
-            messages.forEach(message => {
-                results.push({
-                    type: 'channel',
-                    id: message.id,
-                    name: channel.channelData.name,  // Channel-Name
-                    avatar: message.avatar,
-                    message: message.message,  // Nachricht
-                    channelName: channel.channelData.name,
-                    channelID: channel.id
-                });
-            });
-        });
-
-        // Direct Messages durchsuchen
-        Object.values(this.allMessages).forEach((userMessages: Message[]) => {
-            const matchingMessages = userMessages.filter(message => {
-                return message.message.toLowerCase().includes(query.toLowerCase());
-            });
-
-            matchingMessages.forEach(message => {
-                results.push({
-                    type: 'user',
-                    id: message.id,
-                    name: message.name,  // Benutzername
-                    avatar: message.avatar,
-                    message: message.message,  // Nachricht
-                    userID: message.id
-                });
-            });
-        });
-
-        return results;
-    }
-
 
 }
diff --git a/src/app/main/chat/direct-message/direct-message.component.html b/src/app/main/chat/direct-message/direct-message.component.html
@@ -187,7 +187,7 @@ <h1>{{ chatService.selectedUser.name }}</h1>
                     </button>
                 </div>
             </div>
-            <mat-autocomplete #auto="matAutocomplete" (optionSelected)="selected($event)">
+            <mat-autocomplete class="directmessage-mention-autocomplete" #auto="matAutocomplete" (optionSelected)="selected($event)">
                 <mat-option *ngFor="let option of filteredMembers | async" [value]="option.name">
                     @if (option.avatar && option.avatar.length > 1) {
                     <img src="{{ option.avatar }}" />

diff --git a/src/app/main/chat/direct-message/direct-message.component.scss b/src/app/main/chat/direct-message/direct-message.component.scss
@@ -689,7 +689,7 @@
     }
 }
 
-::ng-deep::ng-deep div.mat-mdc-autocomplete-panel {
+::ng-deep::ng-deep div.directmessage-mention-autocomplete {
     width: unset !important;
     display: flex !important;
     padding: 1.25rem 1.3125rem !important;

diff --git a/src/app/main/chat/direct-message/directmessage.service.ts b/src/app/main/chat/direct-message/directmessage.service.ts
@@ -182,36 +182,49 @@ export class DirectmessageService {
 
 
     getAllMessages() {
-        this.allMessages = {};
-
+        this.allMessages = {};  // Leere das Nachrichten-Objekt
+
+        // Durchlaufe alle Benutzer aus der usersList
         this.chat.usersList.forEach((user) => {
+            // Erstelle einen eindeutigen Chat-Pfad basierend auf den Benutzer-IDs
+            const chatId = this.currentUser.currentUser.id < user.id
+                ? `${this.currentUser.currentUser.id}_${user.id}`
+                : `${user.id}_${this.currentUser.currentUser.id}`;
+
             const potentialCollectionRef = collection(
                 this.firestore,
-                `users/${this.currentUser.currentUser.id}/${user.id}`,
+                `directmessages/${chatId}/messages`
             );
+
+            // Sortiere die Nachrichten nach dem Zeitstempel
             const messagesQuery = query(
                 potentialCollectionRef,
-                orderBy("time"),
+                orderBy("time")
             );
-
+
+            // Setze einen Echtzeitlistener für die Nachrichten
             onSnapshot(messagesQuery, (messagesSnapshot) => {
                 if (!messagesSnapshot.empty) {
+                    // Stelle sicher, dass das Nachrichten-Objekt für diesen Benutzer existiert
                     if (!this.allMessages[user.id]) {
                         this.allMessages[user.id] = {};
                     }
-
+
+                    // Durchlaufe die Nachrichten und speichere sie in allMessages
                     messagesSnapshot.forEach((messageDoc) => {
                         const messageData = messageDoc.data() as Message;
-
+
+                        // Speichere die Nachricht mit der ID des Dokuments
                         this.allMessages[user.id][messageDoc.id] = {
                             ...messageData,
-                            id: messageDoc.id,
+                            id: messageDoc.id,  // Füge die ID der Nachricht hinzu
                         };
                     });
                 }
             });
         });
     }
+
 
     async updateMessage(sendedUserID: string, messageId: string, newContent: string): Promise<void> {
         // Pfad zur spezifischen Nachricht in der Unterkollektion

diff --git a/src/app/main/header/header.component.html b/src/app/main/header/header.component.html
@@ -33,7 +33,7 @@
             <mat-option class="search-no-results" *ngIf="(filteredResults | async)?.length === 0" disabled>
                 <span>Keine Ergebnisse gefunden</span>
             </mat-option>
-            <ng-container class="hallo" *ngFor="let option of filteredResults | async">
+            <ng-container *ngFor="let option of filteredResults | async">
                 <mat-option class="search-option" *ngIf="option.type === 'user'" [value]="option">
                     @if (option.avatar && option.avatar.length > 1) {
                         <img src="{{ option.avatar }}" />
@@ -50,7 +50,15 @@ <h3>{{ option.name }}</h3>
                     </div>
                 </mat-option>
                 <mat-option class="search-option" *ngIf="option.type === 'channel'" [value]="option">
-                    <img src="../../../assets/img/icons/tag.svg" />
+                    @if (option.avatar && option.avatar.length > 1) {
+                        <img src="{{ option.avatar }}" />
+                    } @else {
+                        <img
+                            src="../../assets/img/avatar/{{
+                                option.avatar
+                            }}.svg"
+                        />
+                    }
                     <div>
                         <h3>{{ option.name }}</h3>
                         <p>{{ option.message }}</p>

diff --git a/src/app/main/header/header.component.scss b/src/app/main/header/header.component.scss
@@ -125,7 +125,7 @@
 
     &:hover {
         cursor: pointer;
-        background-color: var(--bg-color);
+        background-color: var(--bg-color) !important;
     }
 }
 

diff --git a/src/app/main/header/header.component.ts b/src/app/main/header/header.component.ts
@@ -37,6 +37,7 @@ import { SearchResult } from "../../interfaces/search-result";
 import { debounceTime, distinctUntilChanged } from "rxjs/operators";
 import { of } from 'rxjs';
 import { ChatComponent } from "../chat/chat.component";
+import { SearchService } from "./search.service";
 
 @Component({
     selector: "app-header",
@@ -73,6 +74,7 @@ export class HeaderComponent {
         private chatService: ChatService,
         private _bottomSheet: MatBottomSheet,
         public DMService: DirectmessageService,
+        private searchService: SearchService
     ) {
         // Hier wird der SearchResult-Stream initialisiert
 
@@ -81,14 +83,19 @@ export class HeaderComponent {
             distinctUntilChanged(),  // Ignoriert gleiche Eingaben hintereinander
             switchMap((query) => {
                 if (typeof query === 'string' && query.trim() !== '') {
-                    return of(this.chatService.searchMessagesAndChannels(query));
+                    return of(searchService.searchMessagesAndChannels(query));
                 } else {
                     return of([]);
                 }
             })
         );
     }
 
+  ngOnInit() {
+        this.searchService.loadAllChannels();
+        this.searchService.loadAllDirectmessages();
+      }
+
     openDialog(event: MouseEvent): void {
         // Sicherstellen, dass event.target tatsächlich ein Element ist.
         let element = event.target as Element | null;
@@ -127,7 +134,8 @@ export class HeaderComponent {
     }
 
     log() {
-        console.log(this.getChannelMessages());
+        console.log(this.searchService.allChannelMessages);
+        console.log(this.searchService.allDirectMessages);
     }
 
     openBottomSheet(): void {

diff --git a/src/app/main/header/search.service.spec.ts b/src/app/main/header/search.service.spec.ts
@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { SearchService } from './search.service';
+
+describe('SearchService', () => {
+  let service: SearchService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(SearchService);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});