GitHub CLI 分支显示格式优化实践

GitHub CLI 作为 GitHub 官方命令行工具，其用户体验的一致性至关重要。近期在项目开发过程中，我们发现了一个关于分支名称显示格式的优化点，值得与开发者社区分享。

问题背景

在 GitHub CLI 的 run 和 codespace 子命令中，分支名称显示格式存在不一致的情况。具体表现为：

1. 当前实现使用圆括号包裹分支名称
2. 根据 Primer 设计规范，分支名称应该使用方括号包裹并显示为青色

这种不一致性虽然看似微小，但在专业命令行工具中，保持统一的视觉样式对于用户体验至关重要。

技术分析

通过代码审查，我们发现以下关键点：

1. 影响范围：

   • gh run 命令中的 SelectRun() 方法
   • gh codespace 命令中的 chooseCodespaceFromList() 方法

2. 现有实现：

   // run 命令中的当前实现
   fmt.Sprintf("%s %s, %s (%s) %s", symbol, run.Title(), run.WorkflowName(), cs.Cyan(run.HeadBranch), preciseAgo(now, run.StartedTime()))
   
   // codespace 命令中的当前实现
   description := fmt.Sprintf("%s (%s): %s", c.Repository.FullName, branch, displayName)
   

3. 规范要求：

   • 分支名称应使用方括号 [] 包裹
   • 建议使用青色突出显示（在支持颜色的终端中）

解决方案

基于技术讨论和规范要求，我们确定了以下改进方案：

1. 统一将分支名称的包裹符号从圆括号 () 改为方括号 []
2. 在支持终端颜色的环境中，使用青色显示分支名称
3. 保持向后兼容性，确保在不支持颜色的终端中也能正常显示

实现示例：

// 改进后的 run 命令实现
fmt.Sprintf("%s %s, %s [%s] %s", symbol, run.Title(), run.WorkflowName(), cs.Cyan(run.HeadBranch), preciseAgo(now, run.StartedTime()))

// 改进后的 codespace 命令实现
description := fmt.Sprintf("%s [%s]: %s", c.Repository.FullName, branch, displayName)

技术考量

在实施过程中，我们特别考虑了以下因素：

1. 终端兼容性：

   • 确保修改后的格式在各种终端环境下都能正确显示
   • 处理颜色支持检测逻辑

2. 可访问性：

   • 评估方括号对屏幕阅读器用户的影响
   • 确保颜色对比度符合无障碍标准

3. 一致性原则：

   • 虽然本次只修改了两处，但为未来全面统一分支显示格式奠定了基础
   • 建立了处理类似问题的参考模式

实施建议

对于需要在其他 CLI 项目中处理类似问题的开发者，建议：

1. 建立统一的显示格式规范
2. 创建辅助函数处理特殊格式（如分支、标签等）
3. 编写测试用例验证不同终端环境下的显示效果
4. 考虑国际化因素（如RTL语言环境下的显示）

总结

这次对 GitHub CLI 分支显示格式的优化，虽然改动不大，但体现了对细节的关注和对用户体验的重视。通过遵循设计规范并保持一致性，我们能够为用户提供更加专业、统一的命令行体验。这种对细节的关注正是打造优秀开发者工具的关键所在。

对于 CLI 工具开发者而言，类似的显示格式问题值得定期审查，确保整个工具在视觉和交互上保持高度一致性，从而提升用户的信任度和使用体验。