Per bug list we went over today, fixing a deep irritation with data object renaming, hopefully this feels better.

app/spiffworkflow/DataObject/DataObjectHelpers.js

@@ -46,3 +46,12 @@ export function findDataReferenceShapes(processShape, id) {
   }
   return refs;
 }
+
+export function idToHumanReadableName(id) {
+  const words = id.match(/[A-Za-z][a-z]*/g) || [];
+  return words.map(capitalize).join(' ');
+
+  function capitalize(word) {
+    return word.charAt(0).toUpperCase() + word.substring(1);
+  }
+}

app/spiffworkflow/DataObject/DataObjectInterceptor.js

@@ -1,6 +1,6 @@
 import CommandInterceptor from 'diagram-js/lib/command/CommandInterceptor';
 import {getDi, is} from 'bpmn-js/lib/util/ModelUtil';
-import {findDataObjects, findDataReferenceShapes} from './DataObjectHelpers';
+import {findDataObjects, findDataReferenceShapes, idToHumanReadableName} from './DataObjectHelpers';
 var HIGH_PRIORITY = 1500;
 import {
   remove as collectionRemove,
@@ -49,7 +49,7 @@ export default class DataObjectInterceptor extends CommandInterceptor {
         }
 
         // Update the name of the reference to match the data object's id.
-        shape.businessObject.name = dataObject.id;
+        shape.businessObject.name = idToHumanReadableName(dataObject.id);
 
         // set the reference to the DataObject
         shape.businessObject.dataObjectRef = dataObject;

app/spiffworkflow/DataObject/propertiesPanel/DataObjectArray.js

@@ -5,7 +5,7 @@ import {
 } from '@bpmn-io/properties-panel';
 import { without } from 'min-dash';
 import { is } from 'bpmn-js/lib/util/ModelUtil';
-import { findDataObjects, findDataReferenceShapes } from '../DataObjectHelpers';
+import {findDataObjects, findDataReferenceShapes, idToHumanReadableName} from '../DataObjectHelpers';
 
 /**
  * Provides a list of data objects, and allows you to add / remove data objects, and change their ids.
@@ -129,7 +129,7 @@ function DataObjectTextField(props) {
         element: ref,
         moddleElement: ref.businessObject,
         properties: {
-          name: value,
+          name: idToHumanReadableName(value),
         },
         changed: [ref], // everything is already marked as changed, don't recalculate.
       });

app/spiffworkflow/DataObject/propertiesPanel/DataObjectSelect.js

@@ -1,5 +1,6 @@
 import {useService } from 'bpmn-js-properties-panel';
 import { SelectEntry } from '@bpmn-io/properties-panel';
+import {idToHumanReadableName} from '../DataObjectHelpers';
 
 /**
  * Finds the value of the given type within the extensionElements
@@ -43,7 +44,7 @@ export function DataObjectSelect(props) {
           element,
           moddleElement: businessObject,
           properties: {
-            'name': flowElem.id
+            'name': idToHumanReadableName(flowElem.id)
           }
         });
       }

test/spec/DataObjectInterceptorSpec.js

@@ -4,7 +4,7 @@ import { BpmnPropertiesPanelModule, BpmnPropertiesProviderModule } from 'bpmn-js
 import {
   inject,
 } from 'bpmn-js/test/helper';
-import { findDataObjects } from '../../app/spiffworkflow/DataObject/DataObjectHelpers';
+import {findDataObjects, idToHumanReadableName} from '../../app/spiffworkflow/DataObject/DataObjectHelpers';
 
 describe('DataObject Interceptor', function() {
 
@@ -93,7 +93,8 @@ describe('DataObject Interceptor', function() {
       { x: 220, y: 220 }, rootShape);
 
     const dataObjects = findDataObjects(rootShape.businessObject);
-    expect(dataObjectRefShape1.businessObject.name).to.equal(dataObjects[0].id);
+    const human_readable_name = idToHumanReadableName(dataObjects[0].id)
+    expect(dataObjectRefShape1.businessObject.name).to.equal(human_readable_name);
   }));
 
   it('should allow you to add a data object to a subprocess', inject(function(canvas, modeling, elementRegistry) {

test/spec/DataObjectPropsSpec.js

@@ -75,7 +75,7 @@ describe('Properties Panel for Data Objects', function() {
 
     // THEN - both the data object itself, and the label of any references are updated.
     expect(my_data_ref_1.businessObject.dataObjectRef.id).to.equal('my_nifty_new_name');
-    expect(my_data_ref_1.businessObject.name).to.equal('my_nifty_new_name');
+    expect(my_data_ref_1.businessObject.name).to.equal('My Nifty New Name');
   });
 
 });