Save page on name change & refresh sidebar (#20)

src/app/app.component.ts

@@ -13,6 +13,7 @@ import {SelectorComponent} from './components/sharing/selector/selector.componen
 import {SessionService} from './service/session.service';
 import {SearchComponent} from './components/search/Search.component';
 import {NodeTypeIcons} from './structures/node-types';
+import {NavigationService} from './service/navigation.service';
 
 @Component({
   selector: 'app-root',
@@ -88,6 +89,7 @@ export class AppComponent implements OnInit {
     protected modal: ModalController,
     protected session: SessionService,
     protected loading: LoadingController,
+    protected navService: NavigationService,
   ) {
     this.initializeApp();
   }
@@ -104,6 +106,10 @@ export class AppComponent implements OnInit {
 
   ngOnInit() {
     if ( !this.initialized$.getValue() ) {
+      this.navService.sidebarRefresh$.subscribe(([_, quiet]) => {
+        this.onMenuRefresh(quiet);
+      });
+
       const sub = this.initialized$.subscribe((didInit) => {
         if (didInit) {
           this._doInit();
@@ -201,7 +207,7 @@ export class AppComponent implements OnInit {
         });
       } else if ( result.data === 'export_html' ) {
         this.exportTargetAsHTML();
-      }
+      };
     });
 
     await popover.present();
@@ -335,11 +341,17 @@ export class AppComponent implements OnInit {
     await alert.present();
   }
 
-  onMenuRefresh() {
-    this.refreshingMenu = true;
+  onMenuRefresh(quiet = false) {
+    if ( !quiet ) {
+      this.refreshingMenu = true;
+    }
+
     this.reloadMenuItems().subscribe();
+
     setTimeout(() => {
-      this.refreshingMenu = false;
+      if ( !quiet ) {
+        this.refreshingMenu = false;
+      }
     }, 2000);
   }
 

src/app/service/editor.service.ts

@@ -4,6 +4,7 @@ import PageRecord from '../structures/PageRecord';
 import HostRecord from '../structures/HostRecord';
 import {EditorNodeContract} from '../components/nodes/EditorNode.contract';
 import {BehaviorSubject, Subscription} from 'rxjs';
+import {NavigationService} from './navigation.service';
 
 export class NoPageLoadedError extends Error {
     constructor(msg = 'There is no page open for editing.') {
@@ -73,6 +74,7 @@ export class EditorService {
         if ( this.currentPage && this.canEdit() ) {
             if ( this.currentPage.Name !== name ) {
                 this.dirtyOverride = true;
+                this.triggerSave();
             }
 
             this.currentPage.Name = name;
@@ -81,6 +83,7 @@ export class EditorService {
 
     constructor(
         protected api: ApiService,
+        protected nav: NavigationService,
     ) { }
 
     async startEditing(pageId: string) {
@@ -122,9 +125,11 @@ export class EditorService {
             await editor.writeChangesToNode();
         }));
 
+        await this.savePage(this.currentPage);
         await this.saveNodesAsPage(this.currentPage, this.currentNodes);
         this.dirtyOverride = false;
         this.saving = false;
+        this.nav.requestSidebarRefresh({ quiet: true });
     }
 
     async moveNode(node: HostRecord, direction: 'up' | 'down') {
@@ -153,6 +158,20 @@ export class EditorService {
         this.triggerSave();
     }
 
+    async savePage(page: PageRecord): Promise<void> {
+        await new Promise((res, rej) => {
+            const saveData = page.toSave();
+
+            this.api.post(`/page/${page.UUID}/save`, saveData).subscribe({
+                next: result => {
+                    console.log('save result', result);
+                    res();
+                },
+                error: rej,
+            });
+        });
+    }
+
     async saveNodesAsPage(page: PageRecord, nodes: HostRecord[]): Promise<HostRecord[]> {
         return new Promise((res, rej) => {
             const saveNodes = nodes.map(x => {

src/app/service/navigation.service.ts

@@ -0,0 +1,15 @@
+import { Injectable } from '@angular/core';
+import {BehaviorSubject} from 'rxjs';
+
+@Injectable({
+    providedIn: 'root'
+})
+export class NavigationService {
+    protected refreshCount = 0;
+    public readonly sidebarRefresh$: BehaviorSubject<[number, boolean]> = new BehaviorSubject<[number, boolean]>([this.refreshCount, true]);
+
+    requestSidebarRefresh({ quiet = false }) {
+        this.refreshCount += 1;
+        this.sidebarRefresh$.next([this.refreshCount, quiet]);
+    }
+}