Handling Vuex Store object changes with localStorage

Problem: "Cannot read property 'length' of undefined" (usually for artboards.length).

Current workaround: Try clearing your local storage by opening the DevTools > Application > Local Storage > file:// > and then delete the Reflex key. After reloading the app it should work again.

Cause: This problem typically occurs when the data model for something like artboards has changed, but the view is trying to load data from the localStorage which contains an older format/different properties.

Root cause: Currently we're using the vuex-persist plugin, which saves Vuex Store data in the Electron app's localStorage. When there are changes to the properties or structure of the Vuex Store, this error can occur, because the view is trying to render properties of an object that differ from the localStorage (which was an old copy of the Vuex Store objects).

I am not sure how to avoid this problem currently, and am open to ideas.

One workaround solution could be to add an OS-level menu item that allows users to "Clear localStorage". Or to automatically trigger this function and reload the app if such an error is detected.

The issue names Vuex persistence through the Electron app's localStorage and the Reflex key, but no source files or tests. Start by locating the vuex-persist setup and the code that reads artboards, then define how older stored data should be handled and verify that the app no longer fails after a store shape change.