import type RoleRepresentation from "@keycloak/keycloak-admin-client/lib/defs/roleRepresentation";
import { FormProvider, UseFormReturn } from "react-hook-form";

import { FormAccess } from "@keycloakify/keycloak-admin-ui/components/form/FormAccess";
import type { KeyValueType } from "@keycloakify/keycloak-admin-ui/components/key-value-form/key-value-convert";
import { KeyValueInput } from "@keycloakify/keycloak-admin-ui/components/key-value-form/KeyValueInput";
import { FixedButtonsGroup } from "@keycloakify/keycloak-admin-ui/components/form/FixedButtonGroup";

export type AttributeForm = Omit<RoleRepresentation, "attributes"> & {
  attributes?: KeyValueType[];
};

export type AttributesFormProps = {
  form: UseFormReturn<AttributeForm>;
  save?: (model: AttributeForm) => void;
  reset?: () => void;
  fineGrainedAccess?: boolean;
  name?: string;
  isDisabled?: boolean;
};

export const AttributesForm = ({
  form,
  reset,
  save,
  fineGrainedAccess,
  name = "attributes",
  isDisabled = false,
}: AttributesFormProps) => {
  const noSaveCancelButtons = !save && !reset;
  const { handleSubmit } = form;

  return (
    <FormAccess
      role="manage-realm"
      onSubmit={save ? handleSubmit(save) : undefined}
      fineGrainedAccess={fineGrainedAccess}
    >
      <FormProvider {...form}>
        <KeyValueInput name={name} isDisabled={isDisabled} />
      </FormProvider>
      {!noSaveCancelButtons && (
        <FixedButtonsGroup name="attributes" reset={reset} isSubmit />
      )}
    </FormAccess>
  );
};