@anymux/connect 0.1.0

package/dist/GitBrowser-BLgTNQyd.js

@@ -0,0 +1,905 @@
+import { flow, makeAutoObservable } from "mobx";
+import { toast } from "sonner";
+import React, { Suspense, useCallback, useEffect, useRef, useState } from "react";
+import { observer } from "mobx-react-lite";
+import { AlertCircle, Check, ChevronDown, ChevronLeft, ChevronRight, Diff, FolderTree, GitBranch, GitCommit, GitPullRequest, Loader2, Tag } from "lucide-react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { BrowserError } from "@anymux/ui/components/browser-error";
+
+//#region src/models/GitRepoBrowserModel.ts
+const HOST_PAGE_SIZE = 25;
+const COMMITS_PAGE_SIZE = 25;
+var GitRepoBrowserModel = class {
+	constructor(gitRepo, _gitHost, createFileSystem, onError) {
+		this.gitRepo = gitRepo;
+		this._gitHost = _gitHost;
+		this.createFileSystem = createFileSystem;
+		this.onError = onError;
+		this.branches = [];
+		this.tags = [];
+		this.currentRef = "";
+		this.fileSystem = null;
+		this.loading = true;
+		this.error = null;
+		this.activeTab = "files";
+		this.commits = [];
+		this.commitsLoading = false;
+		this.commitsPage = 0;
+		this.hasMoreCommits = false;
+		this.selectedCommitSha = void 0;
+		this.diffEntries = [];
+		this.diffLoading = false;
+		this.prs = [];
+		this.issues = [];
+		this.hostLoading = false;
+		this.hostError = null;
+		this.prPage = 0;
+		this.issuePage = 0;
+		this.hasMorePrs = false;
+		this.hasMoreIssues = false;
+		this.initialize = flow(function* () {
+			this.loading = true;
+			this.error = null;
+			try {
+				const [branchList, tagList] = yield Promise.all([this.gitRepo.listBranches(), this.gitRepo.listTags().catch(() => [])]);
+				this.branches = branchList;
+				this.tags = tagList;
+				const defaultBranch = branchList.find((b) => b.isDefault);
+				const initialRef = defaultBranch?.name ?? branchList[0]?.name ?? "main";
+				this.currentRef = initialRef;
+				const fs = yield this.createFileSystem(initialRef);
+				this.fileSystem = fs;
+			} catch (err) {
+				const msg = err instanceof Error ? err.message : "Failed to load repository";
+				this.error = msg;
+				this.onError?.({ message: msg });
+			} finally {
+				this.loading = false;
+			}
+		});
+		this.switchRef = flow(function* (ref) {
+			if (ref === this.currentRef) return;
+			this.currentRef = ref;
+			this.loading = true;
+			this.error = null;
+			this.selectedCommitSha = void 0;
+			this.diffEntries = [];
+			this.commitsPage = 0;
+			try {
+				const fs = yield this.createFileSystem(ref);
+				this.fileSystem = fs;
+			} catch (err) {
+				const msg = err instanceof Error ? err.message : "Failed to switch ref";
+				this.error = msg;
+				this.onError?.({ message: msg });
+			} finally {
+				this.loading = false;
+			}
+			if (this.activeTab === "commits") this.loadCommits();
+		});
+		this.loadCommits = flow(function* () {
+			if (!this.currentRef) return;
+			this.commitsLoading = true;
+			try {
+				const fetchCount = COMMITS_PAGE_SIZE * (this.commitsPage + 1);
+				const commitList = yield this.gitRepo.listCommits({
+					ref: this.currentRef,
+					maxCount: fetchCount + 1
+				});
+				const start = this.commitsPage * COMMITS_PAGE_SIZE;
+				this.commits = commitList.slice(start, start + COMMITS_PAGE_SIZE);
+				this.hasMoreCommits = commitList.length > start + COMMITS_PAGE_SIZE;
+			} catch (err) {
+				console.error("[GitRepoBrowserModel] Failed to load commits:", err);
+				this.commits = [];
+				this.hasMoreCommits = false;
+			} finally {
+				this.commitsLoading = false;
+			}
+		});
+		this.selectCommit = flow(function* (commit) {
+			this.selectedCommitSha = commit.sha;
+			if (commit.parents.length === 0) {
+				this.diffEntries = [];
+				return;
+			}
+			this.diffLoading = true;
+			try {
+				const entries = yield this.gitRepo.diff(commit.parents[0], commit.sha);
+				this.diffEntries = entries;
+			} catch {
+				this.diffEntries = [];
+			} finally {
+				this.diffLoading = false;
+			}
+		});
+		this.loadPRs = flow(function* () {
+			if (!this._gitHost) return;
+			this.hostLoading = true;
+			this.hostError = null;
+			try {
+				const data = yield this._gitHost.listPullRequests({
+					state: "all",
+					maxResults: HOST_PAGE_SIZE * (this.prPage + 1)
+				});
+				const start = this.prPage * HOST_PAGE_SIZE;
+				this.prs = data.slice(start, start + HOST_PAGE_SIZE);
+				this.hasMorePrs = data.length > start + HOST_PAGE_SIZE;
+			} catch (err) {
+				this.hostError = err instanceof Error ? err.message : "Failed to load";
+			} finally {
+				this.hostLoading = false;
+			}
+		});
+		this.loadIssues = flow(function* () {
+			if (!this._gitHost) return;
+			this.hostLoading = true;
+			this.hostError = null;
+			try {
+				const data = yield this._gitHost.listIssues({
+					state: "all",
+					maxResults: HOST_PAGE_SIZE * (this.issuePage + 1)
+				});
+				const start = this.issuePage * HOST_PAGE_SIZE;
+				this.issues = data.slice(start, start + HOST_PAGE_SIZE);
+				this.hasMoreIssues = data.length > start + HOST_PAGE_SIZE;
+			} catch (err) {
+				this.hostError = err instanceof Error ? err.message : "Failed to load";
+			} finally {
+				this.hostLoading = false;
+			}
+		});
+		makeAutoObservable(this, {});
+	}
+	/** Update the gitHost adapter (e.g. when loaded asynchronously after construction) */
+	setGitHost(host) {
+		this._gitHost = host;
+	}
+	get headSha() {
+		return this.branches.find((b) => b.name === this.currentRef)?.sha;
+	}
+	get hasGitHost() {
+		return !!this._gitHost;
+	}
+	setActiveTab(tab) {
+		this.activeTab = tab;
+		if (tab === "commits" && this.currentRef) this.loadCommits();
+		else if (tab === "prs" && this._gitHost) this.loadPRs();
+		else if (tab === "issues" && this._gitHost) this.loadIssues();
+	}
+	nextCommitsPage() {
+		this.commitsPage += 1;
+		this.loadCommits();
+	}
+	prevCommitsPage() {
+		this.commitsPage = Math.max(0, this.commitsPage - 1);
+		this.loadCommits();
+	}
+	nextPrPage() {
+		this.prPage += 1;
+		this.loadPRs();
+	}
+	prevPrPage() {
+		this.prPage = Math.max(0, this.prPage - 1);
+		this.loadPRs();
+	}
+	nextIssuePage() {
+		this.issuePage += 1;
+		this.loadIssues();
+	}
+	prevIssuePage() {
+		this.issuePage = Math.max(0, this.issuePage - 1);
+		this.loadIssues();
+	}
+	retryPRs() {
+		this.hostError = null;
+		this.prPage = 0;
+		this.loadPRs();
+	}
+	retryIssues() {
+		this.hostError = null;
+		this.issuePage = 0;
+		this.loadIssues();
+	}
+	selectBranch(branch) {
+		this.switchRef(branch.name);
+	}
+};
+
+//#endregion
+//#region src/models/GitHostBrowserModel.ts
+const PAGE_SIZE = 25;
+var GitHostBrowserModel = class {
+	constructor(gitHost) {
+		this.activeTab = "prs";
+		this.prs = [];
+		this.issues = [];
+		this.hasMorePrs = false;
+		this.hasMoreIssues = false;
+		this.page = 0;
+		this.loading = false;
+		this.error = null;
+		this.loadData = flow(function* loadData() {
+			this.loading = true;
+			this.error = null;
+			try {
+				if (this.activeTab === "prs") {
+					const data = yield this.gitHost.listPullRequests({
+						state: "all",
+						maxResults: PAGE_SIZE * (this.page + 1)
+					});
+					const start = this.page * PAGE_SIZE;
+					this.prs = data.slice(start, start + PAGE_SIZE);
+					this.hasMorePrs = data.length > start + PAGE_SIZE;
+				} else {
+					const data = yield this.gitHost.listIssues({
+						state: "all",
+						maxResults: PAGE_SIZE * (this.page + 1)
+					});
+					const start = this.page * PAGE_SIZE;
+					this.issues = data.slice(start, start + PAGE_SIZE);
+					this.hasMoreIssues = data.length > start + PAGE_SIZE;
+				}
+			} catch (err) {
+				this.error = err instanceof Error ? err.message : "Failed to load data";
+			} finally {
+				this.loading = false;
+			}
+		});
+		this.gitHost = gitHost;
+		makeAutoObservable(this, { gitHost: false });
+	}
+	get currentItems() {
+		return this.activeTab === "prs" ? this.prs : this.issues;
+	}
+	get hasMore() {
+		return this.activeTab === "prs" ? this.hasMorePrs : this.hasMoreIssues;
+	}
+	get showPagination() {
+		return this.page > 0 || this.hasMore;
+	}
+	setActiveTab(tab) {
+		this.activeTab = tab;
+		this.page = 0;
+		this.loadData();
+	}
+	nextPage() {
+		if (!this.hasMore) return;
+		this.page += 1;
+		this.loadData();
+	}
+	prevPage() {
+		if (this.page <= 0) return;
+		this.page -= 1;
+		this.loadData();
+	}
+	retry() {
+		this.error = null;
+		this.page = 0;
+		this.loadData();
+	}
+};
+
+//#endregion
+//#region src/utils/action-toast.ts
+/**
+* Show a toast notification for a user action, with optional undo.
+* Records the action in the ActionNotificationModel for history.
+*/
+function showActionToast(model, type, description, options) {
+	const actionId = model.record(type, description, options?.undo);
+	if (options?.undo) toast(description, {
+		duration: options.duration ?? 5e3,
+		action: {
+			label: "Undo",
+			onClick: async () => {
+				try {
+					await options.undo();
+					model.markUndone(actionId);
+					toast.success("Action undone");
+				} catch (err) {
+					toast.error(`Undo failed: ${err instanceof Error ? err.message : "Unknown error"}`);
+				}
+			}
+		}
+	});
+	else toast.success(description, { duration: options?.duration ?? 3e3 });
+	return actionId;
+}
+/** Show an error toast */
+function showErrorToast(message, context) {
+	toast.error(context ? `${context}: ${message}` : message);
+}
+/** Show an info toast */
+function showInfoToast(message) {
+	toast.info(message);
+}
+
+//#endregion
+//#region src/components/GitBrowser.tsx
+const FileBrowser = React.lazy(() => import("@anymux/fs-ui").then((m) => ({ default: m.FileBrowser })));
+const CommitList = React.lazy(() => import("@anymux/fs-ui").then((m) => ({ default: m.CommitList })));
+const BranchList = React.lazy(() => import("@anymux/fs-ui").then((m) => ({ default: m.BranchList })));
+const DiffViewer = React.lazy(() => import("@anymux/fs-ui").then((m) => ({ default: m.DiffViewer })));
+function formatRelativeTime(date) {
+	const now = Date.now();
+	const diffMs = now - new Date(date).getTime();
+	const seconds = Math.floor(diffMs / 1e3);
+	const minutes = Math.floor(seconds / 60);
+	const hours = Math.floor(minutes / 60);
+	const days = Math.floor(hours / 24);
+	const weeks = Math.floor(days / 7);
+	const months = Math.floor(days / 30);
+	if (seconds < 60) return "just now";
+	if (minutes < 60) return `${minutes}m ago`;
+	if (hours < 24) return `${hours}h ago`;
+	if (days < 7) return `${days}d ago`;
+	if (weeks < 5) return `${weeks}w ago`;
+	if (months < 12) return `${months}mo ago`;
+	return new Date(date).toLocaleDateString();
+}
+function LoadingSpinner() {
+	return /* @__PURE__ */ jsx("div", {
+		className: "flex items-center justify-center py-8",
+		children: /* @__PURE__ */ jsx(Loader2, { className: "h-5 w-5 text-gray-400 animate-spin" })
+	});
+}
+function RefSelector({ branches, tags, currentRef, onSelectRef }) {
+	const [isOpen, setIsOpen] = useState(false);
+	const [filterTab, setFilterTab] = useState("branches");
+	const [search, setSearch] = useState("");
+	const dropdownRef = useRef(null);
+	useEffect(() => {
+		function handleClickOutside(e) {
+			if (dropdownRef.current && !dropdownRef.current.contains(e.target)) setIsOpen(false);
+		}
+		if (isOpen) {
+			document.addEventListener("mousedown", handleClickOutside);
+			return () => document.removeEventListener("mousedown", handleClickOutside);
+		}
+	}, [isOpen]);
+	const items = filterTab === "branches" ? branches.map((b) => ({
+		type: "branch",
+		name: b.name,
+		sha: b.sha,
+		isDefault: b.isDefault
+	})) : tags.map((t) => ({
+		type: "tag",
+		name: t.name,
+		sha: t.sha
+	}));
+	const filtered = search ? items.filter((i) => i.name.toLowerCase().includes(search.toLowerCase())) : items;
+	return /* @__PURE__ */ jsxs("div", {
+		ref: dropdownRef,
+		className: "relative",
+		children: [/* @__PURE__ */ jsxs("button", {
+			onClick: () => setIsOpen(!isOpen),
+			className: "inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium rounded-md border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors",
+			children: [
+				/* @__PURE__ */ jsx(GitBranch, { className: "h-3.5 w-3.5 text-gray-500" }),
+				/* @__PURE__ */ jsx("span", {
+					className: "max-w-[160px] truncate",
+					title: currentRef,
+					children: currentRef
+				}),
+				/* @__PURE__ */ jsx(ChevronDown, { className: "h-3 w-3 text-gray-400" })
+			]
+		}), isOpen && /* @__PURE__ */ jsxs("div", {
+			className: "absolute left-0 top-full mt-1 z-50 w-72 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg shadow-lg overflow-hidden",
+			children: [
+				/* @__PURE__ */ jsx("div", {
+					className: "p-2 border-b border-gray-200 dark:border-gray-700",
+					children: /* @__PURE__ */ jsx("input", {
+						type: "text",
+						placeholder: "Filter branches/tags...",
+						value: search,
+						onChange: (e) => setSearch(e.target.value),
+						className: "w-full px-2.5 py-1.5 text-xs rounded-md border border-gray-200 dark:border-gray-600 bg-gray-50 dark:bg-gray-900 focus:outline-none focus:ring-1 focus:ring-blue-500",
+						autoFocus: true
+					})
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: "flex border-b border-gray-200 dark:border-gray-700",
+					children: [/* @__PURE__ */ jsxs("button", {
+						onClick: () => {
+							setFilterTab("branches");
+							setSearch("");
+						},
+						className: `flex-1 flex items-center justify-center gap-1.5 px-3 py-1.5 text-xs font-medium transition-colors ${filterTab === "branches" ? "border-b-2 border-blue-500 text-blue-600 dark:text-blue-400" : "text-gray-500 hover:text-gray-700 dark:hover:text-gray-300"}`,
+						children: [/* @__PURE__ */ jsx(GitBranch, { className: "h-3 w-3" }), "Branches"]
+					}), /* @__PURE__ */ jsxs("button", {
+						onClick: () => {
+							setFilterTab("tags");
+							setSearch("");
+						},
+						className: `flex-1 flex items-center justify-center gap-1.5 px-3 py-1.5 text-xs font-medium transition-colors ${filterTab === "tags" ? "border-b-2 border-blue-500 text-blue-600 dark:text-blue-400" : "text-gray-500 hover:text-gray-700 dark:hover:text-gray-300"}`,
+						children: [/* @__PURE__ */ jsx(Tag, { className: "h-3 w-3" }), "Tags"]
+					})]
+				}),
+				/* @__PURE__ */ jsx("div", {
+					className: "max-h-64 overflow-auto",
+					children: filtered.length === 0 ? /* @__PURE__ */ jsx("div", {
+						className: "px-3 py-4 text-center text-xs text-gray-400",
+						children: search ? "No matches found" : `No ${filterTab} found`
+					}) : filtered.map((item) => /* @__PURE__ */ jsxs("button", {
+						onClick: () => {
+							onSelectRef(item.name, item.type);
+							setIsOpen(false);
+							setSearch("");
+						},
+						className: "flex items-center gap-2 w-full px-3 py-2 text-left hover:bg-gray-50 dark:hover:bg-gray-700/50 transition-colors",
+						children: [
+							/* @__PURE__ */ jsx("span", {
+								className: "w-4 flex-shrink-0",
+								children: item.name === currentRef && /* @__PURE__ */ jsx(Check, { className: "h-3.5 w-3.5 text-blue-500" })
+							}),
+							/* @__PURE__ */ jsx("span", {
+								className: "text-xs truncate flex-1",
+								title: item.name,
+								children: item.name
+							}),
+							item.isDefault && /* @__PURE__ */ jsx("span", {
+								className: "px-1.5 py-0.5 text-[9px] font-medium bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400 rounded flex-shrink-0",
+								children: "default"
+							})
+						]
+					}, `${item.type}-${item.name}`))
+				})
+			]
+		})]
+	});
+}
+const GitRepoBrowser = observer(({ gitRepo, owner, repo, createFileSystem, gitHost, onError, actionNotifications }) => {
+	const [model] = useState(() => new GitRepoBrowserModel(gitRepo, gitHost, createFileSystem, onError));
+	useEffect(() => {
+		if (gitHost && !model.hasGitHost) model.setGitHost(gitHost);
+	}, [gitHost, model]);
+	const handleNotify = useCallback((type, message) => {
+		if (type === "success" && actionNotifications) {
+			const actionType = message.startsWith("Renamed") ? "rename" : message.startsWith("Deleted") ? "delete" : message.startsWith("Created") ? "create" : message.startsWith("Uploaded") || message.includes("upload") ? "upload" : "create";
+			showActionToast(actionNotifications, actionType, message);
+		} else if (type === "error") showErrorToast(message);
+		else toast[type](message);
+	}, [actionNotifications]);
+	useEffect(() => {
+		model.initialize();
+	}, [model]);
+	if (model.loading && !model.fileSystem) return /* @__PURE__ */ jsx(LoadingSpinner, {});
+	if (model.error && !model.fileSystem) return /* @__PURE__ */ jsx(BrowserError, {
+		error: model.error,
+		context: `${owner}/${repo}`,
+		onRetry: () => window.location.reload()
+	});
+	const sidebarTabs = [
+		{
+			id: "files",
+			label: "Files",
+			icon: /* @__PURE__ */ jsx(FolderTree, { className: "h-3.5 w-3.5" })
+		},
+		{
+			id: "branches",
+			label: "Branches",
+			icon: /* @__PURE__ */ jsx(GitBranch, { className: "h-3.5 w-3.5" })
+		},
+		{
+			id: "commits",
+			label: "Commits",
+			icon: /* @__PURE__ */ jsx(GitCommit, { className: "h-3.5 w-3.5" })
+		},
+		...model.hasGitHost ? [{
+			id: "prs",
+			label: "PRs",
+			icon: /* @__PURE__ */ jsx(GitPullRequest, { className: "h-3.5 w-3.5" })
+		}, {
+			id: "issues",
+			label: "Issues",
+			icon: /* @__PURE__ */ jsx(AlertCircle, { className: "h-3.5 w-3.5" })
+		}] : []
+	];
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex flex-col h-full",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-3 px-3 py-2 border-b border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-800 flex-shrink-0",
+				children: [/* @__PURE__ */ jsx(RefSelector, {
+					branches: model.branches,
+					tags: model.tags,
+					currentRef: model.currentRef,
+					onSelectRef: (ref) => model.switchRef(ref)
+				}), /* @__PURE__ */ jsxs("div", {
+					className: "flex items-center gap-1.5 text-xs text-gray-500 dark:text-gray-400 min-w-0",
+					children: [
+						/* @__PURE__ */ jsx("span", {
+							className: "font-medium text-gray-700 dark:text-gray-300 truncate",
+							title: owner,
+							children: owner
+						}),
+						/* @__PURE__ */ jsx("span", { children: "/" }),
+						/* @__PURE__ */ jsx("span", {
+							className: "font-medium text-gray-700 dark:text-gray-300 truncate",
+							title: repo,
+							children: repo
+						})
+					]
+				})]
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: "flex border-b border-gray-200 dark:border-gray-700 flex-shrink-0",
+				children: sidebarTabs.map((tab) => /* @__PURE__ */ jsxs("button", {
+					onClick: () => model.setActiveTab(tab.id),
+					className: `flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium border-b-2 transition-colors ${model.activeTab === tab.id ? "border-blue-500 text-blue-600 dark:text-blue-400" : "border-transparent text-gray-500 hover:text-gray-700 dark:hover:text-gray-300"}`,
+					children: [tab.icon, tab.label]
+				}, tab.id))
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex-1 min-h-0 relative flex flex-col",
+				children: [
+					model.loading && /* @__PURE__ */ jsx("div", {
+						className: "absolute inset-0 bg-white/60 dark:bg-gray-900/60 z-10 flex items-center justify-center",
+						children: /* @__PURE__ */ jsx(Loader2, { className: "h-5 w-5 text-gray-400 animate-spin" })
+					}),
+					model.error && model.fileSystem && /* @__PURE__ */ jsx("div", {
+						className: "px-4 py-2 bg-red-50 dark:bg-red-900/20 text-xs text-red-600 dark:text-red-400 border-b border-red-200 dark:border-red-800 flex-shrink-0",
+						children: model.error
+					}),
+					model.activeTab === "files" && model.fileSystem && /* @__PURE__ */ jsx("div", {
+						className: "flex-1 min-h-0",
+						children: /* @__PURE__ */ jsx(Suspense, {
+							fallback: /* @__PURE__ */ jsx(LoadingSpinner, {}),
+							children: /* @__PURE__ */ jsx(FileBrowser, {
+								fileSystem: model.fileSystem,
+								className: "h-full",
+								onError,
+								onNotify: handleNotify
+							}, model.currentRef)
+						})
+					}),
+					model.activeTab === "branches" && /* @__PURE__ */ jsx("div", {
+						className: "flex-1 min-h-0",
+						children: /* @__PURE__ */ jsx(Suspense, {
+							fallback: /* @__PURE__ */ jsx(LoadingSpinner, {}),
+							children: /* @__PURE__ */ jsx(BranchList, {
+								branches: model.branches,
+								currentBranch: model.currentRef,
+								onSelectBranch: (branch) => model.selectBranch(branch),
+								className: "h-full"
+							})
+						})
+					}),
+					model.activeTab === "commits" && /* @__PURE__ */ jsx("div", {
+						className: "flex-1 min-h-0 flex flex-col",
+						children: model.commitsLoading ? /* @__PURE__ */ jsx(LoadingSpinner, {}) : /* @__PURE__ */ jsxs(Fragment, { children: [
+							/* @__PURE__ */ jsx(Suspense, {
+								fallback: /* @__PURE__ */ jsx(LoadingSpinner, {}),
+								children: /* @__PURE__ */ jsx(CommitList, {
+									commits: model.commits,
+									headSha: model.headSha,
+									selectedSha: model.selectedCommitSha,
+									onSelectCommit: (commit) => model.selectCommit(commit),
+									className: model.selectedCommitSha ? "max-h-[50%] overflow-auto flex-shrink-0" : "flex-1 overflow-auto"
+								})
+							}),
+							(model.commitsPage > 0 || model.hasMoreCommits) && /* @__PURE__ */ jsxs("div", {
+								className: "flex items-center justify-between px-4 py-2 border-t border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-800 flex-shrink-0",
+								children: [
+									/* @__PURE__ */ jsxs("button", {
+										onClick: () => model.prevCommitsPage(),
+										disabled: model.commitsPage === 0,
+										className: "inline-flex items-center gap-1 px-2.5 py-1 text-xs font-medium rounded-md border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors disabled:opacity-50 disabled:pointer-events-none",
+										children: [/* @__PURE__ */ jsx(ChevronLeft, { className: "h-3.5 w-3.5" }), " Previous"]
+									}),
+									/* @__PURE__ */ jsxs("span", {
+										className: "text-xs text-gray-500",
+										children: ["Page ", model.commitsPage + 1]
+									}),
+									/* @__PURE__ */ jsxs("button", {
+										onClick: () => model.nextCommitsPage(),
+										disabled: !model.hasMoreCommits,
+										className: "inline-flex items-center gap-1 px-2.5 py-1 text-xs font-medium rounded-md border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors disabled:opacity-50 disabled:pointer-events-none",
+										children: ["Next ", /* @__PURE__ */ jsx(ChevronRight, { className: "h-3.5 w-3.5" })]
+									})
+								]
+							}),
+							model.selectedCommitSha && /* @__PURE__ */ jsxs("div", {
+								className: "flex-1 min-h-0 border-t border-gray-200 dark:border-gray-700 overflow-auto",
+								children: [/* @__PURE__ */ jsxs("div", {
+									className: "flex items-center gap-2 px-3 py-1.5 bg-gray-50 dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700 flex-shrink-0",
+									children: [/* @__PURE__ */ jsx(Diff, { className: "h-3.5 w-3.5 text-gray-400" }), /* @__PURE__ */ jsxs("span", {
+										className: "text-[10px] font-medium text-gray-600 dark:text-gray-300",
+										children: [
+											"Changes in",
+											" ",
+											/* @__PURE__ */ jsx("code", {
+												className: "font-mono text-blue-600 dark:text-blue-400",
+												children: model.selectedCommitSha.slice(0, 7)
+											})
+										]
+									})]
+								}), model.diffLoading ? /* @__PURE__ */ jsx(LoadingSpinner, {}) : /* @__PURE__ */ jsx(Suspense, {
+									fallback: /* @__PURE__ */ jsx(LoadingSpinner, {}),
+									children: /* @__PURE__ */ jsx(DiffViewer, {
+										entries: model.diffEntries,
+										className: "p-2"
+									})
+								})]
+							})
+						] })
+					}),
+					model.activeTab === "prs" && model.hasGitHost && /* @__PURE__ */ jsxs("div", {
+						className: "flex-1 min-h-0 flex flex-col",
+						children: [
+							model.hostLoading && /* @__PURE__ */ jsx(LoadingSpinner, {}),
+							!model.hostLoading && model.hostError && /* @__PURE__ */ jsx(BrowserError, {
+								error: model.hostError,
+								context: "Pull Requests",
+								onRetry: () => model.retryPRs()
+							}),
+							!model.hostLoading && !model.hostError && (model.prs.length === 0 ? /* @__PURE__ */ jsx("div", {
+								className: "flex items-center justify-center py-8 text-xs text-gray-400",
+								children: "No pull requests found"
+							}) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
+								className: "flex-1 overflow-auto divide-y divide-gray-100 dark:divide-gray-800",
+								children: model.prs.map((pr) => /* @__PURE__ */ jsxs("div", {
+									className: "flex items-start gap-3 px-4 py-2.5 hover:bg-gray-50 dark:hover:bg-gray-800/50",
+									children: [/* @__PURE__ */ jsx(GitPullRequest, { className: "h-4 w-4 text-gray-400 shrink-0 mt-0.5" }), /* @__PURE__ */ jsxs("div", {
+										className: "flex-1 min-w-0",
+										children: [/* @__PURE__ */ jsxs("div", {
+											className: "flex items-center gap-2",
+											children: [/* @__PURE__ */ jsx("span", {
+												className: "text-sm truncate",
+												title: pr.title,
+												children: pr.title
+											}), /* @__PURE__ */ jsx("span", {
+												className: `px-1.5 py-0.5 text-[10px] font-medium rounded ${pr.state === "open" ? "text-green-600 bg-green-50 dark:text-green-400 dark:bg-green-900/30" : pr.state === "merged" ? "text-purple-600 bg-purple-50 dark:text-purple-400 dark:bg-purple-900/30" : "text-red-600 bg-red-50 dark:text-red-400 dark:bg-red-900/30"}`,
+												children: pr.state
+											})]
+										}), /* @__PURE__ */ jsxs("span", {
+											className: "text-xs text-gray-500",
+											children: [
+												"#",
+												pr.number,
+												" · ",
+												pr.author,
+												" · ",
+												formatRelativeTime(pr.createdAt)
+											]
+										})]
+									})]
+								}, pr.number))
+							}), (model.prPage > 0 || model.hasMorePrs) && /* @__PURE__ */ jsxs("div", {
+								className: "flex items-center justify-between px-4 py-2 border-t border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-800 flex-shrink-0",
+								children: [
+									/* @__PURE__ */ jsxs("button", {
+										onClick: () => model.prevPrPage(),
+										disabled: model.prPage === 0,
+										className: "inline-flex items-center gap-1 px-2.5 py-1 text-xs font-medium rounded-md border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors disabled:opacity-50 disabled:pointer-events-none",
+										children: [/* @__PURE__ */ jsx(ChevronLeft, { className: "h-3.5 w-3.5" }), " Previous"]
+									}),
+									/* @__PURE__ */ jsxs("span", {
+										className: "text-xs text-gray-500",
+										children: ["Page ", model.prPage + 1]
+									}),
+									/* @__PURE__ */ jsxs("button", {
+										onClick: () => model.nextPrPage(),
+										disabled: !model.hasMorePrs,
+										className: "inline-flex items-center gap-1 px-2.5 py-1 text-xs font-medium rounded-md border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors disabled:opacity-50 disabled:pointer-events-none",
+										children: ["Next ", /* @__PURE__ */ jsx(ChevronRight, { className: "h-3.5 w-3.5" })]
+									})
+								]
+							})] }))
+						]
+					}),
+					model.activeTab === "issues" && model.hasGitHost && /* @__PURE__ */ jsxs("div", {
+						className: "flex-1 min-h-0 flex flex-col",
+						children: [
+							model.hostLoading && /* @__PURE__ */ jsx(LoadingSpinner, {}),
+							!model.hostLoading && model.hostError && /* @__PURE__ */ jsx(BrowserError, {
+								error: model.hostError,
+								context: "Issues",
+								onRetry: () => model.retryIssues()
+							}),
+							!model.hostLoading && !model.hostError && (model.issues.length === 0 ? /* @__PURE__ */ jsx("div", {
+								className: "flex items-center justify-center py-8 text-xs text-gray-400",
+								children: "No issues found"
+							}) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
+								className: "flex-1 overflow-auto divide-y divide-gray-100 dark:divide-gray-800",
+								children: model.issues.map((issue) => /* @__PURE__ */ jsxs("div", {
+									className: "flex items-start gap-3 px-4 py-2.5 hover:bg-gray-50 dark:hover:bg-gray-800/50",
+									children: [/* @__PURE__ */ jsx(AlertCircle, { className: `h-4 w-4 shrink-0 mt-0.5 ${issue.state === "open" ? "text-green-500" : "text-red-400"}` }), /* @__PURE__ */ jsxs("div", {
+										className: "flex-1 min-w-0",
+										children: [/* @__PURE__ */ jsxs("div", {
+											className: "flex items-center gap-2",
+											children: [/* @__PURE__ */ jsx("span", {
+												className: "text-sm truncate",
+												title: issue.title,
+												children: issue.title
+											}), issue.labels.map((l) => /* @__PURE__ */ jsx("span", {
+												className: "px-1.5 py-0.5 text-[10px] font-medium rounded bg-blue-50 text-blue-600 dark:bg-blue-900/30 dark:text-blue-400",
+												children: l
+											}, l))]
+										}), /* @__PURE__ */ jsxs("span", {
+											className: "text-xs text-gray-500",
+											children: [
+												"#",
+												issue.number,
+												" · ",
+												issue.author,
+												" · ",
+												formatRelativeTime(issue.createdAt)
+											]
+										})]
+									})]
+								}, issue.number))
+							}), (model.issuePage > 0 || model.hasMoreIssues) && /* @__PURE__ */ jsxs("div", {
+								className: "flex items-center justify-between px-4 py-2 border-t border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-800 flex-shrink-0",
+								children: [
+									/* @__PURE__ */ jsxs("button", {
+										onClick: () => model.prevIssuePage(),
+										disabled: model.issuePage === 0,
+										className: "inline-flex items-center gap-1 px-2.5 py-1 text-xs font-medium rounded-md border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors disabled:opacity-50 disabled:pointer-events-none",
+										children: [/* @__PURE__ */ jsx(ChevronLeft, { className: "h-3.5 w-3.5" }), " Previous"]
+									}),
+									/* @__PURE__ */ jsxs("span", {
+										className: "text-xs text-gray-500",
+										children: ["Page ", model.issuePage + 1]
+									}),
+									/* @__PURE__ */ jsxs("button", {
+										onClick: () => model.nextIssuePage(),
+										disabled: !model.hasMoreIssues,
+										className: "inline-flex items-center gap-1 px-2.5 py-1 text-xs font-medium rounded-md border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors disabled:opacity-50 disabled:pointer-events-none",
+										children: ["Next ", /* @__PURE__ */ jsx(ChevronRight, { className: "h-3.5 w-3.5" })]
+									})
+								]
+							})] }))
+						]
+					})
+				]
+			})
+		]
+	});
+});
+function EmptyState({ message }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: "flex items-center justify-center py-8 text-xs text-gray-400",
+		children: message
+	});
+}
+function statusColor(status) {
+	switch (status) {
+		case "open": return "text-green-600 bg-green-50 dark:text-green-400 dark:bg-green-900/30";
+		case "merged": return "text-purple-600 bg-purple-50 dark:text-purple-400 dark:bg-purple-900/30";
+		case "closed": return "text-red-600 bg-red-50 dark:text-red-400 dark:bg-red-900/30";
+		default: return "text-gray-600 bg-gray-50";
+	}
+}
+const GitHostBrowser = observer(({ gitHost }) => {
+	const [model] = useState(() => new GitHostBrowserModel(gitHost));
+	useEffect(() => {
+		model.loadData();
+	}, [model]);
+	const tabDefs = [{
+		id: "prs",
+		label: "Pull Requests",
+		icon: /* @__PURE__ */ jsx(GitPullRequest, { className: "h-3.5 w-3.5" })
+	}, {
+		id: "issues",
+		label: "Issues",
+		icon: /* @__PURE__ */ jsx(AlertCircle, { className: "h-3.5 w-3.5" })
+	}];
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex flex-col h-full",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-2 px-4 py-2 border-b border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-800",
+				children: [/* @__PURE__ */ jsx(GitPullRequest, { className: "h-4 w-4 text-gray-500" }), /* @__PURE__ */ jsx("span", {
+					className: "text-xs font-medium text-gray-700 dark:text-gray-300",
+					children: "Git Host Browser"
+				})]
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: "flex border-b border-gray-200 dark:border-gray-700",
+				children: tabDefs.map((tab) => /* @__PURE__ */ jsxs("button", {
+					onClick: () => model.setActiveTab(tab.id),
+					className: `flex items-center gap-1.5 px-4 py-2 text-xs font-medium border-b-2 transition-colors ${model.activeTab === tab.id ? "border-blue-500 text-blue-600 dark:text-blue-400" : "border-transparent text-gray-500 hover:text-gray-700 dark:hover:text-gray-300"}`,
+					children: [tab.icon, tab.label]
+				}, tab.id))
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex-1 overflow-auto",
+				children: [
+					model.loading && /* @__PURE__ */ jsx(LoadingSpinner, {}),
+					!model.loading && model.error && /* @__PURE__ */ jsx(BrowserError, {
+						error: model.error,
+						context: "Git Host",
+						onRetry: () => model.retry()
+					}),
+					!model.loading && !model.error && model.activeTab === "prs" && (model.prs.length === 0 ? /* @__PURE__ */ jsx(EmptyState, { message: "No pull requests found" }) : /* @__PURE__ */ jsx("div", {
+						className: "divide-y divide-gray-100 dark:divide-gray-800",
+						children: model.prs.map((pr) => /* @__PURE__ */ jsxs("div", {
+							className: "flex items-start gap-3 px-4 py-2.5 hover:bg-gray-50 dark:hover:bg-gray-800/50",
+							children: [/* @__PURE__ */ jsx(GitPullRequest, { className: "h-4 w-4 text-gray-400 shrink-0 mt-0.5" }), /* @__PURE__ */ jsxs("div", {
+								className: "flex-1 min-w-0",
+								children: [/* @__PURE__ */ jsxs("div", {
+									className: "flex items-center gap-2",
+									children: [/* @__PURE__ */ jsx("span", {
+										className: "text-sm truncate",
+										title: pr.title,
+										children: pr.title
+									}), /* @__PURE__ */ jsx("span", {
+										className: `px-1.5 py-0.5 text-[10px] font-medium rounded ${statusColor(pr.state)}`,
+										children: pr.state
+									})]
+								}), /* @__PURE__ */ jsxs("span", {
+									className: "text-xs text-gray-500",
+									children: [
+										"#",
+										pr.number,
+										" · ",
+										pr.author,
+										" · ",
+										formatRelativeTime(pr.createdAt)
+									]
+								})]
+							})]
+						}, pr.number))
+					})),
+					!model.loading && !model.error && model.activeTab === "issues" && (model.issues.length === 0 ? /* @__PURE__ */ jsx(EmptyState, { message: "No issues found" }) : /* @__PURE__ */ jsx("div", {
+						className: "divide-y divide-gray-100 dark:divide-gray-800",
+						children: model.issues.map((issue) => /* @__PURE__ */ jsxs("div", {
+							className: "flex items-start gap-3 px-4 py-2.5 hover:bg-gray-50 dark:hover:bg-gray-800/50",
+							children: [/* @__PURE__ */ jsx(AlertCircle, { className: "h-4 w-4 text-green-500 shrink-0 mt-0.5" }), /* @__PURE__ */ jsxs("div", {
+								className: "flex-1 min-w-0",
+								children: [/* @__PURE__ */ jsxs("div", {
+									className: "flex items-center gap-2",
+									children: [/* @__PURE__ */ jsx("span", {
+										className: "text-sm truncate",
+										title: issue.title,
+										children: issue.title
+									}), issue.labels.map((l) => /* @__PURE__ */ jsx("span", {
+										className: "px-1.5 py-0.5 text-[10px] font-medium rounded bg-blue-50 text-blue-600 dark:bg-blue-900/30 dark:text-blue-400",
+										children: l
+									}, l))]
+								}), /* @__PURE__ */ jsxs("span", {
+									className: "text-xs text-gray-500",
+									children: [
+										"#",
+										issue.number,
+										" · ",
+										issue.author,
+										" · ",
+										formatRelativeTime(issue.createdAt)
+									]
+								})]
+							})]
+						}, issue.number))
+					}))
+				]
+			}),
+			model.showPagination && !model.loading && !model.error && model.currentItems.length > 0 && /* @__PURE__ */ jsxs("div", {
+				className: "flex items-center justify-between px-4 py-2 border-t border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-800",
+				children: [
+					/* @__PURE__ */ jsxs("button", {
+						onClick: () => model.prevPage(),
+						disabled: model.page === 0,
+						className: "inline-flex items-center gap-1 px-2.5 py-1 text-xs font-medium rounded-md border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors disabled:opacity-50 disabled:pointer-events-none",
+						children: [/* @__PURE__ */ jsx(ChevronLeft, { className: "h-3.5 w-3.5" }), "Previous"]
+					}),
+					/* @__PURE__ */ jsxs("span", {
+						className: "text-xs text-gray-500",
+						children: ["Page ", model.page + 1]
+					}),
+					/* @__PURE__ */ jsxs("button", {
+						onClick: () => model.nextPage(),
+						disabled: !model.hasMore,
+						className: "inline-flex items-center gap-1 px-2.5 py-1 text-xs font-medium rounded-md border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors disabled:opacity-50 disabled:pointer-events-none",
+						children: ["Next", /* @__PURE__ */ jsx(ChevronRight, { className: "h-3.5 w-3.5" })]
+					})
+				]
+			})
+		]
+	});
+});
+
+//#endregion
+export { GitHostBrowser, GitHostBrowserModel, GitRepoBrowser, GitRepoBrowserModel, showActionToast, showErrorToast, showInfoToast };
+//# sourceMappingURL=GitBrowser-BLgTNQyd.js.map