Add WIP external action buttons

web/components/action-buttons/ExternalActionButton.tsx

@@ -0,0 +1,18 @@
+import { Button } from 'antd';
+import { ExternalAction } from '../interfaces/external-action.interface';
+
+interface Props {
+  action: ExternalAction;
+}
+
+export default function ExternalActionButton(props: Props) {
+  const { action } = props;
+  const { url, title, description, icon, color, openExternally } = action;
+
+  return (
+    <Button type="primary" style={{ backgroundColor: color }}>
+      <img src={icon} width="30px" alt={description} />
+      {title}
+    </Button>
+  );
+}

web/components/action-buttons/ExternalActionButtonRow.tsx

@@ -0,0 +1,18 @@
+import { ExternalAction } from '../interfaces/external-action.interface';
+import ExternalActionButton from './ExternalActionButton';
+
+interface Props {
+  actions: ExternalAction[];
+}
+
+export default function ExternalActionButtonRow(props: Props) {
+  const { actions } = props;
+
+  return (
+    <div>
+      {actions.map(action => (
+        <ExternalActionButton key={action.id} action={action} />
+      ))}
+    </div>
+  );
+}