v0.3.8-pre.007-fix.002

This commit is contained in:
2026-09-03 18:51:37 +02:00
parent 32577ea48d
commit c9e52d1926
7 changed files with 148 additions and 23 deletions

View File

@@ -1,5 +1,5 @@
<!-- file: crates/ksp-app-store-desk/frontend/main.html -->
<!-- version: 3 -->
<!-- version: 4 -->
<!DOCTYPE html>
<html lang="fr">
@@ -197,7 +197,13 @@
</dl>
<div class="d-flex align-items-center justify-content-between gap-3 mb-2">
<h3 class="h6 mb-0">Payload preview hex</h3>
<span id="transactionDetailPreviewTruncated" class="badge text-bg-warning" hidden>Preview tronquée à 512 bytes</span>
<div class="d-flex align-items-center gap-2">
<button id="transactionDetailPayloadPreviewCopy" class="btn btn-sm btn-outline-secondary" type="button" title="Copier le preview hex affiché" aria-label="Copier le preview hex affiché" hidden>
<i class="fa-regular fa-copy" aria-hidden="true"></i>
<span>Copier</span>
</button>
<span id="transactionDetailPreviewTruncated" class="badge text-bg-warning" hidden>Preview tronquée à 512 bytes</span>
</div>
</div>
<pre id="transactionDetailPayloadPreview" class="small bg-body-tertiary border rounded p-3 overflow-auto text-break mb-0"></pre>
</div>

View File

@@ -1,5 +1,5 @@
// file: crates/ksp-app-store-desk/frontend/ts/main.ts
// version: 5
// version: 6
import DataTable from "datatables.net-bs5";
import "datatables.net-bs5/css/dataTables.bootstrap5.css";
@@ -133,6 +133,7 @@ async function copyLongText(button: HTMLButtonElement, value: string, fieldId: s
}
const icon = button.querySelector<HTMLElement>("i");
const previousClassName = icon?.className ?? "";
const previousTitle = button.title;
if (icon) {
icon.className = "fa-solid fa-check";
}
@@ -142,7 +143,7 @@ async function copyLongText(button: HTMLButtonElement, value: string, fieldId: s
if (icon) {
icon.className = previousClassName;
}
button.title = "Copier la valeur complète";
button.title = previousTitle;
}, COPY_FEEDBACK_MILLISECONDS);
}
@@ -428,6 +429,12 @@ function clearTransactionDetail(): void {
}
setVisible("transactionDetailError", false);
setVisible("transactionDetailPreviewTruncated", false);
const payloadPreviewCopy = document.querySelector<HTMLButtonElement>("#transactionDetailPayloadPreviewCopy");
if (payloadPreviewCopy) {
delete payloadPreviewCopy.dataset.copyLongText;
delete payloadPreviewCopy.dataset.copyField;
payloadPreviewCopy.hidden = true;
}
}
function renderTransactionDetail(detail: StoreTransactionDetailDto): void {
@@ -438,7 +445,18 @@ function renderTransactionDetail(detail: StoreTransactionDetailDto): void {
setCopyableLongText("transactionDetailContentHash", detail.contentHash, "transaction-detail-content-hash");
setText("transactionDetailRetention", detail.retentionState);
setText("transactionDetailPayloadSize", detail.payloadSizeDecimal ?? "—");
setText("transactionDetailPayloadPreview", detail.payloadPreviewHex ?? "Payload non disponible dans cet état de rétention.");
const payloadPreview = detail.payloadPreviewHex;
setText("transactionDetailPayloadPreview", payloadPreview ?? "Payload non disponible dans cet état de rétention.");
const payloadPreviewCopy = document.querySelector<HTMLButtonElement>("#transactionDetailPayloadPreviewCopy");
if (payloadPreviewCopy && payloadPreview) {
payloadPreviewCopy.dataset.copyLongText = payloadPreview;
payloadPreviewCopy.dataset.copyField = "transaction-payload-preview";
payloadPreviewCopy.hidden = false;
} else if (payloadPreviewCopy) {
delete payloadPreviewCopy.dataset.copyLongText;
delete payloadPreviewCopy.dataset.copyField;
payloadPreviewCopy.hidden = true;
}
setVisible("transactionDetailPreviewTruncated", detail.payloadPreviewTruncated);
}