From eb2a93642ba68fa7736166ef543131a34d0efd57 Mon Sep 17 00:00:00 2001 From: kitelev Date: Sat, 4 Jan 2025 20:33:43 +0500 Subject: [PATCH] Change Area layout rendering with dataview --- app/src/adapters/input/layouts/AreaLayout.ts | 48 +++++++++---------- app/src/adapters/input/layouts/Layout.ts | 2 +- .../adapters/input/layouts/LayoutFactory.ts | 7 +-- app/src/utils/creators/KObjectCreator.ts | 2 +- app/src/utils/dv/DvRenderer.ts | 30 ++++++++++++ main.ts | 12 +++-- 6 files changed, 67 insertions(+), 34 deletions(-) create mode 100644 app/src/utils/dv/DvRenderer.ts diff --git a/app/src/adapters/input/layouts/AreaLayout.ts b/app/src/adapters/input/layouts/AreaLayout.ts index c0366fb..8fe805d 100644 --- a/app/src/adapters/input/layouts/AreaLayout.ts +++ b/app/src/adapters/input/layouts/AreaLayout.ts @@ -1,14 +1,15 @@ import Layout from "./Layout"; import ExoContext from "../../../../../common/ExoContext"; import Area from "../../../../../core/src/domain/Area"; +import DvRenderer from "../../../utils/dv/DvRenderer"; +import {Link} from "obsidian-dataview"; +import Effort from "../../../../../core/src/domain/effort/Effort"; export default class AreaLayout implements Layout { - constructor(private ctx: ExoContext) { + constructor(private ctx: ExoContext, private dvRender: DvRenderer) { } - async render(ko: Area): Promise { - const renderText = document.createElement("div"); - + async render(ko: Area, el: HTMLElement): Promise { const unresolvedEfforts = await this.ctx.effortRepository.find(e => { if (e.area === null) { return false; @@ -19,28 +20,27 @@ export default class AreaLayout implements Layout { }); if (unresolvedEfforts.length > 0) { - let h1 = document.createElement("h1"); - h1.textContent = "Unresolved Efforts"; - renderText.appendChild(h1); + let header = this.createH1("Unresolved Efforts"); + el.appendChild(header); - let table = document.createElement("table"); - renderText.appendChild(table); - - const headerRow = document.createElement("tr"); - const th = document.createElement("th"); - th.innerText = "Name"; - headerRow.appendChild(th); - table.appendChild(headerRow); - - for (let effort of unresolvedEfforts) { - const tr = document.createElement("tr"); - let td = document.createElement("td"); - td.textContent = "[[" + effort.title + "]]"; - tr.appendChild(td); - table.appendChild(tr); - } + const dvTable = await this.createTable(unresolvedEfforts); + el.appendChild(dvTable) } + } - return renderText; + private createH1(textContent: string) { + const h1 = document.createElement("h1"); + h1.textContent = textContent; + return h1; + } + + private async createTable(unresolvedEfforts: Effort[]) { + let effortsLinks: Link[] = unresolvedEfforts.map(e => { + let file = this.ctx.appUtils.getObjectFileOrThrow(e); + return this.dvRender.dvApi.fileLink(file.path); + }); + const dvDiv = document.createElement("div"); + await this.dvRender.list(effortsLinks, dvDiv); + return dvDiv; } } diff --git a/app/src/adapters/input/layouts/Layout.ts b/app/src/adapters/input/layouts/Layout.ts index cd31658..8f0d9fa 100644 --- a/app/src/adapters/input/layouts/Layout.ts +++ b/app/src/adapters/input/layouts/Layout.ts @@ -1,3 +1,3 @@ export default interface Layout { - render(ko: KO): Promise; + render(ko: KO, el: HTMLElement): Promise; } diff --git a/app/src/adapters/input/layouts/LayoutFactory.ts b/app/src/adapters/input/layouts/LayoutFactory.ts index 9486f6d..170c4fe 100644 --- a/app/src/adapters/input/layouts/LayoutFactory.ts +++ b/app/src/adapters/input/layouts/LayoutFactory.ts @@ -1,17 +1,18 @@ -import AreaLayout from "./AreaLayout"; import {KOC} from "../../../../../core/src/domain/KOC"; import ExoContext from "../../../../../common/ExoContext"; import KObject from "../../../../../core/src/domain/KObject"; +import AreaLayoutDv from "./AreaLayout"; +import DvRenderer from "../../../utils/dv/DvRenderer"; import Layout from "./Layout"; export default class LayoutFactory { constructor(private ctx: ExoContext) { } - create(ko: KObject): Layout | null { + create(ko: KObject, dvRender: DvRenderer): Layout | null { switch (ko.koc) { case KOC.EMS_AREA: - return new AreaLayout(this.ctx); + return new AreaLayoutDv(this.ctx, dvRender); default: return null; } diff --git a/app/src/utils/creators/KObjectCreator.ts b/app/src/utils/creators/KObjectCreator.ts index 716635c..15f2b7b 100644 --- a/app/src/utils/creators/KObjectCreator.ts +++ b/app/src/utils/creators/KObjectCreator.ts @@ -24,7 +24,7 @@ export default class KObjectCreator { case KOC.EMS_EFFORT: return await this.ctx.effortCreator.create(file); default: - throw new Error("Not implemented createFromTFileTyped") + throw new Error(`KOC '${koc}' not supported`); } } diff --git a/app/src/utils/dv/DvRenderer.ts b/app/src/utils/dv/DvRenderer.ts new file mode 100644 index 0000000..3e73417 --- /dev/null +++ b/app/src/utils/dv/DvRenderer.ts @@ -0,0 +1,30 @@ +import ExoContext from "../../../../common/ExoContext"; +import {Component, MarkdownPostProcessorContext} from "obsidian"; +import {DataviewApi} from "api/plugin-api"; +import {getAPI, Link} from "obsidian-dataview"; + +/** + * Dataview renderer for MarkdownPostProcessing + */ +export default class DvRenderer { + public readonly dvApi: DataviewApi; + + constructor(private exoCtx: ExoContext, + private mdCtx: MarkdownPostProcessorContext, + private component: Component) { + const dvApi: DataviewApi | undefined = getAPI(this.exoCtx.app); + if (!dvApi) { + throw new Error('Dataview API not available.'); + } + this.dvApi = dvApi; + } + + async list(links: Link[], el: HTMLElement) { + await this.dvApi.list( + links, + el, + this.component, + this.mdCtx.sourcePath // TODO maybe this in unnecessary + ); + } +} diff --git a/main.ts b/main.ts index 812d050..4f7e90b 100644 --- a/main.ts +++ b/main.ts @@ -3,6 +3,7 @@ import {ExoMainModal} from "./app/src/ExoMainModal"; import "localforage"; import ExoApi from "./core/src/ExoApi"; import ExoContext from "./common/ExoContext"; +import DvRenderer from "./app/src/utils/dv/DvRenderer"; export default class ExoPlugin extends Plugin { private api: ExoApi; @@ -22,16 +23,17 @@ export default class ExoPlugin extends Plugin { } if (el.classList.contains("mod-ui")) { + const renderer = new DvRenderer(this.ctx, ctx, this); + const file: TFile = this.ctx.appUtils.getFileByPathOrThrow(ctx.sourcePath); - console.log(file) const ko = await this.ctx.kObjectCreator.createFromTFileTyped(file); - const layout = this.ctx.layoutFactory.create(ko); - if (!layout) { + + const layout = this.ctx.layoutFactory.create(ko, renderer); + if (layout === null) { return; } - const renderText = await layout.render(ko); - el.prepend(renderText); + await layout.render(ko, el); } }); }