Input search filtering api Angular

I am fetching my data from api in service. Now i have to do input search filter by name.

Here is my code Service:

export class ListService {
      listUrl = 'https://swapi.co/api/planets';
      constructor(private http: HttpClient) {}

      getList(): Observable<Dummy> {
        return this.http.get<Dummy>(this.listUrl);
      }
    }

Main Component:

 export class MainComponent implements OnInit {
      public planetList: Planet[] = [];

      constructor(private listService: ListService) {}

      ngOnInit() {
        this.listService.getList().subscribe(list => {
          this.planetList = list.results;
        });
      }
onSearchValueChanges(inputElement: HTMLInputElement) {}

Main Component HTML:

<input
      #searchInput
      type="text"
      (keyup)="onSearchValueChanges(searchInput)"
      placeholder="Search"
    />
    <app-list [planetsList]="planetList"></app-list>

List Component:

    export class ListComponent implements OnChanges{
      @Input() planetsList: Planet[] = [];

    ngOnChanges() {
     console.log(this.planetsList)
    }
   }

Is the best option to filter this.planetlist array in Main Component? Or maybe should I use RxJS filter? If so how to do it?

Thanks for answers in advance!