Changed search socket code to receive videos in batches

src/app/pages/search/search.component.ts

@@ -31,29 +31,42 @@ export class SearchComponent implements OnInit {
 
   performSearch(query: string): void {
     this.searching = true;
-    const ws: WebSocketSubject<any> = webSocket<any>(`ws://192.168.0.100:8190/search?q=${query}`);
+    const ws: WebSocketSubject<string> = webSocket<any>({
+      url: `ws://192.168.0.100:8190/search?q=${query}`,
+      deserializer: (e) => e.data,
+      serializer: (value) => value,
+    });
 
     ws.pipe(
-      map((event: any) => {
-        // Mapping to video
-        const video: any = event;
-        const title = video?.filename?.split('/').pop().replace('.mp4', '') ?? 'Unknown title';
-        return { title: title, filepath: video.filename } as Video;
+      map((event: string) => {
+        // Mapping to an array of videos
+        const msgReceived: string = event;
+        const msgs = msgReceived.split('\n');
+        let videos: Video[] = [];
+        msgs.forEach(msg => {
+          if (msg) {
+            const video = JSON.parse(msg);
+            const title = video?.filename?.split('/').pop().replace('.mp4', '') ?? 'Unknown title';
+            videos.push({ title: title, filepath: video.filename } as Video);
+          }
+        });
+
+        return videos;        
       })
     ).subscribe({
-      next: video => {
-        if (video) {
-          this.foundVideos.unshift(video);
+      next: videos => {
+        if (videos) {
+          videos.forEach(video => this.foundVideos.unshift(video));
         }
       },
       error: err => {
         if (err instanceof CloseEvent) {
-          console.log('WebSocket closed');
-          this.searching = false;
+          console.log('WebSocket closed', err);
         }
         else {
           console.error('Error on the socket', err);
         }
+        this.searching = false;
       }
     });
   }