feat(about): Add the IDE Client's display name to /about (#6311)

Co-authored-by: Bryan Morgan <bryanmorgan@google.com>

packages/cli/src/ui/components/AboutBox.tsx

@@ -16,6 +16,7 @@ interface AboutBoxProps {
   modelVersion: string;
   selectedAuthType: string;
   gcpProject: string;
+  ideClient: string;
 }
 
 export const AboutBox: React.FC<AboutBoxProps> = ({
@@ -25,6 +26,7 @@ export const AboutBox: React.FC<AboutBoxProps> = ({
   modelVersion,
   selectedAuthType,
   gcpProject,
+  ideClient,
 }) => (
   <Box
     borderStyle="round"
@@ -115,5 +117,17 @@ export const AboutBox: React.FC<AboutBoxProps> = ({
         </Box>
       </Box>
     )}
+    {ideClient && (
+      <Box flexDirection="row">
+        <Box width="35%">
+          <Text bold color={Colors.LightBlue}>
+            IDE Client
+          </Text>
+        </Box>
+        <Box>
+          <Text>{ideClient}</Text>
+        </Box>
+      </Box>
+    )}
   </Box>
 );

packages/cli/src/ui/components/HistoryItemDisplay.test.tsx

@@ -71,6 +71,7 @@ describe('<HistoryItemDisplay />', () => {
       modelVersion: 'test-model',
       selectedAuthType: 'test-auth',
       gcpProject: 'test-project',
+      ideClient: 'test-ide',
     };
     const { lastFrame } = render(
       <HistoryItemDisplay {...baseItem} item={item} />,

packages/cli/src/ui/components/HistoryItemDisplay.tsx

@@ -73,6 +73,7 @@ export const HistoryItemDisplay: React.FC<HistoryItemDisplayProps> = ({
         modelVersion={item.modelVersion}
         selectedAuthType={item.selectedAuthType}
         gcpProject={item.gcpProject}
+        ideClient={item.ideClient}
       />
     )}
     {item.type === 'help' && commands && <Help commands={commands} />}