@refinedev/core 4.58.0 → 5.0.1

package/src/hooks/useTable/index.ts

@@ -6,15 +6,12 @@ import type {
 } from "@tanstack/react-query";
 import differenceWith from "lodash/differenceWith";
 import isEqual from "lodash/isEqual";
-import qs from "qs";
 import warnOnce from "warn-once";
 
-import { pickNotDeprecated } from "@definitions/helpers";
 import {
   parseTableParams,
   setInitialFilters,
   setInitialSorters,
-  stringifyTableParams,
   unionFilters,
   unionSorters,
 } from "@definitions/table";
@@ -23,11 +20,8 @@ import {
   useList,
   useLiveMode,
   useMeta,
-  useNavigation,
   useParsed,
-  useResource,
-  useRouterContext,
-  useRouterType,
+  useResourceParams,
   useSyncWithLocation,
 } from "@hooks";
 
@@ -44,6 +38,7 @@ import type {
 import type { LiveModeProps } from "../../contexts/live/types";
 import type { SuccessErrorNotification } from "../../contexts/notification/types";
 import type { BaseListProps } from "../data/useList";
+import type { MakeOptional } from "../../definitions/types/index";
 import type {
   UseLoadingOvertimeOptionsProps,
   UseLoadingOvertimeReturnType,
@@ -61,18 +56,6 @@ export type useTableProps<TQueryFnData, TError, TData> = {
    * Configuration for pagination
    */
   pagination?: Pagination;
-  /**
-   * Initial page index
-   * @default 1
-   * @deprecated `initialCurrent` property is deprecated. Use `pagination.current` instead.
-   */
-  initialCurrent?: number;
-  /**
-   * Initial number of items per page
-   * @default 10
-   * @deprecated `initialPageSize` property is deprecated. Use `pagination.pageSize` instead.
-   */
-  initialPageSize?: number;
   /**
    * Sort configs
    */
@@ -92,17 +75,6 @@ export type useTableProps<TQueryFnData, TError, TData> = {
      */
     mode?: "server" | "off";
   };
-  /**
-   * Initial sorter state
-   * @deprecated `initialSorter` property is deprecated. Use `sorters.initial` instead.
-   */
-  initialSorter?: CrudSort[];
-  /**
-   * Default and unchangeable sorter state
-   *  @default `[]`
-   *  @deprecated `permanentSorter` property is deprecated. Use `sorters.permanent` instead.
-   */
-  permanentSorter?: CrudSort[];
   /**
    * Filter configs
    */
@@ -127,29 +99,6 @@ export type useTableProps<TQueryFnData, TError, TData> = {
      */
     mode?: "server" | "off";
   };
-  /**
-   * Initial filter state
-   * @deprecated `initialFilter` property is deprecated. Use `filters.initial` instead.
-   */
-  initialFilter?: CrudFilter[];
-  /**
-   * Default and unchangeable filter state
-   * @default `[]`
-   * @deprecated `permanentFilter` property is deprecated. Use `filters.permanent` instead.
-   */
-  permanentFilter?: CrudFilter[];
-  /**
-   * Default behavior of the `setFilters` function
-   * @default `"merge"`
-   * @deprecated `defaultSetFilterBehavior` property is deprecated. Use `filters.defaultBehavior` instead.
-   */
-  defaultSetFilterBehavior?: SetFilterBehavior;
-  /**
-   * Whether to use server side pagination or not.
-   * @default `true`
-   * @deprecated `hasPagination` property is deprecated. Use `pagination.mode` instead.
-   */
-  hasPagination?: boolean;
   /**
    * Sortings, filters, page index and records shown per page are tracked by browser history
    * @default Value set in [Refine](/docs/api-reference/core/components/refine-config/#syncwithlocation). If a custom resource is given, it will be `false`
@@ -158,20 +107,18 @@ export type useTableProps<TQueryFnData, TError, TData> = {
   /**
    * react-query's [useQuery](https://tanstack.com/query/v4/docs/reference/useQuery) options
    */
-  queryOptions?: UseQueryOptions<
-    GetListResponse<TQueryFnData>,
-    TError,
-    GetListResponse<TData>
+  queryOptions?: MakeOptional<
+    UseQueryOptions<
+      GetListResponse<TQueryFnData>,
+      TError,
+      GetListResponse<TData>
+    >,
+    "queryKey" | "queryFn"
   >;
   /**
    * Metadata query for dataProvider
    */
   meta?: MetaQuery;
-  /**
-   * Metadata query for dataProvider
-   * @deprecated `metaData` is deprecated with refine@4, refine will pass `meta` instead, however, we still support `metaData` for backward compatibility.
-   */
-  metaData?: MetaQuery;
   /**
    * If there is more than one `dataProvider`, you should use the `dataProviderName` that you will use.
    */
@@ -187,11 +134,7 @@ export type useTableProps<TQueryFnData, TError, TData> = {
 type ReactSetState<T> = React.Dispatch<React.SetStateAction<T>>;
 
 type SyncWithLocationParams = {
-  pagination: { current?: number; pageSize?: number };
-  /**
-   * @deprecated `sorter` is deprecated. Use `sorters` instead.
-   */
-  sorter?: CrudSort[];
+  pagination: { currentPage?: number; pageSize?: number };
   sorters: CrudSort[];
   filters: CrudFilter[];
 };
@@ -201,29 +144,21 @@ export type useTableReturnType<
   TError extends HttpError = HttpError,
 > = {
   tableQuery: QueryObserverResult<GetListResponse<TData>, TError>;
-  /**
-   * @deprecated `tableQueryResult` is deprecated. Use `tableQuery` instead.
-   */
-  tableQueryResult: QueryObserverResult<GetListResponse<TData>, TError>;
-  /**
-   * @deprecated `sorter` is deprecated. Use `sorters` instead.
-   */
-  sorter: CrudSort[];
   sorters: CrudSort[];
-  /**
-   * @deprecated `setSorter` is deprecated. Use `setSorters` instead.
-   */
-  setSorter: (sorter: CrudSort[]) => void;
   setSorters: (sorter: CrudSort[]) => void;
   filters: CrudFilter[];
   setFilters: ((filters: CrudFilter[], behavior?: SetFilterBehavior) => void) &
     ((setter: (prevFilters: CrudFilter[]) => CrudFilter[]) => void);
   createLinkForSyncWithLocation: (params: SyncWithLocationParams) => string;
-  current: number;
-  setCurrent: ReactSetState<useTableReturnType["current"]>;
+  currentPage: number;
+  setCurrentPage: ReactSetState<useTableReturnType["currentPage"]>;
   pageSize: number;
   setPageSize: ReactSetState<useTableReturnType["pageSize"]>;
   pageCount: number;
+  result: {
+    data: TData[];
+    total: number | undefined;
+  };
 } & UseLoadingOvertimeReturnType;
 
 /**
@@ -247,15 +182,7 @@ export function useTable<
   TError extends HttpError = HttpError,
   TData extends BaseRecord = TQueryFnData,
 >({
-  initialCurrent,
-  initialPageSize,
-  hasPagination = true,
   pagination,
-  initialSorter,
-  permanentSorter = defaultPermanentSorter,
-  defaultSetFilterBehavior,
-  initialFilter,
-  permanentFilter = defaultPermanentFilter,
   filters: filtersFromProp,
   sorters: sortersFromProp,
   syncWithLocation: syncWithLocationProp,
@@ -267,7 +194,6 @@ export function useTable<
   onLiveEvent,
   liveParams,
   meta,
-  metaData,
   dataProviderName,
   overtimeOptions,
 }: useTableProps<TQueryFnData, TError, TData> = {}): useTableReturnType<
@@ -280,9 +206,6 @@ export function useTable<
 
   const liveMode = useLiveMode(liveModeFromProp);
 
-  const routerType = useRouterType();
-  const { useLocation } = useRouterContext();
-  const { search, pathname } = useLocation();
   const getMeta = useMeta();
   const parsedParams = useParsed();
 
@@ -290,55 +213,36 @@ export function useTable<
     (filtersFromProp?.mode || "server") === "server";
   const isServerSideSortingEnabled =
     (sortersFromProp?.mode || "server") === "server";
-  const hasPaginationString = hasPagination === false ? "off" : "server";
-  const isPaginationEnabled =
-    (pagination?.mode ?? hasPaginationString) !== "off";
-  const prefferedCurrent = pickNotDeprecated(
-    pagination?.current,
-    initialCurrent,
-  );
-  const prefferedPageSize = pickNotDeprecated(
-    pagination?.pageSize,
-    initialPageSize,
-  );
-  const preferredMeta = pickNotDeprecated(meta, metaData);
+  const isPaginationEnabled = pagination?.mode !== "off";
+  const prefferedCurrentPage = pagination?.currentPage;
+  const prefferedPageSize = pagination?.pageSize;
+  const preferredMeta = meta;
 
-  /** `parseTableParams` is redundant with the new routing */
-  // We want to always parse the query string even when syncWithLocation is
-  // deactivated, for hotlinking to work properly
+  // Parse table params from URL if available
   const { parsedCurrent, parsedPageSize, parsedSorter, parsedFilters } =
-    parseTableParams(search ?? "?");
+    parseTableParams(parsedParams.params?.search ?? "?");
 
-  const preferredInitialFilters = pickNotDeprecated(
-    filtersFromProp?.initial,
-    initialFilter,
-  );
+  const preferredInitialFilters = filtersFromProp?.initial;
   const preferredPermanentFilters =
-    pickNotDeprecated(filtersFromProp?.permanent, permanentFilter) ??
-    defaultPermanentFilter;
+    filtersFromProp?.permanent ?? defaultPermanentFilter;
 
-  const preferredInitialSorters = pickNotDeprecated(
-    sortersFromProp?.initial,
-    initialSorter,
-  );
+  const preferredInitialSorters = sortersFromProp?.initial;
   const preferredPermanentSorters =
-    pickNotDeprecated(sortersFromProp?.permanent, permanentSorter) ??
-    defaultPermanentSorter;
+    sortersFromProp?.permanent ?? defaultPermanentSorter;
 
-  const prefferedFilterBehavior =
-    pickNotDeprecated(
-      filtersFromProp?.defaultBehavior,
-      defaultSetFilterBehavior,
-    ) ?? "merge";
+  const prefferedFilterBehavior = filtersFromProp?.defaultBehavior ?? "merge";
 
-  let defaultCurrent: number;
+  let defaultCurrentPage: number;
   let defaultPageSize: number;
   let defaultSorter: CrudSort[] | undefined;
   let defaultFilter: CrudFilter[] | undefined;
 
   if (syncWithLocation) {
-    defaultCurrent =
-      parsedParams?.params?.current || parsedCurrent || prefferedCurrent || 1;
+    defaultCurrentPage =
+      parsedParams?.params?.current ||
+      parsedCurrent ||
+      prefferedCurrentPage ||
+      1;
     defaultPageSize =
       parsedParams?.params?.pageSize ||
       parsedPageSize ||
@@ -351,17 +255,17 @@ export function useTable<
       parsedParams?.params?.filters ||
       (parsedFilters.length ? parsedFilters : preferredInitialFilters);
   } else {
-    defaultCurrent = prefferedCurrent || 1;
+    defaultCurrentPage = prefferedCurrentPage || 1;
     defaultPageSize = prefferedPageSize || 10;
     defaultSorter = preferredInitialSorters;
     defaultFilter = preferredInitialFilters;
   }
 
-  const { replace } = useNavigation();
-  /** New way of `replace` calls to the router is using `useGo` */
   const go = useGo();
 
-  const { resource, identifier } = useResource(resourceFromProp);
+  const { resource, identifier } = useResourceParams({
+    resource: resourceFromProp,
+  });
 
   const combinedMeta = getMeta({
     resource,
@@ -381,66 +285,42 @@ export function useTable<
   const [filters, setFilters] = useState<CrudFilter[]>(
     setInitialFilters(preferredPermanentFilters, defaultFilter ?? []),
   );
-  const [current, setCurrent] = useState<number>(defaultCurrent);
+  const [currentPage, setCurrentPage] = useState<number>(defaultCurrentPage);
   const [pageSize, setPageSize] = useState<number>(defaultPageSize);
 
   const getCurrentQueryParams = (): object => {
-    if (routerType === "new") {
-      // We get QueryString parameters that are uncontrolled by refine.
-      const { sorters, filters, pageSize, current, ...rest } =
-        parsedParams?.params ?? {};
-
-      return rest;
-    }
-
     // We get QueryString parameters that are uncontrolled by refine.
-    const { sorter, filters, pageSize, current, ...rest } = qs.parse(search, {
-      ignoreQueryPrefix: true,
-    });
+    const { sorters, filters, pageSize, current, ...rest } =
+      parsedParams?.params ?? {};
 
     return rest;
   };
 
   const createLinkForSyncWithLocation = ({
-    pagination: { current, pageSize },
-    sorter,
+    pagination: { currentPage, pageSize },
+    sorters,
     filters,
   }: SyncWithLocationParams) => {
-    if (routerType === "new") {
-      return (
-        go({
-          type: "path",
-          options: {
-            keepHash: true,
-            keepQuery: true,
-          },
-          query: {
-            ...(isPaginationEnabled ? { current, pageSize } : {}),
-            sorters: sorter,
-            filters,
-            ...getCurrentQueryParams(),
-          },
-        }) ?? ""
-      );
-    }
-    const currentQueryParams = qs.parse(search?.substring(1)); // remove first ? character
-
-    const stringifyParams = stringifyTableParams({
-      pagination: {
-        pageSize,
-        current,
-      },
-      sorters: sorters ?? sorter,
-      filters,
-      ...currentQueryParams,
-    });
-
-    return `${pathname ?? ""}?${stringifyParams ?? ""}`;
+    return (
+      go({
+        type: "path",
+        options: {
+          keepHash: true,
+          keepQuery: true,
+        },
+        query: {
+          ...(isPaginationEnabled ? { currentPage, pageSize } : {}),
+          sorters,
+          filters,
+          ...getCurrentQueryParams(),
+        },
+      }) ?? ""
+    );
   };
 
   useEffect(() => {
-    if (search === "") {
-      setCurrent(defaultCurrent);
+    if (parsedParams?.params?.search === "") {
+      setCurrentPage(defaultCurrentPage);
       setPageSize(defaultPageSize);
       setSorters(
         setInitialSorters(preferredPermanentSorters, defaultSorter ?? []),
@@ -449,59 +329,27 @@ export function useTable<
         setInitialFilters(preferredPermanentFilters, defaultFilter ?? []),
       );
     }
-  }, [search]);
+  }, [parsedParams?.params?.search]);
 
   useEffect(() => {
     if (syncWithLocation) {
-      // Careful! This triggers render
-      const queryParams = getCurrentQueryParams();
-
-      if (routerType === "new") {
-        go({
-          type: "replace",
-          options: {
-            keepQuery: true,
-          },
-          query: {
-            ...(isPaginationEnabled ? { pageSize, current } : {}),
-            sorters: differenceWith(
-              sorters,
-              preferredPermanentSorters,
-              isEqual,
-            ),
-            filters: differenceWith(
-              filters,
-              preferredPermanentFilters,
-              isEqual,
-            ),
-            // ...queryParams,
-          },
-        });
-      } else {
-        const stringifyParams = stringifyTableParams({
-          ...(isPaginationEnabled
-            ? {
-                pagination: {
-                  pageSize,
-                  current,
-                },
-              }
-            : {}),
+      go({
+        type: "replace",
+        options: {
+          keepQuery: true,
+        },
+        query: {
+          ...(isPaginationEnabled ? { pageSize, currentPage } : {}),
           sorters: differenceWith(sorters, preferredPermanentSorters, isEqual),
           filters: differenceWith(filters, preferredPermanentFilters, isEqual),
-          ...queryParams,
-        });
-        return replace?.(`${pathname}?${stringifyParams}`, undefined, {
-          shallow: true,
-        });
-      }
+        },
+      });
     }
-  }, [syncWithLocation, current, pageSize, sorters, filters]);
+  }, [syncWithLocation, currentPage, pageSize, sorters, filters]);
 
   const queryResult = useList<TQueryFnData, TError, TData>({
     resource: identifier,
-    hasPagination,
-    pagination: { current, pageSize, mode: pagination?.mode },
+    pagination: { currentPage: currentPage, pageSize, mode: pagination?.mode },
     filters: isServerSideFilteringEnabled
       ? unionFilters(preferredPermanentFilters, filters)
       : undefined,
@@ -513,7 +361,6 @@ export function useTable<
     successNotification,
     errorNotification,
     meta: combinedMeta,
-    metaData: combinedMeta,
     liveMode,
     liveParams,
     onLiveEvent,
@@ -572,22 +419,23 @@ export function useTable<
   );
 
   return {
-    tableQueryResult: queryResult,
-    tableQuery: queryResult,
+    tableQuery: queryResult.query,
     sorters,
     setSorters: setSortWithUnion,
-    sorter: sorters,
-    setSorter: setSortWithUnion,
     filters,
     setFilters: setFiltersFn,
-    current,
-    setCurrent,
+    currentPage,
+    setCurrentPage,
     pageSize,
     setPageSize,
     pageCount: pageSize
-      ? Math.ceil((queryResult.data?.total ?? 0) / pageSize)
+      ? Math.ceil((queryResult.result?.total ?? 0) / pageSize)
       : 1,
     createLinkForSyncWithLocation,
     overtime: queryResult.overtime,
+    result: {
+      data: queryResult.result?.data || [],
+      total: queryResult.result?.total,
+    },
   };
 }

package/src/hooks/useTelemetryData/index.ts

@@ -6,8 +6,8 @@ import { DataContext } from "@contexts/data";
 import { I18nContext } from "@contexts/i18n";
 import { LiveContext } from "@contexts/live";
 import { NotificationContext } from "@contexts/notification";
-import { LegacyRouterContext } from "@contexts/router/legacy";
-import { useResource } from "@hooks/resource";
+import { RouterContext } from "@contexts/router";
+import { useResourceParams } from "@hooks/use-resource-params";
 
 import { useIsExistAuthentication, useRefineContext } from "..";
 import type { ITelemetryData } from "../../components/telemetry/types";
@@ -19,12 +19,12 @@ export const useTelemetryData = (): ITelemetryData => {
   const auth = useIsExistAuthentication();
   const auditLogContext = useContext(AuditLogContext);
   const { liveProvider } = useContext(LiveContext);
-  const routerContext = useContext(LegacyRouterContext);
+  const routerContext = useContext(RouterContext);
   const dataContext = useContext(DataContext);
   const { i18nProvider } = useContext(I18nContext);
   const notificationContext = useContext(NotificationContext);
   const accessControlContext = useContext(AccessControlContext);
-  const { resources } = useResource();
+  const { resources } = useResourceParams();
   const refineOptions = useRefineContext();
 
   const auditLog =
@@ -38,11 +38,10 @@ export const useTelemetryData = (): ITelemetryData => {
     !!liveProvider?.unsubscribe;
 
   const router =
-    !!routerContext.useHistory ||
     !!routerContext.Link ||
-    !!routerContext.Prompt ||
-    !!routerContext.useLocation ||
-    !!routerContext.useParams;
+    !!routerContext.go ||
+    !!routerContext.back ||
+    !!routerContext.parse;
 
   const data = !!dataContext;
 

package/src/index.tsx

@@ -3,7 +3,6 @@ export * from "./hooks/index.js";
 
 // all auth types
 export * from "./components/pages/auth/types.js";
-export { ILoginForm } from "./components/pages/login/index.js";
 
 export {
   getDefaultFilter,
@@ -17,19 +16,13 @@ export {
   unionSorters,
 } from "./definitions/table/index.js";
 export {
-  createTreeView,
   handleUseParams,
   importCSVMapper,
-  routeGenerator,
-  userFriendlyResourceName,
   getNextPageParam,
   getPreviousPageParam,
-  pickNotDeprecated,
-  legacyResourceTransform,
   matchResourceFromRoute,
   useActiveAuthProvider,
   useUserFriendlyName,
-  queryKeys,
   pickDataProvider,
   keys,
   KeyBuilder,
@@ -63,13 +56,10 @@ export {
 
 export {
   AuthActionResponse,
-  AuthBindings,
   AuthProvider,
   CheckResponse,
   IAuthContext,
   IdentityResponse,
-  ILegacyAuthContext,
-  LegacyAuthProvider,
   OnErrorResponse,
   PermissionResponse,
   SuccessNotificationResponse,
@@ -111,9 +101,7 @@ export {
   BaseRecord,
   HttpError,
   MetaQuery,
-  MetaDataQuery,
   MutationMode,
-  Option,
   BaseOption,
   IQueryKeys,
   Prettify,
@@ -166,7 +154,6 @@ export {
 } from "./contexts/notification/types.js";
 
 export {
-  DashboardPageProps,
   IRefineContext,
   IRefineContextOptions,
   IRefineContextProvider,
@@ -183,28 +170,12 @@ export {
   IResourceComponentsProps,
   IResourceContext,
   IResourceItem,
-  ITreeMenu,
-  IMenuItem,
   ResourceAuditLogPermissions,
   ResourceBindings,
   RouteableProperties,
-  ResourceRouteComponent,
-  ResourceRouteComposition,
-  ResourceRouteDefinition,
   ResourceRoutePath,
 } from "./contexts/resource/types.js";
 
-export {
-  ActionWithPage,
-  LegacyRouterProvider,
-  LegacyRouterProvider as IRouterContext,
-  LegacyRouterProvider as IRouterProvider,
-  PromptProps,
-  ResourceErrorRouterParams,
-  ResourceRouterParams,
-  RouteAction,
-} from "./contexts/router/legacy/types.js";
-
 export {
   Action,
   BackFunction,
@@ -214,7 +185,6 @@ export {
   ParsedParams,
   ParseFunction,
   RouterProvider,
-  RouterProvider as RouterBindings,
 } from "./contexts/router/types.js";
 
 export {
@@ -229,3 +199,5 @@ export {
   MetaContextProvider,
   useMetaContext,
 } from "./contexts/metaContext/index.js";
+
+export { TreeMenuItem, UseMenuProps } from "./hooks/menu/useMenu.js";