Skip to content

fix: reset pagination on search in all pages #60411

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
bbovenzi merged 1 commit into from
Jan 15, 2026
Merged

fix: reset pagination on search in all pages #60411

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 6 additions & 5 deletions airflow-core/src/airflow/ui/src/pages/AssetsList/AssetsList.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ 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";
import { SearchParamsKeys, type SearchParamsKeysType } from "src/constants/searchParams";
import { CreateAssetEvent } from "src/pages/Asset/CreateAssetEvent";

import { DependencyPopover } from "./DependencyPopover";
Expand Down Expand Up @@ -111,13 +111,13 @@ const createColumns = (
},
];

const NAME_PATTERN_PARAM = SearchParamsKeys.NAME_PATTERN;
const { NAME_PATTERN, OFFSET }: SearchParamsKeysType = SearchParamsKeys;

export const AssetsList = () => {
const { t: translate } = useTranslation(["assets", "common"]);
const [searchParams, setSearchParams] = useSearchParams();

const namePattern = searchParams.get(NAME_PATTERN_PARAM) ?? "";
const namePattern = searchParams.get(NAME_PATTERN) ?? "";

const { setTableURLState, tableURLState } = useTableURLState();
const { pagination, sorting } = tableURLState;
Expand All @@ -141,10 +141,11 @@ export const AssetsList = () => {
sorting,
});
if (value) {
searchParams.set(NAME_PATTERN_PARAM, value);
searchParams.set(NAME_PATTERN, value);
} else {
searchParams.delete(NAME_PATTERN_PARAM);
searchParams.delete(NAME_PATTERN);
}
searchParams.delete(OFFSET);
setSearchParams(searchParams);
};

Expand Down
11 changes: 5 additions & 6 deletions airflow-core/src/airflow/ui/src/pages/Connections/Connections.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -128,10 +128,8 @@ export const Connections = () => {
const { t: translate } = useTranslation(["admin", "common"]);
const { setTableURLState, tableURLState } = useTableURLState();
const [searchParams, setSearchParams] = useSearchParams();
const { NAME_PATTERN: NAME_PATTERN_PARAM }: SearchParamsKeysType = SearchParamsKeys;
const [connectionIdPattern, setConnectionIdPattern] = useState(
searchParams.get(NAME_PATTERN_PARAM) ?? undefined,
);
const { NAME_PATTERN, OFFSET }: SearchParamsKeysType = SearchParamsKeys;
const [connectionIdPattern, setConnectionIdPattern] = useState(searchParams.get(NAME_PATTERN) ?? undefined);

useConnectionTypeMeta(); // Pre-fetch connection type metadata
const { pagination, sorting } = tableURLState;
Expand Down Expand Up @@ -160,14 +158,15 @@ export const Connections = () => {

const handleSearchChange = (value: string) => {
if (value) {
searchParams.set(NAME_PATTERN_PARAM, value);
searchParams.set(NAME_PATTERN, value);
} else {
searchParams.delete(NAME_PATTERN_PARAM);
searchParams.delete(NAME_PATTERN);
}
setTableURLState({
pagination: { ...pagination, pageIndex: 0 },
sorting,
});
searchParams.delete(OFFSET);
setSearchParams(searchParams);
setConnectionIdPattern(value);
};
Expand Down
6 changes: 4 additions & 2 deletions airflow-core/src/airflow/ui/src/pages/Dag/Tasks/TaskFilters/TaskFilters.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,12 +23,13 @@ import { useSearchParams } from "react-router-dom";
import type { TaskCollectionResponse } from "openapi/requests";
import { SearchBar } from "src/components/SearchBar.tsx";
import { ResetButton } from "src/components/ui";
import { SearchParamsKeys } from "src/constants/searchParams.ts";
import { SearchParamsKeys, type SearchParamsKeysType } from "src/constants/searchParams.ts";
import { AttrSelectFilter } from "src/pages/Dag/Tasks/TaskFilters/AttrSelectFilter.tsx";
import { AttrSelectFilterMulti } from "src/pages/Dag/Tasks/TaskFilters/AttrSelectFilterMulti.tsx";

export const TaskFilters = ({ tasksData }: { readonly tasksData: TaskCollectionResponse | undefined }) => {
const { MAPPED, NAME_PATTERN, OPERATOR, RETRIES, TRIGGER_RULE } = SearchParamsKeys;
const { MAPPED, NAME_PATTERN, OFFSET, OPERATOR, RETRIES, TRIGGER_RULE }: SearchParamsKeysType =
SearchParamsKeys;
const { t: translate } = useTranslation("tasks");
const [searchParams, setSearchParams] = useSearchParams();
const selectedOperators = searchParams.getAll(OPERATOR);
Expand Down Expand Up @@ -85,6 +86,7 @@ export const TaskFilters = ({ tasksData }: { readonly tasksData: TaskCollectionR
} else {
searchParams.delete(NAME_PATTERN);
}
searchParams.delete(OFFSET);
setSearchParams(searchParams);
};

Expand Down
17 changes: 13 additions & 4 deletions airflow-core/src/airflow/ui/src/pages/DagsList/DagsList.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ import { NeedsReviewBadge } from "src/components/NeedsReviewBadge";
import { SearchBar } from "src/components/SearchBar";
import { TogglePause } from "src/components/TogglePause";
import TriggerDAGButton from "src/components/TriggerDag/TriggerDAGButton";
import { SearchParamsKeys } from "src/constants/searchParams";
import { SearchParamsKeys, type SearchParamsKeysType } from "src/constants/searchParams";
import { DagsLayout } from "src/layouts/DagsLayout";
import { useConfig } from "src/queries/useConfig";
import { useDags } from "src/queries/useDags";
Expand Down Expand Up @@ -181,8 +181,17 @@ const createColumns = (
},
];

const { FAVORITE, LAST_DAG_RUN_STATE, NAME_PATTERN, NEEDS_REVIEW, OWNERS, PAUSED, TAGS, TAGS_MATCH_MODE } =
SearchParamsKeys;
const {
FAVORITE,
LAST_DAG_RUN_STATE,
NAME_PATTERN,
NEEDS_REVIEW,
OFFSET,
OWNERS,
PAUSED,
TAGS,
TAGS_MATCH_MODE,
}: SearchParamsKeysType = SearchParamsKeys;

const cardDef: CardDef<DAGWithLatestDagRunsResponse> = {
card: ({ row }) => <DagCard dag={row} />,
Expand Down Expand Up @@ -231,7 +240,7 @@ export const DagsList = () => {
} else {
searchParams.delete(NAME_PATTERN);
}
searchParams.delete("offset");
searchParams.delete(OFFSET);
setSearchParams(searchParams);
};

Expand Down
9 changes: 5 additions & 4 deletions airflow-core/src/airflow/ui/src/pages/Pools/Pools.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,8 +53,8 @@ export const Pools = () => {
],
});
const [searchParams, setSearchParams] = useSearchParams();
const { NAME_PATTERN: NAME_PATTERN_PARAM }: SearchParamsKeysType = SearchParamsKeys;
const [poolNamePattern, setPoolNamePattern] = useState(searchParams.get(NAME_PATTERN_PARAM) ?? undefined);
const { NAME_PATTERN, OFFSET }: SearchParamsKeysType = SearchParamsKeys;
const [poolNamePattern, setPoolNamePattern] = useState(searchParams.get(NAME_PATTERN) ?? undefined);

const { setTableURLState, tableURLState } = useTableURLState();
const { pagination, sorting } = tableURLState;
Expand All @@ -70,10 +70,11 @@ export const Pools = () => {

const handleSearchChange = (value: string) => {
if (value) {
searchParams.set(NAME_PATTERN_PARAM, value);
searchParams.set(NAME_PATTERN, value);
} else {
searchParams.delete(NAME_PATTERN_PARAM);
searchParams.delete(NAME_PATTERN);
}
searchParams.delete(OFFSET);
setSearchParams(searchParams);
setPoolNamePattern(value);
};
Expand Down
12 changes: 6 additions & 6 deletions airflow-core/src/airflow/ui/src/pages/TaskInstance/AssetEvents.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,17 +25,16 @@ import { useAssetServiceGetAssetEvents, useTaskInstanceServiceGetMappedTaskInsta
import { AssetEvents as AssetEventsTable } from "src/components/Assets/AssetEvents";
import { useTableURLState } from "src/components/DataTable/useTableUrlState";
import { SearchBar } from "src/components/SearchBar";
import { SearchParamsKeys } from "src/constants/searchParams";
import { SearchParamsKeys, type SearchParamsKeysType } from "src/constants/searchParams";
import { isStatePending, useAutoRefresh } from "src/utils";

export const AssetEvents = () => {
const { dagId = "", mapIndex = "-1", runId = "", taskId = "" } = useParams();
const { NAME_PATTERN, OFFSET }: SearchParamsKeysType = SearchParamsKeys;
const [searchParams, setSearchParams] = useSearchParams();
const { t: translate } = useTranslation(["assets"]);

const [assetNameSearch, setAssetNameSearch] = useState(
searchParams.get(SearchParamsKeys.NAME_PATTERN) ?? "",
);
const [assetNameSearch, setAssetNameSearch] = useState(searchParams.get(NAME_PATTERN) ?? "");

const parsedMapIndex = parseInt(mapIndex, 10);

Expand Down Expand Up @@ -65,10 +64,11 @@ export const AssetEvents = () => {
pagination: { ...pagination, pageIndex: 0 },
});
if (value) {
searchParams.set(SearchParamsKeys.NAME_PATTERN, value);
searchParams.set(NAME_PATTERN, value);
} else {
searchParams.delete(SearchParamsKeys.NAME_PATTERN);
searchParams.delete(NAME_PATTERN);
}
searchParams.delete(OFFSET);
setSearchParams(searchParams);
};

Expand Down
11 changes: 5 additions & 6 deletions airflow-core/src/airflow/ui/src/pages/Variables/Variables.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -115,10 +115,8 @@ export const Variables = () => {
sorting: [{ desc: false, id: "key" }],
}); // To make multiselection smooth
const [searchParams, setSearchParams] = useSearchParams();
const { NAME_PATTERN: NAME_PATTERN_PARAM }: SearchParamsKeysType = SearchParamsKeys;
const [variableKeyPattern, setVariableKeyPattern] = useState(
searchParams.get(NAME_PATTERN_PARAM) ?? undefined,
);
const { NAME_PATTERN, OFFSET }: SearchParamsKeysType = SearchParamsKeys;
const [variableKeyPattern, setVariableKeyPattern] = useState(searchParams.get(NAME_PATTERN) ?? undefined);
const { pagination, sorting } = tableURLState;
const [sort] = sorting;
const orderBy = sort ? [`${sort.desc ? "-" : ""}${sort.id === "value" ? "_val" : sort.id}`] : ["-key"];
Expand Down Expand Up @@ -146,14 +144,15 @@ export const Variables = () => {

const handleSearchChange = (value: string) => {
if (value) {
searchParams.set(NAME_PATTERN_PARAM, value);
searchParams.set(NAME_PATTERN, value);
} else {
searchParams.delete(NAME_PATTERN_PARAM);
searchParams.delete(NAME_PATTERN);
}
setTableURLState({
pagination: { ...pagination, pageIndex: 0 },
sorting,
});
searchParams.delete(OFFSET);
setSearchParams(searchParams);
setVariableKeyPattern(value);
};
Expand Down
Loading