Course work with JavaScript

import { useQuery } from '@tanstack/react-query';
import { fetchUsers } from '../services/api';

interface User {
  id: number;
  name: string;
  email: string;
}

export const UserList = () => {
  const { data: users, isLoading, error } = useQuery({
    queryKey: ['users'],
    queryFn: fetchUsers,
  });

  if (isLoading) return <Spinner />;
  if (error) return <ErrorMessage error={error} />;

  return (
    <ul className="user-list">
      {users?.map((user: User) => (
        <li key={user.id}>
          <span>{user.name}</span>
          <span>{user.email}</span>
        </li>
      ))}
    </ul>
  );
};