@refinedev/core 4.22.0 → 4.24.0

package/src/hooks/data/useCustom.ts

@@ -22,6 +22,11 @@ import {
     Prettify,
     SuccessErrorNotification,
 } from "../../interfaces";
+import {
+    useLoadingOvertime,
+    UseLoadingOvertimeOptionsProps,
+    UseLoadingOvertimeReturnType,
+} from "../useLoadingOvertime";
 
 interface UseCustomConfig<TQuery, TPayload> {
     /**
@@ -73,7 +78,8 @@ export type UseCustomProps<TQueryFnData, TError, TQuery, TPayload, TData> = {
     CustomResponse<TData>,
     TError,
     Prettify<UseCustomConfig<TQuery, TPayload> & MetaQuery>
->;
+> &
+    UseLoadingOvertimeOptionsProps;
 
 /**
  * `useCustom` is a modified version of `react-query`'s {@link https://react-query.tanstack.com/guides/queries `useQuery`} used for custom requests.
@@ -106,13 +112,15 @@ export const useCustom = <
     meta,
     metaData,
     dataProviderName,
+    overtimeOptions,
 }: UseCustomProps<
     TQueryFnData,
     TError,
     TQuery,
     TPayload,
     TData
->): QueryObserverResult<CustomResponse<TData>, TError> => {
+>): QueryObserverResult<CustomResponse<TData>, TError> &
+    UseLoadingOvertimeReturnType => {
     const dataProvider = useDataProvider();
     const authProvider = useActiveAuthProvider();
     const { mutate: checkError } = useOnError({
@@ -201,7 +209,13 @@ export const useCustom = <
                 });
             },
         });
-        return queryResponse;
+        const { elapsedTime } = useLoadingOvertime({
+            isLoading: queryResponse.isFetching,
+            interval: overtimeOptions?.interval,
+            onInterval: overtimeOptions?.onInterval,
+        });
+
+        return { ...queryResponse, overtime: { elapsedTime } };
     } else {
         throw Error("Not implemented custom on data provider.");
     }

package/src/hooks/data/useCustomMutation.ts

@@ -20,6 +20,11 @@ import {
     Prettify,
 } from "../../interfaces";
 import { pickNotDeprecated, useActiveAuthProvider } from "@definitions/helpers";
+import {
+    useLoadingOvertime,
+    UseLoadingOvertimeOptionsProps,
+    UseLoadingOvertimeReturnType,
+} from "../useLoadingOvertime";
 
 interface UseCustomMutationConfig {
     headers?: {};
@@ -71,7 +76,7 @@ export type UseCustomMutationProps<
         >,
         "mutationFn" | "onError" | "onSuccess"
     >;
-};
+} & UseLoadingOvertimeOptionsProps;
 
 /**
  * `useCustomMutation` is a modified version of `react-query`'s {@link https://react-query.tanstack.com/reference/useMutation `useMutation`} for create mutations.
@@ -92,11 +97,13 @@ export const useCustomMutation = <
     TVariables = {},
 >({
     mutationOptions,
+    overtimeOptions,
 }: UseCustomMutationProps<
     TData,
     TError,
     TVariables
-> = {}): UseCustomMutationReturnType<TData, TError, TVariables> => {
+> = {}): UseCustomMutationReturnType<TData, TError, TVariables> &
+    UseLoadingOvertimeReturnType => {
     const authProvider = useActiveAuthProvider();
     const { mutate: checkError } = useOnError({
         v3LegacyAuthProviderCompatible: Boolean(authProvider?.isLegacy),
@@ -195,5 +202,11 @@ export const useCustomMutation = <
         },
     );
 
-    return mutation;
+    const { elapsedTime } = useLoadingOvertime({
+        isLoading: mutation.isLoading,
+        interval: overtimeOptions?.interval,
+        onInterval: overtimeOptions?.onInterval,
+    });
+
+    return { ...mutation, overtime: { elapsedTime } };
 };

package/src/hooks/data/useDelete.ts

@@ -39,6 +39,11 @@ import {
     pickNotDeprecated,
     useActiveAuthProvider,
 } from "@definitions/helpers";
+import {
+    useLoadingOvertime,
+    UseLoadingOvertimeOptionsProps,
+    UseLoadingOvertimeReturnType,
+} from "../useLoadingOvertime";
 
 export type DeleteParams<TData, TError, TVariables> = {
     id: BaseKey;
@@ -65,7 +70,8 @@ export type UseDeleteReturnType<
     TError,
     DeleteParams<TData, TError, TVariables>,
     DeleteContext<TData>
->;
+> &
+    UseLoadingOvertimeReturnType;
 
 export type UseDeleteProps<
     TData extends BaseRecord = BaseRecord,
@@ -81,7 +87,7 @@ export type UseDeleteProps<
         >,
         "mutationFn" | "onError" | "onSuccess" | "onSettled" | "onMutate"
     >;
-};
+} & UseLoadingOvertimeOptionsProps;
 
 /**
  * `useDelete` is a modified version of `react-query`'s {@link https://react-query.tanstack.com/reference/useMutation `useMutation`} for delete mutations.
@@ -101,6 +107,7 @@ export const useDelete = <
     TVariables = {},
 >({
     mutationOptions,
+    overtimeOptions,
 }: UseDeleteProps<TData, TError, TVariables> = {}): UseDeleteReturnType<
     TData,
     TError,
@@ -112,7 +119,7 @@ export const useDelete = <
     });
     const dataProvider = useDataProvider();
 
-    const { resources } = useResource();
+    const { resources, select } = useResource();
     const queryClient = useQueryClient();
 
     const {
@@ -138,14 +145,17 @@ export const useDelete = <
             id,
             mutationMode,
             undoableTimeout,
-            resource,
+            resource: resourceName,
             onCancel,
             meta,
             metaData,
             dataProviderName,
             values,
         }) => {
+            const { resource, identifier } = select(resourceName);
+
             const combinedMeta = getMeta({
+                resource,
                 meta: pickNotDeprecated(meta, metaData),
             });
 
@@ -157,9 +167,9 @@ export const useDelete = <
 
             if (!(mutationModePropOrContext === "undoable")) {
                 return dataProvider(
-                    pickDataProvider(resource, dataProviderName, resources),
+                    pickDataProvider(identifier, dataProviderName, resources),
                 ).deleteOne<TData, TVariables>({
-                    resource,
+                    resource: resource.name,
                     id,
                     meta: combinedMeta,
                     metaData: combinedMeta,
@@ -172,13 +182,13 @@ export const useDelete = <
                     const doMutation = () => {
                         dataProvider(
                             pickDataProvider(
-                                resource,
+                                identifier,
                                 dataProviderName,
                                 resources,
                             ),
                         )
                             .deleteOne<TData, TVariables>({
-                                resource,
+                                resource: resource.name,
                                 id,
                                 meta: combinedMeta,
                                 metaData: combinedMeta,
@@ -200,7 +210,7 @@ export const useDelete = <
                         type: ActionTypes.ADD,
                         payload: {
                             id,
-                            resource: resource,
+                            resource: identifier,
                             cancelMutation: cancelMutation,
                             doMutation: doMutation,
                             seconds: undoableTimeoutPropOrContext,
@@ -214,17 +224,19 @@ export const useDelete = <
         {
             onMutate: async ({
                 id,
-                resource,
+                resource: resourceName,
                 mutationMode,
                 dataProviderName,
                 meta,
                 metaData,
             }) => {
+                const { identifier } = select(resourceName);
+
                 const preferredMeta = pickNotDeprecated(meta, metaData);
+
                 const queryKey = queryKeys(
-                    resource,
-                    pickDataProvider(resource, dataProviderName, resources),
-                    preferredMeta,
+                    identifier,
+                    pickDataProvider(identifier, dataProviderName, resources),
                     preferredMeta,
                 );
 
@@ -294,16 +306,18 @@ export const useDelete = <
                 _error,
                 {
                     id,
-                    resource,
+                    resource: resourceName,
                     dataProviderName,
                     invalidates = ["list", "many"],
                 },
             ) => {
+                const { identifier } = select(resourceName);
+
                 // invalidate the cache for the list and many queries:
                 invalidateStore({
-                    resource,
+                    resource: identifier,
                     dataProviderName: pickDataProvider(
-                        resource,
+                        identifier,
                         dataProviderName,
                         resources,
                     ),
@@ -312,14 +326,14 @@ export const useDelete = <
 
                 notificationDispatch({
                     type: ActionTypes.REMOVE,
-                    payload: { id, resource },
+                    payload: { id, resource: identifier },
                 });
             },
             onSuccess: (
                 _data,
                 {
                     id,
-                    resource,
+                    resource: resourceName,
                     successNotification,
                     dataProviderName,
                     meta,
@@ -327,24 +341,26 @@ export const useDelete = <
                 },
                 context,
             ) => {
-                const resourceSingular = pluralize.singular(resource);
+                const { resource, identifier } = select(resourceName);
+
+                const resourceSingular = pluralize.singular(identifier);
 
                 // Remove the queries from the cache:
                 queryClient.removeQueries(context?.queryKey.detail(id));
 
                 const notificationConfig =
                     typeof successNotification === "function"
-                        ? successNotification(_data, id, resource)
+                        ? successNotification(_data, id, identifier)
                         : successNotification;
 
                 handleNotification(notificationConfig, {
-                    key: `${id}-${resource}-notification`,
+                    key: `${id}-${identifier}-notification`,
                     description: translate("notifications.success", "Success"),
                     message: translate(
                         "notifications.deleteSuccess",
                         {
                             resource: translate(
-                                `${resource}.${resource}`,
+                                `${identifier}.${identifier}`,
                                 resourceSingular,
                             ),
                         },
@@ -354,7 +370,7 @@ export const useDelete = <
                 });
 
                 publish?.({
-                    channel: `resources/${resource}`,
+                    channel: `resources/${resource.name}`,
                     type: "deleted",
                     payload: {
                         ids: [id],
@@ -362,16 +378,21 @@ export const useDelete = <
                     date: new Date(),
                 });
 
+                const combinedMeta = getMeta({
+                    resource,
+                    meta: pickNotDeprecated(meta, metaData),
+                });
+
                 const { fields, operation, variables, ...rest } =
-                    pickNotDeprecated(meta, metaData) || {};
+                    combinedMeta || {};
 
                 log?.mutate({
                     action: "delete",
-                    resource,
+                    resource: resource.name,
                     meta: {
                         id,
                         dataProviderName: pickDataProvider(
-                            resource,
+                            identifier,
                             dataProviderName,
                             resources,
                         ),
@@ -384,9 +405,11 @@ export const useDelete = <
             },
             onError: (
                 err: TError,
-                { id, resource, errorNotification },
+                { id, resource: resourceName, errorNotification },
                 context,
             ) => {
+                const { identifier } = select(resourceName);
+
                 // set back the queries to the context:
                 if (context) {
                     for (const query of context.previousQueries) {
@@ -397,15 +420,15 @@ export const useDelete = <
                 if (err.message !== "mutationCancelled") {
                     checkError(err);
 
-                    const resourceSingular = pluralize.singular(resource);
+                    const resourceSingular = pluralize.singular(identifier);
 
                     const notificationConfig =
                         typeof errorNotification === "function"
-                            ? errorNotification(err, id, resource)
+                            ? errorNotification(err, id, identifier)
                             : errorNotification;
 
                     handleNotification(notificationConfig, {
-                        key: `${id}-${resource}-notification`,
+                        key: `${id}-${identifier}-notification`,
                         message: translate(
                             "notifications.deleteError",
                             {
@@ -423,5 +446,11 @@ export const useDelete = <
         },
     );
 
-    return mutation;
+    const { elapsedTime } = useLoadingOvertime({
+        isLoading: mutation.isLoading,
+        interval: overtimeOptions?.interval,
+        onInterval: overtimeOptions?.onInterval,
+    });
+
+    return { ...mutation, overtime: { elapsedTime } };
 };

package/src/hooks/data/useDeleteMany.ts

@@ -40,6 +40,11 @@ import {
     pickNotDeprecated,
     useActiveAuthProvider,
 } from "@definitions";
+import {
+    useLoadingOvertime,
+    UseLoadingOvertimeOptionsProps,
+    UseLoadingOvertimeReturnType,
+} from "../useLoadingOvertime";
 
 export type DeleteManyParams<TData, TError, TVariables> = {
     ids: BaseKey[];
@@ -66,7 +71,8 @@ export type UseDeleteManyReturnType<
     TError,
     DeleteManyParams<TData, TError, TVariables>,
     unknown
->;
+> &
+    UseLoadingOvertimeReturnType;
 
 export type UseDeleteManyProps<
     TData extends BaseRecord = BaseRecord,
@@ -82,7 +88,7 @@ export type UseDeleteManyProps<
         >,
         "mutationFn" | "onError" | "onSuccess" | "onSettled" | "onMutate"
     >;
-};
+} & UseLoadingOvertimeOptionsProps;
 
 /**
  * `useDeleteMany` is a modified version of `react-query`'s {@link https://react-query.tanstack.com/reference/useMutation `useMutation`} for multiple delete mutations.
@@ -102,6 +108,7 @@ export const useDeleteMany = <
     TVariables = {},
 >({
     mutationOptions,
+    overtimeOptions,
 }: UseDeleteManyProps<TData, TError, TVariables> = {}): UseDeleteManyReturnType<
     TData,
     TError,
@@ -123,7 +130,7 @@ export const useDeleteMany = <
     const handleNotification = useHandleNotification();
     const invalidateStore = useInvalidate();
     const { log } = useLog();
-    const { resources } = useResource();
+    const { resources, select } = useResource();
     const queryClient = useQueryClient();
     const getMeta = useMeta();
 
@@ -134,7 +141,7 @@ export const useDeleteMany = <
         DeleteContext<TData>
     >(
         ({
-            resource,
+            resource: resourceName,
             ids,
             mutationMode,
             undoableTimeout,
@@ -144,7 +151,10 @@ export const useDeleteMany = <
             dataProviderName,
             values,
         }: DeleteManyParams<TData, TError, TVariables>) => {
+            const { resource, identifier } = select(resourceName);
+
             const combinedMeta = getMeta({
+                resource,
                 meta: pickNotDeprecated(meta, metaData),
             });
 
@@ -155,13 +165,13 @@ export const useDeleteMany = <
                 undoableTimeout ?? undoableTimeoutContext;
 
             const selectedDataProvider = dataProvider(
-                pickDataProvider(resource, dataProviderName, resources),
+                pickDataProvider(identifier, dataProviderName, resources),
             );
 
             const mutationFn = () => {
                 if (selectedDataProvider.deleteMany) {
                     return selectedDataProvider.deleteMany<TData, TVariables>({
-                        resource,
+                        resource: resource.name,
                         ids,
                         meta: combinedMeta,
                         metaData: combinedMeta,
@@ -171,7 +181,7 @@ export const useDeleteMany = <
                     return handleMultiple(
                         ids.map((id) =>
                             selectedDataProvider.deleteOne<TData, TVariables>({
-                                resource,
+                                resource: resource.name,
                                 id,
                                 meta: combinedMeta,
                                 metaData: combinedMeta,
@@ -206,7 +216,7 @@ export const useDeleteMany = <
                         type: ActionTypes.ADD,
                         payload: {
                             id: ids,
-                            resource: resource,
+                            resource: identifier,
                             cancelMutation: cancelMutation,
                             doMutation: doMutation,
                             seconds: undoableTimeoutPropOrContext,
@@ -220,17 +230,19 @@ export const useDeleteMany = <
         {
             onMutate: async ({
                 ids,
-                resource,
+                resource: resourceName,
                 mutationMode,
                 dataProviderName,
                 meta,
                 metaData,
             }) => {
+                const { identifier } = select(resourceName);
+
                 const preferredMeta = pickNotDeprecated(meta, metaData);
+
                 const queryKey = queryKeys(
-                    resource,
-                    pickDataProvider(resource, dataProviderName, resources),
-                    preferredMeta,
+                    identifier,
+                    pickDataProvider(identifier, dataProviderName, resources),
                     preferredMeta,
                 );
 
@@ -322,17 +334,19 @@ export const useDeleteMany = <
                 _data,
                 _error,
                 {
-                    resource,
+                    resource: resourceName,
                     ids,
                     dataProviderName,
                     invalidates = ["list", "many"],
                 },
             ) => {
+                const { identifier } = select(resourceName);
+
                 // invalidate the cache for the list and many queries:
                 invalidateStore({
-                    resource,
+                    resource: identifier,
                     dataProviderName: pickDataProvider(
-                        resource,
+                        identifier,
                         dataProviderName,
                         resources,
                     ),
@@ -341,14 +355,14 @@ export const useDeleteMany = <
 
                 notificationDispatch({
                     type: ActionTypes.REMOVE,
-                    payload: { id: ids, resource },
+                    payload: { id: ids, resource: identifier },
                 });
             },
             onSuccess: (
                 _data,
                 {
                     ids,
-                    resource,
+                    resource: resourceName,
                     meta,
                     metaData,
                     dataProviderName,
@@ -356,6 +370,8 @@ export const useDeleteMany = <
                 },
                 context,
             ) => {
+                const { resource, identifier } = select(resourceName);
+
                 // Remove the queries from the cache:
                 ids.forEach((id) =>
                     queryClient.removeQueries(context?.queryKey.detail(id)),
@@ -363,42 +379,47 @@ export const useDeleteMany = <
 
                 const notificationConfig =
                     typeof successNotification === "function"
-                        ? successNotification(_data, ids, resource)
+                        ? successNotification(_data, ids, identifier)
                         : successNotification;
 
                 handleNotification(notificationConfig, {
-                    key: `${ids}-${resource}-notification`,
+                    key: `${ids}-${identifier}-notification`,
                     description: translate("notifications.success", "Success"),
                     message: translate(
                         "notifications.deleteSuccess",
                         {
                             resource: translate(
-                                `${resource}.${resource}`,
-                                resource,
+                                `${identifier}.${identifier}`,
+                                identifier,
                             ),
                         },
-                        `Successfully deleted ${resource}`,
+                        `Successfully deleted ${identifier}`,
                     ),
                     type: "success",
                 });
 
                 publish?.({
-                    channel: `resources/${resource}`,
+                    channel: `resources/${resource.name}`,
                     type: "deleted",
                     payload: { ids },
                     date: new Date(),
                 });
 
+                const combinedMeta = getMeta({
+                    resource,
+                    meta: pickNotDeprecated(meta, metaData),
+                });
+
                 const { fields, operation, variables, ...rest } =
-                    pickNotDeprecated(meta, metaData) || {};
+                    combinedMeta || {};
 
                 log?.mutate({
                     action: "deleteMany",
-                    resource,
+                    resource: resource.name,
                     meta: {
                         ids,
                         dataProviderName: pickDataProvider(
-                            resource,
+                            identifier,
                             dataProviderName,
                             resources,
                         ),
@@ -411,7 +432,13 @@ export const useDeleteMany = <
                     queryClient.removeQueries(context?.queryKey.detail(id)),
                 );
             },
-            onError: (err, { ids, resource, errorNotification }, context) => {
+            onError: (
+                err,
+                { ids, resource: resourceName, errorNotification },
+                context,
+            ) => {
+                const { identifier } = select(resourceName);
+
                 // set back the queries to the context:
                 if (context) {
                     for (const query of context.previousQueries) {
@@ -421,15 +448,15 @@ export const useDeleteMany = <
 
                 if (err.message !== "mutationCancelled") {
                     checkError(err);
-                    const resourceSingular = pluralize.singular(resource);
+                    const resourceSingular = pluralize.singular(identifier);
 
                     const notificationConfig =
                         typeof errorNotification === "function"
-                            ? errorNotification(err, ids, resource)
+                            ? errorNotification(err, ids, identifier)
                             : errorNotification;
 
                     handleNotification(notificationConfig, {
-                        key: `${ids}-${resource}-notification`,
+                        key: `${ids}-${identifier}-notification`,
                         message: translate(
                             "notifications.deleteError",
                             {
@@ -447,5 +474,11 @@ export const useDeleteMany = <
         },
     );
 
-    return mutation;
+    const { elapsedTime } = useLoadingOvertime({
+        isLoading: mutation.isLoading,
+        interval: overtimeOptions?.interval,
+        onInterval: overtimeOptions?.onInterval,
+    });
+
+    return { ...mutation, overtime: { elapsedTime } };
 };