diff --git a/src/hooks/index.ts b/src/hooks/index.ts index 8568e7fce7..540a59753b 100644 --- a/src/hooks/index.ts +++ b/src/hooks/index.ts @@ -13,7 +13,6 @@ export { useTableInputFilter, useTableCheckboxFilter, } from "hooks/useTableFilters"; -export { useUpdateUrlSortParamOnTableChange } from "./useUpdateUrlSortParamOnTableChange"; export { usePrevious } from "./usePrevious"; export { useDisableSpawnExpirationCheckbox } from "./useDisableSpawnExpirationCheckbox"; export { useUpdateURLQueryParams } from "./useUpdateURLQueryParams"; diff --git a/src/hooks/tests/useUpdateUrlSortParamOnTableChange/useUpdateUrlSortParamOnTableChange.test.tsx b/src/hooks/tests/useUpdateUrlSortParamOnTableChange/useUpdateUrlSortParamOnTableChange.test.tsx deleted file mode 100644 index 3debd0c052..0000000000 --- a/src/hooks/tests/useUpdateUrlSortParamOnTableChange/useUpdateUrlSortParamOnTableChange.test.tsx +++ /dev/null @@ -1,117 +0,0 @@ -import { Table } from "antd"; -import { ColumnProps } from "antd/es/table"; -import MatchMediaMock from "jest-matchmedia-mock"; -import { useLocation } from "react-router-dom"; -import { useUpdateUrlSortParamOnTableChange } from "hooks"; -import { renderWithRouterMatch as render, screen, userEvent } from "test_utils"; -import { queryString } from "utils"; - -describe("useUpdateUrlSortParamOnTableChange", () => { - let matchMedia; - beforeAll(() => { - matchMedia = new MatchMediaMock(); - }); - - afterEach(() => { - matchMedia.clear(); - }); - - it("toggles table headers when clicked", async () => { - const user = userEvent.setup(); - render(, { - route: "/hosts", - path: "/hosts", - }); - - const idHeader = screen.getByText("ID"); - const statusHeader = screen.getByText("Status"); - - await user.click(idHeader); - - expect(screen.getByText("sortBy: ID")).toBeInTheDocument(); - expect(screen.getByText("sortDir: ASC")).toBeInTheDocument(); - - await user.click(statusHeader); - - expect(screen.getByText("sortBy: STATUS")).toBeInTheDocument(); - expect(screen.getByText("sortDir: ASC")).toBeInTheDocument(); - - await user.click(statusHeader); - - expect(screen.getByText("sortBy: STATUS")).toBeInTheDocument(); - expect(screen.getByText("sortDir: DESC")).toBeInTheDocument(); - - await user.click(statusHeader); - - expect(screen.getByText("sortBy: none")).toBeInTheDocument(); - expect(screen.getByText("sortDir: none")).toBeInTheDocument(); - }); -}); - -const { parseQueryString } = queryString; -const TestComponent = () => { - const tableChangeHandler = useUpdateUrlSortParamOnTableChange(); - - const { search } = useLocation(); - const queryParams = parseQueryString(search); - - return ( - <> -
{`sortBy: ${queryParams.sortBy ?? "none"}`}
-
{`sortDir: ${queryParams.sortDir ?? "none"}`}
- id} - pagination={false} - columns={columnsTemplate} - dataSource={data} - onChange={tableChangeHandler} - /> - - ); -}; - -interface Data { - id: string; - status: string; - distro: string; -} - -const data = [ - { - id: "1", - status: "passed", - distro: "osx", - }, - { - id: "2", - status: "failed", - distro: "osx", - }, - { - id: "3", - status: "passed", - distro: "windows", - }, -]; - -const columnsTemplate: Array> = [ - { - title: "ID", - dataIndex: "id", - key: "ID", - sorter: true, - }, - { - title: "Status", - dataIndex: "status", - key: "STATUS", - sorter: true, - }, - { - title: "Distro", - dataIndex: "distro", - key: "DISTRO", - sorter: true, - }, -]; diff --git a/src/hooks/useUpdateUrlSortParamOnTableChange.ts b/src/hooks/useUpdateUrlSortParamOnTableChange.ts deleted file mode 100644 index 8c02878210..0000000000 --- a/src/hooks/useUpdateUrlSortParamOnTableChange.ts +++ /dev/null @@ -1,40 +0,0 @@ -import { SortDirection } from "gql/generated/types"; -import { PatchTasksQueryParams, TableOnChange } from "types/task"; -import { useQueryParams } from "./useQueryParam"; - -interface Params { - sendAnalyticsEvents?: () => void; -} - -/* - * @deprecated For use with antd tables - */ -export const useUpdateUrlSortParamOnTableChange = ({ - sendAnalyticsEvents = () => undefined, -}: Params = {}) => { - const [queryParams, setQueryParams] = useQueryParams(); - - const tableChangeHandler: TableOnChange = (...[, , sorter]) => { - sendAnalyticsEvents(); - const { columnKey, order } = Array.isArray(sorter) ? sorter[0] : sorter; - const nextQueryParams = { - ...queryParams, - [PatchTasksQueryParams.SortDir]: mapTableSortDirectionToQueryParam(order), - [PatchTasksQueryParams.SortBy]: columnKey, - [PatchTasksQueryParams.Page]: "0", - }; - if (!order) { - delete nextQueryParams[PatchTasksQueryParams.SortBy]; - } - setQueryParams(nextQueryParams); - }; - - return tableChangeHandler; -}; - -const mapTableSortDirectionToQueryParam = (order: string) => { - if (!order) { - return null; - } - return order === "ascend" ? SortDirection.Asc : SortDirection.Desc; -};