import { useEffect, useState } from "react";
function UsersList() {
const [users, setUsers] = useState([]);
const [search, setSearch] = useState("");
useEffect(() => {
fetch("https://api.example.com/users")
.then((res) => res.json())
.then((data) => {
setUsers(data);
});
});
const filteredUsers = users.filter((user) => {
return user.name.toLowerCase().includes(search.toLowerCase());
});
return (
<div>
<h2>Users</h2>
<input
placeholder="Search users"
value={search}
onChange={(e) => setSearch(e.target.value)}
/>
{filteredUsers.map((user) => (
<div>
<h3>{user.name}</h3>
<p>{user.email}</p>
</div>
))}
</div>
);
}
export default UsersList;