fix(web): make layout and direction settings reactive in UI

Fixed issue #5194 where changing the layout (List/Masonry) or sort direction
didn't update the UI until page refresh. The root cause was that ViewState
fields weren't marked as MobX observables, so the UI didn't react to changes
even though values were being persisted to localStorage.

Solution: Added constructor to ViewState that marks orderByTimeAsc and layout
fields as observable, following the same pattern used in other stores like
MemoFilterState.

Fixes #5194

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
pull/5203/head
Steven 1 week ago
parent 91a7e927a5
commit 5f7c758f38

@ -4,6 +4,7 @@
* Manages UI display preferences and layout settings. * Manages UI display preferences and layout settings.
* This is a client state store that persists to localStorage. * This is a client state store that persists to localStorage.
*/ */
import { makeObservable, observable } from "mobx";
import { StandardState } from "./base-store"; import { StandardState } from "./base-store";
const LOCAL_STORAGE_KEY = "memos-view-setting"; const LOCAL_STORAGE_KEY = "memos-view-setting";
@ -30,6 +31,14 @@ class ViewState extends StandardState {
*/ */
layout: LayoutMode = "LIST"; layout: LayoutMode = "LIST";
constructor() {
super();
makeObservable(this, {
orderByTimeAsc: observable,
layout: observable,
});
}
/** /**
* Override setPartial to persist to localStorage * Override setPartial to persist to localStorage
*/ */

Loading…
Cancel
Save