This is an automated email from the ASF dual-hosted git repository.
ephraimanierobi pushed a commit to branch v3-1-test
in repository https://gitbox.apache.org/repos/asf/airflow.git
commit d3fc7f26bf1b7d6281d32fac7734430f2b75ea11
Author: github-actions[bot]
<41898282+github-actions[bot]@users.noreply.github.com>
AuthorDate: Mon Dec 8 16:01:41 2025 +0100
[v3-1-test] Show asset extra in asset list (#59195) (#59201)
(cherry picked from commit 38db2defa230cdd9976fe12dc2fb0a9048ed01b2)
Co-authored-by: Pierre Jeambrun <[email protected]>
---
.../airflow/ui/public/i18n/locales/en/assets.json | 1 +
.../airflow/ui/public/i18n/locales/en/browse.json | 4 --
.../airflow/ui/public/i18n/locales/en/common.json | 2 +
.../airflow/ui/src/pages/AssetsList/AssetsList.tsx | 43 +++++++++++++++++++---
.../src/airflow/ui/src/pages/Events/Events.tsx | 6 +--
.../src/airflow/ui/src/pages/XCom/XCom.tsx | 4 +-
6 files changed, 45 insertions(+), 15 deletions(-)
diff --git a/airflow-core/src/airflow/ui/public/i18n/locales/en/assets.json
b/airflow-core/src/airflow/ui/public/i18n/locales/en/assets.json
index 527dfeb9e0b..1a0bc7bf86b 100644
--- a/airflow-core/src/airflow/ui/public/i18n/locales/en/assets.json
+++ b/airflow-core/src/airflow/ui/public/i18n/locales/en/assets.json
@@ -22,6 +22,7 @@
},
"title": "Create Asset Event for {{name}}"
},
+ "extra": "Extra",
"group": "Group",
"lastAssetEvent": "Last Asset Event",
"name": "Name",
diff --git a/airflow-core/src/airflow/ui/public/i18n/locales/en/browse.json
b/airflow-core/src/airflow/ui/public/i18n/locales/en/browse.json
index 07259fd1e58..235c3ef4aa2 100644
--- a/airflow-core/src/airflow/ui/public/i18n/locales/en/browse.json
+++ b/airflow-core/src/airflow/ui/public/i18n/locales/en/browse.json
@@ -1,9 +1,5 @@
{
"auditLog": {
- "actions": {
- "collapseAllExtra": "Collapse all extra json",
- "expandAllExtra": "Expand all extra json"
- },
"columns": {
"event": "Event",
"extra": "Extra",
diff --git a/airflow-core/src/airflow/ui/public/i18n/locales/en/common.json
b/airflow-core/src/airflow/ui/public/i18n/locales/en/common.json
index 8aee7cb16de..d7688753c36 100644
--- a/airflow-core/src/airflow/ui/public/i18n/locales/en/common.json
+++ b/airflow-core/src/airflow/ui/public/i18n/locales/en/common.json
@@ -25,6 +25,7 @@
"requiredActions": "Required Actions",
"xcoms": "XComs"
},
+ "collapseAllExtra": "Collapse all extra json",
"collapseDetailsPanel": "Collapse Details Panel",
"createdAssetEvent_one": "Created Asset Event",
"createdAssetEvent_other": "Created Asset Events",
@@ -99,6 +100,7 @@
"hotkey": "e",
"tooltip": "Press {{hotkey}} to toggle expand"
},
+ "expandAllExtra": "Expand all extra json",
"expression": {
"all": "All",
"and": "AND",
diff --git a/airflow-core/src/airflow/ui/src/pages/AssetsList/AssetsList.tsx
b/airflow-core/src/airflow/ui/src/pages/AssetsList/AssetsList.tsx
index 1a7c94d6427..ee0e8cc2a3a 100644
--- a/airflow-core/src/airflow/ui/src/pages/AssetsList/AssetsList.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/AssetsList/AssetsList.tsx
@@ -16,7 +16,7 @@
* specific language governing permissions and limitations
* under the License.
*/
-import { Box, Heading, Link, VStack } from "@chakra-ui/react";
+import { Box, Flex, Heading, Link, useDisclosure, VStack } from
"@chakra-ui/react";
import type { ColumnDef } from "@tanstack/react-table";
import { useMemo } from "react";
import { useTranslation } from "react-i18next";
@@ -27,6 +27,8 @@ import type { AssetResponse } from
"openapi/requests/types.gen";
import { DataTable } from "src/components/DataTable";
import { useTableURLState } from "src/components/DataTable/useTableUrlState";
import { ErrorAlert } from "src/components/ErrorAlert";
+import { ExpandCollapseButtons } from "src/components/ExpandCollapseButtons";
+import RenderedJsonField from "src/components/RenderedJsonField";
import { SearchBar } from "src/components/SearchBar";
import Time from "src/components/Time";
import { SearchParamsKeys } from "src/constants/searchParams";
@@ -36,7 +38,10 @@ import { DependencyPopover } from "./DependencyPopover";
type AssetRow = { row: { original: AssetResponse } };
-const createColumns = (translate: (key: string) => string):
Array<ColumnDef<AssetResponse>> => [
+const createColumns = (
+ translate: (key: string) => string,
+ open?: boolean,
+): Array<ColumnDef<AssetResponse>> => [
{
accessorKey: "name",
cell: ({ row: { original } }: AssetRow) => (
@@ -90,6 +95,21 @@ const createColumns = (translate: (key: string) => string):
Array<ColumnDef<Asse
enableSorting: false,
header: "",
},
+ {
+ accessorKey: "extra",
+ cell: ({ row: { original } }) => {
+ if (original.extra !== null) {
+ return <RenderedJsonField content={original.extra ?? {}} jsonProps={{
collapsed: !open }} />;
+ }
+
+ return undefined;
+ },
+ enableSorting: false,
+ header: translate("extra"),
+ meta: {
+ skeletonWidth: 200,
+ },
+ },
];
const NAME_PATTERN_PARAM = SearchParamsKeys.NAME_PATTERN;
@@ -105,6 +125,8 @@ export const AssetsList = () => {
const [sort] = sorting;
const orderBy = sort ? [`${sort.desc ? "-" : ""}${sort.id}`] : undefined;
+ const { onClose, onOpen, open } = useDisclosure();
+
const { data, error, isLoading } = useAssetServiceGetAssets({
limit: pagination.pageSize,
namePattern,
@@ -112,7 +134,7 @@ export const AssetsList = () => {
orderBy,
});
- const columns = useMemo(() => createColumns(translate), [translate]);
+ const columns = useMemo(() => createColumns(translate, open), [translate,
open]);
const handleSearchChange = (value: string) => {
setTableURLState({
@@ -137,9 +159,18 @@ export const AssetsList = () => {
placeHolder={translate("searchPlaceholder")}
/>
- <Heading py={3} size="md">
- {data?.total_entries} {translate("common:asset", { count:
data?.total_entries })}
- </Heading>
+ <Flex alignItems="center" justifyContent="space-between">
+ <Heading py={3} size="md">
+ {data?.total_entries} {translate("common:asset", { count:
data?.total_entries })}
+ </Heading>
+
+ <ExpandCollapseButtons
+ collapseLabel={translate("collapseAllExtra")}
+ expandLabel={translate("expandAllExtra")}
+ onCollapse={onClose}
+ onExpand={onOpen}
+ />
+ </Flex>
</VStack>
<Box overflow="auto">
<DataTable
diff --git a/airflow-core/src/airflow/ui/src/pages/Events/Events.tsx
b/airflow-core/src/airflow/ui/src/pages/Events/Events.tsx
index e94bf74bdb2..6365ab24f10 100644
--- a/airflow-core/src/airflow/ui/src/pages/Events/Events.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/Events/Events.tsx
@@ -159,7 +159,7 @@ const {
}: SearchParamsKeysType = SearchParamsKeys;
export const Events = () => {
- const { t: translate } = useTranslation("browse");
+ const { t: translate } = useTranslation(["browse", "common"]);
const { dagId, runId, taskId } = useParams();
const [searchParams] = useSearchParams();
const { setTableURLState, tableURLState } = useTableURLState();
@@ -221,8 +221,8 @@ export const Events = () => {
<Flex alignItems="center" justifyContent="space-between">
<EventsFilters urlDagId={dagId} urlRunId={runId} urlTaskId={taskId} />
<ExpandCollapseButtons
- collapseLabel={translate("auditLog.actions.collapseAllExtra")}
- expandLabel={translate("auditLog.actions.expandAllExtra")}
+ collapseLabel={translate("collapseAllExtra")}
+ expandLabel={translate("expandAllExtra")}
onCollapse={onClose}
onExpand={onOpen}
/>
diff --git a/airflow-core/src/airflow/ui/src/pages/XCom/XCom.tsx
b/airflow-core/src/airflow/ui/src/pages/XCom/XCom.tsx
index fc0e8045b3f..6a7c0c80a20 100644
--- a/airflow-core/src/airflow/ui/src/pages/XCom/XCom.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/XCom/XCom.tsx
@@ -173,8 +173,8 @@ export const XCom = () => {
<Flex alignItems="center" justifyContent="space-between">
<XComFilters />
<ExpandCollapseButtons
- collapseLabel={translate("auditLog.actions.collapseAllExtra")}
- expandLabel={translate("auditLog.actions.expandAllExtra")}
+ collapseLabel={translate("collapseAllExtra")}
+ expandLabel={translate("expandAllExtra")}
onCollapse={onClose}
onExpand={onOpen}
/>
