#How should this dropdown menu be implemented?

1 messages · Page 1 of 1 (latest)

cedar nexus
#

I think I should probably use spawn, and I see a recursive structure that allows me to keep opening the nested menu when I press the nested menu button.
It also reminds me of the composite pattern and file systems.
But I can't think of a way to model this as a state machine.
Do you have any ideas or resources for modeling this dropdown as a state machine?

worldly tapir
#

You might want to use a pre-built component library for something like this, e.g. Radix

cedar nexus
#

Hmm... Of course I know radix, but I wanted to try making it myself using a state machine.

In the meantime, I created components such as dialogs, accordions, and tabs using state machines. I asked because I had no idea about components with nested structures, such as drop-down menus.

Thanks for the reply

worldly tapir
#

The way that I would model this is by having two states: closed and opened, and having context.highlighted with an ID

#

Why only one context.highlighted? Because the rest (open menus) can be derived from that

cedar nexus
#

good idea,
If I think about it further, the menu list that opens by pressing the Edit button in the drop-down photo I uploaded and the opening of another menu list by pressing the Find button are structurally the same, so, um, I think it's a nested structure of the same state machine.

#

So what I'm thinking about right now is...

When the items in a menu list are called MenuItems, there are menus that trigger other menu lists and menus that do not.

If we express this as a type,

type MenuItem = { type: "item" } | { type: "menu", items: MenuItem[] }

It can be expressed like this,
Here I add {type: "menu", items: MenuItem[], ref: ActorRef<...> }
I'm going to make it like this and try to spawn.

This is because I think that each menu state should be managed using an actor.

Am I making it too complicated?
Of course, I have to implement it,,, but I failed to implement it all day today, so this is my last idea haha

worldly tapir
#

That may be a little too complicated because each menu is really just showing/hiding and not doing anything else

#

That is, the menus don't have a "mind of their own"