Detecting step editor unmount

[tskomudek]

Hi Bart,

when using a custom step editor in the react designer, i have the problem to loose the current changes in the form when the user accidentally clicks into the editor space and the stepeditor component gets unmounted.

I remember you wrote somewhere that this is currently not possible in the react version, but do you have an idea how to work around this ?

Thanks a lot

Tilo

[b4rtaz]

Hello @tskomudek,

basically you can always save the latest value in the step like:

<input type="text" ... onChange={e => setProperty('x', e.value)} />

So in the definition you will have allways the latest changes.

If you have a save step between changing values and applying them, then you can create a hidden property in the step, such as deltaX.

<input type="text" ... onChange={e => setProperty('deltaX', e.value)} />

During saving changes you need to move values to a final property (deltaX => x).

[b4rtaz]

@tskomudek have you resolved the problem?

[tskomudek]

Not really. Yes, i can store the modified data somewhere, but i'd rather ask the user if he wants to navigate away from the current step without saving. Do you have any other idea how to achive this ?

Thx Tilo

[b4rtaz]

It looks like you need a canCloseEditor callback or something like this. Yeah, it's not available now.

Maybe a temporary solution would be to use the isSelectable callback 🤔, something like:

isSelectable: (step) => {
   if (hasUnsavedChanges()) return window.confirm('You have unsaved data in the editor...');
   // ...
}

[ShraddhaFutrey]

When i integrated sequential-workflow-designer-angular in my existing project in place of router outlet but its not getting initialised properly...svg not taking full height and toolbox not getting initialized

I followed angular demo example -initialize with angular please let me know what could be the reason thanks a lot!!

[b4rtaz]

@ShraddhaFutrey it looks like the parent layers have not set any height constraints. The designer doesn't stretch parents, it adjusts to available space. You can check this theory by setting CSS:

.sqd-designer {height: 900px;}

BTW: please don't add comments to not related threads.

[tskomudek]

Hi Bart,

the isSelectable callback would help partially, but it doesn´t cover when the user just clicks into the canvas and the root editor appears or the user drags a new step from the toolbox. An isUnselectable or canCloseEditor callback would be more suitable. Also, the onSelectedStepIdChanged event doesn't help here, since when it's called the stepeditor is already unmounted. Maybe its worth considering at least.

Thanks Tilo

[b4rtaz]

@tskomudek yes, this feature is planned but with a low priority. If you need this feature faster you can request it under the consulting service.