feat: move timestamp to metadata for edges

main.ts

@@ -53,7 +53,8 @@ export default class TimestampedCanvas extends Plugin {
 		await this.loadSettings();
 
 		this.patchCanvas();
-		this.patchCanvasNode()
+		this.patchCanvasNode();
+		this.patchCanvasEdge();
 
 		this.addSettingTab(new TimestampedCanvasSettingTab(this.app, this));
 	}
@@ -97,7 +98,11 @@ export default class TimestampedCanvas extends Plugin {
 				},
 				addEdge(oldMethod) {
 					return function (...args) {
-						args[0]['label'] = createTimestamp();
+						const edge = args[0]
+						if (edge['unknownData'] === undefined) {
+							edge['unknownData'] = {}
+						}
+						edge['unknownData'] = {'timestamp': createTimestamp()};
 						const result = oldMethod && oldMethod.apply(this, args);
 						return result;
 					}
@@ -116,6 +121,14 @@ export default class TimestampedCanvas extends Plugin {
 										node?.timestampEl.removeClass('canvas-node-timestamp-hide')
 									}
 								})
+
+								this.edges.forEach(edge => {
+									if (plugin.isHide) {
+										edge?.timestampEl.addClass('canvas-edge-timestamp-hide')
+									} else {
+										edge?.timestampEl.removeClass('canvas-edge-timestamp-hide')
+									}
+								})
 							})
 						})
 
@@ -142,6 +155,66 @@ export default class TimestampedCanvas extends Plugin {
 		});
 	}
 
+	patchCanvasEdge() {
+		const createTimestamp = () => {
+			return moment().format(this.settings.dateFormat)
+		}
+
+		const patchEdge = () => {
+			const canvasView = app.workspace.getLeavesOfType("canvas").first()?.view;
+			// @ts-ignore
+			const canvas = canvasView?.canvas;
+			if(!canvas) return false;
+
+			const edge = Array.from(canvas.edges).first();
+			if (!edge) return false;
+
+
+			// @ts-ignore
+			const edgeInstance = edge[1];
+
+			const edgeUninstaller = around(edgeInstance.constructor.prototype, {
+				render(oldMethod) {
+					return function (...args) {
+						const result = oldMethod && oldMethod.apply(this, args);
+						const coords = this.getCenter();
+
+						const div = this.timestampEl || this.canvas.canvasEl.createDiv("canvas-edge-timestamp");
+						div.style.transform = "translate(".concat(coords.x, "px, ").concat(coords.y, "px)")
+
+						this.timestampEl = div;
+						div.setText(this?.unknownData?.timestamp);	
+
+						return 
+					}
+				},
+				destroy(oldMethod) {
+					return function (...args) {
+						if (this.timestampEl) {
+							this.timestampEl.remove()
+						}
+						const result = oldMethod && oldMethod.apply(this, args);
+
+					}
+				}
+			})
+
+			this.register(edgeUninstaller);
+
+			console.log("timestamped-canvas: canvas edge patched");
+			return true;
+		}
+
+		this.app.workspace.onLayoutReady(() => {
+				if (!patchEdge()) {
+					const evt = app.workspace.on("layout-change", () => {
+						patchEdge() && app.workspace.offref(evt);
+					});
+					this.registerEvent(evt);
+				}
+			});
+		}
+
 	patchCanvasNode() {
 		const createTimestamp = () => {
 			return moment().format(this.settings.dateFormat)

styles.css

@@ -14,4 +14,12 @@
 
 .canvas-node-timestamp.canvas-node-timestamp-hide {
     display: none;
+}
+
+.canvas-edge-timestamp {
+    color: var(--canvas-card-label-color);
+}
+
+.canvas-edge-timestamp.canvas-edge-timestamp-hide {
+    display: none;
 }