Many changes. See further for more details.

- Notification API
- New Modal API
- Vault JSON import and export
- Improved Page Cache
- Adding Context Menu API
- Adding Vault Deletion
- Fixing Sync Issues
- Implementing Share Target API
- Implementing Share To API

src/components/routes/vault/Entry.tsx

@@ -1,5 +1,5 @@
 import { h, Component } from "preact"
-import Notes, { IVault, ViewNote, MessageType } from "../../../notes";
+import Notes, { IVault, ViewNote } from "../../../notes";
 import Trash from "feather-icons/dist/icons/trash-2.svg"
 import X from "feather-icons/dist/icons/x.svg"
 import Save from "feather-icons/dist/icons/save.svg"
@@ -7,9 +7,11 @@ import Save from "feather-icons/dist/icons/save.svg"
 import Navigation from "../../../navigation";
 import { YesNoModal } from "../../modals/YesNoModal";
 import LoadingModal from "../../modals/LoadingModal";
+import Notifications, { MessageType } from "../../../notifications";
+import Modal from "../../modals/Modal";
 
 const minRows = 3;
-export default class EntryComponent extends Component<{ vault: Promise<IVault>, id: string | undefined }, { loading: boolean, title: string, changed: boolean, modal: JSX.Element | undefined }> {
+export default class EntryComponent extends Component<{ vault: Promise<IVault>, id: string | undefined, note: string | undefined }, { title: string, changed: boolean }> {
    old_text: string;
    text: string = "";
    vault: IVault;
@@ -20,29 +22,39 @@ export default class EntryComponent extends Component<{ vault: Promise<IVault>,
 
    skip_save: boolean = false;
 
+   loading?: LoadingModal;
+
    constructor(props) {
       super(props);
-      this.state = { changed: false, title: "", modal: undefined, loading: true };
+      this.state = { changed: false, title: "" };
    }
 
    private toVault() {
-      history.back()
-      // Navigation.setPage("/vault", { id: this.vault.id }, { entry: "false" }, true);
+      // history.back()
+      Navigation.setPage("/vault", { id: this.vault.id }, { entry: "false" }, true);
    }
 
    async componentWillMount() {
       try {
          this.skip_save = false;
-         this.setState({ loading: true })
+         this.loading = new LoadingModal();
+         this.loading.show();
+
          this.vault = await this.props.vault;
          let note: ViewNote;
+         let changed = false;
          if (this.props.id)
             note = await this.vault.getNote(this.props.id)
-         else
+         else {
             note = this.vault.newNote();
+            if (this.props.note) {
+               note.__value = this.props.note;
+               changed = true;
+            }
+         }
 
          if (!note) {
-            Notes.messageObservableServer.send({ message: "Note not found!", type: MessageType.ERROR });
+            Notifications.sendNotification("Note not found!", MessageType.ERROR);
             // this.toVault()
          } else {
             this.note = note;
@@ -52,10 +64,12 @@ export default class EntryComponent extends Component<{ vault: Promise<IVault>,
                this.rows = rows;
             }
             let [title] = this.text.split("\n", 1);
-            this.setState({ loading: false, title })
+            this.setState({ title, changed })
+            if (this.loading)
+               this.loading.close();
          }
       } catch (err) {
-         Notes.sendErrorMessage(err);
+         Notifications.sendError(err);
       }
    }
 
@@ -67,7 +81,7 @@ export default class EntryComponent extends Component<{ vault: Promise<IVault>,
             this.setState({ changed: false })
          }
       } catch (err) {
-         Notes.sendErrorMessage(err);
+         Notifications.sendError(err);
       }
    }
 
@@ -110,30 +124,28 @@ export default class EntryComponent extends Component<{ vault: Promise<IVault>,
       }
    }
 
-   exitHandler() {
+   async exitHandler() {
       if (this.state.changed) {
-         let modal = <YesNoModal title="Really want to quit?" onResult={res => {
-            if (res === true) {
-               this.skip_save = true;
-               this.toVault();
-            }
-            this.setState({ modal: undefined });
-         }} />
-         this.setState({ modal })
+         let modal = new YesNoModal("Really want to quit?");
+         let res = await modal.getResult();
+         modal.close();
+         if (res === true) {
+            this.skip_save = true;
+            this.toVault();
+         }
       } else
          this.toVault()
    }
 
    textAreaKeyPress(evt: KeyboardEvent) {
+      console.log(evt);
       if ((evt.keyCode === 83 || evt.keyCode === 13) && evt.ctrlKey) {
-         event.preventDefault()
+         evt.preventDefault()
          this.save();
          return false;
       }
       else if (evt.keyCode === 27) {
-         event.preventDefault();
-         // this.skip_save = true;
-         // this.toVault()
+         evt.preventDefault();
          this.exitHandler();
          return false;
       }
@@ -141,8 +153,6 @@ export default class EntryComponent extends Component<{ vault: Promise<IVault>,
    }
 
    render() {
-      let loading_modal = this.state.loading ? <LoadingModal /> : undefined;
-
       const save_handler = async () => {
          await this.save()
          Navigation.setPage("/vault", { id: this.vault.id }, { entry: "false" }, true);
@@ -155,8 +165,6 @@ export default class EntryComponent extends Component<{ vault: Promise<IVault>,
       }
 
       return <div>
-         {loading_modal}
-         {this.state.modal}
          <header>
             <div>
                <a class="button header_icon_button" onClick={() => this.exitHandler()}><X height={undefined} width={undefined} /></a>