import type { MainSidebarHeaderCenterProps } from '../types';

const WhatsappMainSidebarHeaderCenter = ({
  searchActive,
  search,
  onSearchChange,
  onSearchBlur,
}: MainSidebarHeaderCenterProps) => {
  if (searchActive) {
    return (
      <input
        autoFocus
        value={search}
        onChange={(e) => onSearchChange(e.target.value)}
        onBlur={onSearchBlur}
        placeholder="Поиск"
        className="w-full h-9 px-3 rounded-lg bg-[var(--tg-bg-secondary)] outline-none text-[14px] text-[var(--tg-text-primary)] placeholder:text-[var(--tg-text-secondary)]"
      />
    );
  }
  return (
    <div className="text-[17px] font-medium pl-1 text-[var(--tg-text-primary)]">
      Чаты
    </div>
  );
};

export default WhatsappMainSidebarHeaderCenter;
