Without adding this logic, the BookmarksMenu will not reflect any new bookmarks that are added unless you refresh the browser. The reason is because the menu is always mounted, as it lives at the App layer, though hidden off screen. This means that the useEffect() call only happens once, when the app is first loaded.
By capturing the isOpen variable in the useEffect()'s dependency list, we can retrigger the useEffect() call whenever the menu is opened, causing it to be updated with the latest state of the user's bookmarks.
I missed this during local development, since prior to me moving the dashboard page to the / route, I had to manually type in the URL of the dashboard page to get back there. This effectively forced a page refresh, causing the app to be loaded from scratch, and the BookmarksMenu receiving the latest bookmarks state. Thankfully, I caught this when doing final testing after deploying to prod. I'm going to deploy this as soon as this passes CI.
Without adding this logic, the BookmarksMenu will not reflect any new bookmarks that are added unless you refresh the browser. The reason is because the menu is always mounted, as it lives at the
Applayer, though hidden off screen. This means that theuseEffect()call only happens once, when the app is first loaded.By capturing the
isOpenvariable in theuseEffect()'s dependency list, we can retrigger theuseEffect()call whenever the menu is opened, causing it to be updated with the latest state of the user's bookmarks.I missed this during local development, since prior to me moving the dashboard page to the
/route, I had to manually type in the URL of the dashboard page to get back there. This effectively forced a page refresh, causing the app to be loaded from scratch, and the BookmarksMenu receiving the latest bookmarks state. Thankfully, I caught this when doing final testing after deploying to prod. I'm going to deploy this as soon as this passes CI.