This is an automated email from the ASF dual-hosted git repository. kaxilnaik pushed a commit to branch v3-0-test in repository https://gitbox.apache.org/repos/asf/airflow.git
commit 733c7ee97eaab706575b818e3b86c74c1d9f2aac Author: Aritra Basu <[email protected]> AuthorDate: Thu May 1 00:40:41 2025 +0530 Added the download button on the assets page (#50045) * Added the download button on the assets Added for consistency, not sure on if people do actually want to download that graph * Update airflow-core/src/airflow/ui/src/pages/Asset/AssetGraph.tsx Co-authored-by: Brent Bovenzi <[email protected]> * Update AssetGraph.tsx --------- Co-authored-by: Brent Bovenzi <[email protected]> (cherry picked from commit 77d2fa5b035244944d10914d08e7855a20d573b0) --- airflow-core/src/airflow/ui/src/components/Graph/DownloadButton.tsx | 4 ++-- airflow-core/src/airflow/ui/src/layouts/Details/Graph/Graph.tsx | 2 +- airflow-core/src/airflow/ui/src/pages/Asset/AssetGraph.tsx | 2 ++ 3 files changed, 5 insertions(+), 3 deletions(-) diff --git a/airflow-core/src/airflow/ui/src/components/Graph/DownloadButton.tsx b/airflow-core/src/airflow/ui/src/components/Graph/DownloadButton.tsx index fb4cf5f02e8..1b155a65ea9 100644 --- a/airflow-core/src/airflow/ui/src/components/Graph/DownloadButton.tsx +++ b/airflow-core/src/airflow/ui/src/components/Graph/DownloadButton.tsx @@ -23,7 +23,7 @@ import { FiDownload } from "react-icons/fi"; import { toaster } from "src/components/ui"; -export const DownloadButton = ({ dagId }: { readonly dagId: string }) => { +export const DownloadButton = ({ name }: { readonly name: string }) => { const { getNodes, getZoom } = useReactFlow(); const onClick = () => { @@ -49,7 +49,7 @@ export const DownloadButton = ({ dagId }: { readonly dagId: string }) => { .then((dataUrl) => { const downloadLink = document.createElement("a"); - downloadLink.setAttribute("download", `${dagId}-graph.png`); + downloadLink.setAttribute("download", `${name}-graph.png`); downloadLink.setAttribute("href", dataUrl); downloadLink.click(); }) diff --git a/airflow-core/src/airflow/ui/src/layouts/Details/Graph/Graph.tsx b/airflow-core/src/airflow/ui/src/layouts/Details/Graph/Graph.tsx index be47ebd3abf..12744c7d15f 100644 --- a/airflow-core/src/airflow/ui/src/layouts/Details/Graph/Graph.tsx +++ b/airflow-core/src/airflow/ui/src/layouts/Details/Graph/Graph.tsx @@ -198,7 +198,7 @@ export const Graph = () => { style={{ height: 150, width: 200 }} zoomable /> - <DownloadButton dagId={dagId} /> + <DownloadButton name={dagId} /> </ReactFlow> ); }; diff --git a/airflow-core/src/airflow/ui/src/pages/Asset/AssetGraph.tsx b/airflow-core/src/airflow/ui/src/pages/Asset/AssetGraph.tsx index 28246ed57c1..42e1c39071f 100644 --- a/airflow-core/src/airflow/ui/src/pages/Asset/AssetGraph.tsx +++ b/airflow-core/src/airflow/ui/src/pages/Asset/AssetGraph.tsx @@ -22,6 +22,7 @@ import "@xyflow/react/dist/style.css"; import { useParams } from "react-router-dom"; import type { AssetResponse } from "openapi/requests/types.gen"; +import { DownloadButton } from "src/components/Graph/DownloadButton"; import { edgeTypes, nodeTypes } from "src/components/Graph/graphTypes"; import type { CustomNodeProps } from "src/components/Graph/reactflowUtils"; import { useGraphLayout } from "src/components/Graph/useGraphLayout"; @@ -84,6 +85,7 @@ export const AssetGraph = ({ asset }: { readonly asset?: AssetResponse }) => { pannable zoomable /> + <DownloadButton name={asset?.name ?? asset?.uri ?? "asset"} /> </ReactFlow> ); };
