File size: 2,503 Bytes
3201ca6 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 | import { useTranslation } from "react-i18next";
import { ChevronDown, ChevronRight } from "lucide-react";
import { I18nKey } from "#/i18n/declaration";
import { AccordionPanel } from "./accordion-panel";
import { DiffChangeList, type DiffChangeListItem } from "./diff-change-list";
const EMPTY_COMMIT_SHA_PLACEHOLDER = "-";
/** Base key for i18next pluralization (`_one` / `_other` suffixes). */
const UNCOMMITTED_FILE_COUNT_I18N_KEY = "DIFF_VIEWER$UNCOMMITTED_FILE_COUNT";
export interface UncommittedChangesRowProps {
changes: DiffChangeListItem[];
isExpanded: boolean;
onToggle: () => void;
}
/**
* Top accordion row in the Commits pane for working-tree changes that
* are not yet associated with a commit. Same single-open accordion
* contract as CommitRow.
*/
export function UncommittedChangesRow({
changes,
isExpanded,
onToggle,
}: UncommittedChangesRowProps) {
const { t } = useTranslation("openhands");
return (
<div data-testid="uncommitted-changes-row" className="w-full flex flex-col">
<button
type="button"
onClick={onToggle}
aria-expanded={isExpanded}
data-testid="uncommitted-changes-row-toggle"
className="w-full flex h-10 items-center gap-2 px-3 border-b border-[var(--oh-border)] text-sm text-content text-left hover:cursor-pointer"
>
<code className="w-[7ch] flex-shrink-0 text-center font-mono text-xs text-[var(--oh-muted)]">
{EMPTY_COMMIT_SHA_PLACEHOLDER}
</code>
<strong className="flex-1 truncate font-medium">
{t(I18nKey.DIFF_VIEWER$UNCOMMITTED)}
</strong>
{changes.length > 0 ? (
<span
data-testid="uncommitted-changes-count"
className="text-xs text-[var(--oh-muted)] tabular-nums flex-shrink-0"
>
{t(UNCOMMITTED_FILE_COUNT_I18N_KEY, { count: changes.length })}
</span>
) : null}
{isExpanded ? (
<ChevronDown
className="w-4 h-4 shrink-0 text-[var(--oh-muted)]"
aria-hidden
/>
) : (
<ChevronRight
className="w-4 h-4 shrink-0 text-[var(--oh-muted)]"
aria-hidden
/>
)}
</button>
<AccordionPanel
open={isExpanded}
testId="uncommitted-changes-row-content"
className="w-full flex flex-col pl-6"
>
{changes.length > 0 ? <DiffChangeList changes={changes} /> : null}
</AccordionPanel>
</div>
);
}
|