Add settings to choose diff view mode

src/settings/settings.ts

@@ -9,6 +9,7 @@ export interface GitHubSyncSettings {
   syncOnStartup: boolean;
   syncConfigDir: boolean;
   conflictHandling: "overwriteLocal" | "ask" | "overwriteRemote";
+  conflictViewMode: "default" | "unified" | "split";
   showStatusBarItem: boolean;
   showSyncRibbonButton: boolean;
   showConflictsRibbonButton: boolean;
@@ -26,6 +27,7 @@ export const DEFAULT_SETTINGS: GitHubSyncSettings = {
   syncOnStartup: false,
   syncConfigDir: true,
   conflictHandling: "ask",
+  conflictViewMode: "default",
   showStatusBarItem: true,
   showSyncRibbonButton: true,
   showConflictsRibbonButton: true,

src/settings/tab.ts

@@ -231,6 +231,24 @@ export default class GitHubSyncSettingsTab extends PluginSettingTab {
           });
       });
 
+    const diffModeOptions = {
+      default: "Default",
+      unified: "Unified",
+      split: "Split",
+    };
+    new Setting(containerEl)
+      .setName("Conflict resolution view mode")
+      .setDesc("Set which diff view mode should be shown in case of conflicts")
+      .addDropdown((dropdown) => {
+        dropdown
+          .addOptions(diffModeOptions)
+          .setValue(this.plugin.settings.conflictViewMode)
+          .onChange(async (value: keyof typeof diffModeOptions) => {
+            this.plugin.settings.conflictViewMode = value;
+            await this.plugin.saveSettings();
+          });
+      });
+
     containerEl.createEl("h2", { text: "Extra" });
 
     new Setting(containerEl)

src/views/conflicts-resolution/view.tsx

@@ -1,4 +1,4 @@
-import { IconName, ItemView, Menu, WorkspaceLeaf } from "obsidian";
+import { IconName, ItemView, Menu, Platform, WorkspaceLeaf } from "obsidian";
 import { Root, createRoot } from "react-dom/client";
 import GitHubSyncPlugin from "src/main";
 import { ConflictFile, ConflictResolution } from "src/sync-manager";
@@ -54,18 +54,34 @@ export class ConflictsResolutionView extends ItemView {
       this.root = createRoot(container);
     }
 
-    this.root.render(
-      <>
-        <UnifiedView
-          initialFiles={conflicts}
-          onResolveAllConflicts={this.resolveAllConflicts.bind(this)}
-        />
+    let diffMode = "default";
+    if (this.plugin.settings.conflictViewMode === "default") {
+      if (Platform.isMobile) {
+        diffMode = "unified";
+      } else {
+        diffMode = "split";
+      }
+    } else if (this.plugin.settings.conflictViewMode === "split") {
+      diffMode = "split";
+    } else if (this.plugin.settings.conflictViewMode === "unified") {
+      diffMode = "unified";
+    }
+
+    if (diffMode === "split") {
+      this.root.render(
         <SplitView
           initialFiles={conflicts}
           onResolveAllConflicts={this.resolveAllConflicts.bind(this)}
-        />
-      </>,
-    );
+        />,
+      );
+    } else {
+      this.root.render(
+        <UnifiedView
+          initialFiles={conflicts}
+          onResolveAllConflicts={this.resolveAllConflicts.bind(this)}
+        />,
+      );
+    }
   }
 
   async onClose() {