Register view with registerView

If we don't register the view, as before, then the workspace won't
be able to properly serialize it.

src/components/differences_view.ts

@@ -1,5 +1,5 @@
 import { structuredPatch } from 'diff';
-import { ItemView, TFile, WorkspaceLeaf } from 'obsidian';
+import { ItemView, TFile } from 'obsidian';
 import { Difference } from '../data/difference';
 import { FileDifferences } from '../data/file_differences';
 import { preventEmptyString } from '../utils/string_utils';
@@ -8,19 +8,13 @@ import { DeleteFileModal } from './modals/delete_file_modal';
 
 export const VIEW_TYPE_DIFFERENCES = 'differences-view';
 
-export class DifferencesView extends ItemView {
-	constructor(args: {
-		leaf: WorkspaceLeaf;
-		file1: TFile;
-		file2: TFile;
-		showMergeOption: boolean;
-	}) {
-		super(args.leaf);
-		this.file1 = args.file1;
-		this.file2 = args.file2;
-		this.showMergeOption = args.showMergeOption;
-	}
+interface ViewState {
+	file1: TFile;
+	file2: TFile;
+	showMergeOption: boolean;
+}
 
+export class DifferencesView extends ItemView {
 	private file1: TFile;
 
 	private file2: TFile;
@@ -41,15 +35,19 @@ export class DifferencesView extends ItemView {
 
 	private wasDeleteModalShown = false;
 
-	getViewType(): string {
+	override getViewType(): string {
 		return VIEW_TYPE_DIFFERENCES;
 	}
 
-	getDisplayText(): string {
-		return `Difference between ${this.file1.name} and ${this.file2.name}`;
+	override getDisplayText(): string {
+		return `File Diff`;
 	}
 
-	async onload(): Promise<void> {
+	override async setState(state: ViewState): Promise<void> {
+		this.file1 = state.file1;
+		this.file2 = state.file2;
+		this.showMergeOption = state.showMergeOption;
+
 		this.registerEvent(
 			this.app.vault.on('modify', async (file) => {
 				if (file === this.file1 || file === this.file2) {
@@ -58,9 +56,7 @@ export class DifferencesView extends ItemView {
 				}
 			})
 		);
-	}
 
-	async onOpen(): Promise<void> {
 		await this.updateState();
 		this.build();
 	}
@@ -221,7 +217,13 @@ export class DifferencesView extends ItemView {
 			new DeleteFileModal({
 				file1: this.file1,
 				file2: this.file2,
-				onDone: (e) => (e ? reject(e) : resolve()),
+				onDone: (e) => {
+					if (e) {
+						return reject(e);
+					}
+					this.leaf.detach();
+					return resolve();
+				},
 			}).open();
 		});
 	}

src/components/modals/delete_file_modal.ts

@@ -54,7 +54,7 @@ export class DeleteFileModal extends Modal {
 
 		this.close();
 
-		const leaf = this.app.workspace.getMostRecentLeaf();
+		const leaf = this.app.workspace.getLeaf();
 		if (leaf != null) {
 			leaf.openFile(this.file1);
 		}

src/main.ts

@@ -1,13 +1,21 @@
 import { Plugin, TFile } from 'obsidian';
 
-import { DifferencesView } from './components/differences_view';
+import {
+	DifferencesView,
+	VIEW_TYPE_DIFFERENCES,
+} from './components/differences_view';
 import { RiskyActionModal } from './components/modals/risky_action_modal';
 import { SelectFileModal } from './components/modals/select_file_modal';
 
 export default class FileDiffPlugin extends Plugin {
 	fileDiffMergeWarningKey = 'file-diff-merge-warning';
 
-	onload(): void {
+	override onload(): void {
+		this.registerView(
+			VIEW_TYPE_DIFFERENCES,
+			(leaf) => new DifferencesView(leaf)
+		);
+
 		this.addCommand({
 			id: 'compare',
 			name: 'Compare',
@@ -25,14 +33,20 @@ export default class FileDiffPlugin extends Plugin {
 				}
 
 				// Open differences view
-				const workspaceLeaf = this.app.workspace.getLeaf();
-				await workspaceLeaf.open(
-					new DifferencesView({
-						leaf: workspaceLeaf,
+				this.app.workspace.detachLeavesOfType(VIEW_TYPE_DIFFERENCES);
+
+				await this.app.workspace.getLeaf(true).setViewState({
+					type: VIEW_TYPE_DIFFERENCES,
+					active: true,
+					state: {
 						file1: activeFile,
 						file2: compareFile,
 						showMergeOption: false,
-					})
+					},
+				});
+
+				this.app.workspace.revealLeaf(
+					this.app.workspace.getLeavesOfType(VIEW_TYPE_DIFFERENCES)[0]
 				);
 			},
 		});
@@ -62,28 +76,36 @@ export default class FileDiffPlugin extends Plugin {
 				}
 
 				// Open differences view
-				const workspaceLeaf = this.app.workspace.getMostRecentLeaf();
-				if (workspaceLeaf != null) {
-					await workspaceLeaf.open(
-						new DifferencesView({
-							leaf: workspaceLeaf,
-							file1: activeFile,
-							file2: compareFile,
-							showMergeOption: true,
-						})
-					);
-				}
+				this.app.workspace.detachLeavesOfType(VIEW_TYPE_DIFFERENCES);
+
+				await this.app.workspace.getLeaf(true).setViewState({
+					type: VIEW_TYPE_DIFFERENCES,
+					active: true,
+					state: {
+						file1: activeFile,
+						file2: compareFile,
+						showMergeOption: true,
+					},
+				});
+
+				this.app.workspace.revealLeaf(
+					this.app.workspace.getLeavesOfType(VIEW_TYPE_DIFFERENCES)[0]
+				);
 			},
 		});
 	}
 
-	getFileToCompare(activeFile: TFile): Promise<TFile | undefined> {
+	override async onunload(): Promise<void> {
+		this.app.workspace.detachLeavesOfType(VIEW_TYPE_DIFFERENCES);
+	}
+
+	private getFileToCompare(activeFile: TFile): Promise<TFile | undefined> {
 		const selectableFiles = this.app.vault.getFiles();
 		selectableFiles.remove(activeFile);
 		return this.showSelectOtherFileModal({ selectableFiles });
 	}
 
-	showSelectOtherFileModal(args: {
+	private showSelectOtherFileModal(args: {
 		selectableFiles: TFile[];
 	}): Promise<TFile | undefined> {
 		return new Promise((resolve, reject) => {
@@ -94,7 +116,7 @@ export default class FileDiffPlugin extends Plugin {
 		});
 	}
 
-	showRiskyActionModal(): Promise<void> {
+	private showRiskyActionModal(): Promise<void> {
 		return new Promise((resolve, reject) => {
 			new RiskyActionModal({
 				onAccept: async (e: Error | null) => {