feat(client): turn deploy button into dropdown button with icon

camunda · Sep 4, 2018 · 9a7d809 · 9a7d809
1 parent 05cf31b
commit 9a7d809
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 5 deletions.
diff --git a/client/src/app/tabs/bpmn/BpmnEditor.js b/client/src/app/tabs/bpmn/BpmnEditor.js
@@ -397,9 +397,15 @@ export class BpmnEditor extends CachedComponent {
         </Fill>
 
         <Fill name="toolbar" group="deploy">
-          <Button title="Deploy diagram">
+          <DropdownButton title="Deploy Current Diagram" items={ [{
+            text: 'Deploy Current Diagram',
+            onClick: () => console.log('Deploy Current Diagram')
+          }, {
+            text: 'Configure Deployment Endpoint',
+            onClick: () => console.log('Configure Deployment Endpoint')
+          }] }>
             <Icon name="deploy" />
-          </Button>
+          </DropdownButton>
         </Fill>
 
         <div

diff --git a/client/src/app/tabs/dmn/DmnEditor.js b/client/src/app/tabs/dmn/DmnEditor.js
@@ -2,7 +2,10 @@ import React from 'react';
 
 import { Fill } from '../../slot-fill';
 
-import { Button } from '../../primitives';
+import {
+  DropdownButton,
+  Icon
+} from '../../primitives';
 
 import {
   WithCache,
@@ -299,8 +302,15 @@ class DmnEditor extends CachedComponent {
       <div className={ css.DmnEditor }>
 
         <Fill name="toolbar" group="deploy">
-          <Button>Deploy Current Diagram</Button>
-          <Button>Configure Deployment Endpoint</Button>
+          <DropdownButton title="Deploy Current Diagram" items={ [{
+            text: 'Deploy Current Diagram',
+            onClick: () => console.log('Deploy Current Diagram')
+          }, {
+            text: 'Configure Deployment Endpoint',
+            onClick: () => console.log('Configure Deployment Endpoint')
+          }] }>
+            <Icon name="deploy" />
+          </DropdownButton>
         </Fill>
 
         <div className="diagram" ref={ this.ref }></div>