import { useLocation, useParams } from 'react-router-dom'

import { CloudconfigClusterType } from 'apiClient/services/devops/interface'

import TemplateView from './components/TemplateView'

export default function TemplateDetail() {
  const { template_id } = useParams<{
    template_id: string
  }>()
  const location = useLocation()
  const searchParams = new URLSearchParams(location.search)
  const cluster_type = searchParams.get(
    'cluster_type'
  ) as CloudconfigClusterType
  const withDefaultCases =
    cluster_type === CloudconfigClusterType.DEDICATED_TIDB ||
    cluster_type === CloudconfigClusterType.TICDC

  return (
    <TemplateView
      template_id={template_id}
      cluster_type={cluster_type}
      with_default_cases={withDefaultCases}
    />
  )
}