From 0e6b608f919373652790e735cea5dc8e48aa4cbe Mon Sep 17 00:00:00 2001
From: t0ng7u <dev@aiass.cc>
Date: Mon, 7 Jul 2025 01:53:19 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20feat(ui):=20dynamic=20multi-key?=
 =?UTF-8?q?=20controls=20in=20Channel=20editor?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Summary
1. Load `channel_info` when editing:
   • Detect if the channel is in multi-key mode (`is_multi_key`).
   • Auto-initialize `batch`, `multiToSingle`, and `multiKeyMode` from backend data.

2. Visibility logic
   • Creation page: “Batch create / Multi-key mode” always available.
   • Edit page: show these controls **only when** the channel itself is multi-key.

3. State consistency
   • `multi_key_mode` added to `inputs`; `setValues(inputs)` now preserves the user’s selection.

Result
Single-key channels no longer display irrelevant “key aggregation” options, while multi-key channels open with the correct defaults, providing a cleaner and more accurate editing experience.
---
 web/src/pages/Channel/EditChannel.js | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)

diff --git a/web/src/pages/Channel/EditChannel.js b/web/src/pages/Channel/EditChannel.js
index a12777fc..de55fb9d 100644
--- a/web/src/pages/Channel/EditChannel.js
+++ b/web/src/pages/Channel/EditChannel.js
@@ -108,7 +108,6 @@ const EditChannel = (props) => {
   const [multiToSingle, setMultiToSingle] = useState(false);
   const [multiKeyMode, setMultiKeyMode] = useState('random');
   const [autoBan, setAutoBan] = useState(true);
-  // const [autoBan, setAutoBan] = useState(true);
   const [inputs, setInputs] = useState(originInputs);
   const [originModelOptions, setOriginModelOptions] = useState([]);
   const [modelOptions, setModelOptions] = useState([]);
@@ -122,6 +121,7 @@ const EditChannel = (props) => {
   const [vertexKeys, setVertexKeys] = useState([]);
   const [vertexFileList, setVertexFileList] = useState([]);
   const vertexErroredNames = useRef(new Set()); // 避免重复报错
+  const [isMultiKeyChannel, setIsMultiKeyChannel] = useState(false);
   const getInitValues = () => ({ ...originInputs });
   const handleInputChange = (name, value) => {
     if (formApiRef.current) {
@@ -219,6 +219,19 @@ const EditChannel = (props) => {
           2,
         );
       }
+      const chInfo = data.channel_info || {};
+      const isMulti = chInfo.is_multi_key === true;
+      setIsMultiKeyChannel(isMulti);
+      if (isMulti) {
+        setBatch(true);
+        setMultiToSingle(true);
+        const modeVal = chInfo.multi_key_mode || 'random';
+        setMultiKeyMode(modeVal);
+        data.multi_key_mode = modeVal;
+      } else {
+        setBatch(false);
+        setMultiToSingle(false);
+      }
       setInputs(data);
       if (formApiRef.current) {
         formApiRef.current.setValues(data);
@@ -545,7 +558,7 @@ const EditChannel = (props) => {
     }
   };
 
-  const batchAllowed = !isEdit;
+  const batchAllowed = !isEdit || isMultiKeyChannel;
   const batchExtra = batchAllowed ? (
     <Space>
       <Checkbox checked={batch} onChange={() => {