Add ModalActions to Modal component

webui/src/common/components/Modal/Modal.jsx

@@ -63,3 +63,20 @@ export const Modal = ({
     </div>
   );
 };
+
+export const ModalActions = ({
+  children,
+  className = '',
+  align = 'right',
+  ...rest
+}) => {
+  const alignClass = align === 'left' ? 'modal-actions--left' : 
+                   align === 'center' ? 'modal-actions--center' : 
+                   'modal-actions--right';
+  
+  return (
+    <div className={`modal-actions ${alignClass} ${className}`} {...rest}>
+      {children}
+    </div>
+  );
+};

webui/src/common/components/Modal/index.js

@@ -1 +1 @@
-export { Modal as default } from './Modal.jsx';
+export { Modal as default, ModalActions } from './Modal.jsx';

webui/src/common/components/Modal/styles.sass

@@ -57,6 +57,20 @@
   overflow-y: auto
   flex: 1
 
+.modal-actions
+  display: flex
+  gap: 0.75rem
+  margin-top: 1.5rem
+  
+  &--left
+    justify-content: flex-start
+  
+  &--center
+    justify-content: center
+  
+  &--right
+    justify-content: flex-end
+
 @keyframes modalIn
   from
     opacity: 0