feat: improve mobile git and diff experience

This commit is contained in:
Bohdan Triapitsyn
2025-12-28 14:03:20 +02:00
parent 0d27c0b6d5
commit 69c7ef0222
3 changed files with 19 additions and 4 deletions
@@ -305,8 +305,10 @@ export const DiffView: React.FC = () => {
const diffLayoutPreference = useUIStore((state) => state.diffLayoutPreference);
const diffFileLayout = useUIStore((state) => state.diffFileLayout);
const setDiffFileLayout = useUIStore((state) => state.setDiffFileLayout);
const diffWrapLines = useUIStore((state) => state.diffWrapLines);
const diffWrapLinesStore = useUIStore((state) => state.diffWrapLines);
const setDiffWrapLines = useUIStore((state) => state.setDiffWrapLines);
// Default to wrap on mobile
const diffWrapLines = isMobile || diffWrapLinesStore;
const changedFiles: FileEntry[] = React.useMemo(() => {
if (!status?.files) return [];
@@ -564,7 +566,7 @@ export const DiffView: React.FC = () => {
{selectedFileEntry && (
<button
type="button"
onClick={() => setDiffWrapLines(!diffWrapLines)}
onClick={() => setDiffWrapLines(!diffWrapLinesStore)}
className={`flex items-center justify-center size-5 rounded-sm transition-opacity ${
diffWrapLines
? 'text-foreground opacity-100'
@@ -143,7 +143,7 @@ export const ChangeRow = React.memo<ChangeRowProps>(function ChangeRow({
type="button"
onClick={handleRevertClick}
disabled={isReverting}
className="flex size-5 shrink-0 items-center justify-center rounded text-muted-foreground opacity-0 group-hover:opacity-100 hover:text-foreground focus-visible:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary disabled:cursor-not-allowed disabled:opacity-50 transition-opacity"
className="flex size-5 shrink-0 items-center justify-center rounded text-muted-foreground hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary disabled:cursor-not-allowed disabled:opacity-50"
aria-label={`Revert changes for ${file.path}`}
>
{isReverting ? (