@refinedev/core 4.47.2 → 4.48.0

package/src/components/pages/login/index.tsx

@@ -3,8 +3,8 @@ import React, { useState } from "react";
 import { useLogin, useTranslate } from "@hooks";
 import { useActiveAuthProvider } from "@definitions/helpers";
 export interface ILoginForm {
-    username: string;
-    password: string;
+  username: string;
+  password: string;
 }
 
 /**
@@ -14,78 +14,64 @@ export interface ILoginForm {
  * @see {@link https://refine.dev/docs/api-reference/core/components/refine-config/#loginpage} for more details.
  */
 export const LoginPage: React.FC = () => {
-    const [username, setUsername] = useState("");
-    const [password, setPassword] = useState("");
+  const [username, setUsername] = useState("");
+  const [password, setPassword] = useState("");
 
-    const translate = useTranslate();
+  const translate = useTranslate();
 
-    const authProvider = useActiveAuthProvider();
-    const { mutate: login } = useLogin<ILoginForm>({
-        v3LegacyAuthProviderCompatible: Boolean(authProvider?.isLegacy),
-    });
+  const authProvider = useActiveAuthProvider();
+  const { mutate: login } = useLogin<ILoginForm>({
+    v3LegacyAuthProviderCompatible: Boolean(authProvider?.isLegacy),
+  });
 
-    return (
-        <>
-            <h1>{translate("pages.login.title", "Sign in your account")}</h1>
-            <form
-                onSubmit={(e) => {
-                    e.preventDefault();
-                    login({ username, password });
-                }}
-            >
-                <table>
-                    <tbody>
-                        <tr>
-                            <td>
-                                {translate(
-                                    "pages.login.username",
-                                    undefined,
-                                    "username",
-                                )}
-                                :
-                            </td>
-                            <td>
-                                <input
-                                    type="text"
-                                    size={20}
-                                    autoCorrect="off"
-                                    spellCheck={false}
-                                    autoCapitalize="off"
-                                    autoFocus
-                                    required
-                                    value={username}
-                                    onChange={(e) =>
-                                        setUsername(e.target.value)
-                                    }
-                                />
-                            </td>
-                        </tr>
-                        <tr>
-                            <td>
-                                {translate(
-                                    "pages.login.password",
-                                    undefined,
-                                    "password",
-                                )}
-                                :
-                            </td>
-                            <td>
-                                <input
-                                    type="password"
-                                    required
-                                    size={20}
-                                    value={password}
-                                    onChange={(e) =>
-                                        setPassword(e.target.value)
-                                    }
-                                />
-                            </td>
-                        </tr>
-                    </tbody>
-                </table>
-                <br />
-                <input type="submit" value="login" />
-            </form>
-        </>
-    );
+  return (
+    <>
+      <h1>{translate("pages.login.title", "Sign in your account")}</h1>
+      <form
+        onSubmit={(e) => {
+          e.preventDefault();
+          login({ username, password });
+        }}
+      >
+        <table>
+          <tbody>
+            <tr>
+              <td>
+                {translate("pages.login.username", undefined, "username")}:
+              </td>
+              <td>
+                <input
+                  type="text"
+                  size={20}
+                  autoCorrect="off"
+                  spellCheck={false}
+                  autoCapitalize="off"
+                  autoFocus
+                  required
+                  value={username}
+                  onChange={(e) => setUsername(e.target.value)}
+                />
+              </td>
+            </tr>
+            <tr>
+              <td>
+                {translate("pages.login.password", undefined, "password")}:
+              </td>
+              <td>
+                <input
+                  type="password"
+                  required
+                  size={20}
+                  value={password}
+                  onChange={(e) => setPassword(e.target.value)}
+                />
+              </td>
+            </tr>
+          </tbody>
+        </table>
+        <br />
+        <input type="submit" value="login" />
+      </form>
+    </>
+  );
 };

package/src/components/pages/ready/index.tsx

@@ -6,33 +6,25 @@ import React from "react";
  * @deprecated `ReadyPage` is deprecated and will be removed in the next major release.
  */
 export const ReadyPage: React.FC = () => {
-    return (
-        <>
-            <h1>Welcome on board</h1>
-            <p>Your configuration is completed.</p>
-            <p>
-                Now you can get started by adding your resources to the{" "}
-                <code>`resources`</code> property of <code>{"`<Refine>`"}</code>
-            </p>
-            <div style={{ display: "flex", gap: 8 }}>
-                <a href="https://refine.dev" target="_blank" rel="noreferrer">
-                    <button>Documentation</button>
-                </a>
-                <a
-                    href="https://refine.dev/examples"
-                    target="_blank"
-                    rel="noreferrer"
-                >
-                    <button>Examples</button>
-                </a>
-                <a
-                    href="https://discord.gg/refine"
-                    target="_blank"
-                    rel="noreferrer"
-                >
-                    <button>Community</button>
-                </a>
-            </div>
-        </>
-    );
+  return (
+    <>
+      <h1>Welcome on board</h1>
+      <p>Your configuration is completed.</p>
+      <p>
+        Now you can get started by adding your resources to the{" "}
+        <code>`resources`</code> property of <code>{"`<Refine>`"}</code>
+      </p>
+      <div style={{ display: "flex", gap: 8 }}>
+        <a href="https://refine.dev" target="_blank" rel="noreferrer">
+          <button>Documentation</button>
+        </a>
+        <a href="https://refine.dev/examples" target="_blank" rel="noreferrer">
+          <button>Examples</button>
+        </a>
+        <a href="https://discord.gg/refine" target="_blank" rel="noreferrer">
+          <button>Community</button>
+        </a>
+      </div>
+    </>
+  );
 };

package/src/components/pages/welcome/index.tsx

@@ -4,12 +4,12 @@ import { useRefineContext } from "@hooks/refine";
 import { ConfigErrorPage } from "../config-error";
 
 export const WelcomePage = () => {
-    const { __initialized } = useRefineContext();
+  const { __initialized } = useRefineContext();
 
-    return (
-        <>
-            <ConfigSuccessPage />
-            {!__initialized && <ConfigErrorPage />}
-        </>
-    );
+  return (
+    <>
+      <ConfigSuccessPage />
+      {!__initialized && <ConfigErrorPage />}
+    </>
+  );
 };

package/src/components/routeChangeHandler/index.tsx

@@ -3,14 +3,14 @@ import { useRouterContext } from "@hooks";
 import { useLegacyAuthContext } from "@contexts/auth";
 
 export const RouteChangeHandler: React.FC = () => {
-    const { useLocation } = useRouterContext();
+  const { useLocation } = useRouterContext();
 
-    const { checkAuth } = useLegacyAuthContext();
-    const location = useLocation();
+  const { checkAuth } = useLegacyAuthContext();
+  const location = useLocation();
 
-    useEffect(() => {
-        checkAuth?.().catch(() => false);
-    }, [location?.pathname]);
+  useEffect(() => {
+    checkAuth?.().catch(() => false);
+  }, [location?.pathname]);
 
-    return null;
+  return null;
 };

package/src/components/telemetry/index.tsx

@@ -5,54 +5,54 @@ import { useTelemetryData } from "@hooks/useTelemetryData";
 import { ITelemetryData } from "../../interfaces/telemetry";
 
 const encode = (payload: ITelemetryData): string | undefined => {
-    try {
-        const stringifiedPayload = JSON.stringify(payload || {});
+  try {
+    const stringifiedPayload = JSON.stringify(payload || {});
 
-        if (typeof btoa !== "undefined") {
-            return btoa(stringifiedPayload);
-        }
-
-        return Buffer.from(stringifiedPayload).toString("base64");
-    } catch (err) {
-        return undefined;
+    if (typeof btoa !== "undefined") {
+      return btoa(stringifiedPayload);
     }
+
+    return Buffer.from(stringifiedPayload).toString("base64");
+  } catch (err) {
+    return undefined;
+  }
 };
 
 const throughImage = (src: string) => {
-    const img = new Image();
+  const img = new Image();
 
-    img.src = src;
+  img.src = src;
 };
 
 const throughFetch = (src: string) => {
-    fetch(src);
+  fetch(src);
 };
 
 const transport = (src: string) => {
-    if (typeof Image !== "undefined") {
-        throughImage(src);
-    } else if (typeof fetch !== "undefined") {
-        throughFetch(src);
-    }
+  if (typeof Image !== "undefined") {
+    throughImage(src);
+  } else if (typeof fetch !== "undefined") {
+    throughFetch(src);
+  }
 };
 
 export const Telemetry: React.FC<{}> = () => {
-    const payload = useTelemetryData();
-    const sent = React.useRef(false);
+  const payload = useTelemetryData();
+  const sent = React.useRef(false);
 
-    React.useEffect(() => {
-        if (sent.current) {
-            return;
-        }
-        const encoded = encode(payload);
+  React.useEffect(() => {
+    if (sent.current) {
+      return;
+    }
+    const encoded = encode(payload);
 
-        if (!encoded) {
-            return;
-        }
+    if (!encoded) {
+      return;
+    }
 
-        transport(`https://telemetry.refine.dev/telemetry?payload=${encoded}`);
-        sent.current = true;
-    }, []);
+    transport(`https://telemetry.refine.dev/telemetry?payload=${encoded}`);
+    sent.current = true;
+  }, []);
 
-    return null;
+  return null;
 };

package/src/components/undoableQueue/index.tsx

@@ -7,62 +7,62 @@ import { IUndoableQueue } from "../../interfaces";
 import { userFriendlySecond } from "@definitions/helpers";
 
 export const UndoableQueue: React.FC<{
-    notification: IUndoableQueue;
+  notification: IUndoableQueue;
 }> = ({ notification }) => {
-    const translate = useTranslate();
+  const translate = useTranslate();
 
-    const { notificationDispatch } = useCancelNotification();
-    const { open } = useNotification();
+  const { notificationDispatch } = useCancelNotification();
+  const { open } = useNotification();
 
-    const [timeoutId, setTimeoutId] = useState<number | undefined>();
+  const [timeoutId, setTimeoutId] = useState<number | undefined>();
 
-    const cancelNotification = () => {
-        if (notification.isRunning === true) {
-            if (notification.seconds === 0) {
-                notification.doMutation();
-            }
-            if (!notification.isSilent) {
-                open?.({
-                    key: `${notification.id}-${notification.resource}-notification`,
-                    type: "progress",
-                    message: translate(
-                        "notifications.undoable",
-                        {
-                            seconds: userFriendlySecond(notification.seconds),
-                        },
-                        `You have ${userFriendlySecond(
-                            notification.seconds,
-                        )} seconds to undo`,
-                    ),
-                    cancelMutation: notification.cancelMutation,
-                    undoableTimeout: userFriendlySecond(notification.seconds),
-                });
-            }
+  const cancelNotification = () => {
+    if (notification.isRunning === true) {
+      if (notification.seconds === 0) {
+        notification.doMutation();
+      }
+      if (!notification.isSilent) {
+        open?.({
+          key: `${notification.id}-${notification.resource}-notification`,
+          type: "progress",
+          message: translate(
+            "notifications.undoable",
+            {
+              seconds: userFriendlySecond(notification.seconds),
+            },
+            `You have ${userFriendlySecond(
+              notification.seconds,
+            )} seconds to undo`,
+          ),
+          cancelMutation: notification.cancelMutation,
+          undoableTimeout: userFriendlySecond(notification.seconds),
+        });
+      }
 
-            if (notification.seconds > 0) {
-                if (timeoutId) {
-                    clearTimeout(timeoutId);
-                }
+      if (notification.seconds > 0) {
+        if (timeoutId) {
+          clearTimeout(timeoutId);
+        }
 
-                const newTimeoutId = setTimeout(() => {
-                    notificationDispatch({
-                        type: ActionTypes.DECREASE_NOTIFICATION_SECOND,
-                        payload: {
-                            id: notification.id,
-                            seconds: notification.seconds,
-                            resource: notification.resource,
-                        },
-                    });
-                }, 1000) as unknown as number;
+        const newTimeoutId = setTimeout(() => {
+          notificationDispatch({
+            type: ActionTypes.DECREASE_NOTIFICATION_SECOND,
+            payload: {
+              id: notification.id,
+              seconds: notification.seconds,
+              resource: notification.resource,
+            },
+          });
+        }, 1000) as unknown as number;
 
-                setTimeoutId(newTimeoutId);
-            }
-        }
-    };
+        setTimeoutId(newTimeoutId);
+      }
+    }
+  };
 
-    useEffect(() => {
-        cancelNotification();
-    }, [notification]);
+  useEffect(() => {
+    cancelNotification();
+  }, [notification]);
 
-    return null;
+  return null;
 };

package/src/contexts/accessControl/IAccessControlContext.ts

@@ -2,51 +2,51 @@ import { BaseKey, IResourceItem, ITreeMenu } from "../../interfaces";
 import { UseQueryOptions } from "@tanstack/react-query";
 
 export type CanParams = {
-    /**
-     * Resource name for API data interactions
-     */
-    resource?: string;
-    /**
-     * Intended action on resource
-     */
-    action: string;
-    /**
-     * Parameters associated with the resource
-     * @type { resource?: [IResourceItem](https://refine.dev/docs/api-reference/core/interfaceReferences/#canparams), id?: [BaseKey](https://refine.dev/docs/api-reference/core/interfaceReferences/#basekey), [key: string]: any }
-     */
-    params?: {
-        resource?: IResourceItem & { children?: ITreeMenu[] };
-        id?: BaseKey;
-        [key: string]: any;
-    };
+  /**
+   * Resource name for API data interactions
+   */
+  resource?: string;
+  /**
+   * Intended action on resource
+   */
+  action: string;
+  /**
+   * Parameters associated with the resource
+   * @type { resource?: [IResourceItem](https://refine.dev/docs/api-reference/core/interfaceReferences/#canparams), id?: [BaseKey](https://refine.dev/docs/api-reference/core/interfaceReferences/#basekey), [key: string]: any }
+   */
+  params?: {
+    resource?: IResourceItem & { children?: ITreeMenu[] };
+    id?: BaseKey;
+    [key: string]: any;
+  };
 };
 
 export type CanReturnType = {
-    can: boolean;
-    reason?: string;
+  can: boolean;
+  reason?: string;
 };
 
 export interface IAccessControlContext {
-    can?: ({ resource, action, params }: CanParams) => Promise<CanReturnType>;
-    options?: {
-        buttons?: {
-            enableAccessControl?: boolean;
-            hideIfUnauthorized?: boolean;
-        };
-        queryOptions?: UseQueryOptions<CanReturnType>;
+  can?: ({ resource, action, params }: CanParams) => Promise<CanReturnType>;
+  options?: {
+    buttons?: {
+      enableAccessControl?: boolean;
+      hideIfUnauthorized?: boolean;
     };
+    queryOptions?: UseQueryOptions<CanReturnType>;
+  };
 }
 
 export interface IAccessControlContextReturnType {
-    can?: ({ resource, action, params }: CanParams) => Promise<CanReturnType>;
-    options: {
-        buttons: {
-            enableAccessControl?: boolean;
-            hideIfUnauthorized?: boolean;
-        };
-        queryOptions?: UseQueryOptions<CanReturnType>;
+  can?: ({ resource, action, params }: CanParams) => Promise<CanReturnType>;
+  options: {
+    buttons: {
+      enableAccessControl?: boolean;
+      hideIfUnauthorized?: boolean;
     };
+    queryOptions?: UseQueryOptions<CanReturnType>;
+  };
 }
 
 export type AccessControlProvider = Partial<IAccessControlContext> &
-    Required<Pick<IAccessControlContext, "can">>;
+  Required<Pick<IAccessControlContext, "can">>;

package/src/contexts/accessControl/index.tsx

@@ -1,50 +1,50 @@
 import React from "react";
 
 import {
-    IAccessControlContext,
-    IAccessControlContextReturnType,
+  IAccessControlContext,
+  IAccessControlContextReturnType,
 } from "./IAccessControlContext";
 
 /** @deprecated default value for access control context has no use and is an empty object. */
 export const defaultAccessControlContext: IAccessControlContext = {};
 
 export const AccessControlContext =
-    React.createContext<IAccessControlContextReturnType>({
-        options: {
-            buttons: { enableAccessControl: true, hideIfUnauthorized: false },
-        },
-    });
+  React.createContext<IAccessControlContextReturnType>({
+    options: {
+      buttons: { enableAccessControl: true, hideIfUnauthorized: false },
+    },
+  });
 
 export { IAccessControlContext };
 
 export const AccessControlContextProvider: React.FC<
-    IAccessControlContext & {
-        children?: React.ReactNode;
-    }
+  IAccessControlContext & {
+    children?: React.ReactNode;
+  }
 > = ({ can, children, options }) => {
-    return (
-        <AccessControlContext.Provider
-            value={{
-                can,
-                options: options
-                    ? {
-                          ...options,
-                          buttons: {
-                              enableAccessControl: true,
-                              hideIfUnauthorized: false,
-                              ...options.buttons,
-                          },
-                      }
-                    : {
-                          buttons: {
-                              enableAccessControl: true,
-                              hideIfUnauthorized: false,
-                          },
-                          queryOptions: undefined,
-                      },
-            }}
-        >
-            {children}
-        </AccessControlContext.Provider>
-    );
+  return (
+    <AccessControlContext.Provider
+      value={{
+        can,
+        options: options
+          ? {
+              ...options,
+              buttons: {
+                enableAccessControl: true,
+                hideIfUnauthorized: false,
+                ...options.buttons,
+              },
+            }
+          : {
+              buttons: {
+                enableAccessControl: true,
+                hideIfUnauthorized: false,
+              },
+              queryOptions: undefined,
+            },
+      }}
+    >
+      {children}
+    </AccessControlContext.Provider>
+  );
 };