'use client';
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { useTranslation } from 'react-i18next';
import { AlertTriangle, CheckCircle2, GitMerge, RefreshCw } from 'lucide-react';
import { CometSpinner } from '../../ui/comet-spinner.js';
import { ActionButton } from '../../common/action-button/index.js';
import { Separator } from '../../ui/separator.js';
export function BranchSyncStatus({ syncStatus, syncLoading, syncError, onRefreshSync, onRebaseOnMain, rebaseLoading, rebaseError, }) {
    const { t } = useTranslation('web');
    const isRebasing = rebaseLoading;
    const isBehind = syncStatus != null && syncStatus.behind > 0;
    const isUpToDate = syncStatus?.behind === 0;
    const baseBranch = syncStatus?.baseBranch ?? 'main';
    return (_jsxs(_Fragment, { children: [_jsx(Separator, {}), _jsxs("div", { "data-testid": "branch-sync-status", className: "flex flex-col gap-3 p-4", children: [_jsx("div", { className: "text-muted-foreground text-xs font-semibold tracking-wider", children: "BRANCH SYNC" }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("div", { className: "flex items-center gap-2", children: syncLoading && !syncStatus ? (_jsxs(_Fragment, { children: [_jsx(CometSpinner, { size: "sm", className: "shrink-0" }), _jsx("span", { className: "text-muted-foreground text-sm", children: "Checking..." })] })) : syncError ? (_jsxs(_Fragment, { children: [_jsx(AlertTriangle, { className: "h-4 w-4 shrink-0 text-red-500" }), _jsx("span", { className: "text-sm text-red-600", children: syncError })] })) : isRebasing ? (_jsxs(_Fragment, { children: [_jsx(CometSpinner, { size: "sm", className: "shrink-0" }), _jsxs("span", { className: "text-sm", children: ["Rebasing on", ' ', _jsx("code", { className: "bg-muted rounded px-1 py-0.5 font-mono text-xs", children: baseBranch }), "..."] })] })) : isBehind ? (_jsxs(_Fragment, { children: [_jsx(AlertTriangle, { className: "h-4 w-4 shrink-0 text-orange-500" }), _jsxs("span", { className: "text-sm", children: [syncStatus.behind, " commit", syncStatus.behind === 1 ? '' : 's', " behind", ' ', _jsx("code", { className: "bg-muted rounded px-1 py-0.5 font-mono text-xs", children: baseBranch }), syncStatus.ahead > 0 ? (_jsxs("span", { className: "text-muted-foreground ms-1", children: ["\u00B7 ", syncStatus.ahead, " ahead"] })) : null] })] })) : isUpToDate ? (_jsxs(_Fragment, { children: [_jsx(CheckCircle2, { className: "h-4 w-4 shrink-0 text-green-500" }), _jsxs("span", { className: "text-sm", children: ["Up to date with", ' ', _jsx("code", { className: "bg-muted rounded px-1 py-0.5 font-mono text-xs", children: baseBranch }), syncStatus.ahead > 0 ? (_jsxs("span", { className: "text-muted-foreground ms-1", children: ["\u00B7 ", syncStatus.ahead, " ahead"] })) : null] })] })) : null }), (syncStatus || syncError) && !isRebasing ? (_jsx("button", { "data-testid": "sync-refresh-button", onClick: onRefreshSync, disabled: syncLoading, className: "text-muted-foreground hover:text-foreground inline-flex items-center rounded p-1 transition-colors disabled:opacity-50", "aria-label": t('branchSyncStatus.refreshSyncStatus'), children: _jsx(RefreshCw, { className: `h-3.5 w-3.5 ${syncLoading ? 'animate-spin' : ''}` }) })) : null] }), isBehind && !isRebasing ? (_jsx(ActionButton, { label: t('branchSyncStatus.rebaseOnMain'), onClick: onRebaseOnMain, loading: false, error: !!rebaseError, icon: GitMerge, variant: "outline", size: "sm" })) : null, rebaseError ? _jsx("p", { className: "text-destructive text-xs", children: rebaseError }) : null] })] }));
}
