It's really fantastic how we can edit an App "live" in front of our eyes, with queries running and data being displayed and updated even as we work.
But I find sometimes a bit of a risk - if I want to move a button, for example, which cause an action to happen - it could be quite bad if the action (delete/update/add etc) happened unintentionally.
I know if you are careful it's possible to distinguish between clicking in the middle to activate a button, clicking on the name to open the attributes panel and clicking on the edge to move or re-size a component.
But I find it also very easy to click wrongly and have to try again to get what I want.
So I wondered whether there is a way to temporarily "switch off" all actions whilst adjusting the layout of components so I don't activate something by mistake.
Hi @davblo,
This is a very common and valid concern when editing Retool apps where one misclick could trigger a query unintentionally.
Unfortunately, Retool does not currently offer a built-in “safe edit” or “layout-only” mode that completely disables all interactivity (like buttons or inputs) while in edit mode.
The safest way is to setup a Retool Environments to prevent risky actions.
Each environment (e.g., development, staging, production) can have:
- Different resource credentials (e.g., a dev vs. prod database)
- Separate query behavior and permissions
This allows you to test layout and logic in a sandbox environment without risking real data.
As an alternative, you can also set up a global “editing mode” variable to disable actions temporarily:
Create a temporary state variable: editingMode = true.
Then on each button/component that triggers a query, wrap the logic like this: {{ editingMode.value ? null : myQuery.trigger() }}.
Hopefully this helps.
1 Like
Thanks for the reply.
I guess I'm already using the "sandbox" solution you suggest. I have separate servers and backup/copies of the database so I can recover from any serious mishaps.
But an on/off switch could be a good safety measure I think.
(Just to note, there is also a "Disable" option on each button which could be set simply {{ "editingMode.value" }}. It greys out the buttons but they can still be re-positioned.)
It sounds like you are already on the right track to protecting your data.
I would be happy if they had an on/off switch as well. As you mentioned, it would be handy when working more with the UI than the code. 
Yes, the disable and hidden options are handy. I use them often if a user shouldn't use a component or needs to perform a task before the button is enabled.