code improvement

Signed-off-by: Yi Cai <yicai@redhat.com>

Author: ciiay

workspaces/lightspeed/plugins/lightspeed/src/components/LightSpeedChat.tsx

@@ -1112,33 +1112,37 @@ export const LightspeedChat = ({
     </>
   );
 
-  let mainPanelContent = <>{chatMainContent}</>;
+  const mcpSettingsPanel = (
+    <McpServersSettings onClose={() => setIsMcpSettingsOpen(false)} />
+  );
+
+  const mainPanelContent = (() => {
+    if (!isMcpSettingsOpen) {
+      return <>{chatMainContent}</>;
+    }
 
-  if (isMcpSettingsOpen && isFullscreenMode) {
-    mainPanelContent = (
-      <div className={classes.mcpFullscreenLayout}>
-        <div className={classes.mcpChatPane}>{chatMainContent}</div>
-        <div className={classes.mcpSettingsPane}>
-          <McpServersSettings onClose={() => setIsMcpSettingsOpen(false)} />
+    if (isFullscreenMode) {
+      return (
+        <div className={classes.mcpFullscreenLayout}>
+          <div className={classes.mcpChatPane}>{chatMainContent}</div>
+          <div className={classes.mcpSettingsPane}>{mcpSettingsPanel}</div>
         </div>
-      </div>
-    );
-  } else if (isMcpSettingsOpen) {
-    mainPanelContent = (
+      );
+    }
+
+    return (
       <Settings
         className={classes.settingsFlat}
         fields={[
           {
             id: 'mcp-servers-settings',
             label: '',
-            field: (
-              <McpServersSettings onClose={() => setIsMcpSettingsOpen(false)} />
-            ),
+            field: mcpSettingsPanel,
           },
         ]}
       />
     );
-  }
+  })();
 
   let drawerPanelStyle: { [key: string]: string | number } | undefined;
   if (!isFullscreenMode) {

workspaces/lightspeed/plugins/lightspeed/src/components/McpServersSettings.tsx

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { useCallback, useEffect, useMemo, useState } from 'react';
+import { MouseEvent, useCallback, useEffect, useMemo, useState } from 'react';
 
 import { configApiRef, fetchApiRef, useApi } from '@backstage/core-plugin-api';
 
@@ -345,6 +345,11 @@ export const McpServersSettings = ({ onClose }: McpServersSettingsProps) => {
     return next;
   }, [servers, sortAsc]);
 
+  const onEditClick = useCallback((event: MouseEvent) => {
+    // Intentionally no-op in this branch; follow-up branch will wire edit flow.
+    event.preventDefault();
+  }, []);
+
   return (
     <div className={classes.root}>
       <div className={classes.headerRow}>
@@ -475,7 +480,7 @@ export const McpServersSettings = ({ onClose }: McpServersSettingsProps) => {
                     icon={<ModeEditOutlineOutlinedIcon fontSize="small" />}
                     variant="plain"
                     className={classes.actionButton}
-                    isDisabled
+                    onClick={onEditClick}
                   />
                 </Td>
               </Tr>