surshar / claude-code
Claude Code is an agentic coding tool that lives in your terminal, understands your codebase, and helps you code faster by executing routine tasks, explaining complex code, and handling git workflows - all through natural language commands.
Built by Anthropic · github.com/anthropics
| 1 | /* @jsxRuntime classic */ |
| 2 | /* @jsx h */ |
| 3 | /* @jsxFrag Fragment */ |
| 4 | import type { RenderElement } from 'claude-code' |
| 5 | |
| 6 | import type PaneState from '../../pane-state' |
| 7 | import type { Kit } from '../kit' |
| 8 | import { TODO_BAR_CELLS } from './todo-bar-cells' |
| 9 | import { TODO_BAR_RESERVE } from './todo-bar-reserve' |
| 10 | |
| 11 | /** |
| 12 | * The session's todo progress as a bar and `done/total`, drawn only while |
| 13 | * a todo list exists (ReplDiffSidebar's ProgressBar row). |
| 14 | * |
| 15 | * @param kit the elements and the width |
| 16 | * @param model the pane's state, holding its todos' completed over total |
| 17 | * @returns the row, or null without todos |
| 18 | */ |
| 19 | export function todoBar( |
| 20 | kit: Kit, |
| 21 | model: Pick<PaneState.PaneModel, 'todos'>, |
| 22 | ): RenderElement | null { |
| 23 | const { todos } = model |
| 24 | |
| 25 | if (todos.total === 0) { |
| 26 | return null |
| 27 | } |
| 28 | |
| 29 | const { Box, Text } = kit.ui |
| 30 | |
| 31 | const cells = Math.max( |
| 32 | 1, |
| 33 | Math.min(TODO_BAR_CELLS, kit.columns - TODO_BAR_RESERVE), |
| 34 | ) |
| 35 | |
| 36 | const filled = Math.round((todos.done / todos.total) * cells) |
| 37 | |
| 38 | return ( |
| 39 | <Box flexDirection="row" gap={1} marginTop={1}> |
| 40 | <Text> |
| 41 | <Text color="success">{'█'.repeat(filled)}</Text> |
| 42 | <Text color="inactive">{'░'.repeat(Math.max(0, cells - filled))}</Text> |
| 43 | </Text> |
| 44 | <Text dimColor>{`${todos.done}/${todos.total}`}</Text> |
| 45 | </Box> |
| 46 | ) |
| 47 | } |