hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Enable keyboard shortcuts automatically instead of requiring explicit listener to be used in the application

Browse Source 
Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>
This commit is contained in:
Janne Savolainen 2023-03-31 08:36:24 +03:00
parent e3a6162448
commit a0cfeb18c0
No known key found for this signature in database
GPG Key ID: 8C6CFB2FFFE8F68A
7 changed files with 356 additions and 5297 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5540
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

3
packages/business-features/keyboard-shortcuts/index.ts
View File

@ -1,6 +1,3 @@
export { KeyboardShortcutListener } from "./src/keyboard-shortcut-listener";
export type { KeyboardShortcutListenerProps } from "./src/keyboard-shortcut-listener";
export { KeyboardShortcutScope } from "./src/keyboard-shortcut-scope"; export { KeyboardShortcutScope } from "./src/keyboard-shortcut-scope";
export type { KeyboardShortcutScopeProps } from "./src/keyboard-shortcut-scope"; export type { KeyboardShortcutScopeProps } from "./src/keyboard-shortcut-scope";

2
packages/business-features/keyboard-shortcuts/package.json
View File

@ -32,7 +32,7 @@
}, },
"peerDependencies": { "peerDependencies": {
"@k8slens/feature-core": "^6.5.0-alpha.0", "@k8slens/feature-core": "^6.5.0-alpha.0",
"@k8slens/application": "6.5.0-alpha.2", "@k8slens/react-application": "^1.0.0-alpha.0",
"@ogre-tools/injectable": "^15.1.2", "@ogre-tools/injectable": "^15.1.2",
"@ogre-tools/injectable-extension-for-auto-registration": "^15.1.2", "@ogre-tools/injectable-extension-for-auto-registration": "^15.1.2",
"@ogre-tools/fp": "^15.1.2", "@ogre-tools/fp": "^15.1.2",

18
packages/business-features/keyboard-shortcuts/src/__snapshots__/keyboard-shortcuts.test.tsx.snap
View File

@ -1,18 +1,14 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`keyboard-shortcuts when rendered renders 1`] = ` exports[`keyboard-shortcuts when application is started renders 1`] = `
<body> <body>
<div> <div>
<div> <div
<div> data-keyboard-shortcut-scope="some-scope"
<div data-keyboard-shortcut-scope-test="some-scope"
data-keyboard-shortcut-scope="some-scope" tabindex="-1"
data-keyboard-shortcut-scope-test="some-scope" >
tabindex="-1" <div />
>
<div />
</div>
</div>
</div> </div>
</div> </div>
</body> </body>

4
packages/business-features/keyboard-shortcuts/src/feature.ts
View File

@ -1,6 +1,6 @@
import { getFeature } from "@k8slens/feature-core"; import { getFeature } from "@k8slens/feature-core";
import { autoRegister } from "@ogre-tools/injectable-extension-for-auto-registration"; import { autoRegister } from "@ogre-tools/injectable-extension-for-auto-registration";
import { applicationFeature } from "@k8slens/application"; import { reactApplicationFeature } from "@k8slens/react-application";
export const keyboardShortcutsFeature = getFeature({ export const keyboardShortcutsFeature = getFeature({
id: "keyboard-shortcuts", id: "keyboard-shortcuts",
@ -13,5 +13,5 @@ export const keyboardShortcutsFeature = getFeature({
}); });
}, },
dependencies: [applicationFeature], dependencies: [reactApplicationFeature],
}); });

10
packages/business-features/keyboard-shortcuts/src/keyboard-shortcut-listener-react-application-hoc.injectable.tsx Normal file
View File

@ -0,0 +1,10 @@
import { getInjectable } from "@ogre-tools/injectable";
import { KeyboardShortcutListener } from "./keyboard-shortcut-listener";
import { reactApplicationHigherOrderComponentInjectionToken } from "@k8slens/react-application";
export const keyboardShortcutListenerReactApplicationHocInjectable = getInjectable({
id: "keyboard-shortcut-listener-react-application-hoc",
instantiate: () => KeyboardShortcutListener,
injectionToken: reactApplicationHigherOrderComponentInjectionToken,
});

76
packages/business-features/keyboard-shortcuts/src/keyboard-shortcuts.test.tsx
View File

@ -1,38 +1,34 @@
import userEvent from "@testing-library/user-event"; import userEvent from "@testing-library/user-event";
import type { RenderResult } from "@testing-library/react"; import type { RenderResult } from "@testing-library/react";
import { render } from "@testing-library/react";
import { createContainer, DiContainer, getInjectable } from "@ogre-tools/injectable"; import { createContainer, DiContainer, getInjectable } from "@ogre-tools/injectable";
import { registerInjectableReact } from "@ogre-tools/injectable-react"; import { registerInjectableReact } from "@ogre-tools/injectable-react";
import { registerMobX } from "@ogre-tools/injectable-extension-for-mobx";
import { keyboardShortcutInjectionToken } from "./keyboard-shortcut-injection-token"; import { keyboardShortcutInjectionToken } from "./keyboard-shortcut-injection-token";
import { registerFeature } from "@k8slens/feature-core"; import { registerFeature } from "@k8slens/feature-core";
import { keyboardShortcutsFeature } from "./feature"; import { keyboardShortcutsFeature } from "./feature";
import { renderFor } from "@k8slens/test-utils";
import React from "react"; import React from "react";
import { computed, runInAction } from "mobx";
import { KeyboardShortcutScope } from "./keyboard-shortcut-scope"; import { KeyboardShortcutScope } from "./keyboard-shortcut-scope";
import { Discover, discoverFor } from "@k8slens/react-testing-library-discovery"; import { Discover, discoverFor } from "@k8slens/react-testing-library-discovery";
import { KeyboardShortcutListener } from "./keyboard-shortcut-listener"; import { startApplicationInjectionToken } from "@k8slens/application";
import { renderInjectionToken } from "@k8slens/react-application";
const TestComponent = () => ( import { reactApplicationChildrenInjectionToken } from "@k8slens/react-application";
<KeyboardShortcutListener>
<div>
<div>
<KeyboardShortcutScope id="some-scope">
<div />
</KeyboardShortcutScope>
</div>
</div>
</KeyboardShortcutListener>
);
describe("keyboard-shortcuts", () => { describe("keyboard-shortcuts", () => {
let di: DiContainer; let di: DiContainer;
let invokeMock: jest.Mock; let invokeMock: jest.Mock;
let rendered: RenderResult;
beforeEach(() => { beforeEach(() => {
di = createContainer("irrelevant"); di = createContainer("irrelevant");
registerInjectableReact(di); registerInjectableReact(di);
registerMobX(di);
registerFeature(di, keyboardShortcutsFeature); runInAction(() => {
registerFeature(di, keyboardShortcutsFeature);
});
invokeMock = jest.fn(); invokeMock = jest.fn();
@ -70,21 +66,45 @@ describe("keyboard-shortcuts", () => {
injectionToken: keyboardShortcutInjectionToken, injectionToken: keyboardShortcutInjectionToken,
}); });
di.register( const childComponentForScopeInjectable = getInjectable({
someKeyboardShortcutInjectable, id: "some-child-component-for-scope",
someScopedKeyboardShortcutInjectable,
someOtherKeyboardShortcutInjectable, instantiate: () => ({
); id: "some-child-component-for-scope",
enabled: computed(() => true),
Component: () => (
<KeyboardShortcutScope id="some-scope">
<div />
</KeyboardShortcutScope>
),
}),
injectionToken: reactApplicationChildrenInjectionToken,
});
runInAction(() => {
di.register(
someKeyboardShortcutInjectable,
someScopedKeyboardShortcutInjectable,
someOtherKeyboardShortcutInjectable,
childComponentForScopeInjectable,
);
});
di.override(renderInjectionToken, () => (application) => {
rendered = render(application);
});
}); });
describe("when rendered", () => { describe("when application is started", () => {
let rendered: RenderResult;
let discover: Discover; let discover: Discover;
beforeEach(async () => { beforeEach(async () => {
const render = renderFor(di); const startApplication = di.inject(startApplicationInjectionToken);
rendered = render(<TestComponent />); await startApplication();
discover = discoverFor(() => rendered); discover = discoverFor(() => rendered);
}); });
@ -123,7 +143,9 @@ describe("keyboard-shortcuts", () => {
injectionToken: keyboardShortcutInjectionToken, injectionToken: keyboardShortcutInjectionToken,
}); });
di.register(conflictingShortcutInjectable); runInAction(() => {
di.register(conflictingShortcutInjectable);
});
userEvent.keyboard("{Escape}"); userEvent.keyboard("{Escape}");
@ -192,7 +214,9 @@ describe("keyboard-shortcuts", () => {
injectionToken: keyboardShortcutInjectionToken, injectionToken: keyboardShortcutInjectionToken,
}); });
di.register(shortcutInjectable); runInAction(() => {
di.register(shortcutInjectable);
});
userEvent.keyboard(keyboard); userEvent.keyboard(keyboard);