gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-11 00:49:00 +01:00
Code Issues Actions 17 Packages Projects Releases Wiki Activity

chore(react/type_widget): add deletion widget

Browse Source
This commit is contained in:
Elian Doran 2025-09-21 19:43:36 +03:00
parent f2b4f49be2
commit ffe4e9b8de
No known key found for this signature in database
3 changed files with 24 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

79
apps/client/src/widgets/attachment_detail.ts
View File

@ -1,79 +0,0 @@
import { t } from "../services/i18n.js";
import utils from "../services/utils.js";
import AttachmentActionsWidget from "./buttons/attachments_actions.js";
import BasicWidget from "./basic_widget.js";
import options from "../services/options.js";
import imageService from "../services/image.js";
import linkService from "../services/link.js";
import contentRenderer from "../services/content_renderer.js";
import toastService from "../services/toast.js";
import type FAttachment from "../entities/fattachment.js";
import type { EventData } from "../components/app_context.js";
const TPL = /*html*/`
<div class="attachment-deletion-warning alert alert-info" style="margin-top: 15px;"></div>
</div>
</div>`;
export default class AttachmentDetailWidget extends BasicWidget {
attachment: FAttachment;
attachmentActionsWidget: AttachmentActionsWidget;
isFullDetail: boolean;
$wrapper!: JQuery<HTMLElement>;
constructor(attachment: FAttachment, isFullDetail: boolean) {
super();
this.contentSized();
this.attachment = attachment;
this.attachmentActionsWidget = new AttachmentActionsWidget(attachment, isFullDetail);
this.isFullDetail = isFullDetail;
this.child(this.attachmentActionsWidget);
}
doRender() {
this.$widget = $(TPL);
this.refresh();
super.doRender();
}
async refresh() {
this.$widget.find(".attachment-detail-wrapper").empty().append($(TPL).find(".attachment-detail-wrapper").html());
this.$wrapper = this.$widget.find(".attachment-detail-wrapper");
this.$wrapper.addClass(this.isFullDetail ? "full-detail" : "list-view");
const $deletionWarning = this.$wrapper.find(".attachment-deletion-warning");
const { utcDateScheduledForErasureSince } = this.attachment;
if (utcDateScheduledForErasureSince) {
this.$wrapper.addClass("scheduled-for-deletion");
const scheduledSinceTimestamp = utils.parseDate(utcDateScheduledForErasureSince)?.getTime();
// use default value (30 days in seconds) from options_init as fallback, in case getInt returns null
const intervalMs = options.getInt("eraseUnusedAttachmentsAfterSeconds") || 2592000 * 1000;
const deletionTimestamp = scheduledSinceTimestamp + intervalMs;
const willBeDeletedInMs = deletionTimestamp - Date.now();
$deletionWarning.show();
if (willBeDeletedInMs >= 60000) {
$deletionWarning.text(t("attachment_detail_2.will_be_deleted_in", { time: utils.formatTimeInterval(willBeDeletedInMs) }));
} else {
$deletionWarning.text(t("attachment_detail_2.will_be_deleted_soon"));
}
$deletionWarning.append(t("attachment_detail_2.deletion_reason"));
} else {
this.$wrapper.removeClass("scheduled-for-deletion");
$deletionWarning.hide();
}
this.$wrapper.find(".attachment-actions-container").append(this.attachmentActionsWidget.render());
const { $renderedContent } = await );
this.$wrapper.find(".attachment-content-wrapper").append($renderedContent);
}
}

4
apps/client/src/widgets/type_widgets/Attachment.css
View File

@ -82,6 +82,10 @@
.attachment-detail-wrapper.scheduled-for-deletion .attachment-content-wrapper img {
filter: contrast(10%);
}
.attachment-detail-wrapper .attachment-deletion-warning {
margin-top: 15px;
}
/* #endregion */
/* #region Attachment detail */

21
apps/client/src/widgets/type_widgets/Attachment.tsx
View File

@ -25,6 +25,7 @@ import dialog from "../../services/dialog";
import ws from "../../services/ws";
import appContext from "../../components/app_context";
import { ConvertAttachmentToNoteResponse } from "@triliumnext/commons";
import options from "../../services/options";
/**
* Displays the full list of attachments of a note and allows the user to interact with them.
@ -158,7 +159,7 @@ function AttachmentInfo({ attachment, isFullDetail }: { attachment: FAttachment,
return (
<div className="attachment-detail-widget">
<div className="attachment-detail-wrapper">
<div className={`attachment-detail-wrapper ${isFullDetail ? "full-detail" : "list-view"} ${attachment.utcDateScheduledForErasureSince ? "scheduled-for-deletion" : ""}`}>
<div className="attachment-title-line">
<AttachmentActions attachment={attachment} copyAttachmentLinkToClipboard={copyAttachmentLinkToClipboard} />
<h4 className="attachment-title">
@ -179,12 +180,30 @@ function AttachmentInfo({ attachment, isFullDetail }: { attachment: FAttachment,
<div style="flex: 1 1;"></div>
</div>
{attachment.utcDateScheduledForErasureSince && <DeletionAlert utcDateScheduledForErasureSince={attachment.utcDateScheduledForErasureSince} />}
<div ref={contentWrapper} className="attachment-content-wrapper" />
</div>
</div>
)
}
function DeletionAlert({ utcDateScheduledForErasureSince }: { utcDateScheduledForErasureSince: string }) {
const scheduledSinceTimestamp = utils.parseDate(utcDateScheduledForErasureSince)?.getTime();
// use default value (30 days in seconds) from options_init as fallback, in case getInt returns null
const intervalMs = options.getInt("eraseUnusedAttachmentsAfterSeconds") || 2592000 * 1000;
const deletionTimestamp = scheduledSinceTimestamp + intervalMs;
const willBeDeletedInMs = deletionTimestamp - Date.now();
return (
<Alert className="attachment-deletion-warning" type="info">
{ willBeDeletedInMs >= 60000
? t("attachment_detail_2.will_be_deleted_in", { time: utils.formatTimeInterval(willBeDeletedInMs) })
: t("attachment_detail_2.will_be_deleted_soon")}
{t("attachment_detail_2.deletion_reason")}
</Alert>
)
}
function AttachmentActions({ attachment, copyAttachmentLinkToClipboard }: { attachment: FAttachment, copyAttachmentLinkToClipboard: () => void }) {
const isElectron = utils.isElectron();
const fileUploadRef = useRef<HTMLInputElement>(null);