diff --git a/packages/core/src/renderer/components/namespace-select-filter/__snapshots__/namespace-select-filter.test.tsx.snap b/packages/core/src/renderer/components/namespace-select-filter/__snapshots__/namespace-select-filter.test.tsx.snap index b4d72bb7eb..a7a0c15d66 100644 --- a/packages/core/src/renderer/components/namespace-select-filter/__snapshots__/namespace-select-filter.test.tsx.snap +++ b/packages/core/src/renderer/components/namespace-select-filter/__snapshots__/namespace-select-filter.test.tsx.snap @@ -17,7 +17,7 @@ exports[` once the subscribe resolves renders 1`] = ` > @@ -26,7 +26,7 @@ exports[` once the subscribe resolves renders 1`] = ` /> @@ -69,7 +69,7 @@ exports[` once the subscribe resolves when clicked rend > @@ -78,7 +78,7 @@ exports[` once the subscribe resolves when clicked rend /> @@ -731,7 +731,7 @@ exports[` once the subscribe resolves when clicked when > @@ -740,7 +740,7 @@ exports[` once the subscribe resolves when clicked when /> @@ -783,7 +783,7 @@ exports[` once the subscribe resolves when clicked when > @@ -792,7 +792,7 @@ exports[` once the subscribe resolves when clicked when /> @@ -1445,7 +1445,7 @@ exports[` once the subscribe resolves when clicked when > @@ -1454,7 +1454,7 @@ exports[` once the subscribe resolves when clicked when /> @@ -1497,7 +1497,7 @@ exports[` once the subscribe resolves when clicked when > @@ -1506,7 +1506,7 @@ exports[` once the subscribe resolves when clicked when /> @@ -2159,7 +2159,7 @@ exports[` once the subscribe resolves when clicked when > @@ -2168,7 +2168,7 @@ exports[` once the subscribe resolves when clicked when /> @@ -2821,7 +2821,7 @@ exports[` once the subscribe resolves when clicked when > @@ -2830,7 +2830,7 @@ exports[` once the subscribe resolves when clicked when /> @@ -3483,7 +3483,7 @@ exports[` once the subscribe resolves when clicked when > @@ -3492,7 +3492,7 @@ exports[` once the subscribe resolves when clicked when /> @@ -4145,7 +4145,7 @@ exports[` once the subscribe resolves when clicked when > @@ -4154,7 +4154,7 @@ exports[` once the subscribe resolves when clicked when /> @@ -4807,7 +4807,7 @@ exports[` once the subscribe resolves when clicked when > @@ -4816,7 +4816,7 @@ exports[` once the subscribe resolves when clicked when /> @@ -4859,7 +4859,7 @@ exports[` once the subscribe resolves when clicked when > @@ -4868,10 +4868,8 @@ exports[` once the subscribe resolves when clicked when /> + for="namespace-select-filter-input" + />
@@ -5161,7 +5159,7 @@ exports[` once the subscribe resolves when clicked when > @@ -5170,10 +5168,8 @@ exports[` once the subscribe resolves when clicked when /> + for="namespace-select-filter-input" + />
@@ -5446,6 +5442,58 @@ exports[` once the subscribe resolves when clicked when `; +exports[` once the subscribe resolves when clicked when typing in the filter input when pressing the 'Enter' key renders 1`] = ` + +
+
+ + +`; + exports[` once the subscribe resolves when menu expand icon is clicked renders 1`] = `
@@ -5463,7 +5511,7 @@ exports[` once the subscribe resolves when menu expand > @@ -5472,7 +5520,7 @@ exports[` once the subscribe resolves when menu expand /> @@ -6125,7 +6173,7 @@ exports[` once the subscribe resolves when menu expand > @@ -6134,7 +6182,7 @@ exports[` once the subscribe resolves when menu expand /> @@ -6177,7 +6225,7 @@ exports[` once the subscribe resolves with thousands of > @@ -6186,7 +6234,7 @@ exports[` once the subscribe resolves with thousands of /> @@ -6229,7 +6277,7 @@ exports[` once the subscribe resolves with thousands of > @@ -6238,7 +6286,7 @@ exports[` once the subscribe resolves with thousands of /> @@ -6981,7 +7029,7 @@ exports[` once the subscribe resolves with thousands of > @@ -6990,7 +7038,7 @@ exports[` once the subscribe resolves with thousands of /> diff --git a/packages/core/src/renderer/components/namespace-select-filter/component.tsx b/packages/core/src/renderer/components/namespace-select-filter/component.tsx index 2bc1114e12..fba7de3d30 100644 --- a/packages/core/src/renderer/components/namespace-select-filter/component.tsx +++ b/packages/core/src/renderer/components/namespace-select-filter/component.tsx @@ -43,6 +43,7 @@ const NamespaceSelectFilterMenu = observer(({ id, model }: Dependencies & Namesp value={model.filterText.get()} onChange={(event) => model.filterText.set(event.target.value)} onClick={model.menu.open} + onKeyDown={model.input.onKeyDown} data-testid="namespace-select-filter-input" /> diff --git a/packages/core/src/renderer/components/namespace-select-filter/model.injectable.ts b/packages/core/src/renderer/components/namespace-select-filter/model.injectable.ts index 7594de276f..ba0338bbd1 100644 --- a/packages/core/src/renderer/components/namespace-select-filter/model.injectable.ts +++ b/packages/core/src/renderer/components/namespace-select-filter/model.injectable.ts @@ -34,6 +34,9 @@ export interface NamespaceSelectFilterModel { onKeyDown: React.KeyboardEventHandler; onKeyUp: React.KeyboardEventHandler; }; + readonly input: { + onKeyDown: React.KeyboardEventHandler; + }; onClick: (options: NamespaceSelectFilterOption) => void; deselect: (namespace: string) => void; select: (namespace: string) => void; @@ -158,6 +161,17 @@ const namespaceSelectFilterModelInjectable = getInjectable({ } }, }, + input: { + onKeyDown: (event) => { + if (event.key === "Enter") { + const options = filteredOptions.get().slice(1); + + if (options.length >= 1) { + model.onClick(options[0]); + } + } + }, + }, onClick: action((option) => { if (option.value === selectAllNamespaces) { namespaceStore.selectAll(); diff --git a/packages/core/src/renderer/components/namespace-select-filter/namespace-select-filter.test.tsx b/packages/core/src/renderer/components/namespace-select-filter/namespace-select-filter.test.tsx index 9260063cd6..65c15a4ff1 100644 --- a/packages/core/src/renderer/components/namespace-select-filter/namespace-select-filter.test.tsx +++ b/packages/core/src/renderer/components/namespace-select-filter/namespace-select-filter.test.tsx @@ -374,6 +374,24 @@ describe("", () => { it("does not show 'test-2' option", () => { expect(result.queryByTestId("namespace-select-filter-option-test-2")).not.toBeInTheDocument(); }); + + describe("when pressing the 'Enter' key", () => { + beforeEach(() => { + userEvent.keyboard("{enter}"); + }); + + it("renders", () => { + expect(result.baseElement).toMatchSnapshot(); + }); + + it("closes the menu", () => { + expect(result.queryByTestId("namespace-select-filter-list-container")).not.toBeInTheDocument(); + }); + + it("has only 'test-1' as selected in the store", () => { + expect(namespaceStore.contextNamespaces).toEqual(["test-1"]); + }); + }); }); describe("when typing a glob style filter into the filter input", () => {