import { PageShellBase } from '@tidbcloud/uikit/biz'
import { observer } from 'mobx-react'
import { useCallback, useEffect, useMemo, useState } from 'react'
import { useLocation } from 'react-router-dom'

import { HeroComponent } from 'dbaas/components/Measurement'
import { DelayedPageLoader } from 'dbaas/components/Placeholder'
import { Commonv1beta1ServicePlan } from 'dbaas/services/api-clients/v2025/tidb-management/v1beta2/interface'

import { TidbCreationHeader } from './layout/TidbCreationHeader'
import { PlanSelector } from './modules/plan-selector/PlanSelector'
import { getInitialSelectedPlan, normalizeSelectedPlanByPolicy } from './modules/plan-selector/policy'
import { ServicePlan } from './modules/plan-selector/types'
import { ByocCreation } from './plans/byoc/ByocCreation'
import { DedicatedCreation } from './plans/dedicated/DedicatedCreation'
import { EssentialCreation } from './plans/essential/EssentialCreation'
import { PremiumCreation } from './plans/premium/PremiumCreation'
import { PremiumReservedCreation } from './plans/premium-reserved/PremiumReservedCreation'
import { StarterCreation } from './plans/starter/StarterCreation'
import { getTiDBPlanSelectorPolicy } from './shared/plan-selector-policy'
import { usePremiumByocFeatEnabled } from './shared/premium-byoc/use-premium-byoc-feat-enabled'
import { usePremiumReservedFeatEnabled } from './shared/premium-reserved/use-premium-reserved-feat-enabled'
import { useAdjustHelpCenter } from './shared/use-adjust-help-center'
import { useBillingPlanAvailability } from './shared/use-billing-plan-availability'

export const MyTidbCreationPage = observer(() => {
  useAdjustHelpCenter()
  const location = useLocation()
  const {
    isBYOCEnabled,
    isError: isPremiumByocFeatError,
    isLoading: isPremiumByocFeatLoading
  } = usePremiumByocFeatEnabled()
  const { planAvailability, isLoading: isPlanAvailabilityLoading } = useBillingPlanAvailability()

  const effectiveIsBYOCEnabled = isPremiumByocFeatError ? false : isBYOCEnabled
  const {
    premiumReservedMode,
    isError: isPremiumReservedFeatError,
    isLoading: isPremiumReservedFeatLoading
  } = usePremiumReservedFeatEnabled()

  const effectivePremiumReservedMode = isPremiumReservedFeatError ? 'hidden' : premiumReservedMode
  const isPlanSelectorLoading = isPremiumByocFeatLoading || isPlanAvailabilityLoading || isPremiumReservedFeatLoading

  const planSelectorPolicy = useMemo(() => {
    return getTiDBPlanSelectorPolicy({
      isBYOCEnabled: effectiveIsBYOCEnabled,
      planAvailabilityMap: planAvailability,
      premiumReservedMode: effectivePremiumReservedMode
    })
  }, [effectiveIsBYOCEnabled, planAvailability, effectivePremiumReservedMode])
  const requestedPlan = useMemo(() => {
    const plan = new URLSearchParams(location.search).get('plan')
    return plan && Object.values(Commonv1beta1ServicePlan).includes(plan as Commonv1beta1ServicePlan)
      ? (plan as ServicePlan)
      : undefined
  }, [location.search])

  const [selectedPlan, setSelectedPlan] = useState<ServicePlan>()

  useEffect(() => {
    if (isPlanSelectorLoading) {
      return
    }

    setSelectedPlan((currentPlan) => {
      if (!currentPlan) {
        return requestedPlan
          ? normalizeSelectedPlanByPolicy(planSelectorPolicy, requestedPlan)
          : getInitialSelectedPlan(planSelectorPolicy)
      }

      return normalizeSelectedPlanByPolicy(planSelectorPolicy, currentPlan)
    })
  }, [isPlanSelectorLoading, planSelectorPolicy, requestedPlan])

  const onPlanChange = useCallback((plan: ServicePlan) => setSelectedPlan(plan), [])

  if (isPlanSelectorLoading || !selectedPlan) {
    return <DelayedPageLoader delayMs={600} />
  }

  const header = <TidbCreationHeader title="Create Resource" />
  const planSelector = (
    <PlanSelector selectedPlan={selectedPlan} onPlanChange={onPlanChange} policy={planSelectorPolicy} />
  )

  return (
    <PageShellBase.Root
      sx={{
        backgroundColor: 'var(--mantine-color-carbon-1)',
        height: '100%',
        overflow: 'hidden'
      }}
    >
      <HeroComponent />
      <StarterCreation header={header} planSelector={planSelector} active={selectedPlan === 'Starter'} />
      <EssentialCreation header={header} planSelector={planSelector} active={selectedPlan === 'Essential'} />
      <PremiumCreation header={header} planSelector={planSelector} active={selectedPlan === 'Premium'} />
      <DedicatedCreation header={header} planSelector={planSelector} active={selectedPlan === 'Dedicated'} />
      <ByocCreation header={header} planSelector={planSelector} active={selectedPlan === 'BYOC'} />
      <PremiumReservedCreation
        header={header}
        planSelector={planSelector}
        active={selectedPlan === 'Premium_Reserved'}
      />
    </PageShellBase.Root>
  )
})