import { useIntl } from '@umijs/max';
import { Button } from 'antd';
import ModalTreeSelectGroup from './ModalTreeSelectGroup';

interface ButtonSelectGroupProps {
  visible: boolean;
  onVisibleChange: (visible: boolean) => void;
  onSubmitGroup: (groupId: string) => Promise<void>;
}

const ButtonSelectGroup: React.FC<ButtonSelectGroupProps> = ({
  visible,
  onVisibleChange,
  onSubmitGroup,
}) => {
  const intl = useIntl();

  return (
    <>
      <Button type="primary" onClick={() => onVisibleChange(true)}>
        {intl.formatMessage({
          id: 'pages.groups.setgroup.text',
          defaultMessage: 'Set group',
        })}
      </Button>

      <ModalTreeSelectGroup
        visible={visible}
        onModalVisible={onVisibleChange}
        onSubmit={async (groupId: string) => {
          await onSubmitGroup(groupId);
        }}
      />
    </>
  );
};

export default ButtonSelectGroup;
