fix(toolbar): version counter prevents stale unmount clearing config

Vue Router can mount the incoming component before unmounting the outgoing one.
Without a version guard, the old component's onUnmounted would null out the config
that the new component just set — causing toolbar groups to disappear on back-nav.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Nico 2026-04-03 23:02:44 +02:00
parent 8a6b1a533e
commit 571f04074a

View File

@ -28,12 +28,23 @@ export interface ToolbarConfig {
// --- Global reactive config — views write on mount/unmount, toolbar reads --- // --- Global reactive config — views write on mount/unmount, toolbar reads ---
// Cannot use provide/inject: AppToolbar is a sibling of <RouterView>, not a descendant. // Cannot use provide/inject: AppToolbar is a sibling of <RouterView>, not a descendant.
//
// Version counter: Vue Router may mount the new component before unmounting the old one.
// Without this, the old component's onUnmounted would clear config set by the new component.
const _config = ref<ToolbarConfig | null>(null); const _config = ref<ToolbarConfig | null>(null);
let _mountVersion = 0;
export function provideToolbar(config: ToolbarConfig) { export function provideToolbar(config: ToolbarConfig) {
onMounted(() => { _config.value = config; }); let myVersion = 0;
onUnmounted(() => { _config.value = null; }); onMounted(() => {
myVersion = ++_mountVersion;
_config.value = config;
});
onUnmounted(() => {
// Only clear if no newer component has taken ownership since we mounted.
if (myVersion === _mountVersion) _config.value = null;
});
} }
export function injectToolbar(): Ref<ToolbarConfig | null> { export function injectToolbar(): Ref<ToolbarConfig | null> {