Function MonthSelect

packages/shared/src/components/profile/MonthSelect.tsx:37–74

({
  icon,
  placeholder,
  value,
  onSelect,
  disabled,
}: MonthSelectProps)

};

const MonthSelect = ({
  icon,
  placeholder,
  value,
  onSelect,
  disabled,
}: MonthSelectProps) => {
  const menuItems: MenuItemProps[] = MONTHS.map((opt) => ({
    label: opt.label,
    action: () => onSelect?.(opt.value),
  }));

  const selectedLabel = MONTHS.find((opt) => opt.value === value)?.label;

  return (
    <DropdownMenu>
      <DropdownMenuTrigger className="w-full" asChild disabled={disabled}>
        <Button
          icon={icon}
          variant={ButtonVariant.Float}
          size={ButtonSize.Large}
          disabled={disabled}
        >
          {selectedLabel || placeholder}
          <ArrowIcon className="ml-auto rotate-180" secondary />
        </Button>
      </DropdownMenuTrigger>
      <DropdownMenuContent
        variant="field"
        align="start"
        sideOffset={10}
        className="flex flex-col gap-1 !p-0"
      >
        <DropdownMenuOptions options={menuItems} />
      </DropdownMenuContent>
    </DropdownMenu>
  );
};

export default MonthSelect;