feat(backend-options): add a refresh floating button

This commit is contained in:
Elian Doran 2025-03-30 14:29:20 +03:00
parent a0d562e01b
commit 30c14297d0
No known key found for this signature in database
6 changed files with 51 additions and 9 deletions

View File

@ -374,6 +374,7 @@ type EventMappings = {
cloneNoteIdsTo: {
noteIds: string[];
};
refreshData: { ntxId: string | null | undefined };
};
export type EventListener<T extends EventNames> = {

View File

@ -92,6 +92,7 @@ import type { WidgetsByParent } from "../services/bundle.js";
import SwitchSplitOrientationButton from "../widgets/floating_buttons/switch_layout_button.js";
import ToggleReadOnlyButton from "../widgets/floating_buttons/toggle_read_only_button.js";
import PngExportButton from "../widgets/floating_buttons/png_export_button.js";
import RefreshButton from "../widgets/floating_buttons/refresh_button.js";
export default class DesktopLayout {
@ -205,6 +206,7 @@ export default class DesktopLayout {
.child(new WatchedFileUpdateStatusWidget())
.child(
new FloatingButtons()
.child(new RefreshButton())
.child(new SwitchSplitOrientationButton())
.child(new ToggleReadOnlyButton())
.child(new EditButton())

View File

@ -31,6 +31,7 @@ import TabRowWidget from "../widgets/tab_row.js";
import JumpToNoteDialog from "../widgets/dialogs/jump_to_note.js";
import RecentChangesDialog from "../widgets/dialogs/recent_changes.js";
import PromptDialog from "../widgets/dialogs/prompt.js";
import RefreshButton from "../widgets/floating_buttons/refresh_button.js";
const MOBILE_CSS = `
<style>
@ -154,6 +155,7 @@ export default class MobileLayout {
.child(new SharedInfoWidget())
.child(
new FloatingButtons()
.child(new RefreshButton())
.child(new EditButton())
.child(new RelationMapButtons())
.child(new SvgExportButton())

View File

@ -0,0 +1,21 @@
import appContext from "../../components/app_context.js";
import { t } from "../../services/i18n.js";
import OnClickButtonWidget from "../buttons/onclick_button.js";
export default class RefreshButton extends OnClickButtonWidget {
constructor() {
super();
this
.title(t("backend_log.refresh"))
.icon("bx-refresh")
.onClick(() => this.triggerEvent("refreshData", { ntxId: this.noteContext?.ntxId }))
}
isEnabled(): boolean | null | undefined {
return super.isEnabled()
&& this.note?.noteId === "_backendLog"
&& this.noteContext?.viewScope?.viewMode === "default";
}
}

View File

@ -1,6 +1,6 @@
import server from "../../../services/server.js";
import { t } from "../../../services/i18n.js";
import AbstractCodeTypeWidget from "../abstract_code_type_widget.js";
import type { EventData } from "../../../components/app_context.js";
const TPL = `<div style="height: 100%; display: flex; flex-direction: column;">
<style>
@ -9,14 +9,11 @@ const TPL = `<div style="height: 100%; display: flex; flex-direction: column;">
width: 100%;
border: none;
resize: none;
margin-bottom: 0;
}
</style>
<pre class="backend-log-editor"></pre>
<div style="display: flex; justify-content: space-around; margin-top: 10px;">
<button class="refresh-backend-log-button btn btn-primary">${t("backend_log.refresh")}</button>
</div>
<pre class="backend-log-editor"></pre
</div>`;
export default class BackendLogWidget extends AbstractCodeTypeWidget {
@ -27,15 +24,20 @@ export default class BackendLogWidget extends AbstractCodeTypeWidget {
super.doRender();
this.$widget = $(TPL);
this.$editor = this.$widget.find(".backend-log-editor");
this.$refreshBackendLog = this.$widget.find(".refresh-backend-log-button");
this.$refreshBackendLog.on("click", () => this.load());
}
async refresh() {
await this.load();
}
async refreshDataEvent({ ntxId }: EventData<"refreshData">) {
if (ntxId !== this.noteContext?.ntxId) {
return;
}
this.refresh();
}
getExtraOpts(): Partial<CodeMirrorOpts> {
return {
readOnly: true
@ -55,4 +57,5 @@ export default class BackendLogWidget extends AbstractCodeTypeWidget {
this.show();
this.scrollToEnd();
}
}

View File

@ -41,6 +41,8 @@ import type FNote from "../../entities/fnote.js";
import type NoteContextAwareWidget from "../note_context_aware_widget.js";
import { t } from "i18next";
import LanguageOptions from "./options/i18n/language.js";
import type { EventData, EventNames } from "../../components/app_context.js";
import type BasicWidget from "../basic_widget.js";
const TPL = `<div class="note-detail-content-widget note-detail-printable">
<style>
@ -137,6 +139,7 @@ const CONTENT_WIDGETS: Record<string, (typeof NoteContextAwareWidget)[]> = {
export default class ContentWidgetTypeWidget extends TypeWidget {
private $content!: JQuery<HTMLElement>;
private widget?: BasicWidget;
static getType() {
return "contentWidget";
@ -166,10 +169,20 @@ export default class ContentWidgetTypeWidget extends TypeWidget {
this.child(widget);
this.$content.append(widget.render());
this.widget = widget;
await widget.refresh();
}
} else {
this.$content.append(t("content_widget.unknown_widget", { id: note.noteId }));
}
}
async handleEventInChildren<T extends EventNames>(name: T, data: EventData<T>) {
if (this.widget && this.widget.handleEvent) {
return this.widget.handleEvent(name, data);
}
return super.handleEventInChildren(name, data);
}
}