Added Dashboard.addTaskActionButton API, share to OAM button mock, webpack changes

app/static/app/js/classes/plugins/API.js

@@ -1,6 +1,7 @@
 import { EventEmitter } from 'fbemitter';
 import ApiFactory from './ApiFactory';
 import Map from './Map';
+import Dashboard from './Dashboard';
 import $ from 'jquery';
 import SystemJS from 'SystemJS';
 
@@ -27,6 +28,7 @@ if (!window.PluginsAPI){
 
   window.PluginsAPI = {
     Map: factory.create(Map),
+    Dashboard: factory.create(Dashboard),
 
     SystemJS,
     events

app/static/app/js/classes/plugins/Dashboard.js

@@ -0,0 +1,8 @@
+export default {
+  namespace: "Dashboard",
+
+  endpoints: [
+	"addTaskActionButton"
+  ]
+};
+

app/static/app/js/components/TaskListItem.jsx

@@ -8,6 +8,7 @@ import EditTaskPanel from './EditTaskPanel';
 import AssetDownloadButtons from './AssetDownloadButtons';
 import HistoryNav from '../classes/HistoryNav';
 import PropTypes from 'prop-types';
+import TaskPluginActionButtons from './TaskPluginActionButtons';
 
 class TaskListItem extends React.Component {
   static propTypes = {
@@ -30,7 +31,8 @@ class TaskListItem extends React.Component {
       actionButtonsDisabled: false,
       editing: false,
       memoryError: false,
-      badDatasetError: false
+      badDatasetError: false,
+      pluginActionButtons: []
     }
 
     for (let k in props.data){
@@ -512,6 +514,7 @@ class TaskListItem extends React.Component {
             <ErrorMessage bind={[this, 'actionError']} />
             {actionButtons}
           </div>
+          <TaskPluginActionButtons task={task} />
         </div>
       );
 

app/static/app/js/components/TaskPluginActionButtons.jsx

@@ -0,0 +1,50 @@
+import React from 'react';
+import '../css/TaskPluginActionButtons.scss';
+import PropTypes from 'prop-types';
+import PluginsAPI from '../classes/plugins/API';
+import update from 'immutability-helper';
+
+class TaskPluginActionButtons extends React.Component {
+    static defaultProps = {
+        task: null
+    };
+
+    static propTypes = {
+        task: PropTypes.object.isRequired,
+    };
+
+    constructor(props){
+        super();
+
+        this.state = {
+            buttons: []
+        };
+    }
+
+    componentDidMount(){
+        PluginsAPI.Dashboard.triggerAddTaskActionButton({
+            task: this.props.task
+        }, ({button, task}) => {
+            // Only process callbacks for
+            // for the current task
+            if (task === this.props.task){
+              this.setState(update(this.state, {
+                buttons: {$push: [button]}
+              }));
+            }
+        });
+    }
+
+    render(){
+        if (this.state.buttons.length > 0){
+            return (
+              <div className="row plugin-action-buttons">
+                  {this.state.buttons.map((button, i) => <div key={i}>{button}</div>)}
+              </div>);
+        }else{
+            return "";
+        }
+    }
+}
+
+export default TaskPluginActionButtons;

app/static/app/js/components/tests/TaskPluginActionButtons.test.jsx

@@ -0,0 +1,11 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+import TaskPluginActionButtons from '../TaskPluginActionButtons';
+const taskMock = require('../../tests/utils/MockLoader').load("task.json");
+
+describe('<TaskPluginActionButtons />', () => {
+  it('renders without exploding', () => {
+  	const wrapper = shallow(<TaskPluginActionButtons task={taskMock} />);
+    expect(wrapper.exists()).toBe(true);
+  })
+});

app/static/app/js/css/TaskPluginActionButtons.scss

@@ -0,0 +1,15 @@
+.plugin-action-buttons{
+    button{
+        margin-right: 4px;
+    }
+
+    .btn-group{
+        button:first-child{
+            margin-right: 0;
+        }
+    }
+
+    & > div{
+        display: inline-block;
+    }
+}

package.json

@@ -64,6 +64,6 @@
     "url-loader": "^0.5.7",
     "webpack": "^4.16.2",
     "webpack-bundle-tracker": "0.0.93",
-    "webpack-livereload-plugin": "^0.9.0"
+    "webpack-livereload-plugin": "^2.1.1"
   }
 }

plugins/openaerialmap/plugin.py

@@ -14,6 +14,9 @@ class Plugin(PluginBase):
     def main_menu(self):
         return [Menu("OpenAerialMap", self.public_url(""), "oam-icon fa fa-fw")]
 
+    def include_js_files(self):
+        return ['main.js']
+
     def include_css_files(self):
         return ['style.css']
 

plugins/openaerialmap/public/main.js

@@ -0,0 +1,15 @@
+PluginsAPI.Dashboard.addTaskActionButton(function(options){
+
+    console.log("INVOKED");
+
+    return {
+        button: React.createElement("button", {
+                    type: "button",
+                    className: "btn btn-sm btn-primary",
+                    onClick: function(){
+                        console.log("HEY");
+                    }
+                }, React.createElement("i", {className: "oam-icon fa"}, ""), " Share to OAM"),
+        task: options.task
+    };
+});

webpack.config.js

@@ -4,7 +4,7 @@ let ExtractTextPlugin = require('extract-text-webpack-plugin');
 let LiveReloadPlugin = require('webpack-livereload-plugin');
 
 module.exports = {
-  mode: 'production',
+  mode: 'development',
   context: __dirname,
 
   entry: {