displaying a simple entry for collaboration keys w/ burnettk cullerton

This commit is contained in:
jasquat 2022-08-16 14:17:55 -04:00
parent c31d85b81c
commit 9471a6b7bd
3 changed files with 47 additions and 151 deletions

View File

@ -10,7 +10,6 @@ export function getRoot(element) {
if (typeof element.$parent !== 'undefined') {
return getRoot(element.$parent);
}
console.log('Cannot getRoot: ', element);
return element;
}
@ -79,7 +78,6 @@ export function findCorrelationKeys(element) {
currentProperty.name = currentCorrelation.name;
currentProperty.refs = [];
for (const correlationProperty in currentCorrelation.correlationPropertyRef) {
console.log('findCorrelationKeys: propertyRef', correlationProperty);
currentProperty.refs.push(
currentCorrelation.correlationPropertyRef[correlationProperty]
);

View File

@ -3,6 +3,7 @@ import {
isTextFieldEntryEdited,
ListGroup,
TextFieldEntry,
SimpleEntry,
} from '@bpmn-io/properties-panel';
import { without } from 'min-dash';
import { is } from 'bpmn-js/lib/util/ModelUtil';
@ -30,36 +31,32 @@ export function CorrelationKeysArray(props) {
const correlationProperties = findCorrelationKeys(element.businessObject);
const items = correlationProperties.map((correlationProperty, index) => {
const id = `correlationGroup-${correlationProperty.name}`;
// console.log('correlationProperty.refs', correlationProperty.refs);
console.log('id', id);
return {
id,
correlationProperty,
label: correlationProperty.name,
// entries: correlationProperty.refs,
entries: correlationGroup({
id,
element,
correlationProperty,
}),
autoFocusEntry: id,
// remove: removeFactory({ element, correlationProperty, commandStack, elementRegistry })
};
});
function add(event) {
event.stopPropagation();
const newCorrelationKey = moddle.create('bpmn:CorrelationKey');
newCorrelationKey.name = moddle.ids.nextPrefixed('CorrelationKey_');
console.log('newCorrelationKey', newCorrelationKey);
commandStack.execute('element.updateModdleProperties', {
element,
moddleElement: element.businessObject,
newElements: newCorrelationKey,
});
}
// function add(event) {
// event.stopPropagation();
// const newCorrelationKey = moddle.create('bpmn:CorrelationKey');
// newCorrelationKey.name = moddle.ids.nextPrefixed('CorrelationKey_');
// console.log('newCorrelationKey', newCorrelationKey);
// commandStack.execute('element.updateModdleProperties', {
// element,
// moddleElement: element.businessObject,
// newElements: newCorrelationKey,
// });
// }
return { items, add };
return { items };
}
function removeFactory(props) {
@ -97,128 +94,33 @@ function removeFactory(props) {
function correlationGroup(props) {
const { element, correlationProperty } = props;
const id = `correlation-${correlationProperty.name}`;
console.log('HELL1');
// return [
// {
// // id,
// // label: correlationProperty.name,
// // entries: [],
// // entries: CorrelationKeyGroup({
// // id,
// // element,
// // correlationProperty,
// // }),
// id: `${id}-hey-group`,
// // component: CorrelationKeyGroup,
// component: CorrelationKeyTextField,
// // isEdited: isTextFieldEntryEdited,
// correlationProperty,
// // autoFocusEntry: id,
// },
// ];
return correlationProperty.refs.map((cpRef, index) => {
console.log('ref1', cpRef);
return {
// id,
// label: correlationProperty.name,
// entries: [],
// entries: CorrelationKeyGroup({
// id,
// element,
// correlationProperty,
// }),
id: `${id}-${cpRef.id}-group`,
// component: CorrelationKeyGroup,
component: CorrelationKeyTextField,
// isEdited: isTextFieldEntryEdited,
correlationProperty,
cpRef,
// autoFocusEntry: id,
};
});
}
function CorrelationKeyGroup(props) {
const { id, correlationProperty } = props;
console.log('HELLO');
const entries = correlationProperty.refs.map((cpRef, index) => {
// debugger;
// return CorrelationKeyTextField({
return {
id: `${id}-${cpRef.id}-group`,
component: CorrelationKeyTextField,
isEdited: isTextFieldEntryEdited,
correlationProperty,
};
// })
});
// console.log('stuff', stuff);
console.log('entries', entries);
return [
{
id: `${id}-group`,
entries,
isEdited: isTextFieldEntryEdited,
correlationProperty,
},
];
}
function CorrelationKeyTextField(props) {
console.log('WE IN TEXT');
console.log('props', props);
const { id, element, parameter, correlationProperty, cpRef } = props;
console.log('cpRef', cpRef);
const commandStack = useService('commandStack');
const debounce = useService('debounceInput');
const setValue = (value) => {
commandStack.execute('element.updateModdleProperties', {
element,
moddleElement: correlationProperty,
properties: {
id: value,
},
});
// Also update the label of all the references
// const references = findDataReferenceShapes(element, correlationProperty.id);
const references = ['hello1', 'hello2'];
for (const cpRef of references) {
commandStack.execute('element.updateProperties', {
element: cpRef,
moddleElement: cpRef.businessObject,
properties: {
name: value,
},
changed: [cpRef], // everything is already marked as changed, don't recalculate.
});
}
};
const getValue = (parameter) => {
return correlationProperty.refs;
return cpRef.id;
};
// return ListGroup({
// element: parameter,
// items: correlationProperty.refs,
// id: `${idPrefix}-textField`,
// label: 'Correlation Properties',
// getValue,
// setValue,
// debounce,
// });
console.log('correlationProperty.id', correlationProperty.name);
return TextFieldEntry({
return SimpleEntry({
element: parameter,
id: `${id}-textField`,
label: cpRef.id,
editable: false,
getValue,
setValue,
disabled: true,
debounce,
});
}

View File

@ -8,7 +8,7 @@ import {
expectSelected,
findEntry,
findGroupEntry,
findInput,
// findInput,
findSelect,
findTextarea,
findButtonByClass,
@ -47,7 +47,7 @@ describe('Messages should work', function () {
expect(entry).to.exist;
});
it.only('should show a Message Properties group when a send task is selected', async function () {
it('should show a Message Properties group when a send task is selected', async function () {
// Select the send Task
const send_shape = await expectSelected('ActivitySendLetter');
expect(send_shape, "Can't find Send Task").to.exist;
@ -99,38 +99,34 @@ describe('Messages should work', function () {
// THEN - there are correlations.
const correlations = findGroupEntry('messageCorrelations', container);
expect(correlations, "Can't find the message correlations").to.exist;
console.log('Message Correlations: ');
});
it('should add a new correlation when clicked', async function () {
// Select the second Task
const send_shape = await expectSelected('ActivitySendLetter');
expect(send_shape, "Can't find Send Task").to.exist;
const buttonClass =
'bio-properties-panel-group-header-button bio-properties-panel-add-entry';
const button = findButtonByClass(buttonClass, container);
pressButton(button);
console.log(button);
});
it('should add a new Correlation Key when clicked', async function () {
const divClass = 'bio-properties-panel-list';
const divs = findDivByClass(divClass, container);
const buttonClass =
'bio-properties-panel-group-header-button bio-properties-panel-add-entry';
const button = findButtonByClass(buttonClass, container);
pressButton(button);
// THEN - a select Data Object section should appear in the properties panel
const entry = findGroupEntry('correlation_keys', container);
expect(entry).to.exist;
const divs2 = findDivByClass(divClass, container);
console.log(button);
});
// it('should add a new correlation when clicked', async function () {
// // Select the second Task
// const send_shape = await expectSelected('ActivitySendLetter');
// expect(send_shape, "Can't find Send Task").to.exist;
//
// const buttonClass =
// 'bio-properties-panel-group-header-button bio-properties-panel-add-entry';
// const button = findButtonByClass(buttonClass, container);
// pressButton(button);
//
// console.log(button);
// });
//
// it('should add a new Correlation Key when clicked', async function () {
// const divClass = 'bio-properties-panel-list';
// const divs = findDivByClass(divClass, container);
//
// const buttonClass =
// 'bio-properties-panel-group-header-button bio-properties-panel-add-entry';
// const button = findButtonByClass(buttonClass, container);
// pressButton(button);
//
// // THEN - a select Data Object section should appear in the properties panel
// const entry = findGroupEntry('correlation_keys', container);
// expect(entry).to.exist;
//
// const divs2 = findDivByClass(divClass, container);
// });
});