import { User } from "../types";
import { UserIcon } from "../images";

export function Users(props: React.PropsWithChildren<{ users: User[] }>) {
  return (
    <div className="p-5 bg-white">
      <div className="flex flex-row items-center gap-8">
        {props.users.map((user) => (
          <div
            key={user?.id}
            className="flex w-60 flex-col items-center border border-gql-vis-grey-2 p-5 rounded-lg shadow"
          >
            <img className="w-28 m-5" src={UserIcon} alt="logo" />
            <p>{user?.email}</p>
          </div>
        ))}
      </div>
    </div>
  );
}
