import { observer } from 'mobx-react'

import { AccessDeniedView } from 'dbaas/contexts/access-control/ui/AccessDeniedView'
import { useNextGenMode } from 'dbaas/features/Organization/mode'
import { useCreateResourceAccess } from 'dbaas/screens/NextGen/shared/access/use-create-resource-access'

import { MyTidbCreationPage } from './MyTidbCreationPage'

export const MyTidbCreationPageWithGuard = observer(() => {
  const { isNextGen } = useNextGenMode()
  const hasAccess = useCreateResourceAccess()

  if (!isNextGen || !hasAccess) {
    return <AccessDeniedView />
  }

  return <MyTidbCreationPage />
})