import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { memo, useEffect, useState } from 'react';
import { ChevronRight, GitBranch, RefreshCw, Upload } from 'lucide-react';
import { useQueryClient } from '@tanstack/react-query';
import { useGitStore } from '../../stores/gitStore';
import { useGitStatus, usePushCommits } from '../../hooks/useGit';
import { Button } from '../ui/Button';
import { GitFileList } from './GitFileList';
export const GitSidebar = memo(function GitSidebar() {
    // Use selectors to only subscribe to needed state
    const isExpanded = useGitStore((state) => state.isExpanded);
    const collapseSidebar = useGitStore((state) => state.collapseSidebar);
    const { data: status, isLoading, error, refetch } = useGitStatus();
    const queryClient = useQueryClient();
    const pushMutation = usePushCommits();
    const [pushError, setPushError] = useState(null);
    // Auto-fetch when sidebar is opened or closed
    useEffect(() => {
        if (isExpanded) {
            // Fetch immediately when opening
            queryClient.invalidateQueries({ queryKey: ['git', 'status'] });
        }
    }, [isExpanded, queryClient]);
    // Manual refresh handler
    const handleRefresh = () => {
        refetch();
    };
    // Push handler
    const handlePush = async () => {
        setPushError(null);
        try {
            await pushMutation.mutateAsync();
        }
        catch (err) {
            setPushError(err instanceof Error ? err.message : 'Failed to push');
        }
    };
    if (!isExpanded)
        return null;
    const allFiles = [
        ...(status?.conflicted || []),
        ...(status?.staged || []),
        ...(status?.unstaged || []),
        ...(status?.untracked || []),
    ];
    const totalChanges = allFiles.length;
    const canPush = status && status.ahead > 0;
    return (_jsxs("div", { className: "w-80 border-l border-border bg-background flex flex-col h-full", children: [_jsxs("div", { className: "h-14 border-b border-border px-4 flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-2 flex-1", children: [_jsx(GitBranch, { className: "w-4 h-4 text-muted-foreground" }), _jsxs("span", { className: "font-medium text-foreground", children: ["Git Changes", totalChanges > 0 && (_jsxs("span", { className: "ml-2 text-xs text-muted-foreground", children: ["(", totalChanges, ")"] }))] })] }), _jsx(Button, { variant: "ghost", size: "icon", onClick: collapseSidebar, title: "Close sidebar", children: _jsx(ChevronRight, { className: "w-4 h-4" }) })] }), _jsx("div", { className: "flex-1 overflow-y-auto", children: isLoading ? (_jsx("div", { className: "p-4 text-sm text-muted-foreground", children: "Loading git status..." })) : error ? (_jsx("div", { className: "p-4 text-sm text-muted-foreground", children: _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("span", { className: "text-orange-500", children: error instanceof Error
                                    ? error.message
                                    : 'Failed to load git status' }), _jsx(Button, { variant: "secondary", size: "sm", onClick: handleRefresh, children: "Retry" })] }) })) : !status || totalChanges === 0 ? (_jsx("div", { className: "p-4 text-sm text-muted-foreground", children: "No changes detected" })) : (_jsx(GitFileList, { status: status })) }), pushError && (_jsx("div", { className: "px-4 py-2 text-xs text-orange-500 border-t border-border bg-orange-50 dark:bg-orange-950/20", children: pushError })), _jsxs("div", { className: "h-12 px-4 border-t border-border text-xs text-muted-foreground flex items-center justify-between gap-2", children: [_jsxs("div", { className: "flex items-center gap-2 min-w-0 flex-1", children: [_jsx(GitBranch, { className: "w-3 h-3 flex-shrink-0" }), status?.branch && (_jsxs(_Fragment, { children: [_jsx("span", { className: "truncate", children: status.branch }), status.ahead > 0 && (_jsxs("span", { className: "text-green-500 flex-shrink-0", children: ["\u2191", status.ahead] })), status.behind > 0 && (_jsxs("span", { className: "text-orange-500 flex-shrink-0", children: ["\u2193", status.behind] }))] }))] }), _jsxs("div", { className: "flex items-center gap-1 flex-shrink-0", children: [canPush && (_jsx(Button, { variant: "ghost", size: "icon", onClick: handlePush, title: "Push commits to remote", className: "h-6 w-6 transition-transform duration-200 hover:scale-110", disabled: pushMutation.isPending, children: _jsx(Upload, { className: `w-3 h-3 ${pushMutation.isPending ? 'animate-pulse' : ''}` }) })), _jsx(Button, { variant: "ghost", size: "icon", onClick: handleRefresh, title: "Refresh git status", className: "h-6 w-6 transition-transform duration-200 hover:scale-110", disabled: isLoading, children: _jsx(RefreshCw, { className: `w-3 h-3 ${isLoading ? 'animate-spin' : ''}` }) })] })] })] }));
});
//# sourceMappingURL=GitSidebar.js.map