feat(geomap): add prompt for creating child note

src/public/app/components/app_context.ts

@@ -266,7 +266,10 @@ type EventMappings = {
     };
     exportSvg: {
         ntxId: string;
-    }
+    };
+    geoMapCreateChildNote: {
+        ntxId: string | null | undefined; // TODO: deduplicate ntxId
+    };
 };
 
 export type EventListener<T extends EventNames> = {

src/public/app/components/component.ts

@@ -61,7 +61,7 @@ export class TypedComponent<ChildT extends TypedComponent<ChildT>> {
         }
     }
 
-    triggerEvent(name: string, data = {}): Promise<unknown> | undefined | null {
+    triggerEvent<T extends EventNames>(name: T, data: EventData<T>): Promise<unknown> | undefined | null {
         return this.parent?.triggerEvent(name, data);
     }
 

src/public/app/widgets/floating_buttons/geo_map_button.ts

@@ -35,6 +35,7 @@ export default class GeoMapButtons extends NoteContextAwareWidget {
         super.doRender();
 
         this.$widget = $(TPL);
+        this.$widget.find(".geo-map-create-child-note").on("click", () => this.triggerEvent("geoMapCreateChildNote", { ntxId: this.ntxId }));
     }
 
 }

src/public/app/widgets/floating_buttons/relation_map_buttons.js

@@ -13,16 +13,16 @@ const TPL = `
     <button type="button"
             class="relation-map-create-child-note floating-button btn bx bx-folder-plus"
             title="${t("relation_map_buttons.create_child_note_title")}"></button>
-    
+
     <button type="button"
             class="relation-map-reset-pan-zoom floating-button btn bx bx-crop"
             title="${t("relation_map_buttons.reset_pan_zoom_title")}"></button>
-    
+
     <div class="btn-group">
         <button type="button"
                 class="relation-map-zoom-in floating-button btn bx bx-zoom-in"
                 title="${t("relation_map_buttons.zoom_in_title")}"></button>
-    
+
         <button type="button"
                 class="relation-map-zoom-out floating-button btn bx bx-zoom-out"
                 title="${t("relation_map_buttons.zoom_out_title")}"></button>
@@ -43,6 +43,7 @@ export default class RelationMapButtons extends NoteContextAwareWidget {
         this.$zoomOutButton = this.$widget.find(".relation-map-zoom-out");
         this.$resetPanZoomButton = this.$widget.find(".relation-map-reset-pan-zoom");
 
+        // TODO: Deduplicate object creation here.
         this.$createChildNote.on("click", () => this.triggerEvent("relationMapCreateChildNote", { ntxId: this.ntxId }));
         this.$resetPanZoomButton.on("click", () => this.triggerEvent("relationMapResetPanZoom", { ntxId: this.ntxId }));
 

src/public/app/widgets/type_widgets/geo_map.ts

@@ -2,6 +2,11 @@ import type { LatLng } from "leaflet";
 import type FNote from "../../entities/fnote.js";
 import GeoMapWidget from "../geo_map.js";
 import TypeWidget from "./type_widget.js"
+import server from "../../services/server.js";
+import toastService from "../../services/toast.js";
+import dialogService from "../../services/dialog.js";
+import type { EventData } from "../../components/app_context.js";
+import { t } from "../../services/i18n.js";
 
 const TPL = `\
 <div class="note-detail-geo-map note-detail-printable">
@@ -19,9 +24,22 @@ interface MapData {
     }
 }
 
+// TODO: Deduplicate
+interface CreateChildResponse {
+    note: {
+        noteId: string;
+    }
+}
+
+interface Clipboard {
+    noteId: string;
+    title: string;
+}
+
 export default class GeoMapTypeWidget extends TypeWidget {
 
     private geoMapWidget: GeoMapWidget;
+    private clipboard?: Clipboard;
 
     static getType() {
         return "geoMap";
@@ -82,6 +100,28 @@ export default class GeoMapTypeWidget extends TypeWidget {
         };
     }
 
+    async geoMapCreateChildNoteEvent({ ntxId }: EventData<"geoMapCreateChildNote">) {
+        if (!this.isNoteContext(ntxId)) {
+            return;
+        }
+
+        const title = await dialogService.prompt({ message: t("relation_map.enter_title_of_new_note"), defaultValue: t("relation_map.default_new_note_title") });
+
+        if (!title?.trim()) {
+            return;
+        }
+
+        const { note } = await server.post<CreateChildResponse>(`notes/${this.noteId}/children?target=into`, {
+            title,
+            content: "",
+            type: "text"
+        });
+
+        toastService.showMessage(t("relation_map.click_on_canvas_to_place_new_note"));
+
+        this.clipboard = { noteId: note.noteId, title };
+    }
+
     async doRefresh(note: FNote) {
         await this.geoMapWidget.refresh();
     }