Add ability to load page version in editor service and show in version modal

src/app/components/version-modal/version-modal.component.html

@@ -19,7 +19,7 @@
             </ion-item>
         </ion-list>
         <div class="preview">
-            <app-editor [pageId]="pageId" *ngIf="selectedVersion" [hosted]="true" [readonly]="true" #editor></app-editor>
+            <app-editor [pageId]="pageId" *ngIf="selectedVersion" [hosted]="true" [readonly]="true" [version]="selectedVersion.versionNum" #editor></app-editor>
         </div>
     </div>
 </div>

src/app/components/version-modal/version-modal.component.ts

@@ -26,10 +26,7 @@ export class VersionModalComponent implements OnInit {
 
     async ngOnInit() {
         this.pageVersions = await this.editorService.loadPageVersions(this.pageId);
-        this.selectedVersion = this.pageVersions[0];
-        setTimeout(() => {
-            this.onVersionClick(this.pageVersions[0]);
-        }, 100);
+        this.onVersionClick(this.pageVersions[0]);
     }
 
     dismiss() {
@@ -38,8 +35,10 @@ export class VersionModalComponent implements OnInit {
 
     async onVersionClick(version: PageVersionRecord) {
         this.selectedVersion = version;
-        if ( this.editor ) {
-            this.editor.ionViewDidEnter();
-        }
+        setTimeout(() => {
+            if ( this.editor ) {
+                this.editor.ionViewDidEnter();
+            }
+        }, 300);
     }
 }

src/app/pages/editor/editor.page.ts

@@ -49,7 +49,7 @@ export class EditorPage implements OnInit {
 
   ionViewDidEnter() {
     if ( this.pageId ) {
-      this.editorService.startEditing(this.pageId);
+      this.editorService.startEditing(this.pageId, this.version);
     } else if ( !this.hosted ) {
       this.router.navigate(['/home']);
     }

src/app/service/editor.service.ts

@@ -31,6 +31,7 @@ export class EditorService {
     protected ready$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
     protected subs: Subscription[] = [];
     protected saving = false;
+    protected currentPageVersion?: number;
     public forceReadonly = false;
     protected saveTriggered = false;
     public notAvailable = false;
@@ -110,14 +111,15 @@ export class EditorService {
         return inst;
     }
 
-    async startEditing(pageId: string) {
+    async startEditing(pageId: string, version?: number) {
         if ( this.currentPage ) {
             await this.stopEditing();
         }
 
         try {
-            this.currentPage = await this.loadPage(pageId);
-            this.currentNodes = await this.loadNodes(pageId);
+            this.currentPageVersion = version;
+            this.currentPage = await this.loadPage(pageId, version);
+            this.currentNodes = await this.loadNodes(pageId, version);
             this.notAvailable = false;
             await this.ready$.next(true);
         } catch (e) {
@@ -556,7 +558,7 @@ export class EditorService {
         delete this.nodeIdToEditorContract[nodeId];
     }
 
-    async loadPage(pageId: string): Promise<PageRecord> {
+    async loadPage(pageId: string, version?: number): Promise<PageRecord> {
         return new Promise(async (res, rej) => {
             const existingLocalPage = await this.db.pages.where({ UUID: pageId }).first() as Page;
 
@@ -570,7 +572,7 @@ export class EditorService {
             }
 
             // If we're online, fetch the page record and store it locally
-            this.api.get(`/page/${pageId}`).subscribe({
+            this.api.get(`/page/${pageId}${version ? '?version=' + version : ''}`).subscribe({
                 next: async result => {
                     const page = new PageRecord(result.data);
 
@@ -632,7 +634,7 @@ export class EditorService {
         });
     }
 
-    async loadNodes(pageId: string): Promise<HostRecord[]> {
+    async loadNodes(pageId: string, version?: number): Promise<HostRecord[]> {
         return new Promise(async (res, rej) => {
             const existingNodes = await this.db.pageNodes.where({ PageId: pageId }).toArray() as PageNode[];
 
@@ -650,7 +652,7 @@ export class EditorService {
                 return res(inflateRecords(parsedRecords));
             }
 
-            this.api.get(`/page/${pageId}/nodes`).subscribe({
+            this.api.get(`/page/${pageId}/nodes${version ? '?version=' + version : ''}`).subscribe({
                 next: async result => {
                     // If we got resolved records, delete the local ones to replace them
                     await this.db.pageNodes.where({ PageId: pageId }).delete();