import React from 'react';
import { useState } from 'react';
import { Button } from '../components/Button';
import { Dialog } from '../components/Dialog';

export const DialogExample = () => {
    const [open, setOpen] = useState(false);

    function confirm(){
        setOpen(!open)
    }

    return(
        <div>
            <Dialog 
                content={
                    <label>Are you sure you want to delete your account?</label>
                } 
                title="Dialog"
                appearance="danger"
                open={open}
                close={() => { setOpen(!open) }}    
                confirm={confirm}     
            />

            <Button onClick={() => { setOpen(true) }}>Open dialog</Button>   
        </div>
    );
}