My goal: use a variable to determine components’ hidden state.
Issue: The variable’s value is updating based on its underlying reference (resource query results), verified in multiple ways, but the components which reference that variable for their hidden state aren’t updating properly, i.e. not hiding when they should.
Steps I've taken to troubleshoot: Checked states or live evaluations in multiple places; they obviously conflict.
Additional info: (Cloud or Self-hosted, Screenshots)
The component’s hidden state is clearly evaluating to true, however the component is not hiding: there’s no eye with a line through it icon, as designated hidden components when their “Always show in edit mode” flag is on; it shows in Preview mode; and the component’s state in the left pane clearly states hidden:false.
This is a contradiction. I would expect the evaluation of the Hidden value on the right pane to drive the behavior.
To make matters worse, if I cut {{ _.isNil(firstMatchedUser_var.value) }} and re-paste it in, then the component will hide: it’ll get the eye icon and the left pane will change to hidden: true:
Given the above, I don’t think i’m doing anything wrong; I’ve used variable with dynamic values for hiding components for years in Retool. It’s happening for other components in this app. This feels broken.
I’m on Retool Cloud, v3.385.0-9d273a3 (Build 334052)
i can get the behavior i want with a transformer instead of the variable, but why should i have to resort to that? the variable is a simple reference; it doesn’t need transformation.
and variables can be dynamic; their value can be the result of something that changes. i’m using variables with dynamic values in other manners throughout this app ostensibly without issue; it’s just this hiding logic that seems broken.
if what i’m doing is wrong, why is it so easily allowed, and so confusing with what some of Retool’s own inspector tools are telling me vs the others that contradict those?
I tried to reproduce what you're seeing using the same {{_.isNil(firstMatchedUser_var.value) }} expression along with a REST API resource query to dynamically update the variable, but the component behaved as expected on my end, with the state and inspector values staying in sync.
Sorry you’re running into this and I’m glad you found a workaround in the meantime! I’d be happy to dig into this further. Can you DM me a JSON export of your app please? It would be helpful to see how you’re updating the variable so I can try and replicate what's showing in your screenshot.
