mirror of
https://github.com/zadam/trilium.git
synced 2025-11-08 06:15:48 +01:00
feat(react/bulk_actions): port rename note
This commit is contained in:
@@ -1,61 +0,0 @@
|
||||
import SpacedUpdate from "../../../services/spaced_update.js";
|
||||
import AbstractBulkAction from "../abstract_bulk_action.js";
|
||||
import { t } from "../../../services/i18n.js";
|
||||
|
||||
const TPL = /*html*/`
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<div style="display: flex; align-items: center">
|
||||
<div style="margin-right: 10px; flex-shrink: 0;">${t("rename_note.rename_note_title_to")}</div>
|
||||
|
||||
<input type="text"
|
||||
class="form-control new-title"
|
||||
placeholder="${t("rename_note.new_note_title")}"
|
||||
title="${t("rename_note.click_help_icon")}"/>
|
||||
</div>
|
||||
</td>
|
||||
<td class="button-column">
|
||||
<div class="dropdown help-dropdown">
|
||||
<span class="bx bx-help-circle icon-action" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></span>
|
||||
<div class="dropdown-menu dropdown-menu-right p-4">
|
||||
<p>${t("rename_note.evaluated_as_js_string")}</p>
|
||||
|
||||
<ul>
|
||||
<li>${t("rename_note.example_note")}</li>
|
||||
<li>${t("rename_note.example_new_title")}</li>
|
||||
<li>${t("rename_note.example_date_prefix")}</li>
|
||||
</ul>
|
||||
|
||||
${t("rename_note.api_docs")}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span class="bx bx-x icon-action action-conf-del"></span>
|
||||
</td>
|
||||
</tr>`;
|
||||
|
||||
export default class RenameNoteBulkAction extends AbstractBulkAction {
|
||||
static get actionName() {
|
||||
return "renameNote";
|
||||
}
|
||||
static get actionTitle() {
|
||||
return t("rename_note.rename_note");
|
||||
}
|
||||
|
||||
doRender() {
|
||||
const $action = $(TPL);
|
||||
|
||||
const $newTitle = $action.find(".new-title");
|
||||
$newTitle.val(this.actionDef.newTitle || "");
|
||||
|
||||
const spacedUpdate = new SpacedUpdate(async () => {
|
||||
await this.saveAction({
|
||||
newTitle: $newTitle.val()
|
||||
});
|
||||
}, 1000);
|
||||
|
||||
$newTitle.on("input", () => spacedUpdate.scheduleUpdate());
|
||||
|
||||
return $action;
|
||||
}
|
||||
}
|
||||
53
apps/client/src/widgets/bulk_actions/note/rename_note.tsx
Normal file
53
apps/client/src/widgets/bulk_actions/note/rename_note.tsx
Normal file
@@ -0,0 +1,53 @@
|
||||
import SpacedUpdate from "../../../services/spaced_update.js";
|
||||
import AbstractBulkAction, { ActionDefinition } from "../abstract_bulk_action.js";
|
||||
import { t } from "../../../services/i18n.js";
|
||||
import BulkAction from "../BulkAction.jsx";
|
||||
import FormTextBox from "../../react/FormTextBox.jsx";
|
||||
import { useEffect, useState } from "preact/hooks";
|
||||
import { useSpacedUpdate } from "../../react/hooks.jsx";
|
||||
import RawHtml from "../../react/RawHtml.jsx";
|
||||
|
||||
function RenameNoteBulkActionComponent({ bulkAction, actionDef }: { bulkAction: AbstractBulkAction, actionDef: ActionDefinition}) {
|
||||
const [ newTitle, setNewTitle ] = useState<string>(actionDef.newTitle ?? "");
|
||||
const spacedUpdate = useSpacedUpdate(() => bulkAction.saveAction({ newTitle }));
|
||||
useEffect(() => spacedUpdate.scheduleUpdate(), [ newTitle ]);
|
||||
|
||||
return (
|
||||
<BulkAction
|
||||
bulkAction={bulkAction}
|
||||
label={t("rename_note.rename_note_title_to")}
|
||||
helpText={<>
|
||||
<p>{t("rename_note.evaluated_as_js_string")}</p>
|
||||
|
||||
<ul>
|
||||
<li><RawHtml html={t("rename_note.example_note")} /></li>
|
||||
<li><RawHtml html={t("rename_note.example_new_title")} /></li>
|
||||
<li><RawHtml html={t("rename_note.example_date_prefix")} /></li>
|
||||
</ul>
|
||||
|
||||
<RawHtml html={t("rename_note.api_docs")} />
|
||||
</>}
|
||||
>
|
||||
<FormTextBox
|
||||
placeholder={t("rename_note.new_note_title")}
|
||||
title={("rename_note.click_help_icon")}
|
||||
currentValue={newTitle} onChange={setNewTitle}
|
||||
/>
|
||||
</BulkAction>
|
||||
)
|
||||
}
|
||||
|
||||
export default class RenameNoteBulkAction extends AbstractBulkAction {
|
||||
static get actionName() {
|
||||
return "renameNote";
|
||||
}
|
||||
|
||||
static get actionTitle() {
|
||||
return t("rename_note.rename_note");
|
||||
}
|
||||
|
||||
doRender() {
|
||||
return <RenameNoteBulkActionComponent bulkAction={this} actionDef={this.actionDef} />
|
||||
}
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user