import { zodResolver } from '@hookform/resolvers/zod'
import { notifier } from '@tidbcloud/uikit'
import { observer } from 'mobx-react'
import { useCallback, useId, useMemo } from 'react'
import { FormProvider, useForm } from 'react-hook-form'

import { PremiumByocFormValue } from 'dbaas/screens/NextGen/my-tidb-creation/shared/premium-byoc/types'
import { useCreateTidb } from 'dbaas/screens/NextGen/my-tidb-creation/shared/premium-byoc/use-create-tidb'
import { useCreateResourceRoleState } from 'dbaas/screens/NextGen/shared/access/create-resource-role'
import { Commonv1beta1ServicePlan } from 'dbaas/services/api-clients/v2025/tidb-management/v1beta2/interface'
import useStores from 'dbaas/stores/useStores'

import { TwoPaneLayout } from '../../layout/TwoPaneLayout'
import { createPremiumByocFormSchema } from '../../shared/premium-byoc/schema'
import { useVirtualProjectId } from '../../shared/use-virtual-project-id'

import { PremiumReservedForm } from './PremiumReservedForm'
import { PremiumReservedSummary } from './PremiumReservedSummary'

interface PremiumReservedCreationProps {
  header: React.ReactNode
  planSelector: React.ReactNode
  active: boolean
}

export const PremiumReservedCreation = observer(({ header, planSelector, active }: PremiumReservedCreationProps) => {
  const {
    store: {
      lastVisitLocation: { orgId }
    }
  } = useStores()
  const servicePlan = Commonv1beta1ServicePlan.Premium_Reserved
  const virtualProjectId = useVirtualProjectId()
  const { requiresProjectSelection, isOrgOwner, ownerProjects } = useCreateResourceRoleState()
  const eligibleProjects = useMemo(
    () => ownerProjects.filter((project) => !project.aws_cmek_enabled && project.type === 'tidbx'),
    [ownerProjects]
  )

  const createMutator = useCreateTidb()

  const formMethods = useForm<PremiumByocFormValue>({
    mode: 'onChange',
    defaultValues: {
      projectId: '',
      cloudProvider: undefined,
      regionId: '',
      name: '',
      reservedCapacityTemplateId: '',
      highAvailabilityType: 'REGIONAL',
      dualLayerDataEncryption: {
        encrypted: false,
        keyType: 'service-managed',
        awsCmek: {
          accountId: '',
          kmsKeyArn: ''
        },
        aliyunCmek: {
          accountId: '',
          kmsKeyArn: ''
        }
      }
    },
    resolver: (values, ctx, options) => {
      const resolvedProjectId = isOrgOwner ? values.projectId || virtualProjectId : values.projectId
      const schema = createPremiumByocFormSchema(servicePlan, orgId, resolvedProjectId, {
        requireProjectSelection: requiresProjectSelection || (!isOrgOwner && eligibleProjects.length === 0)
      })

      return zodResolver(schema)(values, ctx, options)
    }
  })

  const { handleSubmit } = formMethods

  const handleValidSubmit = useCallback(
    async (data: PremiumByocFormValue) => {
      const resolvedProjectId = isOrgOwner ? data.projectId || virtualProjectId : data.projectId

      if (!resolvedProjectId) {
        notifier.error('Missing organization or project context.')
        return
      }

      const result = await createMutator.mutateAsync({
        data: {
          servicePlan,
          displayName: data.name,
          cloudProvider: data.cloudProvider,
          regionId: data.regionId,
          maxRcu: '0',
          reservedCapacityTemplateId: data.reservedCapacityTemplateId,
          highAvailabilityType: data.highAvailabilityType,
          labels: {
            'tidb.cloud/project': resolvedProjectId
          },
          dualLayerDataEncryption: undefined
        },
        params: {
          orgId,
          projectId: resolvedProjectId
        }
      })

      return result
    },
    [createMutator, isOrgOwner, orgId, servicePlan, virtualProjectId]
  )
  const formId = useId()

  return (
    <FormProvider {...formMethods}>
      <TwoPaneLayout
        visible={active}
        header={header}
        rightSection={
          <PremiumReservedSummary formId={formId} servicePlan={servicePlan} isPending={createMutator.isLoading} />
        }
      >
        <PremiumReservedForm
          formId={formId}
          planSelector={planSelector}
          onSubmit={handleSubmit(handleValidSubmit)}
          active={active}
        />
      </TwoPaneLayout>
    </FormProvider>
  )
})
