spacehub

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

claude-code / mods / diff / hooks / views / sections / todo-bar.tsx
43 lines · 1.2 KBRaw
1/* @jsxRuntime classic */
2/* @jsx h */
3/* @jsxFrag Fragment */
4import type { RenderElement } from 'claude-code'
5
6import type Todos from '../../todos'
7import type { Kit } from '../kit'
8import { TODO_BAR_CELLS } from './todo-bar-cells'
9import { 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 todos completed over total
17 * @returns the row, or null without todos
18 */
19export function todoBar(
20 kit: Kit,
21 todos: Todos.TodoProgress,
22): RenderElement | null {
23 if (todos.total === 0) {
24 return null
25 }
26
27 const { Box, Text } = kit.ui
28 const cells = Math.max(
29 1,
30 Math.min(TODO_BAR_CELLS, kit.columns - TODO_BAR_RESERVE),
31 )
32 const filled = Math.round((todos.done / todos.total) * cells)
33
34 return (
35 <Box flexDirection="row" gap={1} marginTop={1}>
36 <Text>
37 <Text color="success">{'█'.repeat(filled)}</Text>
38 <Text color="inactive">{'░'.repeat(Math.max(0, cells - filled))}</Text>
39 </Text>
40 <Text dimColor>{`${todos.done}/${todos.total}`}</Text>
41 </Box>
42 )
43}