"use client";

import { Info } from "lucide-react";
import { tasksDict } from "@/features/tasks/dict";

type DescriptionInfoButtonProps = {
  onClick: () => void;
};

export function DescriptionInfoButton({ onClick }: DescriptionInfoButtonProps) {
  return (
    <button
      type="button"
      aria-label={tasksDict.showDescription}
      onClick={(event) => {
        event.stopPropagation();
        onClick();
      }}
      className="inline-flex size-11 shrink-0 items-center justify-center rounded-2xl text-muted-foreground transition-colors hover:bg-muted hover:text-foreground"
    >
      <Info aria-hidden className="size-5" />
    </button>
  );
}