From da94e7c19a2485fbb1703e5ab21164c4f75e8aea Mon Sep 17 00:00:00 2001
From: wang <1509326266@qq.com>
Date: Thu, 8 Aug 2024 19:34:50 +0800
Subject: [PATCH] feat(packages): add route Transition animation

---
 packages/simple-router/src/router.tsx     | 6 +++---
 packages/simple-router/src/types/index.ts | 2 +-
 src/App.tsx                               | 5 ++---
 3 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/packages/simple-router/src/router.tsx b/packages/simple-router/src/router.tsx
index 542ca91..cb42d5f 100644
--- a/packages/simple-router/src/router.tsx
+++ b/packages/simple-router/src/router.tsx
@@ -2,7 +2,7 @@ import type { Location, RouteObject } from 'react-router-dom';
 import { RouterProvider, createBrowserRouter, createHashRouter, createMemoryRouter } from 'react-router-dom';
 import type { BlockerFunction, Router as RemixRouter, RouterState } from '@remix-run/router';
 import type { ElegantConstRoute } from '@ohh-889/react-auto-route';
-import { createContext } from 'react';
+import React, { createContext } from 'react';
 import type { RouteLocationNamedRaw, RouteLocationNormalizedLoaded, Router, RouterOptions } from './types';
 import CreateRouterMatcher from './matcher';
 import type { RouteRecordNormalized } from './matcher/types';
@@ -191,7 +191,7 @@ class CreateRouter {
     };
   }
 
-  CustomRouterProvider: () => JSX.Element = () => {
+  CustomRouterProvider: (loading:React.ReactNode) => JSX.Element = (loading) => {
     const reactiveRoute = {} as RouteLocationNormalizedLoaded;
     // eslint-disable-next-line guard-for-in
     for (const key in START_LOCATION_NORMALIZED) {
@@ -206,7 +206,7 @@ class CreateRouter {
       <RouterContext.Provider value={this}>
         <RouteContext.Provider value={reactiveRoute}>
           <RouterProvider
-            fallbackElement={'加载中'}
+            fallbackElement={loading}
             router={this.reactRouter}
           />
         </RouteContext.Provider>
diff --git a/packages/simple-router/src/types/index.ts b/packages/simple-router/src/types/index.ts
index c9c4555..b2f3b76 100644
--- a/packages/simple-router/src/types/index.ts
+++ b/packages/simple-router/src/types/index.ts
@@ -85,7 +85,7 @@ export interface Router {
   readonly reactRouter: RemixRouter;
   readonly reactRoutes: RouteObject[];
   addReactRoutes: (routes: ElegantConstRoute[]) => void;
-  CustomRouterProvider: () => JSX.Element;
+  CustomRouterProvider: (loading: React.ReactNode) => JSX.Element;
   getRoutes: () => RouteRecordNormalized[];
   getRouteByName: (name: string) => RouteRecordNormalized | undefined;
   resetRoute: () => void;
diff --git a/src/App.tsx b/src/App.tsx
index fc57e71..9017b3b 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -7,6 +7,7 @@ import MenuProvider from '@/components/common/MenuProvider.tsx';
 import { router } from '@/router';
 import { antdLocales } from './locales/antd';
 import AppProvider from './components/common/AppProvider.tsx';
+import GlobalLoading from './components/common/GlobalLoading.tsx';
 
 const App = () => {
   const locale = useAppSelector(getLocale);
@@ -28,9 +29,7 @@ const App = () => {
       button={{ classNames: { icon: 'align-1px  text-icon' } }}
     >
       <MenuProvider>
-        <AppProvider>
-          <router.CustomRouterProvider />
-        </AppProvider>
+        <AppProvider>{router.CustomRouterProvider(<GlobalLoading />)}</AppProvider>
       </MenuProvider>
     </ConfigProvider>
   );