import React from 'react';

type Props = {
  title: string;
  children?: React.ReactNode;
};

const ListHeader: React.FC<Props> = ({ title, children }) => (
  <div className="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4 sm:gap-2 mb-6 w-full">
    <h1 className="text-gray-800 font-bold text-xl sm:text-2xl">{title}</h1>
    <div className="flex flex-wrap items-center gap-2 w-full sm:w-auto">{children}</div>
  </div>
);

export default ListHeader;
