feat: Add stacked diff mode controls and mobile dropdown mode selector (#142)

* feat: add diffViewMode to UI store

* feat(PierreDiffViewer): add layout prop for inline diff

* feat: add diff view modes and change descriptors

* feat(openchamber): add diff view mode toggle

* feat: add diff view mode selector
This commit is contained in:
Nelson Pires
2026-01-14 15:15:16 +02:00
committed by GitHub
parent 4fa4c8d40b
commit e95bfdebaf
4 changed files with 724 additions and 31 deletions
+8
View File
@@ -52,6 +52,7 @@ interface UIStore {
diffLayoutPreference: 'dynamic' | 'inline' | 'side-by-side';
diffFileLayout: Record<string, 'inline' | 'side-by-side'>;
diffWrapLines: boolean;
diffViewMode: 'single' | 'stacked';
isTimelineDialogOpen: boolean;
nativeNotificationsEnabled: boolean;
notificationMode: 'always' | 'hidden-only';
@@ -95,6 +96,7 @@ interface UIStore {
setDiffLayoutPreference: (mode: 'dynamic' | 'inline' | 'side-by-side') => void;
setDiffFileLayout: (filePath: string, mode: 'inline' | 'side-by-side') => void;
setDiffWrapLines: (wrap: boolean) => void;
setDiffViewMode: (mode: 'single' | 'stacked') => void;
setMultiRunLauncherOpen: (open: boolean) => void;
setTimelineDialogOpen: (open: boolean) => void;
setNativeNotificationsEnabled: (value: boolean) => void;
@@ -141,6 +143,7 @@ export const useUIStore = create<UIStore>()(
diffLayoutPreference: 'dynamic',
diffFileLayout: {},
diffWrapLines: false,
diffViewMode: 'single',
isTimelineDialogOpen: false,
nativeNotificationsEnabled: false,
notificationMode: 'hidden-only',
@@ -365,6 +368,10 @@ export const useUIStore = create<UIStore>()(
set({ diffWrapLines: wrap });
},
setDiffViewMode: (mode) => {
set({ diffViewMode: mode });
},
setInputBarOffset: (offset) => {
set({ inputBarOffset: offset });
},
@@ -503,6 +510,7 @@ export const useUIStore = create<UIStore>()(
recentModels: state.recentModels,
diffLayoutPreference: state.diffLayoutPreference,
diffWrapLines: state.diffWrapLines,
diffViewMode: state.diffViewMode,
nativeNotificationsEnabled: state.nativeNotificationsEnabled,
notificationMode: state.notificationMode,
})