From 4d661996b41c3ee2f5d2eabf4a8e317a9f4f9a72 Mon Sep 17 00:00:00 2001
From: sdjdd <i@sdjdd.com>
Date: Fri, 29 Mar 2024 19:30:28 +0800
Subject: [PATCH] feat(next/web): allow customer service agent to create user

---
 next/web/src/App/Admin/Settings/index.tsx     | 55 +++++++++++++++----
 next/web/src/App/Admin/Sidebar/index.tsx      | 12 ++--
 .../web/src/components/Page/SubMenu/index.tsx |  2 +-
 3 files changed, 49 insertions(+), 20 deletions(-)

diff --git a/next/web/src/App/Admin/Settings/index.tsx b/next/web/src/App/Admin/Settings/index.tsx
index 1d972228d..f4a268b2a 100644
--- a/next/web/src/App/Admin/Settings/index.tsx
+++ b/next/web/src/App/Admin/Settings/index.tsx
@@ -1,6 +1,7 @@
+import { useMemo } from 'react';
 import { Route, Routes } from 'react-router-dom';
 
-import { SubMenu, MenuDataItem } from '@/components/Page';
+import { SubMenu } from '@/components/Page';
 
 import { NewUser } from './Users';
 import { Members } from './Members';
@@ -35,12 +36,19 @@ import { NewTicketFormNoteTranslation } from './TicketFormNotes/NewTicketFormNot
 import { EditTicketFormNoteTranslation } from './TicketFormNotes/EditTranslation';
 import { EditSupportEmail, NewSupportEmail, SupportEmailList } from './SupportEmails';
 import { useCurrentUserIsAdmin } from '@/leancloud';
-import { Result } from '@/components/antd';
 import { EvaluationConfig } from './Evaluation';
 import { MergeUser } from './Users/MergeUser';
 import { ExportTicketTask } from './ExportTicket/Tasks';
 
 const SettingRoutes = () => (
+  <Routes>
+    <Route path="/users">
+      <Route path="new" element={<NewUser />} />
+    </Route>
+  </Routes>
+);
+
+const AdminSettingRoutes = () => (
   <Routes>
     <Route path="/users">
       <Route index element="Under Construction" />
@@ -146,14 +154,24 @@ const SettingRoutes = () => (
   </Routes>
 );
 
-const routeGroups: MenuDataItem[] = [
+interface MenuItem {
+  name: string;
+  path?: string;
+  key?: string;
+  children?: Omit<MenuItem, 'children'>[];
+  adminOnly?: boolean;
+}
+
+const routeGroups: MenuItem[] = [
   {
     name: '用户',
     key: 'users',
+    adminOnly: false,
     children: [
       {
         name: '创建用户',
         path: 'users/new',
+        adminOnly: false,
       },
       {
         name: '合并用户',
@@ -267,14 +285,29 @@ const routeGroups: MenuDataItem[] = [
   },
 ];
 
+function filterDeep<T extends { children?: T[] }>(
+  items: T[],
+  predicate: (item: T) => boolean
+): T[] {
+  return items
+    .map((item) => {
+      if (item.children) {
+        return {
+          ...item,
+          children: filterDeep(item.children, predicate),
+        };
+      }
+      return item;
+    })
+    .filter(predicate);
+}
+
 export default function Setting() {
   const isAdmin = useCurrentUserIsAdmin();
-  if (!isAdmin) {
-    return <Result status="403" title="403" subTitle="该页面需要管理员角色" />;
-  }
-  return (
-    <SubMenu menus={routeGroups}>
-      <SettingRoutes />
-    </SubMenu>
-  );
+  const menus = useMemo(() => {
+    if (isAdmin) return routeGroups;
+    return filterDeep(routeGroups, (menu) => menu.adminOnly === false);
+  }, [isAdmin]);
+
+  return <SubMenu menus={menus}>{isAdmin ? <AdminSettingRoutes /> : <SettingRoutes />}</SubMenu>;
 }
diff --git a/next/web/src/App/Admin/Sidebar/index.tsx b/next/web/src/App/Admin/Sidebar/index.tsx
index e770543c6..7c90d952e 100644
--- a/next/web/src/App/Admin/Sidebar/index.tsx
+++ b/next/web/src/App/Admin/Sidebar/index.tsx
@@ -3,11 +3,10 @@ import { NavLink } from 'react-router-dom';
 import { AiOutlineContainer, AiOutlineSetting } from 'react-icons/ai';
 import { HiOutlinePlus, HiOutlineTicket } from 'react-icons/hi';
 import { MdOutlineAnalytics } from 'react-icons/md';
-import { BsChatSquareDots } from 'react-icons/bs';
 import cx from 'classnames';
 
 import { Tooltip } from '@/components/antd';
-import { useCurrentUserIsAdmin, useCurrentUserIsCustomerService } from '@/leancloud';
+import { useCurrentUserIsCustomerService } from '@/leancloud';
 import { Feedback } from '../Feedback';
 import { CurrentUserSection } from '../CurrentUserSection';
 import { RequirePermission } from '@/components/RequirePermission';
@@ -36,7 +35,6 @@ function Path({ to, children, title }: { to: string; children: ReactNode; title?
 
 export function Sidebar(props: ComponentPropsWithoutRef<'aside'>) {
   const isCustomerService = useCurrentUserIsCustomerService();
-  const isAdmin = useCurrentUserIsAdmin();
 
   return (
     <aside
@@ -65,11 +63,9 @@ export function Sidebar(props: ComponentPropsWithoutRef<'aside'>) {
             </Path>
           </RequirePermission>
         }
-        {isAdmin && (
-          <Path to="/admin/settings" title="设置">
-            <AiOutlineSetting className="m-auto w-5 h-5" />
-          </Path>
-        )}
+        <Path to="/admin/settings" title="设置">
+          <AiOutlineSetting className="m-auto w-5 h-5" />
+        </Path>
       </section>
       <section />
       <section className="p-3">
diff --git a/next/web/src/components/Page/SubMenu/index.tsx b/next/web/src/components/Page/SubMenu/index.tsx
index b1c9b0396..61d6d63c7 100644
--- a/next/web/src/components/Page/SubMenu/index.tsx
+++ b/next/web/src/components/Page/SubMenu/index.tsx
@@ -7,7 +7,7 @@ export type MenuDataItem = {
   name: ReactNode;
   path?: string;
   key?: string;
-  children?: MenuDataItem[];
+  children?: Omit<MenuDataItem, 'children'>[];
 };
 
 interface SubMenuProps {