Викторина: Список не фильтруется

1import { useState } from "react";
2
3const bands = [
4    { id: 1, name: "Ночные поезда" },
5    { id: 2, name: "Лунные коты" },
6    { id: 3, name: "Совиный хор" },
7];
8
9export default function App() {
10    const [search, setSearch] = useState("");
11    const [shownBands] = useState(bands.filter((band) => band.name.includes(search)));
12
13    return (
14        <main>
15            <h1>Летние звуки</h1>
16            <input
17                value={search}
18                onChange={(event) => setSearch(event.target.value)}
19            />
20            <ul>
21                {shownBands.map((band) => (
22                    <li key={band.id}>{band.name}</li>
23                ))}
24            </ul>
25        </main>
26    );
27}