import { Box, Typography } from '@tidbcloud/uikit'

import { CapacityField } from 'dbaas/screens/TiDBNextGen/essential/Capacity'

export const ClusterPlanField = () => {
  return (
    <Box>
      <Typography variant="title-md">Capacity</Typography>
      <Typography variant="body-lg" mt={8}>
        Instance provisioned capacity is measured in Request Capacity Units (RCUs). TiDB Cloud automatically creates
        scaling rules based on the minimum and maximum capacity setting.{' '}
        <a href="https://docs.pingcap.com/tidbcloud/tidb-cloud-billing/#pricing-for-tidb-cloud-essential">Learn more</a>
        .
      </Typography>
      <CapacityField mt={24} />
    </Box>
  )
}