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 { Kit } from '../kit' |
| 5 | import Layout from '../layout' |
| 6 | import Sections from '../sections' |
| 7 | import { codeBlocksOf } from './code-blocks-of' |
| 8 | import type { DetailModel } from './detail-model' |
| 9 | import { FILE_FRAME_NODES } from './file-frame-nodes' |
| 10 | import { MAX_CODE_CHARS } from './max-code-chars' |
| 11 | import { placeholderOf } from './placeholder-of' |
| 12 | import type Types from './types' |
| 13 | |
| 14 | /** |
| 15 | * One file's detail (DiffDetailView): its name row (nameRow), the |
| 16 | * built-in's dim rule under it, the body. |
| 17 | * |
| 18 | * The body is a placeholder, or the hunks as the engine's diff `Code` |
| 19 | * blocks (codeBlocksOf) within the room given, then a footer when anything |
| 20 | * was cut; with it, the room left over. |
| 21 | * |
| 22 | * @param kit the elements and the width |
| 23 | * @param detail the file |
| 24 | * @param room the room the pane's bodies have left |
| 25 | * @returns the detail element and the room after it |
| 26 | */ |
| 27 | export function detailView( |
| 28 | kit: Kit, |
| 29 | detail: DetailModel, |
| 30 | room: Types.BodyRoom, |
| 31 | ): Types.DrawnDetail { |
| 32 | const { Box, Text, Code } = kit.ui |
| 33 | const placeholder = placeholderOf(detail) |
| 34 | |
| 35 | const code = codeBlocksOf(placeholder ? [] : (detail.body?.hunks ?? []), { |
| 36 | chars: room.chars - Layout.sanitizeName(detail.displayPath).length, |
| 37 | nodes: room.nodes - FILE_FRAME_NODES, |
| 38 | }) |
| 39 | |
| 40 | const isTruncated = detail.body?.isTruncated === true || code.isTruncated |
| 41 | const path = Layout.sanitizeName(detail.path).slice(-MAX_CODE_CHARS) |
| 42 | |
| 43 | const footer = isTruncated |
| 44 | ? [ |
| 45 | <Text dimColor italic> |
| 46 | … diff truncated (exceeded 400 line limit) |
| 47 | </Text>, |
| 48 | ] |
| 49 | : [] |
| 50 | |
| 51 | const notes = (placeholder ?? []).map(line => ( |
| 52 | <Text dimColor italic wrap="wrap"> |
| 53 | {line} |
| 54 | </Text> |
| 55 | )) |
| 56 | |
| 57 | const hunks = code.sources.map(source => ( |
| 58 | <Code source={source} format="diff" path={path} /> |
| 59 | )) |
| 60 | |
| 61 | const element = ( |
| 62 | <Box flexDirection="column"> |
| 63 | {[ |
| 64 | Sections.nameRow(kit, { |
| 65 | ...detail, |
| 66 | isTruncated, |
| 67 | isAskable: placeholder === null, |
| 68 | }), |
| 69 | Sections.divider(kit), |
| 70 | ...(placeholder ? notes : hunks), |
| 71 | ...footer, |
| 72 | ]} |
| 73 | </Box> |
| 74 | ) |
| 75 | |
| 76 | return { element, room: code.room } |
| 77 | } |