refactor: replace ngx-filter-pipe dependency

package.json

@@ -68,7 +68,6 @@
         "material-icons": "0.3.1",
         "moment": "2.29.4",
         "nedb-promises": "6.0.3",
-        "ngx-filter-pipe": "2.1.2",
         "ngx-indexed-db": "9.4.2",
         "ngx-whats-new": "0.3.0",
         "rxjs": "7.5.6",

src/app/player/components/channel-list-container/channel-list-container.component.html

@@ -22,7 +22,8 @@
             <cdk-virtual-scroll-viewport itemSize="50" class="scroll-viewport">
                 <mat-list-item
                     *cdkVirtualFor="
-                        let channel of _channelList | filterBy: searchTerm;
+                        let channel of _channelList
+                            | filterBy: searchTerm.name:'name';
                         index as i;
                         trackBy: trackByFn
                     "

src/app/player/components/channel-list-container/channel-list-container.component.spec.ts

@@ -12,10 +12,10 @@ import { By } from '@angular/platform-browser';
 import { RouterTestingModule } from '@angular/router/testing';
 import { TranslatePipe } from '@ngx-translate/core';
 import { MockModule, MockPipes } from 'ng-mocks';
-import { FilterPipe } from 'ngx-filter-pipe';
 import * as MOCKED_PLAYLIST from '../../../../mocks/playlist.json';
 import { DataService } from '../../../services/data.service';
 import { ElectronServiceStub } from '../../../services/electron.service.stub';
+import { FilterPipe } from '../../../shared/pipes/filter.pipe';
 import { createChannel } from '../../../state';
 import { ChannelQuery } from '../../../state/channel.query';
 import { ChannelStore } from '../../../state/channel.store';

src/app/shared/pipes/filter.pipe.ts

@@ -0,0 +1,16 @@
+import { Injectable, Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+    name: 'filterBy',
+})
+@Injectable()
+export class FilterPipe implements PipeTransform {
+    transform(array: any[], filter: string, property: string): any {
+        if (!array || !filter) {
+            return array;
+        }
+        return array.filter((item) =>
+            item[property].toLowerCase().includes(filter.toLowerCase())
+        );
+    }
+}

src/app/shared/shared.module.ts

@@ -4,7 +4,6 @@ import { NgModule } from '@angular/core';
 import { FlexLayoutModule } from '@angular/flex-layout';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { TranslateModule } from '@ngx-translate/core';
-import { FilterPipeModule } from 'ngx-filter-pipe';
 import { NgxWhatsNewModule } from 'ngx-whats-new';
 import { PlaylistItemComponent } from '../home/recent-playlists/playlist-item/playlist-item.component';
 import { RecentPlaylistsComponent } from '../home/recent-playlists/recent-playlists.component';
@@ -12,10 +11,12 @@ import { MaterialModule } from '../material.module';
 import { HeaderComponent } from './components/';
 import { AboutDialogComponent } from './components/about-dialog/about-dialog.component';
 import { ConfirmDialogComponent } from './components/confirm-dialog/confirm-dialog.component';
+import { FilterPipe } from './pipes/filter.pipe';
 import { MomentDatePipe } from './pipes/moment-date.pipe';
 @NgModule({
     declarations: [
         ConfirmDialogComponent,
+        FilterPipe,
         HeaderComponent,
         MomentDatePipe,
         AboutDialogComponent,
@@ -24,7 +25,6 @@ import { MomentDatePipe } from './pipes/moment-date.pipe';
     ],
     imports: [
         CommonModule,
-        FilterPipeModule,
         FlexLayoutModule,
         FormsModule,
         MaterialModule,
@@ -35,7 +35,7 @@ import { MomentDatePipe } from './pipes/moment-date.pipe';
     ],
     exports: [
         ConfirmDialogComponent,
-        FilterPipeModule,
+        FilterPipe,
         FlexLayoutModule,
         FormsModule,
         HeaderComponent,