Support for Built-in Agent Skills (#16045)

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

@@ -154,6 +154,7 @@ const createMockConfig = (overrides = {}) => ({
   }),
   getSkillManager: () => ({
     getSkills: () => [],
+    getDisplayableSkills: () => [],
   }),
   getMcpClientManager: () => ({
     getMcpServers: () => ({}),

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

@@ -45,6 +45,7 @@ const createMockConfig = (overrides = {}) => ({
   })),
   getSkillManager: vi.fn().mockImplementation(() => ({
     getSkills: vi.fn(() => ['skill1', 'skill2']),
+    getDisplayableSkills: vi.fn(() => ['skill1', 'skill2']),
   })),
   ...overrides,
 });

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

@@ -25,7 +25,7 @@ export const StatusDisplay: React.FC<StatusDisplayProps> = ({
   const config = useConfig();
 
   if (process.env['GEMINI_SYSTEM_MD']) {
-    return <Text color={theme.status.error}>|⌐■_■| </Text>;
+    return <Text color={theme.status.error}>|⌐■_■|</Text>;
   }
 
   if (uiState.ctrlCPressedOnce) {
@@ -69,7 +69,7 @@ export const StatusDisplay: React.FC<StatusDisplayProps> = ({
         blockedMcpServers={
           config.getMcpClientManager()?.getBlockedMcpServers() ?? []
         }
-        skillCount={config.getSkillManager().getSkills().length}
+        skillCount={config.getSkillManager().getDisplayableSkills().length}
       />
     );
   }

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

@@ -105,4 +105,25 @@ describe('SkillsList Component', () => {
 
     unmount();
   });
+
+  it('should render [Built-in] tag for built-in skills', () => {
+    const builtinSkill: SkillDefinition = {
+      name: 'builtin-skill',
+      description: 'A built-in skill',
+      disabled: false,
+      location: 'loc',
+      body: 'body',
+      isBuiltin: true,
+    };
+
+    const { lastFrame, unmount } = render(
+      <SkillsList skills={[builtinSkill]} showDescriptions={true} />,
+    );
+    const output = lastFrame();
+
+    expect(output).toContain('builtin-skill');
+    expect(output).toContain('Built-in');
+
+    unmount();
+  });
 });

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

@@ -18,24 +18,32 @@ export const SkillsList: React.FC<SkillsListProps> = ({
   skills,
   showDescriptions,
 }) => {
-  const enabledSkills = skills
-    .filter((s) => !s.disabled)
-    .sort((a, b) => a.name.localeCompare(b.name));
+  const sortSkills = (a: SkillDefinition, b: SkillDefinition) => {
+    if (a.isBuiltin === b.isBuiltin) {
+      return a.name.localeCompare(b.name);
+    }
+    return a.isBuiltin ? 1 : -1;
+  };
 
-  const disabledSkills = skills
-    .filter((s) => s.disabled)
-    .sort((a, b) => a.name.localeCompare(b.name));
+  const enabledSkills = skills.filter((s) => !s.disabled).sort(sortSkills);
+
+  const disabledSkills = skills.filter((s) => s.disabled).sort(sortSkills);
 
   const renderSkill = (skill: SkillDefinition) => (
     <Box key={skill.name} flexDirection="row">
       <Text color={theme.text.primary}>{'  '}- </Text>
       <Box flexDirection="column">
-        <Text
-          bold
-          color={skill.disabled ? theme.text.secondary : theme.text.link}
-        >
-          {skill.name}
-        </Text>
+        <Box flexDirection="row">
+          <Text
+            bold
+            color={skill.disabled ? theme.text.secondary : theme.text.link}
+          >
+            {skill.name}
+          </Text>
+          {skill.isBuiltin && (
+            <Text color={theme.text.secondary}>{' [Built-in]'}</Text>
+          )}
+        </Box>
         {showDescriptions && skill.description && (
           <Box marginLeft={2}>
             <Text