Add extension settings info to /extensions list (#14905)

packages/cli/src/ui/components/views/ExtensionsList.test.tsx

@@ -125,4 +125,33 @@ describe('<ExtensionsList />', () => {
       unmount();
     });
   }
+
+  it('should render resolved settings for an extension', () => {
+    mockUIState(new Map());
+    const extensionWithSettings = {
+      ...mockExtensions[0],
+      resolvedSettings: [
+        {
+          name: 'sensitiveApiKey',
+          value: '***',
+          envVar: 'API_KEY',
+          sensitive: true,
+        },
+        {
+          name: 'maxTokens',
+          value: '1000',
+          envVar: 'MAX_TOKENS',
+          sensitive: false,
+        },
+      ],
+    };
+    const { lastFrame, unmount } = render(
+      <ExtensionsList extensions={[extensionWithSettings]} />,
+    );
+    const output = lastFrame();
+    expect(output).toContain('settings:');
+    expect(output).toContain('- sensitiveApiKey: ***');
+    expect(output).toContain('- maxTokens: 1000');
+    unmount();
+  });
 });

packages/cli/src/ui/components/views/ExtensionsList.tsx

@@ -23,7 +23,7 @@ export const ExtensionsList: React.FC<ExtensionsList> = ({ extensions }) => {
 
   return (
     <Box flexDirection="column" marginTop={1} marginBottom={1}>
-      <Text>Installed extensions:</Text>
+      <Text>Installed extensions: </Text>
       <Box flexDirection="column" paddingLeft={2}>
         {extensions.map((ext) => {
           const state = extensionsUpdateState.get(ext.name);
@@ -59,12 +59,22 @@ export const ExtensionsList: React.FC<ExtensionsList> = ({ extensions }) => {
           }
 
           return (
-            <Box key={ext.name}>
+            <Box key={ext.name} flexDirection="column" marginBottom={1}>
               <Text>
                 <Text color="cyan">{`${ext.name} (v${ext.version})`}</Text>
                 <Text color={activeColor}>{` - ${activeString}`}</Text>
                 {<Text color={stateColor}>{` (${stateText})`}</Text>}
               </Text>
+              {ext.resolvedSettings && ext.resolvedSettings.length > 0 && (
+                <Box flexDirection="column" paddingLeft={2}>
+                  <Text>settings:</Text>
+                  {ext.resolvedSettings.map((setting) => (
+                    <Text key={setting.name}>
+                      - {setting.name}: {setting.value}
+                    </Text>
+                  ))}
+                </Box>
+              )}
             </Box>
           );
         })}