This is an automated email from the ASF dual-hosted git repository.
bbovenzi 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 602eb20fa64 Update buttons for adding Connections, Variables and Pools
(#62607)
602eb20fa64 is described below
commit 602eb20fa641660716251a62aa55b9fe85549754
Author: Yeonguk Choo <[email protected]>
AuthorDate: Sat Mar 7 01:44:02 2026 +0900
Update buttons for adding Connections, Variables and Pools (#62607)
* Use icon-only buttons for Variables and Pools page actions
* Replace IconButton with Button for action buttons
---
.../ui/src/pages/Connections/AddConnectionButton.tsx | 18 +++++-------------
airflow-core/src/airflow/ui/src/pages/Pools/Pools.tsx | 3 ++-
.../src/airflow/ui/src/pages/Variables/Variables.tsx | 4 ++--
3 files changed, 9 insertions(+), 16 deletions(-)
diff --git
a/airflow-core/src/airflow/ui/src/pages/Connections/AddConnectionButton.tsx
b/airflow-core/src/airflow/ui/src/pages/Connections/AddConnectionButton.tsx
index 2bd70c50356..d8647fa9968 100644
--- a/airflow-core/src/airflow/ui/src/pages/Connections/AddConnectionButton.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/Connections/AddConnectionButton.tsx
@@ -16,11 +16,11 @@
* specific language governing permissions and limitations
* under the License.
*/
-import { Heading, IconButton, useDisclosure, VStack } from "@chakra-ui/react";
+import { Button, Heading, useDisclosure, VStack } from "@chakra-ui/react";
import { useTranslation } from "react-i18next";
import { FiPlusCircle } from "react-icons/fi";
-import { Dialog, Tooltip } from "src/components/ui";
+import { Dialog } from "src/components/ui";
import { useAddConnection } from "src/queries/useAddConnection";
import ConnectionForm from "./ConnectionForm";
@@ -45,17 +45,9 @@ const AddConnectionButton = () => {
return (
<>
- <Tooltip content={translate("connections.add")}>
- <IconButton
- aria-label={translate("connections.add")}
- colorPalette="brand"
- onClick={onOpen}
- size="md"
- variant="ghost"
- >
- <FiPlusCircle />
- </IconButton>
- </Tooltip>
+ <Button colorPalette="brand" onClick={onOpen}>
+ <FiPlusCircle /> {translate("connections.add")}
+ </Button>
<Dialog.Root lazyMount onOpenChange={onClose} open={open} size="xl"
unmountOnExit>
<Dialog.Content backdrop>
diff --git a/airflow-core/src/airflow/ui/src/pages/Pools/Pools.tsx
b/airflow-core/src/airflow/ui/src/pages/Pools/Pools.tsx
index 3dd31712e10..e8b9f9f4046 100644
--- a/airflow-core/src/airflow/ui/src/pages/Pools/Pools.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/Pools/Pools.tsx
@@ -16,7 +16,7 @@
* specific language governing permissions and limitations
* under the License.
*/
-import { Box, HStack, Skeleton } from "@chakra-ui/react";
+import { Box, HStack, Skeleton, Spacer } from "@chakra-ui/react";
import { createListCollection } from "@chakra-ui/react/collection";
import { useState } from "react";
import { useTranslation } from "react-i18next";
@@ -118,6 +118,7 @@ export const Pools = () => {
))}
</Select.Content>
</Select.Root>
+ <Spacer />
<AddPoolButton />
</HStack>
<Box mt={4}>
diff --git a/airflow-core/src/airflow/ui/src/pages/Variables/Variables.tsx
b/airflow-core/src/airflow/ui/src/pages/Variables/Variables.tsx
index 1aacbab07ff..053b432e106 100644
--- a/airflow-core/src/airflow/ui/src/pages/Variables/Variables.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/Variables/Variables.tsx
@@ -207,14 +207,14 @@ export const Variables = () => {
placeholder={translate("variables.searchPlaceholder")}
/>
<HStack gap={4} mt={2}>
- <ImportVariablesButton disabled={selectedRows.size > 0} />
- <Spacer />
<ExpandCollapseButtons
collapseLabel={translate("common:expand.collapse")}
expandLabel={translate("common:expand.expand")}
onCollapse={onClose}
onExpand={onOpen}
/>
+ <Spacer />
+ <ImportVariablesButton disabled={selectedRows.size > 0} />
<AddVariableButton disabled={selectedRows.size > 0} />
</HStack>
</VStack>
