import { Box, Kbd, Text } from '@tidbcloud/uikit'

import { EmptyRunTips } from 'dbaas/screens/SqlEditor/MessageLogs/EmptyTips'

const EmptyTips = () => {
  return (
    <Box
      p={16}
      sx={(theme) => ({
        color: theme.colors.carbon[7],
        fontSize: 14
      })}
    >
      <EmptyRunTips />

      <Box>
        Click 'Test' or hint
        <Kbd mx={4}>F5</Kbd>
        to test your endpoint.
      </Box>

      <Box mt={12}>
        <Text span>Type "-- your question" + </Text>
        <Kbd mx={4}>Enter</Kbd>to try out AI-generated SQL queries.
      </Box>
    </Box>
  )
}

export default EmptyTips
