diffity 0.1.0

package/packages/ui/src/lib/api.ts

@@ -0,0 +1,232 @@
+import type { ParsedDiff } from '@diffity/parser';
+import type { CommentThread, CommentAuthor, CommentSide, Comment } from '../types/comment';
+
+export interface RepoInfo {
+  name: string;
+  branch: string;
+  root: string;
+  description: string;
+  capabilities?: { reviews: boolean };
+  sessionId?: string | null;
+}
+
+export interface Commit {
+  hash: string;
+  shortHash: string;
+  message: string;
+  relativeDate: string;
+}
+
+export interface OverviewFile {
+  path: string;
+  status: 'staged' | 'modified' | 'added';
+}
+
+export interface Overview {
+  files: OverviewFile[];
+}
+
+export interface CommitsPage {
+  commits: Commit[];
+  hasMore: boolean;
+}
+
+export async function fetchDiff(hideWhitespace: boolean, ref?: string): Promise<ParsedDiff> {
+  const params = new URLSearchParams();
+  if (hideWhitespace) {
+    params.set('whitespace', 'hide');
+  }
+  if (ref) {
+    params.set('ref', ref);
+  }
+  const query = params.toString();
+  const url = query ? `/api/diff?${query}` : '/api/diff';
+  const res = await fetch(url);
+  if (!res.ok) {
+    throw new Error(`HTTP ${res.status}`);
+  }
+  return res.json();
+}
+
+export async function fetchDiffFingerprint(ref?: string): Promise<string> {
+  const params = new URLSearchParams();
+  if (ref) {
+    params.set('ref', ref);
+  }
+  const query = params.toString();
+  const url = query ? `/api/diff-fingerprint?${query}` : '/api/diff-fingerprint';
+  const res = await fetch(url);
+  if (!res.ok) {
+    throw new Error(`HTTP ${res.status}`);
+  }
+  const json = await res.json();
+  return json.fingerprint;
+}
+
+export async function fetchRepoInfo(ref?: string): Promise<RepoInfo> {
+  const params = new URLSearchParams();
+  if (ref) {
+    params.set('ref', ref);
+  }
+  const query = params.toString();
+  const url = query ? `/api/info?${query}` : '/api/info';
+  const res = await fetch(url);
+  if (!res.ok) {
+    throw new Error(`HTTP ${res.status}`);
+  }
+  return res.json();
+}
+
+export async function fetchOverview(): Promise<Overview> {
+  const res = await fetch('/api/overview');
+  if (!res.ok) {
+    throw new Error(`HTTP ${res.status}`);
+  }
+  return res.json();
+}
+
+export async function fetchCommits(skip = 0, count = 10, search?: string): Promise<CommitsPage> {
+  const params = new URLSearchParams({ skip: String(skip), count: String(count) });
+  if (search) {
+    params.set('search', search);
+  }
+  const res = await fetch(`/api/commits?${params}`);
+  if (!res.ok) {
+    throw new Error(`HTTP ${res.status}`);
+  }
+  return res.json();
+}
+
+export async function fetchSession(): Promise<{ id: string; ref: string; headHash: string } | null> {
+  const res = await fetch('/api/sessions/current');
+  if (!res.ok) {
+    return null;
+  }
+  return res.json();
+}
+
+export async function fetchThreads(sessionId: string, status?: string): Promise<CommentThread[]> {
+  const params = new URLSearchParams({ session: sessionId });
+  if (status) {
+    params.set('status', status);
+  }
+  const res = await fetch(`/api/threads?${params}`);
+  if (!res.ok) {
+    return [];
+  }
+  return res.json();
+}
+
+export async function createThread(data: {
+  sessionId: string;
+  filePath: string;
+  side: CommentSide;
+  startLine: number;
+  endLine: number;
+  body: string;
+  author: CommentAuthor;
+  anchorContent?: string;
+}): Promise<CommentThread> {
+  const res = await fetch('/api/threads', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify(data),
+  });
+  if (!res.ok) {
+    throw new Error(`HTTP ${res.status}`);
+  }
+  return res.json();
+}
+
+export async function replyToThread(threadId: string, body: string, author: CommentAuthor): Promise<Comment> {
+  const res = await fetch(`/api/threads/${threadId}/reply`, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ body, author }),
+  });
+  if (!res.ok) {
+    throw new Error(`HTTP ${res.status}`);
+  }
+  return res.json();
+}
+
+export async function updateThreadStatus(threadId: string, status: string, summary?: string): Promise<void> {
+  const res = await fetch(`/api/threads/${threadId}/status`, {
+    method: 'PATCH',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ status, summary }),
+  });
+  if (!res.ok) {
+    throw new Error(`HTTP ${res.status}`);
+  }
+}
+
+export async function deleteAllThreads(sessionId: string): Promise<void> {
+  const res = await fetch('/api/threads', {
+    method: 'DELETE',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ sessionId }),
+  });
+  if (!res.ok) {
+    throw new Error(`HTTP ${res.status}`);
+  }
+}
+
+export async function deleteThread(threadId: string): Promise<void> {
+  const res = await fetch(`/api/threads/${threadId}`, {
+    method: 'DELETE',
+  });
+  if (!res.ok) {
+    throw new Error(`HTTP ${res.status}`);
+  }
+}
+
+export async function deleteComment(commentId: string): Promise<void> {
+  const res = await fetch(`/api/comments/${commentId}`, {
+    method: 'DELETE',
+  });
+  if (!res.ok) {
+    throw new Error(`HTTP ${res.status}`);
+  }
+}
+
+export async function revertFile(filePath: string, isUntracked: boolean): Promise<void> {
+  const res = await fetch('/api/revert-file', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ filePath, isUntracked }),
+  });
+  if (!res.ok) {
+    const json = await res.json().catch(() => ({ error: `HTTP ${res.status}` }));
+    throw new Error(json.error || `HTTP ${res.status}`);
+  }
+}
+
+export async function revertHunk(patch: string): Promise<void> {
+  const res = await fetch('/api/revert-hunk', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ patch }),
+  });
+  if (!res.ok) {
+    const json = await res.json().catch(() => ({ error: `HTTP ${res.status}` }));
+    throw new Error(json.error || `HTTP ${res.status}`);
+  }
+}
+
+export async function fetchFileContent(filePath: string, ref?: string): Promise<string[]> {
+  const params = new URLSearchParams();
+  if (ref) {
+    params.set('ref', ref);
+  }
+  const query = params.toString();
+  const url = query
+    ? `/api/file/${encodeURIComponent(filePath)}?${query}`
+    : `/api/file/${encodeURIComponent(filePath)}`;
+  const res = await fetch(url);
+  if (!res.ok) {
+    throw new Error(`HTTP ${res.status}`);
+  }
+  const json = await res.json();
+  return json.content as string[];
+}

package/packages/ui/src/lib/cn.ts

@@ -0,0 +1,6 @@
+import { clsx, type ClassValue } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}

package/packages/ui/src/lib/context-expansion.ts

@@ -0,0 +1,122 @@
+import type { DiffHunk, DiffLine } from '@diffity/parser';
+
+const EXPAND_CHUNK_SIZE = 20;
+
+export interface ExpandableGap {
+  id: string;
+  position: 'top' | 'between' | 'bottom';
+  oldStart: number;
+  oldEnd: number;
+  newStart: number;
+  newEnd: number;
+  totalLines: number;
+}
+
+export function computeGaps(hunks: DiffHunk[], fileLineCount: number | null): ExpandableGap[] {
+  if (hunks.length === 0) {
+    return [];
+  }
+
+  const gaps: ExpandableGap[] = [];
+
+  const firstHunk = hunks[0];
+  if (firstHunk.oldStart > 1) {
+    const hiddenLines = firstHunk.oldStart - 1;
+    gaps.push({
+      id: 'top',
+      position: 'top',
+      oldStart: 1,
+      oldEnd: firstHunk.oldStart - 1,
+      newStart: 1,
+      newEnd: firstHunk.newStart - 1,
+      totalLines: hiddenLines,
+    });
+  }
+
+  for (let i = 0; i < hunks.length - 1; i++) {
+    const current = hunks[i];
+    const next = hunks[i + 1];
+    const currentEnd = current.oldStart + current.oldCount;
+    const nextStart = next.oldStart;
+    const hiddenLines = nextStart - currentEnd;
+
+    if (hiddenLines > 0) {
+      const currentNewEnd = current.newStart + current.newCount;
+      gaps.push({
+        id: `between-${i}`,
+        position: 'between',
+        oldStart: currentEnd,
+        oldEnd: nextStart - 1,
+        newStart: currentNewEnd,
+        newEnd: next.newStart - 1,
+        totalLines: hiddenLines,
+      });
+    }
+  }
+
+  const lastHunk = hunks[hunks.length - 1];
+  const lastOldEnd = lastHunk.oldStart + lastHunk.oldCount;
+  const lastNewEnd = lastHunk.newStart + lastHunk.newCount;
+
+  if (fileLineCount !== null) {
+    const remaining = fileLineCount - lastOldEnd + 1;
+
+    if (remaining > 0) {
+      gaps.push({
+        id: 'bottom',
+        position: 'bottom',
+        oldStart: lastOldEnd,
+        oldEnd: fileLineCount,
+        newStart: lastNewEnd,
+        newEnd: lastNewEnd + remaining - 1,
+        totalLines: remaining,
+      });
+    }
+  }
+
+  return gaps;
+}
+
+export function createContextLines(
+  fileLines: string[],
+  oldStart: number,
+  oldEnd: number,
+  newOffset: number
+): DiffLine[] {
+  const lines: DiffLine[] = [];
+  for (let i = oldStart; i <= oldEnd; i++) {
+    const content = fileLines[i - 1] ?? '';
+    lines.push({
+      type: 'context',
+      content,
+      oldLineNumber: i,
+      newLineNumber: i + newOffset,
+    });
+  }
+  return lines;
+}
+
+export function getExpandRange(
+  gap: ExpandableGap,
+  direction: 'up' | 'down' | 'all',
+  alreadyExpanded: { fromTop: number; fromBottom: number }
+): { oldStart: number; oldEnd: number } | null {
+  const remainingStart = gap.oldStart + alreadyExpanded.fromTop;
+  const remainingEnd = gap.oldEnd - alreadyExpanded.fromBottom;
+
+  if (remainingStart > remainingEnd) {
+    return null;
+  }
+
+  const remaining = remainingEnd - remainingStart + 1;
+
+  if (direction === 'all' || remaining <= EXPAND_CHUNK_SIZE) {
+    return { oldStart: remainingStart, oldEnd: remainingEnd };
+  }
+
+  if (direction === 'down') {
+    return { oldStart: remainingStart, oldEnd: Math.min(remainingStart + EXPAND_CHUNK_SIZE - 1, remainingEnd) };
+  }
+
+  return { oldStart: Math.max(remainingEnd - EXPAND_CHUNK_SIZE + 1, remainingStart), oldEnd: remainingEnd };
+}

package/packages/ui/src/lib/diff-utils.ts

@@ -0,0 +1,268 @@
+import type { DiffFile, DiffHunk } from '@diffity/parser';
+import type { CommentSide } from '../types/comment';
+
+export type ViewMode = 'unified' | 'split';
+
+const WORKING_TREE_REFS = new Set(['work', 'staged', 'unstaged', 'working', 'untracked']);
+
+export function isWorkingTreeRef(ref?: string): boolean {
+  return !!ref && WORKING_TREE_REFS.has(ref);
+}
+
+export function getFilePath(file: DiffFile): string {
+  if (file.status === 'deleted') {
+    return file.oldPath;
+  }
+  return file.newPath;
+}
+
+export function getLineBg(type: string): string {
+  switch (type) {
+    case 'add':
+      return 'bg-diff-add-bg';
+    case 'delete':
+      return 'bg-diff-del-bg';
+    default:
+      return 'bg-bg';
+  }
+}
+
+const LOCK_FILES = new Set([
+  'package-lock.json',
+  'pnpm-lock.yaml',
+  'pnpm-lock.yml',
+  'bun.lock',
+  'bun.lockb',
+  'yarn.lock',
+  'Cargo.lock',
+  'Gemfile.lock',
+  'composer.lock',
+  'poetry.lock',
+  'Pipfile.lock',
+  'go.sum',
+  'flake.lock',
+  'pubspec.lock',
+  'Podfile.lock',
+  'packages.lock.json',
+  'project.assets.json',
+  'paket.lock',
+  'pnpm-workspace.yaml',
+  'shrinkwrap.yaml',
+]);
+
+const GENERATED_EXTENSIONS = [
+  '.min.js',
+  '.min.css',
+  '.min.mjs',
+  '.bundle.js',
+  '.bundle.css',
+  '.chunk.js',
+  '.chunk.css',
+  '.generated.ts',
+  '.generated.js',
+  '.g.dart',
+  '.freezed.dart',
+  '.pb.go',
+  '.pb.ts',
+  '.pb.js',
+];
+
+const GENERATED_PATTERNS = [
+  /\.d\.ts$/,
+  /\.map$/,
+  /\.snap$/,
+  /dist\//,
+  /build\//,
+  /generated\//,
+  /__generated__\//,
+  /\.lock$/,
+];
+
+function isAutoCollapsible(file: DiffFile): boolean {
+  if (file.status === 'deleted' || file.status === 'renamed') {
+    return true;
+  }
+
+  const path = getFilePath(file);
+  const fileName = path.split('/').pop() || '';
+
+  if (LOCK_FILES.has(fileName)) {
+    return true;
+  }
+
+  const lowerPath = path.toLowerCase();
+  for (const ext of GENERATED_EXTENSIONS) {
+    if (lowerPath.endsWith(ext)) {
+      return true;
+    }
+  }
+
+  for (const pattern of GENERATED_PATTERNS) {
+    if (pattern.test(path)) {
+      return true;
+    }
+  }
+
+  return false;
+}
+
+export function getAutoCollapsedPaths(files: DiffFile[]): Set<string> {
+  const paths = new Set<string>();
+  for (const file of files) {
+    if (isAutoCollapsible(file)) {
+      paths.add(getFilePath(file));
+    }
+  }
+  return paths;
+}
+
+export function buildHunkPatch(file: DiffFile, hunk: DiffHunk): string {
+  const oldPath = file.status === 'added' ? '/dev/null' : `a/${file.oldPath}`;
+  const newPath = file.status === 'deleted' ? '/dev/null' : `b/${file.newPath}`;
+  const lines: string[] = [
+    `--- ${oldPath}`,
+    `+++ ${newPath}`,
+    hunk.header,
+  ];
+  for (const line of hunk.lines) {
+    const prefix = line.type === 'add' ? '+' : line.type === 'delete' ? '-' : ' ';
+    lines.push(`${prefix}${line.content}`);
+    if (line.noNewline) {
+      lines.push('\');
+    }
+  }
+  return lines.join('\n') + '\n';
+}
+
+export interface ChangeGroup {
+  startIndex: number;
+  endIndex: number;
+}
+
+export function getChangeGroups(lines: { type: string }[]): ChangeGroup[] {
+  const groups: ChangeGroup[] = [];
+  let i = 0;
+  while (i < lines.length) {
+    if (lines[i].type !== 'context') {
+      const start = i;
+      while (i < lines.length && lines[i].type !== 'context') {
+        i++;
+      }
+      groups.push({ startIndex: start, endIndex: i - 1 });
+    } else {
+      i++;
+    }
+  }
+  return groups;
+}
+
+export function buildChangeGroupPatch(file: DiffFile, hunk: DiffHunk, startIndex: number, endIndex: number): string {
+  const CONTEXT = 3;
+  const lines = hunk.lines;
+
+  const contextBefore: typeof lines = [];
+  for (let i = startIndex - 1; i >= Math.max(0, startIndex - CONTEXT); i--) {
+    if (lines[i].type === 'context') {
+      contextBefore.unshift(lines[i]);
+    } else {
+      break;
+    }
+  }
+
+  const changeLines = lines.slice(startIndex, endIndex + 1);
+
+  const contextAfter: typeof lines = [];
+  for (let i = endIndex + 1; i < Math.min(lines.length, endIndex + 1 + CONTEXT); i++) {
+    if (lines[i].type === 'context') {
+      contextAfter.push(lines[i]);
+    } else {
+      break;
+    }
+  }
+
+  const allLines = [...contextBefore, ...changeLines, ...contextAfter];
+
+  let oldStart = 0;
+  let oldCount = 0;
+  let newStart = 0;
+  let newCount = 0;
+
+  for (const line of allLines) {
+    if (line.oldLineNumber !== null && oldStart === 0) {
+      oldStart = line.oldLineNumber;
+    }
+    if (line.newLineNumber !== null && newStart === 0) {
+      newStart = line.newLineNumber;
+    }
+    if (line.type === 'context' || line.type === 'delete') {
+      oldCount++;
+    }
+    if (line.type === 'context' || line.type === 'add') {
+      newCount++;
+    }
+  }
+
+  if (oldStart === 0) {
+    oldStart = hunk.oldStart;
+  }
+  if (newStart === 0) {
+    newStart = hunk.newStart;
+  }
+
+  const oldPath = file.status === 'added' ? '/dev/null' : `a/${file.oldPath}`;
+  const newPath = file.status === 'deleted' ? '/dev/null' : `b/${file.newPath}`;
+  const header = `@@ -${oldStart},${oldCount} +${newStart},${newCount} @@`;
+
+  const patchLines: string[] = [
+    `--- ${oldPath}`,
+    `+++ ${newPath}`,
+    header,
+  ];
+
+  for (const line of allLines) {
+    const prefix = line.type === 'add' ? '+' : line.type === 'delete' ? '-' : ' ';
+    patchLines.push(`${prefix}${line.content}`);
+    if (line.noNewline) {
+      patchLines.push('\');
+    }
+  }
+
+  return patchLines.join('\n') + '\n';
+}
+
+
+export function extractLinesFromDiff(
+  hunks: DiffHunk[],
+  side: CommentSide,
+  startLine: number,
+  endLine: number,
+): string {
+  const result: string[] = [];
+  for (const hunk of hunks) {
+    for (const line of hunk.lines) {
+      const lineNum = side === 'old' ? line.oldLineNumber : line.newLineNumber;
+      if (lineNum === null || lineNum < startLine || lineNum > endLine) {
+        continue;
+      }
+      if (side === 'old' && (line.type === 'delete' || line.type === 'context')) {
+        result.push(line.content);
+      } else if (side === 'new' && (line.type === 'add' || line.type === 'context')) {
+        result.push(line.content);
+      }
+    }
+  }
+  return result.join('\n');
+}
+
+export function getStatusColor(status: string): string {
+  switch (status) {
+    case 'added':
+      return 'bg-added/15 text-added';
+    case 'deleted':
+      return 'bg-deleted/15 text-deleted';
+    case 'renamed':
+      return 'bg-renamed/15 text-renamed';
+    default:
+      return 'bg-modified/15 text-modified';
+  }
+}

package/packages/ui/src/lib/dom-utils.ts

@@ -0,0 +1,13 @@
+export function getFileBlocks(): HTMLElement[] {
+  return Array.from(document.querySelectorAll('[id^="file-"]'));
+}
+
+export function getHunkHeaders(): HTMLElement[] {
+  return Array.from(
+    document.querySelectorAll('tbody > tr:first-child')
+  );
+}
+
+export function scrollToElement(el: HTMLElement) {
+  el.scrollIntoView({ behavior: 'instant', block: 'start' });
+}