Skip to content
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

Jump to bottom

feat: Improve UX of namespace select filter #7783

Open
wants to merge 16 commits into
base: master
Choose a base branch
from
Open

feat: Improve UX of namespace select filter #7783

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
16 commits
Select commit Hold shift + click to select a range
151a393
feat: Improve UX of namespace select filter
Nokel81 May 23, 2023
5811695
chore: Start moving namespace-select-filter to own folder
Nokel81 May 24, 2023
8fc9fc7
chore: Refactor isSelectionKey
Nokel81 May 24, 2023
b619eb5
chore: Consolidate namespace-select-filter model into single file
Nokel81 May 24, 2023
ce11ef0
chore: Rename namespace-select-filter component file
Nokel81 May 24, 2023
fa7bc2e
chore: Fixup previous namespace-select-filter unit tests
Nokel81 May 24, 2023
ec1b88b
chore: Add more test for namespace-select-filter to cover new behaviour
Nokel81 May 24, 2023
e528c72
chore: Add tests for large number of namespaces
Nokel81 May 25, 2023
839fa64
chore: Update snapshots due to new behaviour of namespace-select-filter
Nokel81 May 26, 2023
b2d1adf
chore: Update smoke test to fix selector due to new namespace-select-…
Nokel81 May 26, 2023
5ae2f7d
chore: Fixup NamespaceSelectFilter after rebase
Nokel81 May 31, 2023
40bca3b
chore: Fix integration test because of new behaviour
Nokel81 May 31, 2023
72a4841
fix: Filtering text of NamespaceSelectFilter shouldn't look bold
Nokel81 May 31, 2023
adc4d40
feat: Add support for using 'Enter' to quickly switch to a filtered n…
Nokel81 May 31, 2023
3a6539e
chore: Update snapshots
Nokel81 May 31, 2023
6d3342e
chore: Update custom-resources-in-sidebar snapshots
Nokel81 Jun 1, 2023
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
9 changes: 4 additions & 5 deletions open-lens/integration/__tests__/cluster-pages.tests.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -106,14 +106,13 @@ describeIf(minikubeReady(TEST_NAMESPACE))("Minikube based tests", () => {

await navigateToPods(frame);

const namespacesSelector = await frame.waitForSelector(
".NamespaceSelect",
);
const namespacesSelector = await frame.waitForSelector(".namespace-select-filter .menu .non-icon label");

await namespacesSelector.click();
await namespacesSelector.type(TEST_NAMESPACE);
await namespacesSelector.press("Enter");
await namespacesSelector.click();
await frame.page().keyboard.press("Tab", { delay: 10 });
await frame.page().keyboard.press("Tab", { delay: 10 });
await frame.page().keyboard.press("Enter", { delay: 10 });

await frame.click(".Icon.new-dock-tab");

Expand Down
2 changes: 1 addition & 1 deletion packages/core/src/extensions/renderer-api/components.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -94,7 +94,7 @@ export * from "../../renderer/components/stepper";
export * from "../../renderer/components/wizard";
export * from "../../renderer/components/workloads-pods/pod-details-list";
export * from "../../renderer/components/namespaces/namespace-select";
export * from "../../renderer/components/namespaces/namespace-select-filter";
export * from "../../renderer/components/namespace-select-filter/component";
export * from "../../renderer/components/layout/sub-title";
export * from "../../renderer/components/input/search-input";
export * from "../../renderer/components/chart/bar-chart";
Expand Down
784 changes: 256 additions & 528 deletions packages/core/src/features/cluster/__snapshots__/custom-resources-in-sidebar.test.tsx.snap
View file
Open in desktop

Large diffs are not rendered by default.

98 changes: 32 additions & 66 deletions ...ures/cluster/__snapshots__/legacy-extension-adding-cluster-frame-components.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -293,82 +293,48 @@ exports[`legacy extension adding cluster frame components given custom component
Overview
</h5>
<div
class="NamespaceSelectFilterParent"
class="namespace-select-filter"
data-testid="namespace-select-filter"
id="overview-namespace-select-filter-input"
tabindex="1"
>
<div
class="Select theme-dark NamespaceSelect NamespaceSelectFilter css-b62m3t-container"
class="menu"
>
<span
class="css-1f43avz-a11yText-A11yText"
id="react-select-overview-namespace-select-filter-input-live-region"
/>
<span
aria-atomic="false"
aria-live="polite"
aria-relevant="additions text"
class="css-1f43avz-a11yText-A11yText"
/>
<div
class="Select__control css-13cymwt-control"
class="non-icon"
>
<input
data-testid="namespace-select-filter-input"
id="overview-namespace-select-filter-input-input"
type="text"
value=""
/>
<div
class="Select__value-container Select__value-container--is-multi css-1fdsijx-ValueContainer"
class="gradient left"
/>
<label
data-testid="namespace-select-filter-label"
for="overview-namespace-select-filter-input-input"
>
<div
class="Select__placeholder css-1jqq78o-placeholder"
id="react-select-overview-namespace-select-filter-input-placeholder"
>
All namespaces
</div>
<div
class="Select__input-container css-qbdosj-Input"
data-value=""
>
<input
aria-autocomplete="list"
aria-describedby="react-select-overview-namespace-select-filter-input-placeholder"
aria-expanded="false"
aria-haspopup="true"
autocapitalize="none"
autocomplete="off"
autocorrect="off"
class="Select__input"
id="overview-namespace-select-filter-input"
role="combobox"
spellcheck="false"
style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
tabindex="0"
type="text"
value=""
/>
</div>
</div>
Namespaces:
</label>
<div
class="Select__indicators css-1hb7zxy-IndicatorsContainer"
>
<span
class="Select__indicator-separator css-1u9des2-indicatorSeparator"
/>
<div
aria-hidden="true"
class="Select__indicator Select__dropdown-indicator css-1xc3v61-indicatorContainer"
>
<svg
aria-hidden="true"
class="css-tj5bde-Svg"
focusable="false"
height="20"
viewBox="0 0 20 20"
width="20"
>
<path
d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
/>
</svg>
</div>
</div>
class="gradient right"
/>
</div>
<i
class="Icon expand-icon material interactive focusable"
data-testid="namespace-select-filter-expand-icon"
tabindex="0"
>
<span
class="icon"
data-icon-name="expand_more"
>
expand_more
</span>
</i>
</div>
</div>
</div>
Expand Down
Loading