This is an automated email from the ASF dual-hosted git repository.
jscheffl pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/airflow.git
The following commit(s) were added to refs/heads/main by this push:
new 9eecdac3ab7 Add shortcut key support for search dags. (#45908)
9eecdac3ab7 is described below
commit 9eecdac3ab79be7d0ad996f0973ce25f62959b78
Author: Karthikeyan Singaravelan <[email protected]>
AuthorDate: Fri Jan 31 01:40:08 2025 +0530
Add shortcut key support for search dags. (#45908)
* Add shortcut key support for search dags.
* Display meta key for respective OS.
---
airflow/ui/package.json | 1 +
airflow/ui/pnpm-lock.yaml | 14 ++++++++++++++
.../ui/src/components/SearchDags/SearchDagsButton.tsx | 16 ++++++++++++++--
airflow/ui/src/utils/{index.ts => getMetaKey.ts} | 4 +---
airflow/ui/src/utils/index.ts | 1 +
5 files changed, 31 insertions(+), 5 deletions(-)
diff --git a/airflow/ui/package.json b/airflow/ui/package.json
index 0526f20d4d0..322623e9db6 100644
--- a/airflow/ui/package.json
+++ b/airflow/ui/package.json
@@ -39,6 +39,7 @@
"react-chartjs-2": "^5.2.0",
"react-dom": "^18.3.1",
"react-hook-form": "^7.20.0",
+ "react-hotkeys-hook": "^4.6.1",
"react-icons": "^5.4.0",
"react-json-view": "^1.21.3",
"react-markdown": "^9.0.1",
diff --git a/airflow/ui/pnpm-lock.yaml b/airflow/ui/pnpm-lock.yaml
index 5b89d9517c8..20ae5859425 100644
--- a/airflow/ui/pnpm-lock.yaml
+++ b/airflow/ui/pnpm-lock.yaml
@@ -77,6 +77,9 @@ importers:
react-hook-form:
specifier: ^7.20.0
version: 7.53.1([email protected])
+ react-hotkeys-hook:
+ specifier: ^4.6.1
+ version: 4.6.1([email protected]([email protected]))([email protected])
react-icons:
specifier: ^5.4.0
version: 5.4.0([email protected])
@@ -3441,6 +3444,12 @@ packages:
peerDependencies:
react: ^16.8.0 || ^17 || ^18 || ^19
+ [email protected]:
+ resolution: {integrity:
sha512-XlZpbKUj9tkfgPgT9gA+1p7Ey6vFIZHttUjPqpTdyT5nqQ8mHL7elxvSbaC+dpSiHUSmr21Ya1mDxBZG3aje4Q==}
+ peerDependencies:
+ react: '>=16.8.1'
+ react-dom: '>=16.8.1'
+
[email protected]:
resolution: {integrity:
sha512-7eltJxgVt7X64oHh6wSWNwwbKTCtMfK35hcjvJS0yxEAhPM8oUKdS3+kqaW1vicIltw+kR2unHaa12S9pPALoQ==}
peerDependencies:
@@ -8475,6 +8484,11 @@ snapshots:
dependencies:
react: 18.3.1
+ [email protected]([email protected]([email protected]))([email protected]):
+ dependencies:
+ react: 18.3.1
+ react-dom: 18.3.1([email protected])
+
[email protected]([email protected]):
dependencies:
react: 18.3.1
diff --git a/airflow/ui/src/components/SearchDags/SearchDagsButton.tsx
b/airflow/ui/src/components/SearchDags/SearchDagsButton.tsx
index 942e3e5a848..83974fd0909 100644
--- a/airflow/ui/src/components/SearchDags/SearchDagsButton.tsx
+++ b/airflow/ui/src/components/SearchDags/SearchDagsButton.tsx
@@ -16,25 +16,37 @@
* specific language governing permissions and limitations
* under the License.
*/
-import { Button, Box } from "@chakra-ui/react";
+import { Button, Box, Kbd } from "@chakra-ui/react";
import { useState } from "react";
+import { useHotkeys } from "react-hotkeys-hook";
import { MdSearch } from "react-icons/md";
import { Dialog } from "src/components/ui";
+import { getMetaKey } from "src/utils";
import { SearchDags } from "./SearchDags";
export const SearchDagsButton = () => {
const [isOpen, setIsOpen] = useState(false);
+ const metaKey = getMetaKey();
const onOpenChange = () => {
setIsOpen(false);
};
+ useHotkeys(
+ "mod+k",
+ () => {
+ setIsOpen(true);
+ },
+ [isOpen],
+ { preventDefault: true },
+ );
+
return (
<Box>
<Button justifyContent="flex-start" onClick={() => setIsOpen(true)}
variant="subtle" w={200}>
- <MdSearch /> Search Dags
+ <MdSearch /> Search Dags <Kbd size="sm">{metaKey}+K</Kbd>
</Button>
<Dialog.Root onOpenChange={onOpenChange} open={isOpen} size="sm">
<Dialog.Content>
diff --git a/airflow/ui/src/utils/index.ts b/airflow/ui/src/utils/getMetaKey.ts
similarity index 85%
copy from airflow/ui/src/utils/index.ts
copy to airflow/ui/src/utils/getMetaKey.ts
index bdfe8ac8d80..4e1e867c2c2 100644
--- a/airflow/ui/src/utils/index.ts
+++ b/airflow/ui/src/utils/getMetaKey.ts
@@ -17,6 +17,4 @@
* under the License.
*/
-export { capitalize } from "./capitalize";
-export { pluralize } from "./pluralize";
-export { getDuration } from "./datetime_utils";
+export const getMetaKey = () => (navigator.appVersion.includes("Mac") ? "⌘" :
"Ctrl");
diff --git a/airflow/ui/src/utils/index.ts b/airflow/ui/src/utils/index.ts
index bdfe8ac8d80..60357e9470a 100644
--- a/airflow/ui/src/utils/index.ts
+++ b/airflow/ui/src/utils/index.ts
@@ -20,3 +20,4 @@
export { capitalize } from "./capitalize";
export { pluralize } from "./pluralize";
export { getDuration } from "./datetime_utils";
+export { getMetaKey } from "./getMetaKey";
