import { useTranslation } from "react-i18next";
import { SelectControl } from "@keycloakify/keycloak-admin-ui/ui-shared";
import { useServerInfo } from "@keycloakify/keycloak-admin-ui/context/server-info/ServerInfoProvider";
import { convertAttributeNameToForm } from "@keycloakify/keycloak-admin-ui/util";
import { FormFields } from "@keycloakify/keycloak-admin-ui/clients/ClientDetails";

type SignedJWTProps = {
  clientAuthenticatorType: string;
};

export const SignedJWT = ({ clientAuthenticatorType }: SignedJWTProps) => {
  const { cryptoInfo } = useServerInfo();
  const providers =
    clientAuthenticatorType === "client-jwt"
      ? (cryptoInfo?.clientSignatureAsymmetricAlgorithms ?? [])
      : (cryptoInfo?.clientSignatureSymmetricAlgorithms ?? []);

  const { t } = useTranslation();

  return (
    <SelectControl
      name={convertAttributeNameToForm<FormFields>(
        "attributes.token.endpoint.auth.signing.alg",
      )}
      label={t("signatureAlgorithm")}
      labelIcon={t("signatureAlgorithmHelp")}
      controller={{
        defaultValue: "",
      }}
      isScrollable
      maxMenuHeight="200px"
      options={[
        { key: "", value: t("anyAlgorithm") },
        ...providers.map((option) => ({ key: option, value: option })),
      ]}
    />
  );
};