Message Pop Up

<button onClick={() => setOpen(true)}>Show Popup</button>
  {open && (
    <MessagePopup
      message="Are you sure you want to delete this item?"
      onClose={() => setOpen(false)}
      onConfirm={() => {
        alert("Confirmed!");
        setOpen(false);
      }}
      onCancel={() => {
        alert("Cancelled!");
        setOpen(false);
      }}
    />
  )}

{open && <MessagePopup rounding="none" message="Apply these workspace settings?" onClose={() => setOpen(false)} onConfirm={() => setOpen(false)} onCancel={() => setOpen(false)} />}

{open && <MessagePopup rounding="medium" message="Apply these workspace settings?" onClose={() => setOpen(false)} onConfirm={() => setOpen(false)} onCancel={() => setOpen(false)} />}

{open && <MessagePopup rounding="large" message="Apply these workspace settings?" onClose={() => setOpen(false)} onConfirm={() => setOpen(false)} onCancel={() => setOpen(false)} />}