feat: Timeline UI (#2830)

web/src/components/Dialog.jsx

@@ -1,10 +1,8 @@
 import { h, Fragment } from 'preact';
-import Button from './Button';
-import Heading from './Heading';
 import { createPortal } from 'preact/compat';
 import { useState, useEffect } from 'preact/hooks';
 
-export default function Dialog({ actions = [], portalRootID = 'dialogs', title, text }) {
+export default function Dialog({ children, portalRootID = 'dialogs' }) {
   const portalRoot = portalRootID && document.getElementById(portalRootID);
   const [show, setShow] = useState(false);
 
@@ -27,17 +25,7 @@ export default function Dialog({ actions = [], portalRootID = 'dialogs', title,
             show ? 'scale-100 opacity-100' : ''
           }`}
         >
-          <div className="p-4">
-            <Heading size="lg">{title}</Heading>
-            <p>{text}</p>
-          </div>
-          <div className="p-2 flex justify-start flex-row-reverse space-x-2">
-            {actions.map(({ color, text, onClick, ...props }, i) => (
-              <Button className="ml-2" color={color} key={i} onClick={onClick} type="text" {...props}>
-                {text}
-              </Button>
-            ))}
-          </div>
+          {children}
         </div>
       </div>
     </Fragment>