Close zoom menu when toggling minimap visibility (#5974)

## Summary

Closes the zoom menu popup when clicking show/hide minimap to prevent
the menu from remaining open after toggling.

## Changes

- **What**: Adds `close` event emission from `ZoomControlsModal` when
minimap toggle is clicked, wired to `hideModal` in parent
`GraphCanvasMenu`
- **Tests**: Adds unit tests verifying close behavior for minimap toggle
vs other commands

## Review Focus

This fixes the immediate UX issue where the zoom popup remained open
after toggling minimap visibility. However, the minimap toggle's
placement within the zoom menu is **not** ideal—it's not intuitive to
look for minimap controls within zoom controls. This PR addresses the
current UX friction without tackling the broader discoverability issue.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5974-Close-zoom-menu-when-toggling-minimap-visibility-2866d73d365081bdbb0bfeb0da4b8c2b)
by [Unito](https://www.unito.io)

---------

Co-authored-by: DrJKL <DrJKL0424@gmail.com>
This commit is contained in:
filtered
2025-10-09 15:51:10 +11:00
committed by GitHub
parent b943c0fa75
commit 8188029c6c
4 changed files with 153 additions and 101 deletions

View File

@@ -1,6 +1,6 @@
<template>
<div>
<ZoomControlsModal :visible="isModalVisible" />
<ZoomControlsModal :visible="isModalVisible" @close="hideModal" />
<!-- Backdrop -->
<div

View File

@@ -158,6 +158,10 @@ interface Props {
const props = defineProps<Props>()
const emit = defineEmits<{
close: []
}>()
const interval = ref<number | null>(null)
// Computed properties for reactive states
@@ -177,6 +181,9 @@ const applyZoom = (val: InputNumberInputEvent) => {
const executeCommand = (command: string) => {
void commandStore.execute(command)
if (command === 'Comfy.Canvas.ToggleMinimap') {
emit('close')
}
}
const startRepeat = (command: string) => {