andras/vault-link
andras/vault-link
1
0
Fork 0
Code Issues Pull requests 19 Projects Releases 55 Packages Wiki Activity Actions 30

Fix logs UX

Browse source
This commit is contained in:
Andras Schmelczer 2025-01-04 17:04:50 +00:00
commit d069939c6b
No known key found for this signature in database
GPG key ID: FC8F2C3D3D1A718C
3 changed files with 43 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

2
plugin/src/database/database.ts
View file

@ -88,7 +88,7 @@ export class Database {
key: T, key: T,
value: SyncSettings[T] value: SyncSettings[T]
): Promise<void> { ): Promise<void> {
let newSettings = { ...this._settings, [key]: value }; const newSettings = { ...this._settings, [key]: value };
Logger.getInstance().debug( Logger.getInstance().debug(
`Setting ${key} to ${value}, new settings: ${JSON.stringify( `Setting ${key} to ${value}, new settings: ${JSON.stringify(
newSettings, newSettings,

4
plugin/src/styles.scss
View file

@ -86,8 +86,10 @@
} }
.logs-view { .logs-view {
display: flex;
flex-direction: column;
.logs-container { .logs-container {
max-height: 100%;
max-width: 100%; max-width: 100%;
overflow-y: auto; overflow-y: auto;

66
plugin/src/views/logs-view.ts
View file

@ -1,8 +1,8 @@
import type { WorkspaceLeaf } from "obsidian"; import type { WorkspaceLeaf } from "obsidian";
import { ItemView } from "obsidian"; import { ItemView } from "obsidian";
import type VaultLinkPlugin from "src/vault-link-plugin"; import type VaultLinkPlugin from "src/vault-link-plugin";
import { LogLevel, Logger } from "src/tracing/logger"; import { Logger } from "src/tracing/logger";
import { Database } from "src/database/database"; import type { Database } from "src/database/database";
export class LogsView extends ItemView { export class LogsView extends ItemView {
public static readonly TYPE = "logs-view"; public static readonly TYPE = "logs-view";
@ -43,17 +43,18 @@ export class LogsView extends ItemView {
const container = this.containerEl.children[1]; const container = this.containerEl.children[1];
container.addClass("logs-view"); container.addClass("logs-view");
const logsContainer = container
.getElementsByClassName("logs-container")
.item(0);
if (logsContainer) {
logsContainer.scrollTop = logsContainer.scrollHeight;
}
} }
private updateView(): void { private updateView(): void {
const container = this.containerEl.children[1]; const container = this.containerEl.children[1];
let logsContainer = container
.getElementsByClassName("logs-container")
.item(0);
const scrollPosition = logsContainer?.scrollTop;
console.log(scrollPosition);
container.empty(); container.empty();
container.createEl("h4", { text: "VaultLink logs" }); container.createEl("h4", { text: "VaultLink logs" });
@ -88,23 +89,34 @@ export class LogsView extends ItemView {
return; return;
} }
container.createDiv({ cls: "logs-container" }, (logsContainer) => { logsContainer = container.createDiv(
logs.forEach((message) => { cls: "logs-container" },
logsContainer.createDiv( (logsContainer) => {
{ logs.slice(-100).forEach((message) =>
cls: ["log-message", message.level], logsContainer.createDiv(
}, {
(messageContainer) => { cls: ["log-message", message.level],
messageContainer.createEl("span", { },
text: LogsView.formatTimestamp(message.timestamp), (messageContainer) => {
cls: "timestamp", messageContainer.createEl("span", {
}); text: LogsView.formatTimestamp(
messageContainer.createEl("span", { message.timestamp
text: message.message, ),
}); cls: "timestamp",
} });
) messageContainer.createEl("span", {
); text: message.message,
}); });
}
)
);
}
);
if (scrollPosition) {
logsContainer.scrollTop = scrollPosition;
} else {
logsContainer.scrollTop = logsContainer.scrollHeight;
}
} }
} }