Rename properties automatically everywhere

💬 Feature Requests
1

Many times we need to rebind data because I changed names. For instance, let's say I have a temp state variable that has some default property names. I decided to change the name for one. Currently, if I do so, then I will have to manually rename this everywhere across all pages like JS scripts, inspector fields etc... This can heavily be time-consuming plus I might miss renaming some leaving broken scripts. I have done this a many time before so having an automatic renaming option will help a lot. Currently, only the queries, js scripts and variables automatically get renamed but we not the content inside.

A small example is let's say i have a temp state called global_state. it's an object with those values

{
"theme" : "light",
"language": "en"
}

Everything in my app I set {{ global_state.value?.theme === 'dark' ? '#000' : '#fff' }}

If i renamed "theme" to something else like for instance "mode", then the bounded values won't automatically rename. I will still get this

{
"mode": "",
"theme" : "light",
"language": "en"
}

And so i have to go across each page and for rename each component's properties to use the new name I just set. This could be quite useful and time-saving if this gets implemented.

1 Like
4

Hey @Retooler thanks for the detailed write-up, totally understand the frustration here. I agree this would be useful and time-saving when building. I've gone ahead and filed this as a feature request internally. In the meantime, there are two workarounds:

  1. Find in code: do a "Code search" in the Retool editor to locate each occurrence and update them manually.
  2. Source control + IDE find & replace: if you're on source control, pull your branch locally, do a global find & replace in VS Code (or any IDE), then push the changes back and sync your Retool branch.

I'll update when I hear back, thanks! :folded_hands:

5

+1 for this. This kind of rename support would make refactoring much safer.

Right now it’s easy to rename a variable/property and think everything is fine, but then a hidden binding somewhere still points to the old path and only breaks at runtime. For small projects it’s manageable, but with multiple pages it becomes a pretty tedious search-and-fix process.

An IDE-style "rename symbol" behavior would be ideal here — detect references in bindings, scripts, inspector values, etc. and update them together. Even a confirmation dialog showing all affected places would already help a lot.

6

Hey @Hatint, great callout, the confirmation dialog idea in particular is a really practical starting point. I've passed that feedback along internally. :+1: