From 5a45a62cb31189b27cd5f827e33cafe958dda5d2 Mon Sep 17 00:00:00 2001
From: Marliana Lara <mlara@redhat.com>
Date: Wed, 25 Mar 2020 17:44:34 -0400
Subject: [PATCH] Hookup WF documentation button to visualizer toolbar

---
 .../WorkflowJobTemplateVisualizer/VisualizerToolbar.jsx   | 8 +++++++-
 .../VisualizerToolbar.test.jsx                            | 8 ++++++++
 2 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/VisualizerToolbar.jsx b/awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/VisualizerToolbar.jsx
index abdab2a40f..d9b53cf6ee 100644
--- a/awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/VisualizerToolbar.jsx
+++ b/awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/VisualizerToolbar.jsx
@@ -46,6 +46,9 @@ const ActionButton = styled(Button)`
 `;
 ActionButton.displayName = 'ActionButton';
 
+const DOCLINK =
+  'https://docs.ansible.com/ansible-tower/latest/html/userguide/workflow_templates.html#ug-wf-editor';
+
 function VisualizerToolbar({
   i18n,
   onClose,
@@ -95,9 +98,12 @@ function VisualizerToolbar({
             </ActionButton>
           </Tooltip>
           <ActionButton
+            aria-label={i18n._(t`Workflow Documentation`)}
             id="visualizer-documentation"
             variant="plain"
-            isDisabled
+            component="a"
+            target="_blank"
+            href={DOCLINK}
           >
             <BookIcon />
           </ActionButton>
diff --git a/awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/VisualizerToolbar.test.jsx b/awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/VisualizerToolbar.test.jsx
index 36063e61f7..3edfa63c0d 100644
--- a/awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/VisualizerToolbar.test.jsx
+++ b/awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/VisualizerToolbar.test.jsx
@@ -62,6 +62,14 @@ describe('VisualizerToolbar', () => {
     expect(wrapper.find('Badge').text()).toBe('1');
   });
 
+  test('Should display action buttons', () => {
+    expect(wrapper.find('CompassIcon')).toHaveLength(1);
+    expect(wrapper.find('WrenchIcon')).toHaveLength(1);
+    expect(wrapper.find('BookIcon')).toHaveLength(1);
+    expect(wrapper.find('RocketIcon')).toHaveLength(1);
+    expect(wrapper.find('TrashAltIcon')).toHaveLength(1);
+  });
+
   test('Toggle Legend button dispatches as expected', () => {
     wrapper.find('CompassIcon').simulate('click');
     expect(dispatch).toHaveBeenCalledWith({ type: 'TOGGLE_LEGEND' });