ran precommit and ignoring html files with prettier since it has a hard time with jinja files w/ burnettk

.pre-commit-config.yaml

@@ -60,3 +60,4 @@ repos:
     rev: v2.4.1
     hooks:
       - id: prettier
+        exclude_types: [html]

docker-compose.yml

@@ -10,7 +10,7 @@ services:
       - MYSQL_DATABASE=spiffworkflow_backend_staging
       - MYSQL_ROOT_PASSWORD=St4g3Th1515
     ports:
-      - '7001:3306'
+      - "7001:3306"
     volumes:
       - spiffworkflow_backend:/var/lib/mysql
     healthcheck:

public/app.bundled.js/main.js

@@ -0,0 +1,49 @@
+/*
+ * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
+ * This devtool is neither made for production nor for readable output files.
+ * It uses "eval()" calls to create a separate source file in the browser devtools.
+ * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
+ * or disable the default devtool with "devtool: false".
+ * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
+ */
+/******/ (() => { // webpackBootstrap
+/******/ 	"use strict";
+/******/ 	var __webpack_modules__ = ({
+
+/***/ "./src/app.js":
+/*!********************!*\
+  !*** ./src/app.js ***!
+  \********************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\nObject(function webpackMissingModule() { var e = new Error(\"Cannot find module 'bpmn-js'\"); e.code = 'MODULE_NOT_FOUND'; throw e; }());\n\n\nvar viewer = new Object(function webpackMissingModule() { var e = new Error(\"Cannot find module 'bpmn-js'\"); e.code = 'MODULE_NOT_FOUND'; throw e; }())({\n  container: '#canvas'\n});\n\n\nviewer.importXML(pizzaDiagram).then(function(result) {\n\n  const { warnings } = result;\n\n  console.log('success !', warnings);\n\n  viewer.get('canvas').zoom('fit-viewport');\n}).catch(function(err) {\n\n  const { warnings, message } = err;\n\n  console.log('something went wrong:', warnings, message);\n});\n\n\n//# sourceURL=webpack:///./src/app.js?");
+
+/***/ })
+
+/******/ 	});
+/************************************************************************/
+/******/ 	// The require scope
+/******/ 	var __webpack_require__ = {};
+/******/ 	
+/************************************************************************/
+/******/ 	/* webpack/runtime/make namespace object */
+/******/ 	(() => {
+/******/ 		// define __esModule on exports
+/******/ 		__webpack_require__.r = (exports) => {
+/******/ 			if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 				Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 			}
+/******/ 			Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 		};
+/******/ 	})();
+/******/ 	
+/************************************************************************/
+/******/ 	
+/******/ 	// startup
+/******/ 	// Load entry module and return exports
+/******/ 	// This entry module can't be inlined because the eval devtool is used.
+/******/ 	var __webpack_exports__ = {};
+/******/ 	__webpack_modules__["./src/app.js"](0, __webpack_exports__, __webpack_require__);
+/******/ 	
+/******/ })()
+;

src/spiffworkflow_backend/__init__.py

@@ -29,7 +29,9 @@ def create_app() -> flask.app.Flask:
     app.config["SESSION_TYPE"] = "filesystem"
 
     if os.environ.get("FLASK_SESSION_SECRET_KEY") is None:
-        raise KeyError("Cannot find the secret_key from the environment. Please set FLASK_SESSION_SECRET_KEY")
+        raise KeyError(
+            "Cannot find the secret_key from the environment. Please set FLASK_SESSION_SECRET_KEY"
+        )
 
     app.secret_key = os.environ.get("FLASK_SESSION_SECRET_KEY")
 

src/spiffworkflow_backend/routes/admin_blueprint/admin_blueprint.py

@@ -115,13 +115,13 @@ def process_model_edit(process_model_id, file_name):
     )
 
 
-@admin_blueprint.route("/process-models/<process_model_id>/save/<file_name>", methods=["POST"])
+@admin_blueprint.route(
+    "/process-models/<process_model_id>/save/<file_name>", methods=["POST"]
+)
 def process_model_save(process_model_id, file_name):
     """Process_model_save."""
     process_model = ProcessModelService().get_spec(process_model_id)
-    SpecFileService.update_file(
-        process_model, file_name, request.get_data()
-    )
+    SpecFileService.update_file(process_model, file_name, request.get_data())
     bpmn_xml = SpecFileService.get_data(process_model, process_model.primary_file_name)
     return render_template(
         "process_model_edit.html",

src/spiffworkflow_backend/routes/admin_blueprint/static/app.js

@@ -0,0 +1,26 @@
+import BpmnViewer from 'bpmn-js';
+
+var viewer = new BpmnViewer({
+  container: '#canvas'
+});
+
+
+viewer.importXML(pizzaDiagram).then(function(result) {
+
+  const { warnings } = result;
+
+  console.log('success !', warnings);
+
+  viewer.get('canvas').zoom('fit-viewport');
+}).catch(function(err) {
+
+  const { warnings, message } = err;
+
+  console.log('something went wrong:', warnings, message);
+});
+
+export function sayHello () {
+  console.log('hello')
+}
+
+window.foo = 'bar'

src/spiffworkflow_backend/routes/admin_blueprint/static/package.json

@@ -9,6 +9,10 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "bpmn-js": "^9.1.0"
+    "bpmn-js": "^9.1.0",
+    "bpmn-js-properties-panel": "^1.1.1"
+  },
+  "devDependencies": {
+    "webpack-cli": "^4.9.2"
   }
 }

src/spiffworkflow_backend/routes/admin_blueprint/static/style.css

@@ -1 +1,2 @@
-.example { }
+.example {
+}

src/spiffworkflow_backend/routes/admin_blueprint/templates/process_model_edit.html

@@ -1,33 +1,29 @@
-{% extends "layout.html" %} {% block title %}Process Model Edit: {{
-process_model.id }}{% endblock %} {% block head %}
+{% extends "layout.html" %} {% block title %}
+  Process Model Edit: {{ process_model.id }}
+{% endblock %}
+
+{% block head %}
   <meta charset="UTF-8" />
   
   <!-- example styles -->
   <!-- required modeler styles -->
-<link
-  rel="stylesheet"
-  href="https://unpkg.com/bpmn-js@9.1.0/dist/assets/bpmn-js.css"
-/>
-<link
-  rel="stylesheet"
-  href="https://unpkg.com/bpmn-js@9.1.0/dist/assets/diagram-js.css"
-/>
-<link
-  rel="stylesheet"
-  href="https://unpkg.com/bpmn-js@9.1.0/dist/assets/bpmn-font/css/bpmn.css"
-/>
+  <link rel="stylesheet" href="https://unpkg.com/bpmn-js@9.1.0/dist/assets/bpmn-js.css" />
+  <link rel="stylesheet" href="https://unpkg.com/bpmn-js@9.1.0/dist/assets/diagram-js.css" />
+  <link rel="stylesheet" href="https://unpkg.com/bpmn-js@9.1.0/dist/assets/bpmn-font/css/bpmn.css" />
+  
+  <link rel="stylesheet" href="https://unpkg.com/bpmn-js-properties-panel/dist/assets/properties-panel.css">
+  <link rel="stylesheet" href="https://unpkg.com/bpmn-js-properties-panel/dist/assets/element-templates.css">
   
   <!-- modeler distro -->
   <script src="https://unpkg.com/bpmn-js@9.1.0/dist/bpmn-modeler.development.js"></script>
+  <script src="{{ url_for('admin.static', filename='public/app.bundled.js/main.js') }}"></script>
   
   <!-- needed for this example only -->
   <script src="https://unpkg.com/jquery@3.3.1/dist/jquery.js"></script>
   
   <!-- example styles -->
   <style>
-  html,
-  body,
-  #canvas {
+    html, body, #canvas {
       height: 100%;
       padding: 0;
       margin: 0;
@@ -55,7 +51,9 @@ process_model.id }}{% endblock %} {% block head %}
       left: 20px;
     }
   </style>
-{% endblock %} {% block content %}
+{% endblock %}
+
+{% block content %}
   <div id="result">{{ result }}</div>
   <button
     type="button"
@@ -64,10 +62,30 @@ process_model.id }}{% endblock %} {% block head %}
     Back
   </button>
   <button type="button" onclick="exportDiagram()">Save</button>
+  <!-- <div class="modeler"> -->
     <div id="canvas"></div>
+    <div id="properties"></div>
+  <!-- </div> -->
   
   <meta id="bpmn_xml" data-name="{{bpmn_xml}}" />
   <script>
+    // import BpmnModeler from '/admin/static/node_modules/bpmn-js/lib/Modeler.js';
+    // import {
+    // BpmnPropertiesPanelModule,
+    // BpmnPropertiesProviderModule,
+    // } from '/admin/static/node_modules/bpmn-js-properties-panel/dist/index.js';
+    //  
+    // const bpmnModeler = new BpmnModeler({
+    //   container: '#canvas',
+    //   propertiesPanel: {
+    //     parent: '#properties'
+    //   },
+    //   additionalModules: [
+    //     BpmnPropertiesPanelModule,
+    //     BpmnPropertiesProviderModule
+    //   ]
+    // });
+
     // modeler instance
     var bpmnModeler = new BpmnJS({
         container: "#canvas",

tests/spiffworkflow_backend/unit/test_permissions.py

@@ -1,12 +1,13 @@
 """Test Permissions."""
 from flask.app import Flask
 from flask_bpmn.models.db import db
-# from tests.spiffworkflow_backend.helpers.test_data import find_or_create_process_group
 from tests.spiffworkflow_backend.helpers.test_data import find_or_create_user
 
+from spiffworkflow_backend.models.principal import PrincipalModel
+
+# from tests.spiffworkflow_backend.helpers.test_data import find_or_create_process_group
 # from spiffworkflow_backend.models.permission_assignment import PermissionAssignmentModel
 # from spiffworkflow_backend.models.permission_target import PermissionTargetModel
-from spiffworkflow_backend.models.principal import PrincipalModel
 
 
 def test_user_can_be_given_permission_to_administer_process_group(app: Flask) -> None:

wsgi.py

@@ -7,19 +7,20 @@ from spiffworkflow_backend import create_app
 app = create_app()
 
 if __name__ == "__main__":
+
     def no_app(environ, start_response):
         return NotFound()(environ, start_response)
 
     # Remove trailing slash, but add leading slash
-    base_url = '/' + app.config['APPLICATION_ROOT'].strip('/')
-    routes = {'/': app.wsgi_app}
+    base_url = "/" + app.config["APPLICATION_ROOT"].strip("/")
+    routes = {"/": app.wsgi_app}
 
-    if base_url != '/':
+    if base_url != "/":
         routes[base_url] = app.wsgi_app
 
     app.wsgi_app = DispatcherMiddleware(no_app, routes)
     app.wsgi_app = ProxyFix(app.wsgi_app)
 
-    flask_port = app.config['FLASK_PORT']
+    flask_port = app.config["FLASK_PORT"]
 
-    app.run(host='0.0.0.0', port=flask_port)
+    app.run(host="0.0.0.0", port=flask_port)