Skip to content

Stop propagation of the Escape event when looker is a Modal [FOEPD-862] #6387

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 6 commits into from
Nov 6, 2025
+19 −1
Merged

Stop propagation of the Escape event when looker is a Modal [FOEPD-862] #6387

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
9c5dc05
Improve user experience when using Escape key
jleven Oct 7, 2025
7fed8d5
only open confirm dialog when some samples are selected
jleven Oct 21, 2025
038db0f
only open confirm dialog when some samples are selected
jleven Oct 25, 2025
3e9d53d
add isModal explicitly to looker's state.config
jleven Oct 25, 2025
d450206
accept esc confirmation in selection spec
benjaminpkane Nov 5, 2025
633d88b
Update e2e-pw/src/oss/specs/selection.spec.ts
benjaminpkane Nov 5, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 11 additions & 1 deletion app/packages/core/src/components/Grid/useEscape.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,17 @@ const useEscape = () => {
}

const modal = await snapshot.getPromise(fos.modalSelector);
modal === null && reset(fos.selectedSamples);
const selectedSampleIds = await snapshot.getPromise(
fos.selectedSamples
);
// TODO: modal is always `null` here right after a modal closes, so this isn't the condition we want
if (modal === null && selectedSampleIds.size > 0) {
Comment on lines +24 to +25
Copy link
Contributor

@benjaminpkane benjaminpkane Nov 4, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure I understand. This seems to work. I assume only if propagation is stopped in looker?

Copy link
Contributor Author

@jleven jleven Nov 5, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think modal === null was put here to try to accomplish what this PR is actually accomplishing. Unfortunately, modal is always null here, so we do need this PR.

if (
confirm("Are you sure you want to clear your current selection?")
) {
reset(fos.selectedSamples);
}
}
},
[]
)
Expand Down
5 changes: 5 additions & 0 deletions app/packages/looker/src/elements/common/looker.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,13 +30,18 @@ export class LookerElement<State extends BaseState> extends BaseElement<
SHORTCUTS,
error,
options: { shouldHandleKeyEvents },
config: { isModal },
} = state;
if (!error && e.key in SHORTCUTS) {
const matchedControl = SHORTCUTS[e.key] as Control;
const enabled =
shouldHandleKeyEvents || matchedControl.alwaysHandle;
if (enabled) {
matchedControl.action(update, dispatchEvent, e.key, e.shiftKey);

if (e.key === "Escape" && isModal) {
e.stopPropagation();
}
}
}

Expand Down
1 change: 1 addition & 0 deletions app/packages/looker/src/state.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -223,6 +223,7 @@ export interface BaseConfig {
id: string;
name: string;
};
isModal?: boolean;
}

export interface FrameConfig extends BaseConfig {
Expand Down
1 change: 1 addition & 0 deletions app/packages/state/src/hooks/useCreateLooker.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -159,6 +159,7 @@ export default <T extends AbstractLooker<BaseState>>(
thumbnail,
view,
shouldHandleKeyEvents: isModal,
isModal,
};

let sampleMediaFilePath = urls[mediaField];
Expand Down
1 change: 1 addition & 0 deletions e2e-pw/src/oss/specs/selection.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,6 +71,7 @@ test.describe.serial("selection", () => {
// verify selection clears on escape
await grid.toggleSelectFirstSample();
await grid.assert.isSelectionCountEqualTo(1);
page.once("dialog", (dialog) => dialog.accept());
await page.press("body", "Escape");
await grid.assert.isSelectionCountEqualTo(0);

Expand Down
Loading