@refinedev/antd 5.3.8 → 5.3.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@refinedev/antd",
-  "version": "5.3.8",
+  "version": "5.3.10",
   "description": "refine is a React-based framework for building internal tools, rapidly. It ships with Ant Design System, an enterprise-level UI toolkit.",
   "private": false,
   "main": "dist/index.js",
@@ -24,8 +24,8 @@
   },
   "devDependencies": {
     "@refinedev/cli": "^2.1.0",
-    "@refinedev/ui-tests": "^1.3.0",
-    "@refinedev/core": "^4.5.4",
+    "@refinedev/ui-tests": "^1.3.2",
+    "@refinedev/core": "^4.5.6",
     "@esbuild-plugins/node-resolve": "^0.1.4",
     "@testing-library/jest-dom": "^5.16.4",
     "@testing-library/react": "^13.1.1",

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

@@ -1,87 +1,10 @@
-import * as React from "react";
-import { Row, Col, Typography, Space, Button } from "antd";
-import { ReadOutlined, FolderOutlined, TeamOutlined } from "@ant-design/icons";
-
-const styles: { [key: string]: React.CSSProperties } = {
-    root: {
-        height: "100vh",
-        backgroundImage:
-            "url('https://refine.ams3.cdn.digitaloceanspaces.com/login-background/background.png')",
-        backgroundSize: "cover",
-        backgroundColor: "#331049",
-    },
-    title: {
-        color: "white",
-        fontWeight: 800,
-        fontSize: "64px",
-        marginBottom: "8px",
-    },
-    p1: {
-        color: "white",
-        marginBottom: 0,
-        fontSize: "20px",
-        fontWeight: "bold",
-    },
-    p2: {
-        color: "white",
-        fontSize: "20px",
-    },
-    code: {
-        backgroundColor: "white",
-        color: "#331049",
-    },
-};
-
-const { Title } = Typography;
+import React from "react";
+import { WelcomePage as WelcomePageFromCore } from "@refinedev/core";
 
 /**
  * It is a page that welcomes you after the configuration is completed.
+ * @deprecated `WelcomePage` is deprecated. Use `WelcomePage` from `@refinedev/core` instead.
  */
 export const WelcomePage: React.FC = () => {
-    return (
-        <Row align="middle" justify="center" style={styles.root}>
-            <Col style={{ textAlign: "center" }}>
-                <img
-                    style={{ marginBottom: "48px" }}
-                    src="https://refine.ams3.cdn.digitaloceanspaces.com/logo/refine.svg"
-                    alt="Refine Logo"
-                />
-                <Title style={styles.title}>Welcome on board</Title>
-                <p style={styles.p1}>Your configuration is completed.</p>
-                <Space
-                    size="large"
-                    wrap
-                    style={{ marginTop: "70px", justifyContent: "center" }}
-                >
-                    <a
-                        href="https://refine.dev"
-                        target="_blank"
-                        rel="noreferrer"
-                    >
-                        <Button size="large" icon={<ReadOutlined />}>
-                            Documentation
-                        </Button>
-                    </a>
-                    <a
-                        href="https://refine.dev/examples"
-                        target="_blank"
-                        rel="noreferrer"
-                    >
-                        <Button size="large" icon={<FolderOutlined />}>
-                            Examples
-                        </Button>
-                    </a>
-                    <a
-                        href="https://discord.gg/refine"
-                        target="_blank"
-                        rel="noreferrer"
-                    >
-                        <Button size="large" icon={<TeamOutlined />}>
-                            Community
-                        </Button>
-                    </a>
-                </Space>
-            </Col>
-        </Row>
-    );
+    return <WelcomePageFromCore />;
 };

package/src/components/themedLayout/sider/index.tsx

@@ -22,6 +22,7 @@ import {
     useRouterType,
     useActiveAuthProvider,
     pickNotDeprecated,
+    useWarnAboutChange,
 } from "@refinedev/core";
 
 import { drawerButtonStyles } from "./styles";
@@ -43,6 +44,7 @@ export const ThemedSider: React.FC<RefineThemedLayoutSiderProps> = ({
     const isExistAuthentication = useIsExistAuthentication();
     const routerType = useRouterType();
     const NewLink = useLink();
+    const { warnWhen, setWarnWhen } = useWarnAboutChange();
     const { Link: LegacyLink } = useRouterContext();
     const Link = routerType === "legacy" ? LegacyLink : NewLink;
     const TitleFromContext = useTitle();
@@ -123,10 +125,28 @@ export const ThemedSider: React.FC<RefineThemedLayoutSiderProps> = ({
         });
     };
 
+    const handleLogout = () => {
+        if (warnWhen) {
+            const confirm = window.confirm(
+                translate(
+                    "warnWhenUnsavedChanges",
+                    "Are you sure you want to leave? You have unsaved changes.",
+                ),
+            );
+
+            if (confirm) {
+                setWarnWhen(false);
+                mutateLogout();
+            }
+        } else {
+            mutateLogout();
+        }
+    };
+
     const logout = isExistAuthentication && (
         <Menu.Item
             key="logout"
-            onClick={() => mutateLogout()}
+            onClick={() => handleLogout()}
             icon={<LogoutOutlined />}
         >
             {translate("buttons.logout", "Logout")}