@refinedev/core 4.47.2 → 4.49.0

package/src/hooks/router/use-go/index.tsx

@@ -1,80 +1,82 @@
-import { RouterBindingsContext } from "@contexts/router";
-import { useResource } from "@hooks/resource";
 import React, { useCallback, useContext } from "react";
-import type {
-    Action,
-    BaseKey,
-    GoConfig as GoConfigBase,
-    IResourceItem,
-} from "../../../interfaces";
+
+import { RouterContext } from "@contexts/router";
+import { useResource } from "@hooks/resource";
+
+import { BaseKey } from "../../../contexts/data/types";
+import { IResourceItem } from "../../../contexts/resource/types";
+import {
+  Action,
+  GoConfig as GoConfigBase,
+} from "../../../contexts/router/types";
 import { useGetToPath } from "../use-get-to-path";
 
 type ResourceWithoutId = {
-    /**
-     *  The name or identifier of the resource.
-     */
-    resource: string;
-    action: Extract<Action, "create" | "list">;
-    id?: never;
-    meta?: Record<string, unknown>;
+  /**
+   *  The name or identifier of the resource.
+   */
+  resource: string;
+  action: Extract<Action, "create" | "list">;
+  id?: never;
+  meta?: Record<string, unknown>;
 };
 
 type ResourceWithId = {
-    /**
-     *  The name or identifier of the resource.
-     */
-    resource: string;
-    action: Extract<Action, "edit" | "show" | "clone">;
-    id: BaseKey;
-    meta?: Record<string, unknown>;
+  /**
+   *  The name or identifier of the resource.
+   */
+  resource: string;
+  action: Extract<Action, "edit" | "show" | "clone">;
+  id: BaseKey;
+  meta?: Record<string, unknown>;
 };
 
 export type Resource = ResourceWithoutId | ResourceWithId;
 
 export type GoConfigWithResource = Omit<GoConfigBase, "to"> & {
-    to?: GoConfigBase["to"] | Resource;
+  to?: GoConfigBase["to"] | Resource;
 };
 
 export const useGo = () => {
-    const bindings = useContext(RouterBindingsContext);
-    const { select: resourceSelect } = useResource();
-    const getToPath = useGetToPath();
+  const routerContext = useContext(RouterContext);
+  const { select: resourceSelect } = useResource();
+  const getToPath = useGetToPath();
 
-    const useGo = React.useMemo(
-        () => bindings?.go ?? (() => () => undefined),
-        [bindings?.go],
-    );
+  const useGo = React.useMemo(
+    () => routerContext?.go ?? (() => () => undefined),
+    [routerContext?.go],
+  );
+
+  const goFromRouter = useGo();
+
+  const go = useCallback(
+    (config: GoConfigWithResource | GoConfigBase) => {
+      if (typeof config.to !== "object") {
+        return goFromRouter({ ...config, to: config.to });
+      }
 
-    const goFromRouter = useGo();
-
-    const go = useCallback(
-        (config: GoConfigWithResource | GoConfigBase) => {
-            if (typeof config.to !== "object") {
-                return goFromRouter({ ...config, to: config.to });
-            }
-
-            // when config.to is an object, it means that we want to go to a resource.
-            // so we need to find the path for the resource.
-            const { resource } = resourceSelect(config.to.resource);
-            handleResourceErrors(config.to, resource);
-            const newTo = getToPath({
-                resource,
-                action: config.to.action,
-                meta: {
-                    id: config.to.id,
-                    ...config.to.meta,
-                },
-            });
-
-            return goFromRouter({
-                ...config,
-                to: newTo,
-            });
+      // when config.to is an object, it means that we want to go to a resource.
+      // so we need to find the path for the resource.
+      const { resource } = resourceSelect(config.to.resource);
+      handleResourceErrors(config.to, resource);
+      const newTo = getToPath({
+        resource,
+        action: config.to.action,
+        meta: {
+          id: config.to.id,
+          ...config.to.meta,
         },
-        [resourceSelect, goFromRouter],
-    );
+      });
+
+      return goFromRouter({
+        ...config,
+        to: newTo,
+      });
+    },
+    [resourceSelect, goFromRouter],
+  );
 
-    return go;
+  return go;
 };
 
 /**
@@ -82,20 +84,20 @@ export const useGo = () => {
  * @internal
  */
 export const handleResourceErrors = (to: Resource, resource: IResourceItem) => {
-    if (!to?.action || !to?.resource) {
-        throw new Error(`[useGo]: "action" or "resource" is required.`);
-    }
-
-    if (["edit", "show", "clone"].includes(to?.action) && !to.id) {
-        throw new Error(
-            `[useGo]: [action: ${to.action}] requires an "id" for resource [resource: ${to.resource}]`,
-        );
-    }
-
-    const actionUrl = resource[to.action];
-    if (!actionUrl) {
-        throw new Error(
-            `[useGo]: [action: ${to.action}] is not defined for [resource: ${to.resource}]`,
-        );
-    }
+  if (!to?.action || !to?.resource) {
+    throw new Error(`[useGo]: "action" or "resource" is required.`);
+  }
+
+  if (["edit", "show", "clone"].includes(to?.action) && !to.id) {
+    throw new Error(
+      `[useGo]: [action: ${to.action}] requires an "id" for resource [resource: ${to.resource}]`,
+    );
+  }
+
+  const actionUrl = resource[to.action];
+  if (!actionUrl) {
+    throw new Error(
+      `[useGo]: [action: ${to.action}] is not defined for [resource: ${to.resource}]`,
+    );
+  }
 };

package/src/hooks/router/use-link/index.tsx

@@ -1,17 +1,17 @@
-import { RouterBindingsContext } from "@contexts/router";
+import { RouterContext } from "@contexts/router";
 import React, { useContext } from "react";
 
 export const useLink = () => {
-    const bindings = useContext(RouterBindingsContext);
+  const routerContext = useContext(RouterContext);
 
-    if (bindings?.Link) {
-        return bindings.Link;
-    }
+  if (routerContext?.Link) {
+    return routerContext.Link;
+  }
 
-    const FallbackLink: Required<typeof bindings>["Link"] = ({
-        to,
-        ...rest
-    }) => <a href={to} {...rest} />;
+  const FallbackLink: Required<typeof routerContext>["Link"] = ({
+    to,
+    ...rest
+  }) => <a href={to} {...rest} />;
 
-    return FallbackLink;
+  return FallbackLink;
 };

package/src/hooks/router/use-parse/index.tsx

@@ -1,25 +1,25 @@
-import { RouterBindingsContext } from "@contexts/router";
+import { RouterContext } from "@contexts/router";
 import React, { useContext } from "react";
-import { ParseFunction, ParseResponse } from "src/interfaces";
+import { ParseFunction, ParseResponse } from "../../../contexts/router/types";
 
 type UseParseType = () => <
-    TParams extends Record<string, any> = Record<string, any>,
+  TParams extends Record<string, any> = Record<string, any>,
 >() => ParseResponse<TParams>;
 
 export const useParse: UseParseType = () => {
-    const bindings = useContext(RouterBindingsContext);
+  const routerContext = useContext(RouterContext);
 
-    const useParse = React.useMemo(
-        () =>
-            bindings?.parse ??
-            (() =>
-                (() => {
-                    return {};
-                }) as ParseFunction),
-        [bindings?.parse],
-    );
+  const useParse = React.useMemo(
+    () =>
+      routerContext?.parse ??
+      (() =>
+        (() => {
+          return {};
+        }) as ParseFunction),
+    [routerContext?.parse],
+  );
 
-    const parse = useParse();
+  const parse = useParse();
 
-    return parse as ReturnType<UseParseType>;
+  return parse as ReturnType<UseParseType>;
 };

package/src/hooks/router/use-parsed/index.tsx

@@ -2,11 +2,11 @@ import React from "react";
 import { useParse } from "../use-parse";
 
 export const useParsed = <
-    TParams extends Record<string, any> = Record<string, any>,
+  TParams extends Record<string, any> = Record<string, any>,
 >() => {
-    const parse = useParse();
+  const parse = useParse();
 
-    const parsed = React.useMemo(() => parse<TParams>(), [parse]);
+  const parsed = React.useMemo(() => parse<TParams>(), [parse]);
 
-    return parsed;
+  return parsed;
 };

package/src/hooks/router/use-router-misuse-warning/index.ts

@@ -1,18 +1,18 @@
 import { checkRouterPropMisuse } from "@definitions/helpers/check-router-prop-misuse";
 import React from "react";
-import { RouterBindings } from "src/interfaces";
+import { RouterProvider } from "../../../contexts/router/types";
 
-export const useRouterMisuseWarning = (value?: RouterBindings) => {
-    const warned = React.useRef(false);
+export const useRouterMisuseWarning = (value?: RouterProvider) => {
+  const warned = React.useRef(false);
 
-    React.useEffect(() => {
-        if (warned.current === false) {
-            if (value) {
-                const warn = checkRouterPropMisuse(value);
-                if (warn) {
-                    warned.current = true;
-                }
-            }
+  React.useEffect(() => {
+    if (warned.current === false) {
+      if (value) {
+        const warn = checkRouterPropMisuse(value);
+        if (warn) {
+          warned.current = true;
         }
-    }, [value]);
+      }
+    }
+  }, [value]);
 };

package/src/hooks/router/use-to-path/index.ts

@@ -1,11 +1,12 @@
-import { Action, IResourceItem } from "../../../interfaces";
+import { IResourceItem } from "../../../contexts/resource/types";
+import { Action } from "../../../contexts/router/types";
 import { useGetToPath } from "../use-get-to-path";
 
 type UseToPathParams = {
-    resource?: IResourceItem;
-    action: Action;
-    meta?: Record<string, unknown>;
-    legacy?: boolean;
+  resource?: IResourceItem;
+  action: Action;
+  meta?: Record<string, unknown>;
+  legacy?: boolean;
 };
 
 /**
@@ -16,12 +17,12 @@ type UseToPathParams = {
  * `meta` can be provided to compose the routes with parameters. (Can be used for nested routes.)
  */
 export const useToPath = ({
-    resource,
-    action,
-    meta,
-    legacy,
+  resource,
+  action,
+  meta,
+  legacy,
 }: UseToPathParams): string | undefined => {
-    const getToPath = useGetToPath();
+  const getToPath = useGetToPath();
 
-    return getToPath({ resource, action, meta, legacy });
+  return getToPath({ resource, action, meta, legacy });
 };

package/src/hooks/show/index.ts

@@ -1 +1,92 @@
-export * from "./useShow";
+import warnOnce from "warn-once";
+import { useMeta, useOne, useResourceParams, useLoadingOvertime } from "@hooks";
+import { pickNotDeprecated } from "@definitions/helpers";
+
+import type { UseShowProps, UseShowReturnType } from "./types";
+import { BaseKey, BaseRecord, HttpError } from "../../contexts/data/types";
+
+export type {
+  UseShowProps,
+  UseShowReturnType,
+  useShowProps,
+  useShowReturnType,
+} from "./types";
+
+/**
+ * `useShow` hook allows you to fetch the desired record.
+ * It uses `getOne` method as query function from the dataProvider that is
+ * passed to {@link https://refine.dev/docs/core/refine-component `<Refine>`}.
+ *
+ * @see {@link https://refine.dev/docs/data/hooks/use-show} for more details.
+ *
+ * @typeParam TQueryFnData - Result data returned by the query function. Extends {@link https://refine.dev/docs/core/interface-references/#baserecord `BaseRecord`}
+ * @typeParam TError - Custom error object that extends {@link https://refine.dev/docs/core/interface-references/#httperror `HttpError`}
+ * @typeParam TData - Result data returned by the `select` function. Extends {@link https://refine.dev/docs/core/interface-references/#baserecord `BaseRecord`}. Defaults to `TQueryFnData`
+ *
+ */
+export const useShow = <
+  TQueryFnData extends BaseRecord = BaseRecord,
+  TError extends HttpError = HttpError,
+  TData extends BaseRecord = TQueryFnData,
+>({
+  resource: resourceFromProp,
+  id,
+  meta,
+  metaData,
+  queryOptions,
+  overtimeOptions,
+  ...useOneProps
+}: UseShowProps<TQueryFnData, TError, TData> = {}): UseShowReturnType<
+  TData,
+  TError
+> => {
+  const {
+    resource,
+    identifier,
+    id: showId,
+    setId: setShowId,
+  } = useResourceParams({
+    id,
+    resource: resourceFromProp,
+  });
+
+  const getMeta = useMeta();
+
+  const combinedMeta = getMeta({
+    resource,
+    meta: pickNotDeprecated(meta, metaData),
+  });
+
+  warnOnce(
+    Boolean(resourceFromProp) && !showId,
+    idWarningMessage(identifier, showId),
+  );
+
+  const queryResult = useOne<TQueryFnData, TError, TData>({
+    resource: identifier,
+    id: showId ?? "",
+    queryOptions: {
+      enabled: showId !== undefined,
+      ...queryOptions,
+    },
+    meta: combinedMeta,
+    metaData: combinedMeta,
+    ...useOneProps,
+  });
+
+  const { elapsedTime } = useLoadingOvertime({
+    isLoading: queryResult.isFetching,
+    interval: overtimeOptions?.interval,
+    onInterval: overtimeOptions?.onInterval,
+  });
+
+  return {
+    queryResult,
+    showId,
+    setShowId,
+    overtime: { elapsedTime },
+  };
+};
+
+const idWarningMessage = (identifier?: string, id?: BaseKey) =>
+  `[useShow]: resource: "${identifier}", id: ${id} \n\nIf you don't use the \`setShowId\` method to set the \`showId\`, you should pass the \`id\` prop to \`useShow\`. Otherwise, \`useShow\` will not be able to infer the \`id\` from the current URL. \n\nSee https://refine.dev/docs/data/hooks/use-show/#resource`;

package/src/hooks/show/types.ts

@@ -0,0 +1,92 @@
+import React from "react";
+
+import type {
+  QueryObserverResult,
+  UseQueryOptions,
+} from "@tanstack/react-query";
+
+import type {
+  UseLoadingOvertimeOptionsProps,
+  UseLoadingOvertimeReturnType,
+} from "../useLoadingOvertime";
+import {
+  BaseKey,
+  BaseRecord,
+  GetOneResponse,
+  HttpError,
+  MetaQuery,
+  Prettify,
+} from "../../contexts/data/types";
+import { LiveModeProps } from "../../contexts/live/types";
+import { SuccessErrorNotification } from "../../contexts/notification/types";
+
+export type UseShowReturnType<
+  TData extends BaseRecord = BaseRecord,
+  TError extends HttpError = HttpError,
+> = {
+  queryResult: QueryObserverResult<GetOneResponse<TData>, TError>;
+  showId?: BaseKey;
+  setShowId: React.Dispatch<React.SetStateAction<BaseKey | undefined>>;
+} & UseLoadingOvertimeReturnType;
+
+export type UseShowProps<
+  TQueryFnData extends BaseRecord = BaseRecord,
+  TError extends HttpError = HttpError,
+  TData extends BaseRecord = TQueryFnData,
+> = {
+  /**
+   * Resource name for API data interactions
+   * @default Reads `:resource` from the URL
+   */
+  resource?: string;
+  /**
+   * Data item ID for API data interactions
+   * @default Reads `:id` from the URL
+   */
+  id?: BaseKey;
+  /**
+   * react-query's [useQuery](https://tanstack.com/query/v4/docs/reference/useQuery) options
+   */
+  queryOptions?: UseQueryOptions<
+    GetOneResponse<TQueryFnData>,
+    TError,
+    GetOneResponse<TData>
+  >;
+  /**
+   * Additional meta data to pass to the data provider's `getOne`
+   */
+  meta?: MetaQuery;
+  /**
+   * Additional meta data to pass to the data provider's `getOne`
+   * @deprecated `metaData` is deprecated with refine@4, refine will pass `meta` instead, however, we still support `metaData` for backward compatibility.
+   */
+  metaData?: MetaQuery;
+  /**
+   * Target data provider name for API call to be made
+   * @default `"default"`
+   */
+  dataProviderName?: string;
+} & LiveModeProps &
+  SuccessErrorNotification<
+    GetOneResponse<TData>,
+    TError,
+    Prettify<{ id?: BaseKey } & MetaQuery>
+  > &
+  UseLoadingOvertimeOptionsProps;
+
+/**
+ * @deprecated use `UseShowReturnType` instead
+ */
+export type useShowReturnType<
+  TData extends BaseRecord = BaseRecord,
+  TError extends HttpError = HttpError,
+> = UseShowReturnType<TData, TError>;
+
+/**
+ * @deprecated use `UseShowProps` instead
+ */
+export type useShowProps<
+  TQueryFnData extends BaseRecord = BaseRecord,
+  TError extends HttpError = HttpError,
+  TData extends BaseRecord = TQueryFnData,
+> = UseShowProps<TQueryFnData, TError, TData>;