This is an automated email from the ASF dual-hosted git repository.
LiteSun pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/apisix-dashboard.git
The following commit(s) were added to refs/heads/master by this push:
new ec0fce264 refactor: drop app-wide MobX observer transform for one
search filter (#3446)
ec0fce264 is described below
commit ec0fce264f56d379b5f3e0d5c906183243fd9e29
Author: Yuhan <[email protected]>
AuthorDate: Tue Jul 28 14:45:44 2026 +0800
refactor: drop app-wide MobX observer transform for one search filter
(#3446)
---
package.json | 4 -
pnpm-lock.yaml | 103 +++++----------------
.../form-slice/FormItemPlugins/PluginCardList.tsx | 51 ++++------
vite.config.ts | 5 +-
4 files changed, 43 insertions(+), 120 deletions(-)
diff --git a/package.json b/package.json
index 217d055fd..da68a3146 100644
--- a/package.json
+++ b/package.json
@@ -34,10 +34,6 @@
"i18next": "^25.10.9",
"immer": "^10.1.1",
"jotai": "^2.19.0",
- "mobx": "^6.13.7",
- "mobx-persist-store": "^1.1.8",
- "mobx-react-lite": "^4.1.0",
- "mobx-react-observer": "^1.1.0",
"monaco-editor": "^0.52.2",
"nanoid": "^5.1.7",
"qs": "^6.15.2",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 9554a77b0..4063d16f7 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -84,18 +84,6 @@ importers:
jotai:
specifier: ^2.19.0
version:
2.19.0(@babel/[email protected])(@babel/[email protected])(@types/[email protected])([email protected])
- mobx:
- specifier: ^6.13.7
- version: 6.15.0
- mobx-persist-store:
- specifier: ^1.1.8
- version: 1.1.8([email protected])
- mobx-react-lite:
- specifier: ^4.1.0
- version:
4.1.1([email protected])([email protected]([email protected]))([email protected])
- mobx-react-observer:
- specifier: ^1.1.0
- version:
1.1.0([email protected])([email protected]([email protected]))([email protected])
monaco-editor:
specifier: ^0.52.2
version: 0.52.2
@@ -1154,66 +1142,79 @@ packages:
resolution: {integrity:
sha512-t4ONHboXi/3E0rT6OZl1pKbl2Vgxf9vJfWgmUoCEVQVxhW6Cw/c8I6hbbu7DAvgp82RKiH7TpLwxnJeKv2pbsw==}
cpu: [arm]
os: [linux]
+ libc: [glibc]
'@rollup/[email protected]':
resolution: {integrity:
sha512-CikFT7aYPA2ufMD086cVORBYGHffBo4K8MQ4uPS/ZnY54GKj36i196u8U+aDVT2LX4eSMbyHtyOh7D7Zvk2VvA==}
cpu: [arm]
os: [linux]
+ libc: [musl]
'@rollup/[email protected]':
resolution: {integrity:
sha512-jYgUGk5aLd1nUb1CtQ8E+t5JhLc9x5WdBKew9ZgAXg7DBk0ZHErLHdXM24rfX+bKrFe+Xp5YuJo54I5HFjGDAA==}
cpu: [arm64]
os: [linux]
+ libc: [glibc]
'@rollup/[email protected]':
resolution: {integrity:
sha512-peZRVEdnFWZ5Bh2KeumKG9ty7aCXzzEsHShOZEFiCQlDEepP1dpUl/SrUNXNg13UmZl+gzVDPsiCwnV1uI0RUA==}
cpu: [arm64]
os: [linux]
+ libc: [musl]
'@rollup/[email protected]':
resolution: {integrity:
sha512-gbUSW/97f7+r4gHy3Jlup8zDG190AuodsWnNiXErp9mT90iCy9NKKU0Xwx5k8VlRAIV2uU9CsMnEFg/xXaOfXg==}
cpu: [loong64]
os: [linux]
+ libc: [glibc]
'@rollup/[email protected]':
resolution: {integrity:
sha512-yTRONe79E+o0FWFijasoTjtzG9EBedFXJMl888NBEDCDV9I2wGbFFfJQQe63OijbFCUZqxpHz1GzpbtSFikJ4Q==}
cpu: [loong64]
os: [linux]
+ libc: [musl]
'@rollup/[email protected]':
resolution: {integrity:
sha512-sw1o3tfyk12k3OEpRddF68a1unZ5VCN7zoTNtSn2KndUE+ea3m3ROOKRCZxEpmT9nsGnogpFP9x6mnLTCaoLkA==}
cpu: [ppc64]
os: [linux]
+ libc: [glibc]
'@rollup/[email protected]':
resolution: {integrity:
sha512-+2kLtQ4xT3AiIxkzFVFXfsmlZiG5FXYW7ZyIIvGA7Bdeuh9Z0aN4hVyXS/G1E9bTP/vqszNIN/pUKCk/BTHsKA==}
cpu: [ppc64]
os: [linux]
+ libc: [musl]
'@rollup/[email protected]':
resolution: {integrity:
sha512-NDYMpsXYJJaj+I7UdwIuHHNxXZ/b/N2hR15NyH3m2qAtb/hHPA4g4SuuvrdxetTdndfj9b1WOmy73kcPRoERUg==}
cpu: [riscv64]
os: [linux]
+ libc: [glibc]
'@rollup/[email protected]':
resolution: {integrity:
sha512-nLckB8WOqHIf1bhymk+oHxvM9D3tyPndZH8i8+35p/1YiVoVswPid2yLzgX7ZJP0KQvnkhM4H6QZ5m0LzbyIAg==}
cpu: [riscv64]
os: [linux]
+ libc: [musl]
'@rollup/[email protected]':
resolution: {integrity:
sha512-oF87Ie3uAIvORFBpwnCvUzdeYUqi2wY6jRFWJAy1qus/udHFYIkplYRW+wo+GRUP4sKzYdmE1Y3+rY5Gc4ZO+w==}
cpu: [s390x]
os: [linux]
+ libc: [glibc]
'@rollup/[email protected]':
resolution: {integrity:
sha512-3AHmtQq/ppNuUspKAlvA8HtLybkDflkMuLK4DPo77DfthRb71V84/c4MlWJXixZz4uruIH4uaa07IqoAkG64fg==}
cpu: [x64]
os: [linux]
+ libc: [glibc]
'@rollup/[email protected]':
resolution: {integrity:
sha512-2UdiwS/9cTAx7qIUZB/fWtToJwvt0Vbo0zmnYt7ED35KPg13Q0ym1g442THLC7VyI6JfYTP4PiSOWyoMdV2/xg==}
cpu: [x64]
os: [linux]
+ libc: [musl]
'@rollup/[email protected]':
resolution: {integrity:
sha512-M3bLRAVk6GOwFlPTIxVBSYKUaqfLrn8l0psKinkCFxl4lQvOSz8ZrKDz2gxcBwHFpci0B6rttydI4IpS4IS/jQ==}
@@ -1351,24 +1352,28 @@ packages:
engines: {node: '>=10'}
cpu: [arm64]
os: [linux]
+ libc: [glibc]
'@swc/[email protected]':
resolution: {integrity:
sha512-EbrX9A5U4cECCQQfky7945AW9GYnTXtCUXElWTkTYmmyQK87yCyFfY8hmZ9qMFIwxPOH6I3I2JwMhzdi8Qoz7g==}
engines: {node: '>=10'}
cpu: [arm64]
os: [linux]
+ libc: [musl]
'@swc/[email protected]':
resolution: {integrity:
sha512-TaxpO6snTjjfLXFYh5EjZ78se69j2gDcqEM8yB9gguPYwkCHi2Ylfmh7iVaNADnDJFtjoAQp0L41bTV/Pfq9Cg==}
engines: {node: '>=10'}
cpu: [x64]
os: [linux]
+ libc: [glibc]
'@swc/[email protected]':
resolution: {integrity:
sha512-IEGvDd6aEEKEyZFZ8oCKuik05G5BS7qwG5hO5PEMzdGeh8JyFZXxsfFXbfeAqjue4UaUUrhnoX+Ze3M2jBVMHw==}
engines: {node: '>=10'}
cpu: [x64]
os: [linux]
+ libc: [musl]
'@swc/[email protected]':
resolution: {integrity:
sha512-UkQ952GSpY+Z6XONj9GSW8xGSkF53jrCsuLj0nrcuw7Dvr1a816U/9WYZmmcYS8tnG2vHylhpm6csQkyS8lpCw==}
@@ -1647,41 +1652,49 @@ packages:
resolution: {integrity:
sha512-34gw7PjDGB9JgePJEmhEqBhWvCiiWCuXsL9hYphDF7crW7UgI05gyBAi6MF58uGcMOiOqSJ2ybEeCvHcq0BCmQ==}
cpu: [arm64]
os: [linux]
+ libc: [glibc]
'@unrs/[email protected]':
resolution: {integrity:
sha512-RyMIx6Uf53hhOtJDIamSbTskA99sPHS96wxVE/bJtePJJtpdKGXO1wY90oRdXuYOGOTuqjT8ACccMc4K6QmT3w==}
cpu: [arm64]
os: [linux]
+ libc: [musl]
'@unrs/[email protected]':
resolution: {integrity:
sha512-D8Vae74A4/a+mZH0FbOkFJL9DSK2R6TFPC9M+jCWYia/q2einCubX10pecpDiTmkJVUH+y8K3BZClycD8nCShA==}
cpu: [ppc64]
os: [linux]
+ libc: [glibc]
'@unrs/[email protected]':
resolution: {integrity:
sha512-frxL4OrzOWVVsOc96+V3aqTIQl1O2TjgExV4EKgRY09AJ9leZpEg8Ak9phadbuX0BA4k8U5qtvMSQQGGmaJqcQ==}
cpu: [riscv64]
os: [linux]
+ libc: [glibc]
'@unrs/[email protected]':
resolution: {integrity:
sha512-mJ5vuDaIZ+l/acv01sHoXfpnyrNKOk/3aDoEdLO/Xtn9HuZlDD6jKxHlkN8ZhWyLJsRBxfv9GYM2utQ1SChKew==}
cpu: [riscv64]
os: [linux]
+ libc: [musl]
'@unrs/[email protected]':
resolution: {integrity:
sha512-kELo8ebBVtb9sA7rMe1Cph4QHreByhaZ2QEADd9NzIQsYNQpt9UkM9iqr2lhGr5afh885d/cB5QeTXSbZHTYPg==}
cpu: [s390x]
os: [linux]
+ libc: [glibc]
'@unrs/[email protected]':
resolution: {integrity:
sha512-C3ZAHugKgovV5YvAMsxhq0gtXuwESUKc5MhEtjBpLoHPLYM+iuwSj3lflFwK3DPm68660rZ7G8BMcwSro7hD5w==}
cpu: [x64]
os: [linux]
+ libc: [glibc]
'@unrs/[email protected]':
resolution: {integrity:
sha512-rV0YSoyhK2nZ4vEswT/QwqzqQXw5I6CjoaYMOX0TqBlWhojUf8P94mvI7nuJTeaCkkds3QE4+zS8Ko+GdXuZtA==}
cpu: [x64]
os: [linux]
+ libc: [musl]
'@unrs/[email protected]':
resolution: {integrity:
sha512-5u4RkfxJm+Ng7IWgkzi3qrFOvLvQYnPBmjmZQ8+szTK/b31fQCnleNl1GgEt7nIsZRIf5PLhPwT0WM+q45x/UQ==}
@@ -1859,9 +1872,6 @@ packages:
[email protected]:
resolution: {integrity:
sha512-GERT7L2TiYcYDtYk1IpD+ASAYXjKbLTDPhBtYj7X1NuRMDTMtAx9kyBenub1Ev41lo91OHCKdmP+egTDmfQ7Ig==}
- [email protected]:
- resolution: {integrity:
sha512-nlOYLXHgZtTM7ejr6x6CpUE/a7W3xa58ItvHL7EMaTpYa9Jv0mQUnrmlIwpP7djadM32Bqx/RMJRro6ZLlYzGw==}
-
[email protected]:
resolution: {integrity:
sha512-BLrgEcRTwX2o6gGxGOCNyMvGSp35YofuYzw9h1IMTRmKqttAZZVU67bdb9Pr2vUHA8+j3i2tJfjO6C6+4myGTA==}
engines: {node: 18 || 20 || >=22}
@@ -2895,30 +2905,6 @@ packages:
[email protected]:
resolution: {integrity:
sha512-SnL6sNutTwRWWR/vcmCYHSADjiEesp5TGQQ0pXyLhW5IoeibRlF/CbSLailbB3CNqJUk9cVJ9dUDnbD7GrcHBQ==}
- [email protected]:
- resolution: {integrity:
sha512-7SiLvang0POfGvfP69fzmppBKv36e0TNndKJT1UokZuLXt13CqF3PAxIcRacHqjTBe4ktmzDsh3DK+fbM6epNg==}
- peerDependencies:
- mobx: '*'
-
- [email protected]:
- resolution: {integrity:
sha512-iUxiMpsvNraCKXU+yPotsOncNNmyeS2B5DKL+TL6Tar/xm+wwNJAubJmtRSeAoYawdZqwv8Z/+5nPRHeQxTiXg==}
- peerDependencies:
- mobx: ^6.9.0
- react: ^16.8.0 || ^17 || ^18 || ^19
- react-dom: '*'
- react-native: '*'
- peerDependenciesMeta:
- react-dom:
- optional: true
- react-native:
- optional: true
-
- [email protected]:
- resolution: {integrity:
sha512-EtSneDeiuSDYHnCu1lANGgLuss14LmAHTMd3SWxvmF3GXfYH0Bl4wdeAGRP2VSt4nB4nGpwAiHval6P6mWjRJA==}
-
- [email protected]:
- resolution: {integrity:
sha512-UczzB+0nnwGotYSgllfARAqWCJ5e/skuV2K/l+Zyck/H6pJIhLXuBnz+6vn2i211o7DtbE78HQtsYEKICHGI+g==}
-
[email protected]:
resolution: {integrity:
sha512-GEQWEZmfkOGLdd3XK8ryrfWz3AIP8YymVXiPHEdewrUq7mh0qrKrfHLNCXcbB6sTnMLnOZ3ztSiKcciFUkIJwQ==}
@@ -3810,9 +3796,6 @@ packages:
[email protected]:
resolution: {integrity:
sha512-e4hG1hRwoOdRb37cIMSgzNsxyzKfayW6VOflrwvR+/bzrkyxY/31WkbgnQpgtrNp1SdpJvpUAGTa/ZoiPNDuRQ==}
- [email protected]:
- resolution: {integrity:
sha512-Ah7RktyGpsd5q3fruW3HXElxo8Rezf7tjiyE5Boge0zoYR5qbzYLi+2kNbcUQV4Ao9oZgRRPA57t0VVmnX0BRw==}
-
[email protected]:
resolution: {integrity:
sha512-2CC6CiKQtEwaEeNiqWTAw9PGykW8SR5zZX8MZk6TeAvEAnVS7Visz8WzphqgtQ8v2xz/4Q5K+j+SeMaKXeeQIA==}
peerDependencies:
@@ -5964,14 +5947,6 @@ snapshots:
transitivePeerDependencies:
- supports-color
- [email protected]:
- dependencies:
- '@babel/core': 7.29.0
- '@babel/traverse': 7.29.0
- minimatch: 10.2.4
- transitivePeerDependencies:
- - supports-color
-
[email protected]: {}
[email protected]: {}
@@ -7106,32 +7081,6 @@ snapshots:
pkg-types: 1.3.1
ufo: 1.6.3
- [email protected]([email protected]):
- dependencies:
- mobx: 6.15.0
-
-
[email protected]([email protected])([email protected]([email protected]))([email protected]):
- dependencies:
- mobx: 6.15.0
- react: 19.1.0
- use-sync-external-store: 1.6.0([email protected])
- optionalDependencies:
- react-dom: 19.1.0([email protected])
-
-
[email protected]([email protected])([email protected]([email protected]))([email protected]):
- dependencies:
- babel-plugin-observing-components: 0.2.0
- mobx-react-lite:
4.1.1([email protected])([email protected]([email protected]))([email protected])
- swc-plugin-observing-components: 0.2.0
- transitivePeerDependencies:
- - mobx
- - react
- - react-dom
- - react-native
- - supports-color
-
- [email protected]: {}
-
[email protected]: {}
[email protected]: {}
@@ -8186,8 +8135,6 @@ snapshots:
[email protected]: {}
- [email protected]: {}
-
[email protected]([email protected]):
dependencies:
dequal: 2.0.3
diff --git a/src/components/form-slice/FormItemPlugins/PluginCardList.tsx
b/src/components/form-slice/FormItemPlugins/PluginCardList.tsx
index 53de9090a..ab95c1dac 100644
--- a/src/components/form-slice/FormItemPlugins/PluginCardList.tsx
+++ b/src/components/form-slice/FormItemPlugins/PluginCardList.tsx
@@ -23,8 +23,7 @@ import {
type TextInputProps,
useVirtualizedCombobox,
} from '@mantine/core';
-import { useLocalObservable } from 'mobx-react-lite';
-import { useEffect } from 'react';
+import { useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { PluginCard, type PluginCardProps } from './PluginCard';
@@ -107,47 +106,31 @@ export const PluginCardList = (props:
PluginCardListProps) => {
const { mode, onAdd, onEdit, onDelete, onView } = props;
const { t } = useTranslation();
const combobox = useVirtualizedCombobox();
- const optionsOb = useLocalObservable(() => ({
- search: '',
- plugins: [] as string[],
- mode: 'add' as OptionProps['mode'],
- setSearch(search: string) {
- this.search = search.toLowerCase().trim();
- },
- setPlugins(plugins: string[]) {
- this.plugins = plugins;
- },
- setMode(mode: PluginCardProps['mode']) {
- this.mode = mode;
- },
- get list() {
- const arr = !this.search
- ? this.plugins
- : this.plugins.filter((d) => d.toLowerCase().includes(this.search));
- return arr.map((name) => ({
- name,
- mode: this.mode,
- onAdd,
- onEdit,
- onDelete,
- onView,
- }));
- },
- }));
- useEffect(() => optionsOb.setPlugins(plugins), [optionsOb, plugins]);
- useEffect(() => optionsOb.setSearch(search), [optionsOb, search]);
- useEffect(() => optionsOb.setMode(mode), [optionsOb, mode]);
+ const list = useMemo(() => {
+ const query = search.toLowerCase().trim();
+ const matched = !query
+ ? plugins
+ : plugins.filter((d) => d.toLowerCase().includes(query));
+ return matched.map((name) => ({
+ name,
+ mode,
+ onAdd,
+ onEdit,
+ onDelete,
+ onView,
+ }));
+ }, [search, plugins, mode, onAdd, onEdit, onDelete, onView]);
return (
<Combobox store={combobox}>
<Combobox.Options mt="1em">
<ScrollArea.Autosize h={h} mah={mah} type="scroll">
- {!optionsOb.list.length ? (
+ {!list.length ? (
<Combobox.Empty>{t('noData')}</Combobox.Empty>
) : (
<SimpleGrid cols={cols}>
- <Options list={optionsOb.list} />
+ <Options list={list} />
</SimpleGrid>
)}
</ScrollArea.Autosize>
diff --git a/vite.config.ts b/vite.config.ts
index d4e3c6894..9624d135e 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -19,7 +19,6 @@ import { readdirSync } from 'node:fs';
import { TanStackRouterVite } from '@tanstack/router-plugin/vite';
import react from '@vitejs/plugin-react-swc';
-import observerPlugin from 'mobx-react-observer/swc-plugin';
import postcssPresetMantine from 'postcss-preset-mantine';
import postcssSimpleVars from 'postcss-simple-vars';
import UnpluginIcons from 'unplugin-icons/vite';
@@ -103,9 +102,7 @@ export default defineConfig({
baseLang: 'en',
getTranslationDir: (lang) => `./src/locales/${lang}`,
}),
- react({
- plugins: [observerPlugin() as never],
- }),
+ react(),
],
css: {
postcss: {
