import { useTranslation } from "react-i18next";
import { PasswordControl } from "@keycloakify/keycloak-admin-ui/ui-shared";
import { convertToName } from "@keycloakify/keycloak-admin-ui/components/dynamic/DynamicComponents";
import type { ComponentProps } from "@keycloakify/keycloak-admin-ui/components/dynamic/components";

export const PasswordComponent = ({
  name,
  label,
  helpText,
  defaultValue,
  required,
  isDisabled = false,
}: ComponentProps) => {
  const { t } = useTranslation();

  return (
    <PasswordControl
      name={convertToName(name!)}
      label={t(label!)}
      labelIcon={t(helpText!)}
      isDisabled={isDisabled}
      defaultValue={defaultValue?.toString()}
      rules={{
        required: { value: !!required, message: t("required") },
      }}
    />
  );
};
