@kitlangton/ghui 0.1.17 → 0.1.19

package/src/ui/commentEditor.ts

@@ -0,0 +1,126 @@
+export interface CommentEditorValue {
+	readonly body: string
+	readonly cursor: number
+}
+
+export interface CommentEditorLine {
+	readonly text: string
+	readonly start: number
+	readonly end: number
+}
+
+export const clampCursor = (body: string, cursor: number) => Math.max(0, Math.min(cursor, body.length))
+
+export const commentEditorLines = (body: string): readonly CommentEditorLine[] => body.split("\n").reduce<CommentEditorLine[]>((ranges, text) => {
+	const start = ranges.length === 0 ? 0 : ranges[ranges.length - 1]!.end + 1
+	ranges.push({ text, start, end: start + text.length })
+	return ranges
+}, [])
+
+export const cursorLineIndexForLines = (lines: readonly CommentEditorLine[], cursor: number) =>
+	Math.max(0, lines.findIndex((line, index) => cursor <= line.end || index === lines.length - 1))
+
+export const cursorLineIndex = (body: string, cursor: number) => {
+	const lines = commentEditorLines(body)
+	const safeCursor = clampCursor(body, cursor)
+	return cursorLineIndexForLines(lines, safeCursor)
+}
+
+export const lineStartAt = (body: string, cursor: number) => body.lastIndexOf("\n", Math.max(0, clampCursor(body, cursor) - 1)) + 1
+
+export const lineEndAt = (body: string, cursor: number) => {
+	const end = body.indexOf("\n", clampCursor(body, cursor))
+	return end === -1 ? body.length : end
+}
+
+const previousWordStart = (body: string, cursor: number) => {
+	let index = clampCursor(body, cursor)
+	while (index > 0 && /\s/.test(body[index - 1]!)) index--
+	while (index > 0 && !/\s/.test(body[index - 1]!)) index--
+	return index
+}
+
+const nextWordEnd = (body: string, cursor: number) => {
+	let index = clampCursor(body, cursor)
+	while (index < body.length && /\s/.test(body[index]!)) index++
+	while (index < body.length && !/\s/.test(body[index]!)) index++
+	return index
+}
+
+const replaceRange = (state: CommentEditorValue, start: number, end: number, text = ""): CommentEditorValue => ({
+	body: `${state.body.slice(0, start)}${text}${state.body.slice(end)}`,
+	cursor: start + text.length,
+})
+
+export const insertText = (state: CommentEditorValue, text: string): CommentEditorValue =>
+	replaceRange(state, clampCursor(state.body, state.cursor), clampCursor(state.body, state.cursor), text)
+
+export const moveLeft = (state: CommentEditorValue): CommentEditorValue => ({
+	...state,
+	cursor: Math.max(0, clampCursor(state.body, state.cursor) - 1),
+})
+
+export const moveRight = (state: CommentEditorValue): CommentEditorValue => ({
+	...state,
+	cursor: Math.min(state.body.length, clampCursor(state.body, state.cursor) + 1),
+})
+
+export const moveLineStart = (state: CommentEditorValue): CommentEditorValue => ({
+	...state,
+	cursor: lineStartAt(state.body, state.cursor),
+})
+
+export const moveLineEnd = (state: CommentEditorValue): CommentEditorValue => ({
+	...state,
+	cursor: lineEndAt(state.body, state.cursor),
+})
+
+export const moveWordBackward = (state: CommentEditorValue): CommentEditorValue => ({
+	...state,
+	cursor: previousWordStart(state.body, state.cursor),
+})
+
+export const moveWordForward = (state: CommentEditorValue): CommentEditorValue => ({
+	...state,
+	cursor: nextWordEnd(state.body, state.cursor),
+})
+
+export const moveVertically = (state: CommentEditorValue, delta: number): CommentEditorValue => {
+	const lines = commentEditorLines(state.body)
+	const safeCursor = clampCursor(state.body, state.cursor)
+	const currentLineIndex = cursorLineIndexForLines(lines, safeCursor)
+	const currentLine = lines[currentLineIndex] ?? { text: state.body, start: 0, end: state.body.length }
+	const targetLine = lines[Math.max(0, Math.min(lines.length - 1, currentLineIndex + delta))] ?? currentLine
+	const column = safeCursor - currentLine.start
+	return { ...state, cursor: Math.min(targetLine.end, targetLine.start + column) }
+}
+
+export const backspace = (state: CommentEditorValue): CommentEditorValue => {
+	const cursor = clampCursor(state.body, state.cursor)
+	return cursor === 0 ? { ...state, cursor } : replaceRange({ ...state, cursor }, cursor - 1, cursor)
+}
+
+export const deleteForward = (state: CommentEditorValue): CommentEditorValue => {
+	const cursor = clampCursor(state.body, state.cursor)
+	return cursor >= state.body.length ? { ...state, cursor } : replaceRange({ ...state, cursor }, cursor, cursor + 1)
+}
+
+export const deleteWordBackward = (state: CommentEditorValue): CommentEditorValue => {
+	const cursor = clampCursor(state.body, state.cursor)
+	return replaceRange({ ...state, cursor }, previousWordStart(state.body, cursor), cursor)
+}
+
+export const deleteWordForward = (state: CommentEditorValue): CommentEditorValue => {
+	const cursor = clampCursor(state.body, state.cursor)
+	return replaceRange({ ...state, cursor }, cursor, nextWordEnd(state.body, cursor))
+}
+
+export const deleteToLineStart = (state: CommentEditorValue): CommentEditorValue => {
+	const cursor = clampCursor(state.body, state.cursor)
+	return replaceRange({ ...state, cursor }, lineStartAt(state.body, cursor), cursor)
+}
+
+export const deleteToLineEnd = (state: CommentEditorValue): CommentEditorValue => {
+	const cursor = clampCursor(state.body, state.cursor)
+	return replaceRange({ ...state, cursor }, cursor, lineEndAt(state.body, cursor))
+}

package/src/ui/diff.ts

@@ -1,17 +1,57 @@
 import { parseColor, SyntaxStyle } from "@opentui/core"
-import type { PullRequestItem } from "../domain.js"
+import { Data, Schema } from "effect"
+import type { DiffCommentSide, PullRequestItem, PullRequestReviewComment } from "../domain.js"
 import { colors } from "./colors.js"
 
+export const DiffView = Schema.Literals(["unified", "split"])
+export type DiffView = Schema.Schema.Type<typeof DiffView>
+
+export const DiffWrapMode = Schema.Literals(["none", "word"])
+export type DiffWrapMode = Schema.Schema.Type<typeof DiffWrapMode>
+
+export const DiffCommentKind = Schema.Literals(["addition", "deletion", "context"])
+export type DiffCommentKind = Schema.Schema.Type<typeof DiffCommentKind>
+
 export interface DiffFilePatch {
 	readonly name: string
 	readonly filetype: string | undefined
 	readonly patch: string
 }
 
-export type PullRequestDiffState =
-	| { readonly status: "loading" }
-	| { readonly status: "ready"; readonly patch: string; readonly files: readonly DiffFilePatch[] }
-	| { readonly status: "error"; readonly error: string }
+export interface DiffFileStats {
+	readonly additions: number
+	readonly deletions: number
+}
+
+export interface StackedDiffFilePatch {
+	readonly file: DiffFilePatch
+	readonly index: number
+	readonly headerLine: number
+	readonly diffStartLine: number
+	readonly diffHeight: number
+}
+
+export interface DiffCommentAnchor {
+	readonly path: string
+	readonly line: number
+	readonly side: DiffCommentSide
+	readonly kind: DiffCommentKind
+	readonly renderLine: number
+	readonly text: string
+}
+
+export type StackedDiffCommentAnchor = DiffCommentAnchor & {
+	readonly fileIndex: number
+	readonly localRenderLine: number
+}
+
+export type PullRequestDiffState = Data.TaggedEnum<{
+	Loading: {}
+	Ready: { readonly patch: string; readonly files: readonly DiffFilePatch[] }
+	Error: { readonly error: string }
+}>
+
+export const PullRequestDiffState = Data.taggedEnum<PullRequestDiffState>()
 
 export const createDiffSyntaxStyle = () => SyntaxStyle.fromStyles({
 	keyword: { fg: parseColor(colors.accent), bold: true },
@@ -144,17 +184,193 @@ export const splitPatchFiles = (patch: string): readonly DiffFilePatch[] => {
 
 export const pullRequestDiffKey = (pullRequest: PullRequestItem) => `${pullRequest.repository}#${pullRequest.number}`
 
+export const safeDiffFileIndex = (files: readonly DiffFilePatch[], index: number) =>
+	files.length > 0 ? Math.max(0, Math.min(index, files.length - 1)) : 0
+
+export const buildStackedDiffFiles = (
+	files: readonly DiffFilePatch[],
+	view: DiffView,
+	wrapMode: DiffWrapMode,
+	width: number,
+): readonly StackedDiffFilePatch[] => {
+	let offset = 0
+	return files.map((file, index) => {
+		const diffHeight = patchRenderableLineCount(file.patch, view, wrapMode, width)
+		const separatorBefore = index === 0 ? 0 : 1
+		const headerLine = offset + separatorBefore
+		const stackedFile = {
+			file,
+			index,
+			headerLine,
+			diffStartLine: headerLine + 2,
+			diffHeight,
+		} satisfies StackedDiffFilePatch
+		offset += separatorBefore + 2 + diffHeight
+		return stackedFile
+	})
+}
+
+export const stackedDiffFileAtLine = (stackedFiles: readonly StackedDiffFilePatch[], line: number) =>
+	stackedFiles.reduce<StackedDiffFilePatch | undefined>((current, file) => file.headerLine <= line ? file : current, undefined)
+
 export const diffStatText = (pullRequest: PullRequestItem) => {
 	if (!pullRequest.detailLoaded) return "loading details"
 	const files = pullRequest.changedFiles === 1 ? "1 file" : `${pullRequest.changedFiles} files`
+	const stats = diffFileStatsText(pullRequest)
+	return stats ? `${stats} ${files}` : files
+}
+
+export const diffCommentLocationKey = (location: Pick<PullRequestReviewComment, "path" | "side" | "line">) => `${location.path}:${location.side}:${location.line}`
+
+export const diffCommentAnchorKey = diffCommentLocationKey
+
+type PendingDiffCommentAnchor = Omit<DiffCommentAnchor, "renderLine">
+
+const diffContentWidth = (lines: readonly string[], view: DiffView, width: number) => {
+	const lineNumberGutterWidth = patchLineNumberGutterWidth(lines)
+	return view === "split"
+		? Math.max(1, Math.floor(width / 2) - lineNumberGutterWidth)
+		: Math.max(1, width - lineNumberGutterWidth)
+}
+
+export const diffFileStats = (file: DiffFilePatch): DiffFileStats => {
+	let additions = 0
+	let deletions = 0
+	let inHunk = false
+
+	for (const line of file.patch.split("\n")) {
+		const hunk = line.match(hunkHeaderPattern)
+		if (hunk) {
+			inHunk = true
+			continue
+		}
+
+		if (!inHunk) continue
+		const firstChar = line[0]
+		if (firstChar === "+") additions++
+		else if (firstChar === "-") deletions++
+	}
+
+	return { additions, deletions }
+}
+
+export const diffFileStatText = (file: DiffFilePatch) => {
+	return diffFileStatsText(diffFileStats(file))
+}
+
+export const diffFileStatsText = (stats: DiffFileStats) => {
 	return [
-		pullRequest.additions > 0 ? `+${pullRequest.additions}` : null,
-		pullRequest.deletions > 0 ? `-${pullRequest.deletions}` : null,
-		files,
+		stats.additions > 0 ? `+${stats.additions}` : null,
+		stats.deletions > 0 ? `-${stats.deletions}` : null,
 	].filter((part): part is string => part !== null).join(" ")
 }
 
-const estimatedWrappedLineCount = (text: string, width: number, wrapMode: "none" | "word") => {
+export const getDiffCommentAnchors = (file: DiffFilePatch, view: DiffView = "unified", wrapMode: DiffWrapMode = "none", width = 120): readonly DiffCommentAnchor[] => {
+	const anchors: DiffCommentAnchor[] = []
+	const lines = file.patch.split("\n")
+	const contentWidth = diffContentWidth(lines, view, width)
+	let oldLine = 0
+	let newLine = 0
+	let renderLine = 0
+	let inHunk = false
+	let deletions: Array<PendingDiffCommentAnchor & { readonly height: number }> = []
+	let additions: Array<PendingDiffCommentAnchor & { readonly height: number }> = []
+
+	const flushChangeBlock = () => {
+		if (deletions.length === 0 && additions.length === 0) return
+		if (view === "split") {
+			const rowCount = Math.max(deletions.length, additions.length)
+			for (let index = 0; index < rowCount; index++) {
+				const deletion = deletions[index]
+				const addition = additions[index]
+				if (deletion) anchors.push({ path: deletion.path, line: deletion.line, side: deletion.side, kind: deletion.kind, text: deletion.text, renderLine })
+				if (addition) anchors.push({ path: addition.path, line: addition.line, side: addition.side, kind: addition.kind, text: addition.text, renderLine })
+				renderLine += Math.max(deletion?.height ?? 1, addition?.height ?? 1)
+			}
+		} else {
+			for (const deletion of deletions) {
+				anchors.push({ path: deletion.path, line: deletion.line, side: deletion.side, kind: deletion.kind, text: deletion.text, renderLine })
+				renderLine += deletion.height
+			}
+			for (const addition of additions) {
+				anchors.push({ path: addition.path, line: addition.line, side: addition.side, kind: addition.kind, text: addition.text, renderLine })
+				renderLine += addition.height
+			}
+		}
+		deletions = []
+		additions = []
+	}
+
+	for (const line of lines) {
+		const hunk = line.match(hunkHeaderPattern)
+		if (hunk) {
+			flushChangeBlock()
+			oldLine = Number(hunk[1])
+			newLine = Number(hunk[3])
+			inHunk = true
+			continue
+		}
+
+		if (!inHunk) continue
+
+		const firstChar = line[0]
+		if (firstChar === "\\") continue
+
+		if (firstChar === "+") {
+			const text = line.slice(1)
+			additions.push({ path: file.name, line: newLine, side: "RIGHT", kind: "addition", text, height: estimatedWrappedLineCount(text, contentWidth, wrapMode) })
+			newLine++
+			continue
+		}
+
+		if (firstChar === "-") {
+			const text = line.slice(1)
+			deletions.push({ path: file.name, line: oldLine, side: "LEFT", kind: "deletion", text, height: estimatedWrappedLineCount(text, contentWidth, wrapMode) })
+			oldLine++
+			continue
+		}
+
+		if (firstChar === " ") {
+			flushChangeBlock()
+			const text = line.slice(1)
+			anchors.push({ path: file.name, line: newLine, side: "RIGHT", kind: "context", renderLine, text })
+			oldLine++
+			newLine++
+			renderLine += estimatedWrappedLineCount(text, contentWidth, wrapMode)
+		}
+	}
+
+	flushChangeBlock()
+	return anchors
+}
+
+export const getStackedDiffCommentAnchors = (
+	stackedFiles: readonly StackedDiffFilePatch[],
+	view: DiffView = "unified",
+	wrapMode: DiffWrapMode = "none",
+	width = 120,
+): readonly StackedDiffCommentAnchor[] =>
+	stackedFiles.flatMap((stackedFile) => getDiffCommentAnchors(stackedFile.file, view, wrapMode, width).map((anchor) => ({
+		...anchor,
+		fileIndex: stackedFile.index,
+		localRenderLine: anchor.renderLine,
+		renderLine: stackedFile.diffStartLine + anchor.renderLine,
+	})))
+
+export const nearestDiffCommentAnchorIndex = (anchors: readonly DiffCommentAnchor[], renderLine: number) => {
+	if (anchors.length === 0) return 0
+	const nextIndex = anchors.findIndex((anchor) => anchor.renderLine >= renderLine)
+	return nextIndex >= 0 ? nextIndex : anchors.length - 1
+}
+
+export const scrollTopForVisibleLine = (currentTop: number, viewportHeight: number, line: number, margin = 1) => {
+	const safeViewportHeight = Math.max(1, viewportHeight)
+	if (line < currentTop + margin) return Math.max(0, line - margin)
+	if (line >= currentTop + safeViewportHeight - margin) return Math.max(0, line - safeViewportHeight + margin + 1)
+	return currentTop
+}
+
+const estimatedWrappedLineCount = (text: string, width: number, wrapMode: DiffWrapMode) => {
 	if (wrapMode === "none") return 1
 	return Math.max(1, Math.ceil(Bun.stringWidth(text) / Math.max(1, width)))
 }
@@ -166,10 +382,10 @@ const patchLineNumberGutterWidth = (lines: readonly string[]) => {
 	let newLine = 0
 
 	for (const line of lines) {
-		const hunk = line.match(/^@@ -(\d+)(?:,\d+)? \+(\d+)(?:,\d+)? @@/)
+		const hunk = line.match(hunkHeaderPattern)
 		if (hunk) {
 			oldLine = Number(hunk[1])
-			newLine = Number(hunk[2])
+			newLine = Number(hunk[3])
 			maxLineNumber = Math.max(maxLineNumber, oldLine, newLine)
 			continue
 		}
@@ -194,12 +410,9 @@ const patchLineNumberGutterWidth = (lines: readonly string[]) => {
 	return Math.max(3, digits + 2) + (hasSigns ? 2 : 0)
 }
 
-export const patchRenderableLineCount = (patch: string, view: "unified" | "split", wrapMode: "none" | "word", width: number) => {
+export const patchRenderableLineCount = (patch: string, view: DiffView, wrapMode: DiffWrapMode, width: number) => {
 	const lines = patch.split("\n")
-	const lineNumberGutterWidth = patchLineNumberGutterWidth(lines)
-	const splitPaneWidth = Math.max(1, Math.floor(width / 2) - lineNumberGutterWidth)
-	const unifiedPaneWidth = Math.max(1, width - lineNumberGutterWidth)
-	const contentWidth = view === "split" ? splitPaneWidth : unifiedPaneWidth
+	const contentWidth = diffContentWidth(lines, view, width)
 	let count = 0
 	let inHunk = false
 	let deletions: number[] = []