update to bun

.github/workflows/release.yml

@@ -1,86 +1,33 @@
-name: Release plugin
+name: Release Obsidian plugin
 
 on:
     push:
-        # Sequence of patterns matched against refs/tags
         tags:
-            - "*" # Push events to matching any tag format, i.e. 1.0, 20.15.10
-
-env:
-    PLUGIN_NAME: obisidian-3d-graph
+            - "*"
 
 jobs:
     build:
         runs-on: ubuntu-latest
 
         steps:
-            - uses: jetli/wasm-pack-action@v0.3.0
+            - uses: actions/checkout@v3
+
+            - uses: oven-sh/setup-bun@v1
               with:
-                  # Optional version of wasm-pack to install(eg. 'v0.9.1', 'latest')
-                  version: "latest"
-            - uses: actions/checkout@v2
-            - name: Use Node.js
-              uses: actions/setup-node@v1
-              with:
-                  node-version: "14.x" # You might need to adjust this value to your own version
-            - name: Build
-              id: build
+                  bun-version: latest
+
+            - name: Build plugin
               run: |
-                  npm install
-                  npm run build
-                  mkdir ${{ env.PLUGIN_NAME }}
-                  cp main.js manifest.json styles.css ${{ env.PLUGIN_NAME }}
-                  zip -r ${{ env.PLUGIN_NAME }}.zip ${{ env.PLUGIN_NAME }}
-                  ls
-                  echo "::set-output name=tag_name::$(git tag --sort version:refname | tail -n 1)"
-            - name: Create Release
-              id: create_release
-              uses: actions/create-release@v1
+                  bun install 
+                  bun run build
+
+            - name: Create release
               env:
-                  GITHUB_TOKEN: ${{ secrets.OBSIDIAN_3D_GRAPH_TOKEN }}
-                  VERSION: ${{ github.ref }}
-              with:
-                  tag_name: ${{ github.ref }}
-                  release_name: ${{ github.ref }}
-                  draft: false
-                  prerelease: false
-            - name: Upload zip file
-              id: upload-zip
-              uses: actions/upload-release-asset@v1
-              env:
-                  GITHUB_TOKEN: ${{ secrets.OBSIDIAN_3D_GRAPH_TOKEN }}
-              with:
-                  upload_url: ${{ steps.create_release.outputs.upload_url }}
-                  asset_path: ./${{ env.PLUGIN_NAME }}.zip
-                  asset_name: ${{ env.PLUGIN_NAME }}-${{ steps.build.outputs.tag_name }}.zip
-                  asset_content_type: application/zip
-            - name: Upload main.js
-              id: upload-main
-              uses: actions/upload-release-asset@v1
-              env:
-                  GITHUB_TOKEN: ${{ secrets.OBSIDIAN_3D_GRAPH_TOKEN }}
-              with:
-                  upload_url: ${{ steps.create_release.outputs.upload_url }}
-                  asset_path: ./main.js
-                  asset_name: main.js
-                  asset_content_type: text/javascript
-            - name: Upload manifest.json
-              id: upload-manifest
-              uses: actions/upload-release-asset@v1
-              env:
-                  GITHUB_TOKEN: ${{ secrets.OBSIDIAN_3D_GRAPH_TOKEN }}
-              with:
-                  upload_url: ${{ steps.create_release.outputs.upload_url }}
-                  asset_path: ./manifest.json
-                  asset_name: manifest.json
-                  asset_content_type: application/json
-            - name: Upload main.js
-              id: upload-css
-              uses: actions/upload-release-asset@v1
-              env:
-                  GITHUB_TOKEN: ${{ secrets.OBSIDIAN_3D_GRAPH_TOKEN }}
-              with:
-                  upload_url: ${{ steps.create_release.outputs.upload_url }}
-                  asset_path: ./styles.css
-                  asset_name: styles.css
-                  asset_content_type: text/css
+                  GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+              run: |
+                  tag="${GITHUB_REF#refs/tags/}"
+
+                  gh release create "$tag" \
+                    --title="$tag" \
+                    --draft \
+                    main.js manifest.json styles.css

.husky/pre-push

@@ -0,0 +1,5 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+bun run typecheck
+bun run build

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2022 Alexander Weichart
+Copyright (c) 2023 Hananoshika Yomuru
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -1,4 +1,6 @@
-## Obsidian 3D Graph
+## Obsidian 3D Graph (Yomaru)
+
+> This is a fork from the original https://github.com/AlexW00/obsidian-3d-graph
 
 A 3D Graph for Obsidian!
 
@@ -8,9 +10,10 @@ https://user-images.githubusercontent.com/55558407/190087315-8386feee-b861-4520-
 
 ### ⬇️ Installation
 
-3D-Graph is an official community plugin. You can download by: 
-- clicking [here](https://obsidian.md/plugins?id=3d-graph)
-- searching for "3D Graph" in the Obsidian plugins tab
+3D-Graph is an official community plugin. You can download by:
+
+-   clicking [here](https://obsidian.md/plugins?id=3d-graph)
+-   searching for "3D Graph" in the Obsidian plugins tab
 
 ### 👨‍💻 Development
 

bun-fix.d.ts

@@ -0,0 +1,2 @@
+/// <reference lib="dom" />
+/// <reference lib="dom.iterable" />

esbuild.config.mjs

@@ -1,42 +1,48 @@
 import esbuild from "esbuild";
 import process from "process";
-import builtins from 'builtin-modules'
+import builtins from "builtin-modules";
 
-const banner =
-`/*
+const banner = `/*
 THIS IS A GENERATED/BUNDLED FILE BY ESBUILD
 if you want to view the source, please visit the github repository of this plugin
 */
 `;
 
-const prod = (process.argv[2] === 'production');
+const prod = process.argv[2] === "production";
 
-esbuild.build({
+const context = await esbuild.context({
 	banner: {
 		js: banner,
 	},
-	entryPoints: ['src/main.ts'],
+	entryPoints: ["src/main.ts"],
 	bundle: true,
 	external: [
-		'obsidian',
-		'electron',
-		'@codemirror/autocomplete',
-		'@codemirror/collab',
-		'@codemirror/commands',
-		'@codemirror/language',
-		'@codemirror/lint',
-		'@codemirror/search',
-		'@codemirror/state',
-		'@codemirror/view',
-		'@lezer/common',
-		'@lezer/highlight',
-		'@lezer/lr',
-		...builtins],
-	format: 'cjs',
-	watch: !prod,
-	target: 'es2018',
+		"obsidian",
+		"electron",
+		"@codemirror/autocomplete",
+		"@codemirror/collab",
+		"@codemirror/commands",
+		"@codemirror/language",
+		"@codemirror/lint",
+		"@codemirror/search",
+		"@codemirror/state",
+		"@codemirror/view",
+		"@lezer/common",
+		"@lezer/highlight",
+		"@lezer/lr",
+		...builtins,
+	],
+	format: "cjs",
+	target: "es2018",
 	logLevel: "info",
-	sourcemap: prod ? false : 'inline',
+	sourcemap: prod ? false : "inline",
 	treeShaking: true,
-	outfile: 'main.js',
-}).catch(() => process.exit(1));
+	outfile: "main.js",
+});
+
+if (prod) {
+	await context.rebuild();
+	process.exit(0);
+} else {
+	await context.watch();
+}

package.json

@@ -4,27 +4,39 @@
 	"description": "A 3D graph for Obsidian",
 	"main": "main.js",
 	"scripts": {
-		"dev": "node esbuild.config.mjs",
-		"build": "tsc -noEmit -skipLibCheck && node esbuild.config.mjs production",
+		"dev": "bun esbuild.config.mjs",
+		"build": "bun esbuild.config.mjs production",
+		"version": "bun version-bump.mjs && git add manifest.json versions.json",
 		"build:copy": "npm run build && ./copy_to_vault.sh ~/Desktop/YouTube",
-		"version": "node version-bump.mjs && git add manifest.json versions.json"
+		"prepare": "husky install",
+		"typecheck": " tsc -noEmit -skipLibCheck"
 	},
-	"keywords": [],
-	"author": "",
+	"keywords": [
+		"obsidian",
+		"plugin",
+		"3D",
+		"D3",
+		"3D graph",
+		"graph"
+	],
+	"author": "Hananoshika Yomaru",
 	"license": "MIT",
 	"devDependencies": {
+		"@total-typescript/ts-reset": "^0.5.1",
 		"@types/d3": "^7.4.0",
 		"@types/node": "^16.11.6",
 		"@typescript-eslint/eslint-plugin": "5.29.0",
 		"@typescript-eslint/parser": "5.29.0",
 		"builtin-modules": "3.3.0",
-		"esbuild": "0.14.47",
+		"bun-types": "^1.0.5",
+		"esbuild": "0.17.3",
+		"husky": "^8.0.3",
 		"obsidian": "latest",
 		"tslib": "2.4.0",
-		"typescript": "4.7.4"
+		"typescript": "^5.0.5"
 	},
 	"dependencies": {
-		"3d-force-graph": "^1.70.12",
+		"3d-force-graph": "^1.72.3",
 		"d3": "^7.6.1",
 		"observable-slim": "^0.1.6"
 	}

src/graph/Graph.ts

@@ -26,6 +26,7 @@ export default class Graph {
 	public getNodeById(id: string): Node | null {
 		const index = this.nodeIndex.get(id);
 		if (index !== undefined) {
+			// @ts-ignore
 			return this.nodes[index];
 		}
 		return null;
@@ -40,6 +41,7 @@ export default class Graph {
 		if (sourceLinkMap) {
 			const index = sourceLinkMap.get(targetNodeId);
 			if (index !== undefined) {
+				// @ts-ignore
 				return this.links[index];
 			}
 		}
@@ -50,6 +52,7 @@ export default class Graph {
 	public getLinksFromNode(sourceNodeId: string): Link[] {
 		const sourceLinkMap = this.linkIndex.get(sourceNodeId);
 		if (sourceLinkMap) {
+			// @ts-ignore
 			return Array.from(sourceLinkMap.values()).map(
 				(index) => this.links[index]
 			);

src/graph/Link.ts

@@ -32,6 +32,7 @@ export default class Link {
 	): [Link[], Map<string, Map<string, number>>] {
 		const links = Object.keys(cache)
 			.map((node1Id) => {
+				// @ts-ignore
 				return Object.keys(cache[node1Id])
 					.map((node2Id) => {
 						const [node1Index, node2Index] = [
@@ -42,7 +43,9 @@ export default class Link {
 							node1Index !== undefined &&
 							node2Index !== undefined
 						) {
+							// @ts-ignore
 							return nodes[node1Index].addNeighbor(
+								// @ts-ignore
 								nodes[node2Index]
 							);
 						}

src/main.ts

@@ -6,7 +6,9 @@ import Graph from "./graph/Graph";
 import ObsidianTheme from "./util/ObsidianTheme";
 import EventBus from "./util/EventBus";
 import { ResolvedLinkCache } from "./graph/Link";
-import shallowCompare from "./util/ShallowCompare";
+import compare from "./util/ShallowCompare";
+import "@total-typescript/ts-reset";
+import "@total-typescript/ts-reset/dom";
 
 export default class Graph3dPlugin extends Plugin {
 	_resolvedCache: ResolvedLinkCache;
@@ -122,10 +124,7 @@ export default class Graph3dPlugin extends Plugin {
 		// with the resolve event
 		if (
 			this.cacheIsReady.value &&
-			!shallowCompare(
-				this._resolvedCache,
-				this.app.metadataCache.resolvedLinks
-			)
+			!compare(this._resolvedCache, this.app.metadataCache.resolvedLinks)
 		) {
 			this._resolvedCache = structuredClone(
 				this.app.metadataCache.resolvedLinks
@@ -136,7 +135,7 @@ export default class Graph3dPlugin extends Plugin {
 				"changed but ",
 				this.cacheIsReady.value,
 				" and ",
-				shallowCompare(
+				compare(
 					this._resolvedCache,
 					this.app.metadataCache.resolvedLinks
 				)

src/util/ShallowCompare.ts

@@ -1,17 +1,16 @@
 // Shallow compare for nested objects
 /* eslint-disable @typescript-eslint/no-explicit-any */
-const shallowCompare = (obj1: any, obj2: any): boolean => {
+const compare = (obj1: any, obj2: any): boolean => {
 	if (!obj1 || !obj2) return obj1 == obj2;
 	else if (obj1 instanceof Object && obj2 instanceof Object) {
 		return (
 			Object.keys(obj1).length === Object.keys(obj2).length &&
 			Object.keys(obj1).every(
 				(key) =>
-					obj2.hasOwnProperty(key) &&
-					shallowCompare(obj1[key], obj2[key])
+					obj2.hasOwnProperty(key) && compare(obj1[key], obj2[key])
 			)
 		);
 	} else return obj1 == obj2;
 };
 
-export default shallowCompare;
+export default compare;

src/views/graph/ForceGraph.ts

@@ -15,7 +15,13 @@ export class ForceGraph {
 	private instance: ForceGraph3DInstance;
 	private readonly rootHtmlElement: HTMLElement;
 
+	/**
+	 * the node connected to the hover node
+	 */
 	private readonly highlightedNodes: Set<string> = new Set();
+	/**
+	 * the links connected to the hover node
+	 */
 	private readonly highlightedLinks: Set<Link> = new Set();
 	hoveredNode: Node | null;
 
@@ -116,6 +122,14 @@ export class ForceGraph {
 			.nodeColor((node: Node) => this.getNodeColor(node))
 			.nodeVisibility(this.doShowNode)
 			.onNodeHover(this.onNodeHover);
+		// @ts-ignore
+		// .nodeThreeObject((node) => {
+		// 	const sprite = new SpriteText(node.id);
+		// 	sprite.material.depthWrite = false; // make sprite background transparent
+		// 	sprite.color = node.color;
+		// 	sprite.textHeight = 8;
+		// 	return sprite;
+		// });
 	};
 
 	private getNodeColor = (node: Node): string => {

tsconfig.json

@@ -1,25 +1,25 @@
 {
-  "compilerOptions": {
-    "baseUrl": ".",
-    "inlineSourceMap": true,
-    "inlineSources": true,
-    "module": "ESNext",
-    "target": "ES6",
-    "allowJs": true,
-    "noImplicitAny": true,
-    "moduleResolution": "node",
-    "importHelpers": true,
-    "isolatedModules": true,
-	"strictNullChecks": true,
-    "lib": [
-      "DOM",
-      "ES5",
-      "ES6",
-      "ES7"
-    ],
-    "allowSyntheticDefaultImports": true
-  },
-  "include": [
-    "**/*.ts"
-  ]
+	"compilerOptions": {
+		"baseUrl": ".",
+		"inlineSourceMap": true,
+		"inlineSources": true,
+		"module": "ESNext",
+		"target": "ES6",
+		"allowJs": true,
+		"noImplicitAny": true,
+		"moduleResolution": "node",
+		"importHelpers": true,
+		"isolatedModules": true,
+		"strictNullChecks": true,
+		"allowSyntheticDefaultImports": true,
+		"noUncheckedIndexedAccess": true,
+		"skipLibCheck": true,
+		"lib": ["DOM", "ES5", "ES6", "ES7", "ESNext"],
+		"types": ["bun-types"],
+		"paths": {
+			"@/*": ["./src/*"]
+		}
+	},
+	"include": ["**/*.ts"],
+	"exclude": ["node_modules"]
 }