Insert camouflaged text in ace editor

Question

I am using Ace Editor (in React-Ace) to allow to insert programming snippets on my platform.

What i am trying to do right now it to had one work, but camouflaged so that i do not expose some internal information.

For example i want to append $[internal_flow_vars\["0f912efd-a2ab-46be-b908-0a6201486a0d\"].passageCount] but i do not want to show the uuid, i just want to show ${passageCount}

The text would look like (user sees)

Hello its my ${passageCount} turn

But then the script generated would need to be (machine sees)

Hello its my $[internal_flow_vars\["0f912efd-a2ab-46be-b908-0a6201486a0d\"].passageCount] turn

Thank you for your time

Answer 1

This depends on what editing interactions do you want to allow for the user.

The simplest solution that also would give the user the most freedom in editing is to keep all the information needed to restore uids in a text, for example by keeping a map from uids to short numbers outside the editor, and showing the user something like ${passageCount,5}.

Another solution is to use folds, but that want work well if the user is allowed to copy the whole code snippet and paste in another place.

The third solution is to use highlight mode to not display parts of the text, but user still will be able to copy them.