refactor: invite view placeholder

web/src/App.tsx

@@ -13,6 +13,10 @@ const EntryRoute = Loadable(() =>
   import('./routes/Entry').then((module) => module.EntryRoute)
 );
 
+const InviteRoute = Loadable(() =>
+  import('./routes/Invite').then((module) => module.InviteRoute)
+);
+
 const AppProvider: React.FC = React.memo((props) => {
   const getPopupContainer = useCallback(
     (triggerNode: HTMLElement): HTMLElement => {
@@ -52,6 +56,7 @@ export const App: React.FC = React.memo(() => {
         <Switch>
           <Route path="/entry" component={EntryRoute} />
           <Route path="/main" component={MainRoute} />
+          <Route path="/invite/:inviteCode" component={InviteRoute} />
           <Redirect to="/entry" />
         </Switch>
       </AppProvider>

web/src/routes/Invite/index.tsx

@@ -0,0 +1,43 @@
+import { Button, Divider } from 'antd';
+import React, { useCallback } from 'react';
+import { useHistory, useParams } from 'react-router';
+
+/**
+ * 邀请界面路由
+ */
+export const InviteRoute: React.FC = React.memo(() => {
+  const history = useHistory();
+  const { inviteCode } = useParams<{ inviteCode: string }>();
+  const isLogin = true;
+
+  const handleRegister = useCallback(() => {
+    history.push(
+      `/entry/register?redirect=${encodeURIComponent(location.pathname)}`
+    );
+  }, []);
+
+  const handleJoinGroup = useCallback(() => {
+    // TODO
+    console.log('TODO');
+  }, []);
+
+  return (
+    <div className="h-full w-full">
+      <div className="w-96 h-72">
+        <div>{inviteCode}</div>
+        <div>xxx 邀请您加入</div>
+        <div>[群组名]</div>
+        <div>成员数: </div>
+
+        <Divider />
+
+        {isLogin ? (
+          <Button onClick={handleJoinGroup}>加入群组</Button>
+        ) : (
+          <Button onClick={handleRegister}>立即注册</Button>
+        )}
+      </div>
+    </div>
+  );
+});
+InviteRoute.displayName = 'InviteRoute';