import React, { useState } from 'react'
import { Button, Dialog } from '@alifd/next'

export default function DesignPic() {
  const [visible, setVisible] = useState(false)

  const onOpen = () => {
    setVisible(true)
  }

  const onOk = () => {
    setVisible(false)
  }

  const onClose = () => {
    setVisible(false)
  }

  return (
    <div>
      <Button onClick={onOpen} type="primary">
        Open dialog
      </Button>
      <Dialog
        v2
        title="Welcome to Alibaba.com"
        visible={visible}
        onOk={onOk}
        onClose={onClose}
      >
        <p>Start your business here by searching a popular product</p>
      </Dialog>
    </div>
  )
}