From dcde6aaf7cfbefcd387c98cbddf7f3ae0c9d9ed7 Mon Sep 17 00:00:00 2001 From: Zef Hemel Date: Sat, 13 Jul 2024 14:55:35 +0200 Subject: [PATCH] Better updating of decorations --- type/web.ts | 3 +- web/client.ts | 12 ++++++ web/client_system.ts | 7 ++++ web/cm_plugins/wiki_link.ts | 7 +++- web/reducer.ts | 81 +++++++++++++++++++++++++++---------- web/styles/main.scss | 5 +++ 6 files changed, 90 insertions(+), 25 deletions(-) diff --git a/type/web.ts b/type/web.ts index 616b8063..6991bc61 100644 --- a/type/web.ts +++ b/type/web.ts @@ -4,8 +4,8 @@ import { AppCommand } from "../lib/command.ts"; import { defaultSettings } from "$common/settings.ts"; import { ActionButton, - EmojiConfig, Decoration, + EmojiConfig, FilterOption, Notification, PanelMode, @@ -125,6 +125,7 @@ export type Action = | { type: "page-changed" } | { type: "page-saved" } | { type: "sync-change"; syncSuccess: boolean } + | { type: "update-current-page-meta"; meta: PageMeta } | { type: "update-page-list"; allPages: PageMeta[] } | { type: "settings-loaded"; settings: BuiltinSettings } | { type: "start-navigate"; mode: "page" | "meta" } diff --git a/web/client.ts b/web/client.ts index c40885e2..66efc265 100644 --- a/web/client.ts +++ b/web/client.ts @@ -713,6 +713,18 @@ export class Client { this.currentPage, meta, ); + const enrichedMeta = await this.clientSystem.getObjectByRef< + PageMeta + >( + this.currentPage, + "page", + this.currentPage, + ); + this.ui.viewDispatch({ + type: "update-current-page-meta", + meta: enrichedMeta, + }); + resolve(); }) .catch((e) => { diff --git a/web/client_system.ts b/web/client_system.ts index 09085368..4ef6c068 100644 --- a/web/client_system.ts +++ b/web/client_system.ts @@ -240,4 +240,11 @@ export class ClientSystem extends CommonSystem { ["index.queryObjects", tag, query], ); } + + getObjectByRef(page: string, tag: string, ref: string) { + return this.localSyscall( + "system.invokeFunction", + ["index.getObjectByRef", page, tag, ref], + ); + } } diff --git a/web/cm_plugins/wiki_link.ts b/web/cm_plugins/wiki_link.ts index a0e4d733..f1817195 100644 --- a/web/cm_plugins/wiki_link.ts +++ b/web/cm_plugins/wiki_link.ts @@ -66,9 +66,12 @@ export function cleanWikiLinkPlugin(client: Client) { } return; } - const pageMeta = client.ui.viewState.allPages.find(p => p.name == url); + const pageMeta = client.ui.viewState.allPages.find((p) => + p.name == url + ); const linkText = alias || - (pageMeta?.pageDecorations.prefix ?? "") + (url.includes("/") ? url.split("/").pop()! : url); + (pageMeta?.pageDecorations?.prefix ?? "") + + (url.includes("/") ? url.split("/").pop()! : url); // And replace it with a widget widgets.push( diff --git a/web/reducer.ts b/web/reducer.ts index 229d7fd0..36479f04 100644 --- a/web/reducer.ts +++ b/web/reducer.ts @@ -1,6 +1,6 @@ +import { Decoration } from "$lib/web.ts"; import { PageMeta } from "../plug-api/types.ts"; import { Action, AppViewState } from "../type/web.ts"; -import { PageState } from "./navigator.ts"; export default function reducer( state: AppViewState, @@ -22,11 +22,13 @@ export default function reducer( }; case "page-loaded": { const mouseDetected = window.matchMedia("(pointer:fine)").matches; - const pageMeta = state.allPages.find(p => p.name == action.meta.name); - const decor = state.settings.decorations?.filter(d => pageMeta?.tags?.some(t => d.tag === t)); + const pageMeta = state.allPages.find((p) => p.name == action.meta.name); + const decor = state.settings.decorations?.filter((d) => + pageMeta?.tags?.some((t) => d.tag === t) + ); if (decor && decor.length > 0) { const mergedDecorations = decor.reduceRight((accumulator, el) => { - accumulator = {...accumulator, ...el}; + accumulator = { ...accumulator, ...el }; return accumulator; }); if (mergedDecorations) { @@ -52,11 +54,26 @@ export default function reducer( ...state, unsavedChanges: true, }; - case "page-saved": + case "page-saved": { return { ...state, unsavedChanges: false, }; + } + case "update-current-page-meta": { + if (state.settings.decorations) { + decoratePageMeta( + action.meta, + "", + action.meta, + state.settings.decorations, + ); + } + return { + ...state, + currentPageMeta: action.meta, + }; + } case "sync-change": return { ...state, @@ -81,22 +98,13 @@ export default function reducer( if (oldPageMetaItem && oldPageMetaItem.lastOpened) { pageMeta.lastOpened = oldPageMetaItem.lastOpened; } - const decor = state.settings.decorations?.filter(d => pageMeta.tags?.some((t: any) => d.tag === t)); - // Page can have multiple decorations applied via different tags, accumulate them. - // The decorations higher in the decorations list defined in SETTINGS gets - // higher precedence. - if (decor && decor.length > 0) { - const mergedDecorations = decor.reduceRight((accumulator, el) => { - accumulator = {...accumulator, ...el}; - return accumulator; - }); - if (mergedDecorations) { - const { tag, ...currPageDecorations} = mergedDecorations; - pageMeta.pageDecorations = currPageDecorations; - if (pageMeta.name === state.currentPage) { - currPageMeta!.pageDecorations = currPageDecorations; - } - } + if (state.settings.decorations) { + decoratePageMeta( + pageMeta, + state.currentPage!, + currPageMeta, + state.settings.decorations, + ); } } return { @@ -237,5 +245,34 @@ export default function reducer( progressPerc: action.progressPerc, }; } - return state; +} + +/** + * Decorates (= attaches a pageDecorations field) to the pageMeta object when a matching decorator is found + */ +function decoratePageMeta( + pageMeta: PageMeta, + currentPage: string, + currPageMeta: PageMeta, + decorations: Decoration[], +) { + const decor = decorations.filter((d) => + pageMeta.tags?.some((t: any) => d.tag === t) + ); + // Page can have multiple decorations applied via different tags, accumulate them. + // The decorations higher in the decorations list defined in SETTINGS gets + // higher precedence. + if (decor && decor.length > 0) { + const mergedDecorations = decor.reduceRight((accumulator, el) => { + accumulator = { ...accumulator, ...el }; + return accumulator; + }); + if (mergedDecorations) { + const { tag, ...currPageDecorations } = mergedDecorations; + pageMeta.pageDecorations = currPageDecorations; + if (pageMeta.name === currentPage) { + currPageMeta!.pageDecorations = currPageDecorations; + } + } + } } diff --git a/web/styles/main.scss b/web/styles/main.scss index 70997251..0bd3d5ae 100644 --- a/web/styles/main.scss +++ b/web/styles/main.scss @@ -215,6 +215,11 @@ body { padding: 1px; margin-right: 3px; font-family: var(--ui-font); + + &:empty { + margin-right: 0; + padding: 0; + } } .sb-panel {