feat: add search for podcasts list

src/pages/home.tsx

@@ -1,14 +1,29 @@
 import { PodcastPreviewCard } from "../components/podcast-preview-card";
 import { podcastsService } from "../services/podcasts/podcasts.service";
 import { useQuery } from "../hooks/useQuery";
+import { useState } from "react";
 
 export function Home() {
   const { data } = useQuery(() => podcastsService.getTopPodcasts());
+  const [search, setSearch] = useState("");
+
+  const filteredData = data?.filter((podcast) => {
+    return (
+      podcast.title.toLowerCase().includes(search.toLowerCase()) ||
+      podcast.author.toLowerCase().includes(search.toLowerCase())
+    );
+  });
 
   return (
     <main>
+      <input
+        type="text"
+        value={search}
+        onChange={(e) => setSearch(e.target.value)}
+        placeholder="Search..."
+      />
       <div className={"grid grid-cols-4"}>
-        {data?.map((podcast) => (
+        {filteredData?.map((podcast) => (
           <PodcastPreviewCard
             detailUrl={`/podcast/${podcast.id}`}
             key={podcast.id}

todo.md

@@ -18,8 +18,8 @@
 
   - [x] Shows a list of 100 most popular podcasts from iTunes
   - [ ] Caches the list for 24 hours
-  - [ ] Has filtering by name and author
+  - [x] Has filtering by name and author
-  - [ ] Filters are applied in real time
+  - [x] Filters are applied in real time
   - [x] Clicking on a podcast navigates to the podcast page
 
 - [ ] Podcast