BranchDiff

1"use client";
2 
3import {
4  Alert02Icon,
5  ArrowDown01Icon,
6  ArrowRight01Icon,
7  GitBranchIcon,
8  Search01Icon,
9  Table01Icon,
10} from "@hugeicons/core-free-icons";
11import { HugeiconsIcon } from "@hugeicons/react";
12import { diffWordsWithSpace } from "diff";
13import { useMemo, useState } from "react";
14 
15import {
16  Tabs,
17  TabsContent,
18  TabsIndicator,
19  TabsList,
20  TabsTrigger,
21} from "@/components/ui/tabs";
22import { cn } from "@/lib/utils";
23 
24type ChangeKind = "added" | "removed" | "modified";
25type DiffTab = "schema" | "data";
26type DiffValue = boolean | number | string | null;
27 
28interface BranchDiffBranch {
29  id: string;
30  name: string;
31}
32 
33interface SchemaChange {
34  id: string;
35  kind: ChangeKind;
36  objectType: "table" | "column" | "index" | "constraint";
37  path: string[];
38  before?: string;
39  after?: string;
40  ddl?: string;
41  breaking?: boolean;
42}
43 
44interface RowChange {
45  id: string;
46  kind: ChangeKind;
47  primaryKey: Record<string, DiffValue>;
48  before?: Record<string, DiffValue>;
49  after?: Record<string, DiffValue>;
50}
51 
52interface TableDataDiff {
53  id: string;
54  schema: string;
55  table: string;
56  primaryKey: string[];
57  rows: RowChange[];
58  addedCount: number;
59  removedCount: number;
60  modifiedCount: number;
61  unchangedCount?: number;
62  hasMore?: boolean;
63}
64 
65interface BranchDiffProps {
66  from: BranchDiffBranch;
67  to: BranchDiffBranch;
68  schemaChanges: SchemaChange[];
69  dataDiffs: TableDataDiff[];
70  tab?: DiffTab;
71  defaultTab?: DiffTab;
72  onTabChange?: (tab: DiffTab) => void;
73  onLoadMore?: (table: TableDataDiff) => void | Promise<void>;
74  loadingTableId?: string | null;
75  isLoading?: boolean;
76  error?: Error | string | null;
77  className?: string;
78}
79 
80const KIND = {
81  added: {
82    className: "text-[var(--status-active)]",
83    label: "Added",
84    surface: "bg-[var(--status-active)]/8",
85    symbol: "+",
86  },
87  modified: {
88    className: "text-[var(--status-scaling)]",
89    label: "Modified",
90    surface: "bg-[var(--status-scaling)]/8",
91    symbol: "~",
92  },
93  removed: {
94    className: "text-destructive",
95    label: "Removed",
96    surface: "bg-destructive/7",
97    symbol: "−",
98  },
99} satisfies Record<ChangeKind, Record<string, string>>;
100 
101const countSchemaKinds = (changes: SchemaChange[]) => ({
102  added: changes.filter((change) => change.kind === "added").length,
103  modified: changes.filter((change) => change.kind === "modified").length,
104  removed: changes.filter((change) => change.kind === "removed").length,
105});
106 
107const countDataKinds = (tables: TableDataDiff[]) => {
108// … truncated