docs: routes demo

packages/core/client/src/route-switch/demos/demo1.tsx

@@ -1,9 +1,18 @@
+import { RouteRedirectProps, RouteSwitch, RouteSwitchProvider } from '@nocobase/client';
 import React from 'react';
 import { Link, MemoryRouter as Router } from 'react-router-dom';
-import { RouteRedirectProps, RouteSwitchProvider, RouteSwitch } from '@nocobase/client';
 
 const Home = () => <h1>Home</h1>;
 const About = () => <h1>About</h1>;
+const SignIn = () => <h1>Sign In</h1>;
+const SignUp = () => <h1>Sign Up</h1>;
+
+const AuthLayout = (props) => (
+  <div>
+    <h1>AuthLayout</h1>
+    {props.children}
+  </div>
+);
 
 const routes: RouteRedirectProps[] = [
   {
@@ -17,13 +26,42 @@ const routes: RouteRedirectProps[] = [
     path: '/about',
     component: 'About',
   },
+  {
+    type: 'route',
+    component: 'AuthLayout',
+    routes: [
+      {
+        type: 'route',
+        path: '/signin',
+        component: 'SignIn',
+      },
+      {
+        type: 'route',
+        path: '/signup',
+        component: 'SignUp',
+      },
+    ],
+  },
 ];
 
 export default () => {
   return (
-    <RouteSwitchProvider components={{ Home, About }}>
+    <RouteSwitchProvider components={{ Home, About, AuthLayout, SignIn, SignUp }}>
       <Router initialEntries={['/']}>
-        <Link to={'/'}>Home</Link>, <Link to={'/about'}>About</Link>
+        <ul>
+          <li>
+            <Link to={'/'}>Home</Link>
+          </li>
+          <li>
+            <Link to={'/about'}>About</Link>
+          </li>
+          <li>
+            <Link to={'/signin'}>Sign In</Link>
+          </li>
+          <li>
+            <Link to={'/signup'}>Sign Up</Link>
+          </li>
+        </ul>
         <RouteSwitch routes={routes} />
       </Router>
     </RouteSwitchProvider>