import { HeroComponent } from 'dbaas/components/Measurement'
import { PageAccessGuard } from 'dbaas/contexts/access-control'
import { CreateDataMigrationPremium } from 'dbaas/screens/DataMigration/CreateDataMigrationPremium'
import { TiDBPageShell } from 'dbaas/screens/NextGen/tidb-mgmt-container/shared/TiDBPageShell'

import { PremiumDmPageTitle } from './PremiumDmPageTitle'

const Creation = () => {
  return (
    <TiDBPageShell
      title={<PremiumDmPageTitle page="create">Create Data Migration</PremiumDmPageTitle>}
      headerProps={{ withBack: true }}
    >
      <HeroComponent />
      <PageAccessGuard id="TidbxDMAction">
        <CreateDataMigrationPremium />
      </PageAccessGuard>
    </TiDBPageShell>
  )
}

export default Creation