From 10ceba47e10ec2938a6761a0913e5eebb00e4540 Mon Sep 17 00:00:00 2001 From: TfTHacker Date: Fri, 5 Apr 2024 17:04:48 +0200 Subject: [PATCH] more preact conversion --- .editorconfig | 4 +- package.json | 24 ++++++- prettier.config.cjs | 1 - src/main.ts | 62 +++++-------------- src/ui/sidebar-pane.tsx | 21 ++----- ...htmlDecorations.ts => htmlDecorations.tsx} | 36 ++++++----- 6 files changed, 62 insertions(+), 86 deletions(-) rename src/view-extensions/{htmlDecorations.ts => htmlDecorations.tsx} (82%) diff --git a/.editorconfig b/.editorconfig index 2d1f06a..e9f48ba 100644 --- a/.editorconfig +++ b/.editorconfig @@ -4,7 +4,7 @@ root = true [*] indent_style = space -indent_size = 2 +indent_size = 2 end_of_line = lf charset = utf-8 trim_trailing_whitespace = true @@ -15,7 +15,7 @@ indent_style = space indent_size = 2 [*.md] -max_line_length = 90 +max_line_length = 140 indent_style = space indent_size = 2 end_of_line = lf diff --git a/package.json b/package.json index 739d46a..b7e5dc0 100644 --- a/package.json +++ b/package.json @@ -21,13 +21,31 @@ "@codemirror/state": "^6.4.1", "@codemirror/view": "^6.26.1", "@types/node": "^20.12.4", - "@types/obsidian-typings": "github:Fevol/obsidian-typings", - "@typescript-eslint/eslint-plugin": "^7.5.0", - "@typescript-eslint/parser": "^7.5.0", "builtin-modules": "3.3.0", "esbuild": "0.20.2", "eslint": "^8.57.0", + "@html-eslint/eslint-plugin": "^0.24.0", + "@html-eslint/parser": "^0.24.0", + "@types/obsidian-typings": "github:Fevol/obsidian-typings", + "@typescript-eslint/eslint-plugin": "^7.5.0", + "@typescript-eslint/parser": "^7.5.0", + "@typescript-eslint/utils": "^7.5.0", + "eslint-config-prettier": "^9.1.0", + "eslint-import-resolver-typescript": "^3.6.1", + "eslint-plugin-css": "^0.9.2", + "eslint-plugin-eslint-comments": "^3.2.0", + "eslint-plugin-import": "^2.29.1", + "eslint-plugin-jsonc": "^2.15.0", + "eslint-plugin-mdx": "^3.1.5", + "eslint-plugin-only-warn": "^1.1.0", + "eslint-plugin-prettier": "^5.1.3", + "eslint-plugin-tsdoc": "^0.2.17", + "eslint-plugin-yml": "^1.14.0", "prettier": "^3.2.5", + "remark-preset-lint-consistent": "^5.1.2", + "remark-preset-lint-markdown-style-guide": "^5.1.3", + "remark-preset-lint-recommended": "^6.1.3", + "remark-preset-prettier": "^2.0.1", "tslib": "^2.6.2", "typescript": "5.4.4", "obsidian": "1.5.7" diff --git a/prettier.config.cjs b/prettier.config.cjs index 1a28e50..937d3b3 100644 --- a/prettier.config.cjs +++ b/prettier.config.cjs @@ -1,4 +1,3 @@ -// eslint-disable-next-line tsdoc/syntax -- ignore for prettier config /** @type {import("prettier").Config} */ const config = { plugins: [ diff --git a/src/main.ts b/src/main.ts index 25ee139..eef1b86 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1,32 +1,19 @@ import { Extension } from '@codemirror/state'; -import { - debounce, - MarkdownPostProcessor, - MarkdownPreviewRenderer, - Platform, - Plugin, -} from 'obsidian'; +import { debounce, MarkdownPostProcessor, MarkdownPreviewRenderer, Platform, Plugin } from 'obsidian'; import { buildLinksAndReferences, setPluginVariableForIndexer } from './indexer'; -import { - InlineReferenceExtension, - setPluginVariableForCM6InlineReferences, -} from './view-extensions/references-cm6'; +import { InlineReferenceExtension, setPluginVariableForCM6InlineReferences } from './view-extensions/references-cm6'; import { setPluginVariableForHtmlDecorations } from './view-extensions/htmlDecorations'; import markdownPreviewProcessor, { - setPluginVariableForMarkdownPreviewProcessor, + setPluginVariableForMarkdownPreviewProcessor } from './view-extensions/references-preview'; -import ReferenceGutterExtension, { - setPluginVariableForCM6Gutter, -} from './view-extensions/gutters-cm6'; -import setHeaderWithReferenceCounts, { - setPluginVariableForHeaderRefCount, -} from './ui/headerRefCount'; +import ReferenceGutterExtension, { setPluginVariableForCM6Gutter } from './view-extensions/gutters-cm6'; +import setHeaderWithReferenceCounts, { setPluginVariableForHeaderRefCount } from './ui/headerRefCount'; import { SideBarPaneView, VIEW_TYPE_SNW } from './ui/sidebar-pane'; import { SettingsTab, Settings, DEFAULT_SETTINGS } from './ui/settingsTab'; import SnwAPI from './snwApi'; import { setPluginVariableForUIC } from './ui/components/uic-ref--parent'; -import PluginCommands from './pluginCommands'; import { setPluginVariableUIC_RefArea } from './ui/components/uic-ref-area'; +import PluginCommands from './PluginCommands'; export default class SNWPlugin extends Plugin { appName = this.manifest.name; @@ -62,8 +49,7 @@ export default class SNWPlugin extends Plugin { this.addSettingTab(new SettingsTab(this.app, this)); // set current state based on startup parameters - if (Platform.isMobile || Platform.isMobileApp) - this.showCountsActive = this.settings.enableOnStartupMobile; + if (Platform.isMobile || Platform.isMobileApp) this.showCountsActive = this.settings.enableOnStartupMobile; else this.showCountsActive = this.settings.enableOnStartupDesktop; this.registerView(VIEW_TYPE_SNW, (leaf) => new SideBarPaneView(leaf, this)); @@ -83,7 +69,7 @@ export default class SNWPlugin extends Plugin { this.app.workspace.registerHoverLinkSource(this.appID, { display: this.appName, - defaultMod: true, + defaultMod: true }); this.snwAPI.settings = this.settings; @@ -97,9 +83,7 @@ export default class SNWPlugin extends Plugin { this.app.workspace.onLayoutReady(async () => { if (!this.app.workspace.getLeavesOfType(VIEW_TYPE_SNW)?.length) { - await this.app.workspace - .getRightLeaf(false) - .setViewState({ type: VIEW_TYPE_SNW, active: false }); + await this.app.workspace.getRightLeaf(false).setViewState({ type: VIEW_TYPE_SNW, active: false }); } const resolved = this.app.metadataCache.on('resolved', async () => { buildLinksAndReferences(); @@ -121,21 +105,13 @@ export default class SNWPlugin extends Plugin { * @param {number} lineNu * @memberof ThePlugin */ - async activateView( - refType: string, - realLink: string, - key: string, - filePath: string, - lineNu: number - ) { + async activateView(refType: string, realLink: string, key: string, filePath: string, lineNu: number) { this.lastSelectedReferenceType = refType; this.lastSelectedReferenceRealLink = realLink; this.lastSelectedReferenceKey = key; this.lastSelectedReferenceFilePath = filePath; this.lastSelectedLineNumber = lineNu; - await ( - this.app.workspace.getLeavesOfType(VIEW_TYPE_SNW)[0].view as SideBarPaneView - ).updateView(); + await (this.app.workspace.getLeavesOfType(VIEW_TYPE_SNW)[0].view as SideBarPaneView).updateView(); this.app.workspace.revealLeaf(this.app.workspace.getLeavesOfType(VIEW_TYPE_SNW)[0]); } @@ -156,14 +132,8 @@ export default class SNWPlugin extends Plugin { * @memberof ThePlugin */ toggleStateSNWMarkdownPreview(): void { - if ( - this.settings.displayInlineReferencesMarkdown && - this.showCountsActive && - this.markdownPostProcessor === null - ) { - this.markdownPostProcessor = this.registerMarkdownPostProcessor((el, ctx) => - markdownPreviewProcessor(el, ctx) - ); + if (this.settings.displayInlineReferencesMarkdown && this.showCountsActive && this.markdownPostProcessor === null) { + this.markdownPostProcessor = this.registerMarkdownPostProcessor((el, ctx) => markdownPreviewProcessor(el, ctx)); } else { if (!this.markdownPostProcessor) { console.log('Markdown post processor is not registered'); @@ -211,11 +181,7 @@ export default class SNWPlugin extends Plugin { * @param {Extension} extension * @memberof ThePlugin */ - updateCMExtensionState( - extensionIdentifier: string, - extensionState: boolean, - extension: Extension - ) { + updateCMExtensionState(extensionIdentifier: string, extensionState: boolean, extension: Extension) { if (extensionState == true) { this.editorExtensions.push(extension); // @ts-ignore diff --git a/src/ui/sidebar-pane.tsx b/src/ui/sidebar-pane.tsx index ffad45a..3b333ad 100644 --- a/src/ui/sidebar-pane.tsx +++ b/src/ui/sidebar-pane.tsx @@ -33,9 +33,7 @@ export class SideBarPaneView extends ItemView { render(
Discovering Strange New Worlds...
-
- Click a reference counter in the main document for information to appear here. -
+
Click a reference counter in the main document for information to appear here.
, this.containerEl ); @@ -49,22 +47,11 @@ export class SideBarPaneView extends ItemView { const lineNu = this.thePlugin.lastSelectedLineNumber; if (this.thePlugin.snwAPI.enableDebugging.SidePane) { - this.thePlugin.snwAPI.console( - 'sidepane.open() refType, realLink, key, filePath', - refType, - realLink, - key, - filePath - ); - this.thePlugin.snwAPI.console( - 'sidepane.open() getReferencesCache()', - getReferencesCache() - ); + this.thePlugin.snwAPI.console('sidepane.open() refType, realLink, key, filePath', refType, realLink, key, filePath); + this.thePlugin.snwAPI.console('sidepane.open() getReferencesCache()', getReferencesCache()); } - this.containerEl.replaceChildren( - await getUIC_SidePane(refType, realLink, key, filePath, lineNu) - ); + this.containerEl.replaceChildren(await getUIC_SidePane(refType, realLink, key, filePath, lineNu)); scrollResultsIntoView(this.containerEl); } diff --git a/src/view-extensions/htmlDecorations.ts b/src/view-extensions/htmlDecorations.tsx similarity index 82% rename from src/view-extensions/htmlDecorations.ts rename to src/view-extensions/htmlDecorations.tsx index 501fe0d..894a1c5 100644 --- a/src/view-extensions/htmlDecorations.ts +++ b/src/view-extensions/htmlDecorations.tsx @@ -3,6 +3,7 @@ import tippy from 'tippy.js'; import 'tippy.js/dist/tippy.css'; import { getUIC_Hoverview } from 'src/ui/components/uic-ref--parent'; import { Platform } from 'obsidian'; +import { render } from 'preact'; let thePlugin: SNWPlugin; @@ -44,27 +45,32 @@ export function htmlDecorationForReferencesElement( filePath ); - const element = createDiv({ cls: 'snw-reference snw-' + referenceType }); - element.innerText = count.toString(); - element.setAttribute('data-snw-type', referenceType); - element.setAttribute('data-snw-reallink', realLink); - element.setAttribute('data-snw-key', key); - element.setAttribute('data-snw-filepath', filePath); - element.setAttribute('snw-data-line-number', lineNu.toString()); - if (attachCSSClass) element.addClass(attachCSSClass); + const referenceElementJsx = ( +
+ {count.toString()} +
+ ); + + const refenceElement = createDiv(); + render(referenceElementJsx, refenceElement); + const refCountBox = refenceElement.firstElementChild as HTMLElement; if (Platform.isDesktop || Platform.isDesktopApp) //click is default to desktop, otherwise mobile behaves differently - element.onclick = async (e: MouseEvent) => - processHtmlDecorationReferenceEvent(e.target as HTMLElement); + refCountBox.onclick = async (e: MouseEvent) => processHtmlDecorationReferenceEvent(e.target as HTMLElement); - if (thePlugin?.snwAPI.enableDebugging?.HtmlDecorationElements) - thePlugin.snwAPI.console('returned element', element); + if (thePlugin?.snwAPI.enableDebugging?.HtmlDecorationElements) thePlugin.snwAPI.console('returned element', refenceElement); const requireModifierKey = thePlugin.settings.requireModifierKeyToActivateSNWView; // defaults to showing tippy on hover, but if requireModifierKey is true, then only show on ctrl/meta key let showTippy = true; - const tippyObject = tippy(element, { + const tippyObject = tippy(refCountBox, { interactive: true, appendTo: () => document.body, allowHTML: true, @@ -87,12 +93,12 @@ export function htmlDecorationForReferencesElement( setTimeout(async () => { await getUIC_Hoverview(instance); }, 1); - }, + } }); tippyObject.popper.classList.add('snw-tippy'); - return element; + return refenceElement; } export /**