Dynamic Navigation Bar

Show and Tell
1

I was looking around today to see how to do a dynamic navigation bar, where links in the navbar appear and disappear based on the actions the user is taking (for me, primarily logging in and out, but could be anything). I found a very helpful post that laid out how to do that for logging in and out, but after I implemented it I realized what I really wanted was a set of generic routines I could pass a dictionary into and have the navbar automatically populate.

So I wrote that. It works pretty well, although I’m sure there are many things I could be doing better. Here’s the code for anyone who needs similar functionality.

Note that since the navbar is created in the init of each form, you can have a shared navbar without replacing content panes, if that’s what you want for your app. That also opens up the possibility of having a shared navbar across most forms, but changing it for specific forms.

Not very well documented, but it’s pretty basic.

https://anvil.works/ide#clone:CFRAKIMRFDASDTOH=2MN43QP455YKAHALFYJLKRGE

4 Likes
2

For anyone following (or using) this, I made some changes that make it more of a full-fledged demo of using both the dynamic navigation bar and using a main form whose content pane is used to hold subforms as navigation bar links are clicked. Included is a form that can only be accessed by admins, to show how I normally do that.

This is basically what I start with for most of my apps now, so I wanted a single thing I could clone instead of copying and pasting from a couple of apps.

3 Likes
3

I took what you’ve done (nice job, by the way) and merged it with some of the ideas I’ve been using in this area for a while. Here’s the result:

https://anvil.works/build#clone:XU6TLEZFX5NQNQLL=DDGVJPM4XFS4QBVQ2UTPGUTJ

I tend to set this as a dependency for new apps (and I have a couple of others that do some common things that I often need).

2 Likes
4

Very cool! I like the idea of having various dependencies to mix and match depending on what common features a particular app needs, and having all the dependencies work well together.