⚡ Optimize package dependency filtering by replacing .filter().map() with .reduce()

src/components/main-layout.tsx

@@ -7,8 +7,8 @@ import {
   ReadOutlined,
   UserOutlined,
 } from '@ant-design/icons';
-import { Button, Dropdown, Grid, Layout, Menu, message } from 'antd';
 import type { MenuProps } from 'antd';
+import { Button, Dropdown, Grid, Layout, Menu, message } from 'antd';
 import type { ReactNode } from 'react';
 import { useEffect, useState } from 'react';
 import { Outlet } from 'react-router-dom';
@@ -57,7 +57,9 @@ const MainLayout = () => {
     {
       key: 'about',
       icon: <InfoCircleOutlined />,
-      label: <ExtLink href="https://reactnative.cn/about.html">关于我们</ExtLink>,
+      label: (
+        <ExtLink href="https://reactnative.cn/about.html">关于我们</ExtLink>
+      ),
     },
     ...(user
       ? [
@@ -103,9 +105,7 @@ const MainLayout = () => {
                   onClick={() => setMobileNavOpen(true)}
                 />
               )}
-              {isMobile && (
-                <LogoH className="h-6 w-auto max-w-[140px]" />
-              )}
+              {isMobile && <LogoH className="h-6 w-auto max-w-[140px]" />}
             </div>
             <div className="flex items-center">
               {isMobile ? (
@@ -117,7 +117,11 @@ const MainLayout = () => {
                   <Button type="text" icon={<MoreOutlined />} />
                 </Dropdown>
               ) : (
-                <Menu mode="horizontal" selectable={false} items={headerItems} />
+                <Menu
+                  mode="horizontal"
+                  selectable={false}
+                  items={headerItems}
+                />
               )}
             </div>
           </div>

src/components/sider.tsx

@@ -250,9 +250,7 @@ const SiderMenu = ({ selectedKeys, onNavigate }: SiderMenuProps) => {
             {
               key: 'realtime-metrics',
               icon: <LineChartOutlined />,
-              label: (
-                <Link to={rootRouterPath.realtimeMetrics}>实时数据</Link>
-              ),
+              label: <Link to={rootRouterPath.realtimeMetrics}>实时数据</Link>,
             },
             {
               key: 'apps',

src/pages/admin-apps.tsx

@@ -5,8 +5,8 @@ import {
   Card,
   Form,
   Input,
-  message,
   Modal,
+  message,
   Select,
   Space,
   Spin,
@@ -126,10 +126,15 @@ export const Component = () => {
       key: 'platform',
       width: 80,
       render: (platform: string) => (
-        <span className={
-          platform === 'ios' ? 'text-blue-600' :
-          platform === 'android' ? 'text-green-600' : 'text-orange-600'
-        }>
+        <span
+          className={
+            platform === 'ios'
+              ? 'text-blue-600'
+              : platform === 'android'
+                ? 'text-green-600'
+                : 'text-orange-600'
+          }
+        >
           {platform}
         </span>
       ),
@@ -231,7 +236,12 @@ export const Component = () => {
       >
         <Form form={form} layout="vertical" className="mt-4">
           <Space className="w-full" direction="vertical" size="middle">
-            <Form.Item name="name" label="名称" className="mb-0!" rules={[{ required: true }]}>
+            <Form.Item
+              name="name"
+              label="名称"
+              className="mb-0!"
+              rules={[{ required: true }]}
+            >
               <Input />
             </Form.Item>
             <Form.Item name="appKey" label="App Key" className="mb-0!">
@@ -255,7 +265,11 @@ export const Component = () => {
             <Form.Item name="status" label="状态" className="mb-0!">
               <Input placeholder="自定义状态" />
             </Form.Item>
-            <Form.Item name="ignoreBuildTime" label="忽略构建时间" className="mb-0!">
+            <Form.Item
+              name="ignoreBuildTime"
+              label="忽略构建时间"
+              className="mb-0!"
+            >
               <Select
                 allowClear
                 options={[

src/pages/admin-config.tsx

@@ -5,16 +5,16 @@ import {
   Card,
   Form,
   Input,
-  message,
   Modal,
+  message,
   Popconfirm,
   Space,
   Spin,
   Table,
   Typography,
 } from 'antd';
 import { useCallback, useEffect, useRef, useState } from 'react';
-import { JSONEditor, type Content, type OnChange } from 'vanilla-jsoneditor';
+import { type Content, JSONEditor, type OnChange } from 'vanilla-jsoneditor';
 import { adminApi } from '@/services/admin-api';
 
 const { Title } = Typography;

src/pages/admin-users.tsx

@@ -6,8 +6,8 @@ import {
   DatePicker,
   Form,
   Input,
-  message,
   Modal,
+  message,
   Select,
   Space,
   Spin,
@@ -16,7 +16,7 @@ import {
 } from 'antd';
 import dayjs from 'dayjs';
 import { useEffect, useRef, useState } from 'react';
-import { JSONEditor, type Content, type OnChange } from 'vanilla-jsoneditor';
+import { type Content, JSONEditor, type OnChange } from 'vanilla-jsoneditor';
 import { adminApi } from '@/services/admin-api';
 
 const { Title } = Typography;
@@ -177,7 +177,9 @@ export const Component = () => {
       key: 'status',
       width: 100,
       render: (status: string) => (
-        <span className={status === 'normal' ? 'text-green-600' : 'text-orange-500'}>
+        <span
+          className={status === 'normal' ? 'text-green-600' : 'text-orange-500'}
+        >
           {status === 'normal' ? '正常' : '未验证'}
         </span>
       ),
@@ -293,10 +295,17 @@ export const Component = () => {
                 ]}
               />
             </Form.Item>
-            <Form.Item name="tierExpiresAt" label="套餐过期时间" className="mb-0!">
+            <Form.Item
+              name="tierExpiresAt"
+              label="套餐过期时间"
+              className="mb-0!"
+            >
               <DatePicker showTime className="w-full" />
             </Form.Item>
-            <Form.Item label="自定义配额 (JSON，留空则使用默认配额)" className="mb-0!">
+            <Form.Item
+              label="自定义配额 (JSON，留空则使用默认配额)"
+              className="mb-0!"
+            >
               <JsonEditorWrapper value={quotaValue} onChange={setQuotaValue} />
             </Form.Item>
           </Space>

src/pages/manage/components/bind-package.tsx

@@ -373,19 +373,18 @@ const BindPackage = ({
           key: 'gray',
           label: '灰度',
           icon: <ExperimentOutlined />,
-          children: [1, 2, 5, 10, 20, 50].reduce<NonNullable<MenuProps['items']>>(
-            (acc, percentage) => {
-              if (percentage > rolloutConfigNumber) {
-                acc.push({
-                  key: `${percentage}`,
-                  label: `${percentage}%`,
-                  onClick: () => publishToPackage(p, percentage),
-                });
-              }
-              return acc;
-            },
-            [],
-          ),
+          children: [1, 2, 5, 10, 20, 50].reduce<
+            NonNullable<MenuProps['items']>
+          >((acc, percentage) => {
+            if (percentage > rolloutConfigNumber) {
+              acc.push({
+                key: `${percentage}`,
+                label: `${percentage}%`,
+                onClick: () => publishToPackage(p, percentage),
+              });
+            }
+            return acc;
+          }, []),
         });
       }
       if (items.length > 0) {

src/pages/manage/components/deps-table.tsx

@@ -64,23 +64,35 @@ export const DepsTable = ({
                                 key: 'package',
                                 type: 'group',
                                 label: '原生包',
-                                children: packages
-                                  .filter((p) => !!p.deps)
-                                  .map((p) => ({
-                                    key: `p_${p.id}`,
-                                    label: p.name,
-                                  })),
+                                children: packages.reduce(
+                                  (acc, p) => {
+                                    if (p.deps) {
+                                      acc.push({
+                                        key: `p_${p.id}`,
+                                        label: p.name,
+                                      });
+                                    }
+                                    return acc;
+                                  },
+                                  [] as { key: string; label: string }[],
+                                ),
                               },
                               {
                                 key: 'version',
                                 type: 'group',
                                 label: '热更包',
-                                children: versions
-                                  .filter((v) => !!v.deps)
-                                  .map((v) => ({
-                                    key: `v_${v.id}`,
-                                    label: v.name,
-                                  })),
+                                children: versions.reduce(
+                                  (acc, v) => {
+                                    if (v.deps) {
+                                      acc.push({
+                                        key: `v_${v.id}`,
+                                        label: v.name,
+                                      });
+                                    }
+                                    return acc;
+                                  },
+                                  [] as { key: string; label: string }[],
+                                ),
                               },
                             ],
                             onClick: ({ key }) => {

src/pages/manage/components/publish-feature-table.tsx

@@ -1,4 +1,4 @@
-import { Table, Tag } from "antd";
+import { Table, Tag } from 'antd';
 
 /**
  * 发布功能支持情况表格组件
@@ -12,25 +12,25 @@ export default function PublishFeatureTable() {
         pagination={false}
         dataSource={[
           {
-            key: "1",
-            version: "< v10.15.0",
-            fullRelease: "✓ 支持",
-            grayRelease: "✗ 不支持",
-            bothRelease: "⚠ 灰度被忽略",
+            key: '1',
+            version: '< v10.15.0',
+            fullRelease: '✓ 支持',
+            grayRelease: '✗ 不支持',
+            bothRelease: '⚠ 灰度被忽略',
           },
           {
-            key: "2",
-            version: "v10.15.0 - v10.31.3",
-            fullRelease: "✓ 支持",
-            grayRelease: "✓ 支持",
-            bothRelease: "⚠ 灰度被忽略",
+            key: '2',
+            version: 'v10.15.0 - v10.31.3',
+            fullRelease: '✓ 支持',
+            grayRelease: '✓ 支持',
+            bothRelease: '⚠ 灰度被忽略',
           },
           {
-            key: "3",
-            version: "≥ v10.32.0",
-            fullRelease: "✓ 支持",
-            grayRelease: "✓ 支持",
-            bothRelease: "✓ 支持（cli >= 2.4.0）",
+            key: '3',
+            version: '≥ v10.32.0',
+            fullRelease: '✓ 支持',
+            grayRelease: '✓ 支持',
+            bothRelease: '✓ 支持（cli >= 2.4.0）',
           },
         ]}
         columns={[
@@ -42,47 +42,47 @@ export default function PublishFeatureTable() {
                 (用户端)
               </span>
             ),
-            dataIndex: "version",
-            key: "version",
+            dataIndex: 'version',
+            key: 'version',
             width: 200,
           },
           {
-            title: "仅全量发布",
-            dataIndex: "fullRelease",
-            key: "fullRelease",
-            align: "center",
+            title: '仅全量发布',
+            dataIndex: 'fullRelease',
+            key: 'fullRelease',
+            align: 'center',
             render: (text: string) => {
               return (
-                <Tag color={text.includes("✓") ? "success" : "error"}>
+                <Tag color={text.includes('✓') ? 'success' : 'error'}>
                   {text}
                 </Tag>
               );
             },
           },
           {
-            title: "仅灰度发布",
-            dataIndex: "grayRelease",
-            key: "grayRelease",
-            align: "center",
+            title: '仅灰度发布',
+            dataIndex: 'grayRelease',
+            key: 'grayRelease',
+            align: 'center',
             render: (text: string) => {
               return (
-                <Tag color={text.includes("✓") ? "success" : "error"}>
+                <Tag color={text.includes('✓') ? 'success' : 'error'}>
                   {text}
                 </Tag>
               );
             },
           },
           {
-            title: "同时发布",
-            dataIndex: "bothRelease",
-            key: "bothRelease",
-            align: "center",
+            title: '同时发布',
+            dataIndex: 'bothRelease',
+            key: 'bothRelease',
+            align: 'center',
             render: (text: string) => {
-              const color = text.includes("✓")
-                ? "success"
-                : text.includes("⚠")
-                ? "warning"
-                : "error";
+              const color = text.includes('✓')
+                ? 'success'
+                : text.includes('⚠')
+                  ? 'warning'
+                  : 'error';
               return <Tag color={color}>{text}</Tag>;
             },
           },