fix(mindmap): use dynamic import instead of static one

This commit is contained in:
Elian Doran 2025-01-19 23:34:57 +02:00
parent fb0dda982f
commit 9820e8aa12
No known key found for this signature in database
2 changed files with 15 additions and 8 deletions

View File

@ -27,7 +27,7 @@ export default class FBlob {
/** /**
* @throws Error in case of invalid JSON * @throws Error in case of invalid JSON
*/ */
getJsonContent(): unknown { getJsonContent<T>(): T | null {
if (!this.content || !this.content.trim()) { if (!this.content || !this.content.trim()) {
return null; return null;
} }

View File

@ -1,6 +1,6 @@
import TypeWidget from "./type_widget.js"; import TypeWidget from "./type_widget.js";
import utils from "../../services/utils.js"; import utils from "../../services/utils.js";
import MindElixir, { type MindElixirCtor } from "mind-elixir"; import type { MindElixirCtor } from "mind-elixir";
import nodeMenu from "@mind-elixir/node-menu"; import nodeMenu from "@mind-elixir/node-menu";
import type FNote from "../../entities/fnote.js"; import type FNote from "../../entities/fnote.js";
import type { EventData } from "../../components/app_context.js"; import type { EventData } from "../../components/app_context.js";
@ -141,11 +141,16 @@ const TPL = `
</div> </div>
`; `;
interface MindmapModel {
direction: number;
}
export default class MindMapWidget extends TypeWidget { export default class MindMapWidget extends TypeWidget {
private $content!: JQuery<HTMLElement>; private $content!: JQuery<HTMLElement>;
private triggeredByUserOperation?: boolean; private triggeredByUserOperation?: boolean;
private mind?: ReturnType<MindElixirCtor["new"]>; private mind?: ReturnType<MindElixirCtor["new"]>;
private MindElixir: any; // TODO: Fix type
static getType() { static getType() {
return "mindMap"; return "mindMap";
@ -188,25 +193,27 @@ export default class MindMapWidget extends TypeWidget {
async #loadData(note: FNote) { async #loadData(note: FNote) {
const blob = await note.getBlob(); const blob = await note.getBlob();
const content = blob?.getJsonContent() || MindElixir.new(NEW_TOPIC_NAME); const content = blob?.getJsonContent<MindmapModel>();
if (!this.mind) { if (!this.mind) {
this.#initLibrary(content.direction ?? MindElixir.LEFT); await this.#initLibrary(content?.direction ?? this.MindElixir.LEFT);
} }
this.mind.refresh(content); this.mind.refresh(content ?? this.MindElixir.new(NEW_TOPIC_NAME));
this.mind.toCenter(); this.mind.toCenter();
} }
#initLibrary(direction: unknown) { async #initLibrary(direction: unknown) {
const mind = new MindElixir({ this.MindElixir = (await import("mind-elixir")).default;
const mind = new this.MindElixir({
el: this.$content[0], el: this.$content[0],
direction direction
}); });
mind.install(nodeMenu); mind.install(nodeMenu);
this.mind = mind; this.mind = mind;
mind.init(MindElixir.new(NEW_TOPIC_NAME)); mind.init(this.MindElixir.new(NEW_TOPIC_NAME));
// TODO: See why the typeof mindmap is not correct. // TODO: See why the typeof mindmap is not correct.
mind.bus.addListener("operation", (operation: { name: string }) => { mind.bus.addListener("operation", (operation: { name: string }) => {
this.triggeredByUserOperation = true; this.triggeredByUserOperation = true;