@refinedev/core 4.0.0

package/src/hooks/refine/useMutationMode.ts

@@ -0,0 +1,22 @@
+import { useContext } from "react";
+
+import { RefineContext } from "@contexts/refine";
+import { IRefineContextOptions } from "../../interfaces";
+
+type UseMutationModeType = () => {
+    mutationMode: IRefineContextOptions["mutationMode"];
+    undoableTimeout: IRefineContextOptions["undoableTimeout"];
+};
+
+/**
+ * Mutation mode determines which mode the mutation runs with.
+ * Mutations can run under three different modes: `pessimistic`, `optimistic` and `undoable`.
+ * Each mode corresponds to a different type of user experience.
+ *
+ * @see {@link https://refine.dev/docs/guides-and-concepts/mutation-mode} for more details.
+ */
+export const useMutationMode: UseMutationModeType = () => {
+    const { mutationMode, undoableTimeout } = useContext(RefineContext);
+
+    return { mutationMode, undoableTimeout };
+};

package/src/hooks/refine/useRefineContext.ts

@@ -0,0 +1,41 @@
+import { useContext } from "react";
+
+import { RefineContext } from "@contexts/refine";
+
+export const useRefineContext = () => {
+    const {
+        Footer,
+        Header,
+        Layout,
+        OffLayoutArea,
+        Sider,
+        Title,
+        hasDashboard,
+        mutationMode,
+        syncWithLocation,
+        undoableTimeout,
+        warnWhenUnsavedChanges,
+        DashboardPage,
+        LoginPage,
+        catchAll,
+        options,
+    } = useContext(RefineContext);
+
+    return {
+        Footer,
+        Header,
+        Layout,
+        OffLayoutArea,
+        Sider,
+        Title,
+        hasDashboard,
+        mutationMode,
+        syncWithLocation,
+        undoableTimeout,
+        warnWhenUnsavedChanges,
+        DashboardPage,
+        LoginPage,
+        catchAll,
+        options,
+    };
+};

package/src/hooks/refine/useSyncWithLocation.ts

@@ -0,0 +1,20 @@
+import { useContext } from "react";
+
+import { RefineContext } from "@contexts/refine";
+import { IRefineContextOptions } from "../../interfaces";
+
+type UseSyncWithLocationType = () => {
+    syncWithLocation: IRefineContextOptions["syncWithLocation"];
+};
+
+/**
+ * List query parameter values can be edited manually by typing directly in the URL.
+ * To activate this feature `syncWithLocation` needs to be set to `true`.
+ *
+ * @see {@link https://refine.dev/docs/api-references/components/refine-config#syncwithlocation} for more details.
+ */
+export const useSyncWithLocation: UseSyncWithLocationType = () => {
+    const { syncWithLocation } = useContext(RefineContext);
+
+    return { syncWithLocation };
+};

package/src/hooks/refine/useTitle.tsx

@@ -0,0 +1,15 @@
+import { useContext } from "react";
+import { RefineContext } from "@contexts/refine";
+import { TitleProps } from "../../interfaces";
+
+/**
+ * `useTitle` returns a component that calls the `<Title>` passed to the `<Refine>`.
+ * In this way, it becomes easier for us to access this component in various parts of the application.
+ *
+ * @see {@link https://refine.dev/docs/core/hooks/refine/useTitle} for more details.
+ */
+export const useTitle: () => React.FC<TitleProps> | undefined = () => {
+    const { Title } = useContext(RefineContext);
+
+    return Title;
+};

package/src/hooks/refine/useWarnAboutChange/index.ts

@@ -0,0 +1,32 @@
+import { useContext } from "react";
+
+import { RefineContext } from "@contexts/refine";
+import { UnsavedWarnContext } from "@contexts/unsavedWarn";
+import {
+    IRefineContextOptions,
+    IUnsavedWarnContext,
+} from "../../../interfaces";
+
+type UseWarnAboutChangeType = () => {
+    warnWhenUnsavedChanges: IRefineContextOptions["warnWhenUnsavedChanges"];
+    warnWhen: NonNullable<IUnsavedWarnContext["warnWhen"]>;
+    setWarnWhen: NonNullable<IUnsavedWarnContext["setWarnWhen"]>;
+};
+
+/**
+ * When you have unsaved changes and try to leave the current page, **refine** shows a confirmation modal box.
+ * To activate this feature, set the `warnWhenUnsavedChanges` to `true`.
+ *
+ * @see {@link https://refine.dev/docs/api-references/components/refine-config#warnwhenunsavedchanges} for more details.
+ */
+export const useWarnAboutChange: UseWarnAboutChangeType = () => {
+    const { warnWhenUnsavedChanges } = useContext(RefineContext);
+
+    const { warnWhen, setWarnWhen } = useContext(UnsavedWarnContext);
+
+    return {
+        warnWhenUnsavedChanges,
+        warnWhen: Boolean(warnWhen),
+        setWarnWhen: setWarnWhen ?? (() => undefined),
+    };
+};

package/src/hooks/resource/index.ts

@@ -0,0 +1,2 @@
+export * from "./useResource";
+export * from "./useResourceWithRoute";

package/src/hooks/resource/useResource/index.ts

@@ -0,0 +1,151 @@
+import { useContext } from "react";
+
+import { ResourceContext } from "@contexts/resource";
+import {
+    Action,
+    BaseKey,
+    IResourceItem,
+    ResourceRouterParams,
+} from "../../../interfaces";
+import { useRouterContext, useResourceWithRoute } from "@hooks";
+import { useRouterType } from "../../../contexts/router-picker";
+import { useParsed } from "../../router/use-parsed";
+import { pickResource } from "../../../definitions/helpers/pick-resource";
+
+export type UseResourceLegacyProps = {
+    /**
+     * Determines which resource to use for redirection
+     * @deprecated resourceName deprecated. Use resourceNameOrRouteName instead # https://github.com/refinedev/refine/issues/1618
+     */
+    resourceName?: string;
+    /**
+     * Determines which resource to use for redirection
+     * @default Resource name that it reads from route
+     */
+    resourceNameOrRouteName?: string;
+    /**
+     * Adds id to the end of the URL
+     * @deprecated resourceName deprecated. Use resourceNameOrRouteName instead # https://github.com/refinedev/refine/issues/1618
+     */
+    recordItemId?: BaseKey;
+};
+
+/**
+ * Matches the resource by identifier.
+ * If not provided, the resource from the route will be returned.
+ * If your resource does not explicitly define an identifier, the resource name will be used.
+ */
+export type UseResourceParam = string | undefined;
+
+type UseResourceReturnType = {
+    resources: IResourceItem[];
+    resource?: IResourceItem;
+    /**
+     * @deprecated Use `resource.name` instead when you need to get the resource name.
+     */
+    resourceName?: string;
+    id?: BaseKey;
+    action?: Action;
+};
+
+type UseResourceReturnTypeWithResource = UseResourceReturnType & {
+    resource: IResourceItem;
+};
+
+/**
+ * @deprecated Use `useResource` with `identifier` property instead. (`identifier` does not check by route name in new router)
+ */
+export function useResource(
+    props: UseResourceLegacyProps,
+): UseResourceReturnType;
+export function useResource(): UseResourceReturnType;
+export function useResource<TIdentifier = UseResourceParam>(
+    identifier: TIdentifier,
+): TIdentifier extends NonNullable<UseResourceParam>
+    ? UseResourceReturnTypeWithResource
+    : UseResourceReturnType;
+/**
+ * `useResource` is used to get `resources` that are defined as property of the `<Refine>` component.
+ *
+ * @see {@link https://refine.dev/docs/core/hooks/resource/useResource} for more details.
+ */
+export function useResource(
+    args?: UseResourceLegacyProps | UseResourceParam,
+): UseResourceReturnType {
+    const { resources } = useContext(ResourceContext);
+
+    const routerType = useRouterType();
+
+    const params = useParsed();
+
+    const oldProps = {
+        resourceName:
+            args && typeof args !== "string" ? args.resourceName : args,
+        resourceNameOrRouteName:
+            args && typeof args !== "string"
+                ? args.resourceNameOrRouteName
+                : args,
+        recordItemId:
+            args && typeof args !== "string" ? args.recordItemId : undefined,
+    };
+
+    /**
+     * Legacy Router - Start
+     *
+     * using `useParams` and `route` to match resource and get params.
+     */
+    const resourceWithRoute = useResourceWithRoute();
+
+    const { useParams } = useRouterContext();
+
+    const legacyParams = useParams<Partial<ResourceRouterParams>>();
+
+    if (routerType === "legacy") {
+        const resourceKeyToCheck = oldProps.resourceNameOrRouteName
+            ? oldProps.resourceNameOrRouteName
+            : legacyParams.resource;
+
+        const legacyResource = resourceKeyToCheck
+            ? resourceWithRoute(resourceKeyToCheck)
+            : undefined;
+        const legacyId = oldProps?.recordItemId ?? legacyParams.id;
+        const legacyAction = legacyParams.action;
+        const legacyResourceName =
+            oldProps?.resourceName ?? legacyResource?.name;
+
+        return {
+            resources,
+            resource: legacyResource,
+            resourceName: legacyResourceName,
+            id: legacyId,
+            action: legacyAction,
+        };
+    }
+    /** Legacy Router - End */
+
+    /** New Router */
+    let resource: IResourceItem | undefined = undefined;
+    // we try to pick the resource from props first
+    const identifier =
+        typeof args === "string" ? args : oldProps?.resourceNameOrRouteName;
+    if (identifier) {
+        const pickedFromProps = pickResource(identifier, resources);
+        if (pickedFromProps) {
+            resource = pickedFromProps;
+        } else {
+            resource = {
+                name: identifier as string,
+            };
+        }
+    } else if (params?.resource) {
+        resource = params.resource;
+    }
+
+    return {
+        resources,
+        resource,
+        resourceName: resource?.name,
+        id: params.id,
+        action: params.action,
+    };
+}

package/src/hooks/resource/useResourceWithRoute/index.ts

@@ -0,0 +1,27 @@
+import { useContext, useCallback } from "react";
+import { ResourceContext } from "@contexts/resource";
+import { IResourceItem } from "../../../interfaces";
+import { pickResource } from "@definitions/helpers/pick-resource";
+
+export type UseResourceWithRouteReturnType = (route: string) => IResourceItem;
+
+/**
+ * @deprecated Use `useResource` hook instead.
+ * @internal This hook is for internal use only. And is kept for backward compatibility.
+ */
+export const useResourceWithRoute = (): UseResourceWithRouteReturnType => {
+    const { resources } = useContext(ResourceContext);
+
+    const resourceWithRoute = useCallback(
+        (route: string) => {
+            const picked = pickResource(route, resources, true);
+            if (picked) {
+                return picked;
+            }
+            return { name: route, route: route } as IResourceItem;
+        },
+        [resources],
+    );
+
+    return resourceWithRoute;
+};

package/src/hooks/router/index.ts

@@ -0,0 +1,7 @@
+export { useGo } from "./use-go";
+export { useBack } from "./use-back";
+export { useParse } from "./use-parse";
+export { useParsed } from "./use-parsed";
+export { useGetToPath } from "./use-get-to-path";
+export { useToPath } from "./use-to-path";
+export { useLink } from "./use-link";

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

@@ -0,0 +1,15 @@
+import { RouterBindingsContext } from "@contexts/router";
+import React, { useContext } from "react";
+
+export const useBack = () => {
+    const bindings = useContext(RouterBindingsContext);
+
+    const useBack = React.useMemo(
+        () => bindings?.back ?? (() => () => undefined),
+        [bindings?.back],
+    );
+
+    const back = useBack();
+
+    return back;
+};

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

@@ -0,0 +1,60 @@
+import React from "react";
+import { useResource } from "../../resource";
+import { Action, IResourceItem } from "../../../interfaces";
+import { getActionRoutesFromResource } from "../../../definitions/helpers/router";
+import { useParsed } from "../use-parsed";
+import { composeRoute } from "../../../definitions/helpers/router/compose-route";
+import { useRouterType } from "./../../../contexts/router-picker";
+
+type UseToPathParams = {
+    resource?: IResourceItem;
+    action: Action;
+    meta?: Record<string, unknown>;
+    legacy?: boolean;
+};
+
+type GetToPathFn = (params: UseToPathParams) => string | undefined;
+
+/**
+ * Returns a function to get the route for a given action and resource.
+ * If resource is not provided, it will use the resource from the route.
+ * If the resource is not found, it will return undefined.
+ * If the action is not found, it will return undefined.
+ * `meta` can be provided to compose the routes with parameters. (Can be used for nested routes.)
+ */
+export const useGetToPath = (): GetToPathFn => {
+    const routerType = useRouterType();
+    const { resource: resourceFromRoute, resources } = useResource();
+    const parsed = useParsed();
+
+    const fn = React.useCallback(
+        ({ resource, action, meta }: UseToPathParams): string | undefined => {
+            const selectedResource = resource || resourceFromRoute;
+
+            if (!selectedResource) {
+                return undefined;
+            }
+
+            const actionRoutes = getActionRoutesFromResource(
+                selectedResource,
+                resources,
+                routerType === "legacy",
+            );
+
+            const actionRoute = actionRoutes.find(
+                (item) => item.action === action,
+            )?.route;
+
+            if (!actionRoute) {
+                return undefined;
+            }
+
+            const composed = composeRoute(actionRoute, parsed, meta);
+
+            return composed;
+        },
+        [resources, resourceFromRoute, parsed],
+    );
+
+    return fn;
+};

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

@@ -0,0 +1,15 @@
+import { RouterBindingsContext } from "@contexts/router";
+import React, { useContext } from "react";
+
+export const useGo = () => {
+    const bindings = useContext(RouterBindingsContext);
+
+    const useGo = React.useMemo(
+        () => bindings?.go ?? (() => () => undefined),
+        [bindings?.go],
+    );
+
+    const go = useGo();
+
+    return go;
+};

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

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

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

@@ -0,0 +1,21 @@
+import { RouterBindingsContext } from "@contexts/router";
+import React, { useContext } from "react";
+import { ParseFunction } from "src/interfaces";
+
+export const useParse = () => {
+    const bindings = useContext(RouterBindingsContext);
+
+    const useParse = React.useMemo(
+        () =>
+            bindings?.parse ??
+            (() =>
+                (() => {
+                    return {};
+                }) as ParseFunction),
+        [bindings?.parse],
+    );
+
+    const parse = useParse();
+
+    return parse;
+};

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

@@ -0,0 +1,10 @@
+import React from "react";
+import { useParse } from "../use-parse";
+
+export const useParsed = () => {
+    const parse = useParse();
+
+    const parsed = React.useMemo(() => parse(), [parse]);
+
+    return parsed;
+};

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

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

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

@@ -0,0 +1,27 @@
+import { Action, IResourceItem } from "../../../interfaces";
+import { useGetToPath } from "../use-get-to-path";
+
+type UseToPathParams = {
+    resource?: IResourceItem;
+    action: Action;
+    meta?: Record<string, unknown>;
+    legacy?: boolean;
+};
+
+/**
+ * Returns the route for a given action and resource.
+ * If resource is not provided, it will use the resource from the route.
+ * If the resource is not found, it will return undefined.
+ * If the action is not found, it will return undefined.
+ * `meta` can be provided to compose the routes with parameters. (Can be used for nested routes.)
+ */
+export const useToPath = ({
+    resource,
+    action,
+    meta,
+    legacy,
+}: UseToPathParams): string | undefined => {
+    const getToPath = useGetToPath();
+
+    return getToPath({ resource, action, meta, legacy });
+};

package/src/hooks/show/index.ts

@@ -0,0 +1 @@
+export * from "./useShow";