Skip to main content
Shane
February 26, 2021

LAUNCHED: State management for prototypes

  • February 26, 2021
  • 205 replies
  • 21529 views

Just struck a pretty simple use case/scenario where I need the component to reset it’s state when I leave the frame. This has been touched on elsewhere, but this is such a common and key use that I thought I’d put it in it’s own thread.

Scenario:
I’ve got a dropdown menu with three items in it, with each item changing what columns are visible in a table and some other control states. I have three frames, each with a view of the table setup as it should be, and want to use the dropdown items to navigate between the frames - basically faking the table state change. All of this works perfectly, however when I navigate back to a previous table view state, the dropdown component is already in it’s open state - not what I want.

Current workaround: none that I can come up with (other than not using interactive components at all for this, and just using multiple frames for the dropdown open/closed states as I would previously)

Suggestions:

  1. Have a “reset component on leaving this frame” setting for instances of a component on a frame - useful for this situation and others, but needs to be a setting so that components that should keep their state between frames can do so (light/dark toggle maybe? Something like that).
  2. Do it all in a single frame, with the dropdown component changing the the state of the table component - no frame navigation required. Would work nicely for the particular use case I’m working with here, but not sure it would solve all similar situations.
  3. Do both 1 and 2. This solution is my preferred solution 😉 😆

EDIT:
Other threads that relate:

205 replies

Dan2
New Participant
April 8, 2021

@Emiliano_Cicero Has this still been an issue for you?

Tristan_Harward
May 17, 2021

I’ve just run into this as well and it’s a pretty giant limitation I didn’t expect. Tough problem to solve, hope they have something for it soon.

But basically I can’t use interactive components in about half the cases I’d expect to be able to at this point.

Shane
ShaneAuthor
May 17, 2021

Yes, at this point I’m only using IC for simple, non-nested hover states 😢

Daniel_Jones
June 8, 2021

Having the same issue.

Interactive Components needs to recognize a component’s default state. Otherwise, when you’re using a click to change interaction, that change will persist through the entire prototype until you reload the prototype.

Jeff_French
June 15, 2021

I definitely hope this gets addressed (or at least acknowledged) during the beta. I’m able to use the overlay hack mentioned above in some, but not all cases.

Marko_Soonurm
New Member
June 18, 2021

Would something like this solve the issue?

Shane
ShaneAuthor
June 19, 2021

Something like this, yes 👍 But I think it belongs on the prototype tab of the sidebar, so that it’s alongside all the other prototyping settings for the component.

Richie_Roberts
July 5, 2021

Hi, we need this so badly too. Btw, enjoying everything in Interactive Components. Thanks so much 😀🙌🏼

J.D_Compton
New Member
July 14, 2021

(Maybe)Think this could be a simple boolean on the page/frame level to reset/lock states to whatever it is set to when navigating. So, if I had a checkbox, I could just toggle on lock state for that variant and when navigating back it would set/keep whatever the state was in whatever position in the flow.

Seth_Akkerman
July 26, 2021

Howdy! I think this is the right feedback channel for this concept. Please direct me to the correct one if I am wrong. This feature is pretty critical in my eyes for instances where we want the interaction to happen each time the trigger happens. I’m trying to use this for “on load” type events with a delay and I’m not sure how to trigger it each time a prototype page loads. For example. I have it fade in. The reason I don’t use a typical delay is that I want the animation sequences to overlap and this is the only way I can figure out how to do that.