import { Box, Card, Flex } from '@tidbcloud/uikit'
import { ReactNode } from 'react'

type LayoutProps = {
  leftSection: ReactNode
  rightSection: ReactNode
}

export const Layout = ({ leftSection, rightSection }: LayoutProps) => {
  return (
    <Flex
      sx={{
        height: '100%',
        gap: 24,
        justifyContent: 'center'
      }}
    >
      <Card w={720} miw={360} shadow="none" p={0}>
        {leftSection}
      </Card>
      <Box w={408} miw={320}>
        {rightSection}
      </Box>
    </Flex>
  )
}