redact: UX overhaul — engine simplification, credits, spinner, save-to-docs, badges
- Remove GPU/regex engine options; keep only azure_mini (1 credit) and azure_full (2 credits)
- Variable credit cost: engine-aware pre-check and charge in api/redact.php; PricingCatalog base = 1
- Fix ATTORNEY not preserved when keepOfficials=true: add to LLM prompt, generic-tag, pseudonym regexes
- Replace Azure credits hint with per-engine credit cost text (all 4 languages)
- Single-file upload only (was: up to 5); simplify status messages
- Clear previous redaction output and show pulsing spinner when a new run starts
- Add "Save to My Docs" button in redact output panel (corpus-save.js path)
- corpus-save.js: capture source_doc_ids from button dataset, pass in POST payload
- api/save-to-corpus.php: accept source_doc_ids, store first as source_url=corpus-doc:{id}
- doc-picker.js: show "✂ Redacted" badge for documents saved from the redact tool
- CSS: .redact-working spinner, doc-item__badge--redact pill styles
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -270,3 +270,23 @@
|
||||
transition: border-color 0.15s, color 0.15s;
|
||||
}
|
||||
.audio-corpus-upload:hover { border-color: var(--dbn-accent, #00205B); color: var(--dbn-accent, #00205B); }
|
||||
|
||||
|
||||
/* ── Redacted document badge ─────────────────────────────────────────────── */
|
||||
|
||||
.doc-item__badge {
|
||||
display: inline-block;
|
||||
margin-left: 0.45em;
|
||||
padding: 0.1em 0.45em;
|
||||
border-radius: 4px;
|
||||
font-size: 0.72rem;
|
||||
font-weight: 600;
|
||||
vertical-align: middle;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.doc-item__badge--redact {
|
||||
background: #ede8f7;
|
||||
color: #5b35a8;
|
||||
border: 1px solid rgba(91, 53, 168, 0.2);
|
||||
}
|
||||
|
||||
@@ -2266,6 +2266,38 @@ p {
|
||||
cursor: progress;
|
||||
}
|
||||
|
||||
@keyframes redact-spin {
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
.redact-working {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 12px;
|
||||
padding: 32px 16px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 8px;
|
||||
background: #fbfcfe;
|
||||
}
|
||||
|
||||
.redact-working p {
|
||||
margin: 0;
|
||||
color: var(--muted);
|
||||
font-size: 0.92rem;
|
||||
}
|
||||
|
||||
.redact-working__spinner {
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 3px solid var(--line);
|
||||
border-top-color: var(--teal);
|
||||
border-radius: 50%;
|
||||
animation: redact-spin 0.9s linear infinite;
|
||||
}
|
||||
|
||||
/* ── Feedback widget ──────────────────────────────────────────── */
|
||||
.feedback-widget {
|
||||
margin-top: 1.5rem;
|
||||
|
||||
+16
-10
@@ -41,6 +41,7 @@
|
||||
}
|
||||
|
||||
function bodyFor(kind, payload) {
|
||||
const sourceDocIds = (payload.sourceDocIds || '').split(',').map(s => s.trim()).filter(Boolean);
|
||||
if (window.DBN_DASHBOARD) {
|
||||
return JSON.stringify({
|
||||
title: payload.title,
|
||||
@@ -48,6 +49,7 @@
|
||||
source_tool: payload.tool || 'dashboard-save',
|
||||
tags: payload.tags,
|
||||
kind,
|
||||
...(sourceDocIds.length ? { source_doc_ids: sourceDocIds } : {}),
|
||||
});
|
||||
}
|
||||
return JSON.stringify({
|
||||
@@ -55,6 +57,7 @@
|
||||
content: payload.content,
|
||||
source_tool: payload.tool || '',
|
||||
tags: payload.tags,
|
||||
...(sourceDocIds.length ? { source_doc_ids: sourceDocIds } : {}),
|
||||
});
|
||||
}
|
||||
|
||||
@@ -74,9 +77,10 @@
|
||||
}
|
||||
|
||||
_pendingBtn = btn;
|
||||
dlg.dataset.pendingContent = content;
|
||||
dlg.dataset.pendingTool = btn.dataset.tool || '';
|
||||
dlg.dataset.pendingKind = 'tool_output';
|
||||
dlg.dataset.pendingContent = content;
|
||||
dlg.dataset.pendingTool = btn.dataset.tool || '';
|
||||
dlg.dataset.pendingKind = 'tool_output';
|
||||
dlg.dataset.pendingSourceDocIds = btn.dataset.sourceDocIds || '';
|
||||
|
||||
titleIn.value = btn.dataset.suggestedTitle || '';
|
||||
tagsIn.value = '';
|
||||
@@ -90,12 +94,13 @@
|
||||
e.preventDefault();
|
||||
dlg.close();
|
||||
|
||||
const btn = _pendingBtn;
|
||||
const content = dlg.dataset.pendingContent || '';
|
||||
const tool = dlg.dataset.pendingTool || '';
|
||||
const kind = dlg.dataset.pendingKind || 'tool_output';
|
||||
const title = titleIn.value.trim();
|
||||
const tags = tagsIn.value.trim();
|
||||
const btn = _pendingBtn;
|
||||
const content = dlg.dataset.pendingContent || '';
|
||||
const tool = dlg.dataset.pendingTool || '';
|
||||
const kind = dlg.dataset.pendingKind || 'tool_output';
|
||||
const sourceDocIds = dlg.dataset.pendingSourceDocIds || '';
|
||||
const title = titleIn.value.trim();
|
||||
const tags = tagsIn.value.trim();
|
||||
|
||||
if (!title || !content) return;
|
||||
|
||||
@@ -109,7 +114,7 @@
|
||||
method: 'POST',
|
||||
credentials: 'same-origin',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: bodyFor(kind, { title, content, tool, tags }),
|
||||
body: bodyFor(kind, { title, content, tool, tags, sourceDocIds }),
|
||||
});
|
||||
const data = await resp.json().catch(() => ({}));
|
||||
|
||||
@@ -146,6 +151,7 @@
|
||||
delete dlg.dataset.pendingContent;
|
||||
delete dlg.dataset.pendingTool;
|
||||
delete dlg.dataset.pendingKind;
|
||||
delete dlg.dataset.pendingSourceDocIds;
|
||||
});
|
||||
|
||||
function showToast(msg, isError) {
|
||||
|
||||
@@ -97,10 +97,13 @@
|
||||
.toLocaleDateString(undefined, { dateStyle: 'medium' }));
|
||||
} catch (_) {}
|
||||
}
|
||||
var redactBadge = doc.source_tool === 'redact'
|
||||
? '<span class="doc-item__badge doc-item__badge--redact">✂ Redacted</span>'
|
||||
: '';
|
||||
return '<div class="doc-item' + (sel ? ' is-selected' : '') + '" data-id="' + id + '" role="option" aria-selected="' + sel + '">'
|
||||
+ '<input type="checkbox" ' + (sel ? 'checked' : '') + ' tabindex="-1" aria-hidden="true">'
|
||||
+ '<div>'
|
||||
+ '<div class="doc-item__title">' + esc(doc.title || 'Untitled') + '</div>'
|
||||
+ '<div class="doc-item__title">' + esc(doc.title || 'Untitled') + redactBadge + '</div>'
|
||||
+ (meta.length ? '<div class="doc-item__meta">' + esc(meta.join(' · ')) + '</div>' : '')
|
||||
+ '</div>'
|
||||
+ '</div>';
|
||||
|
||||
+18
-24
@@ -8,9 +8,7 @@ const REDACT_I18N = {
|
||||
redactEngine: 'Engine',
|
||||
redactEngineAzureMini: 'Azure gpt-4o-mini',
|
||||
redactEngineAzureFull: 'Azure gpt-4o',
|
||||
redactEngineGpu: 'GPU (cuttlefish)',
|
||||
redactEngineRegex: 'Regex only',
|
||||
redactEngineHint: 'Azure engines use your BNL Azure credits. GPU runs the local LiteLLM proxy. Regex-only is instant and free but finds no names or organisations.',
|
||||
redactEngineHint: 'gpt-4o-mini: 1 credit — fast, handles most documents well. gpt-4o: 2 credits — higher accuracy for complex or multi-person cases.',
|
||||
redactMode: 'Mode',
|
||||
redactModeStandard: 'Standard',
|
||||
redactModeStrict: 'Strict',
|
||||
@@ -42,7 +40,7 @@ const REDACT_I18N = {
|
||||
redactAliasAdd: 'Add',
|
||||
redactAliasHint: 'Replace a specific name with a custom bracketed label, e.g. "David Jr" → [Junior].',
|
||||
redactUploadAria: 'File upload',
|
||||
redactUploadDrop: 'Drop up to 5 files here, or',
|
||||
redactUploadDrop: 'Drop one file here, or',
|
||||
redactUploadBrowse: 'browse',
|
||||
redactUploadHint: 'text extracted in memory, never stored',
|
||||
redactUploadClear: '× Clear',
|
||||
@@ -63,9 +61,7 @@ const REDACT_I18N = {
|
||||
redactEngine: 'Motor',
|
||||
redactEngineAzureMini: 'Azure gpt-4o-mini',
|
||||
redactEngineAzureFull: 'Azure gpt-4o',
|
||||
redactEngineGpu: 'GPU (cuttlefish)',
|
||||
redactEngineRegex: 'Kun regex',
|
||||
redactEngineHint: 'Azure-motorer bruker BNL Azure-kreditter. GPU kjører lokal LiteLLM-proxy. Kun regex er øyeblikkelig og gratis, men finner ingen navn eller organisasjoner.',
|
||||
redactEngineHint: 'gpt-4o-mini: 1 kreditt — rask, håndterer de fleste dokumenter godt. gpt-4o: 2 kreditter — høyere nøyaktighet for komplekse eller flerpersonssaker.',
|
||||
redactMode: 'Modus',
|
||||
redactModeStandard: 'Standard',
|
||||
redactModeStrict: 'Strikt',
|
||||
@@ -97,7 +93,7 @@ const REDACT_I18N = {
|
||||
redactAliasAdd: 'Legg til',
|
||||
redactAliasHint: 'Erstatt et spesifikt navn med en egendefinert merkelapp, f.eks. «David Jr» → [Junior].',
|
||||
redactUploadAria: 'Filopplasting',
|
||||
redactUploadDrop: 'Slipp opptil 5 filer her, eller',
|
||||
redactUploadDrop: 'Slipp én fil her, eller',
|
||||
redactUploadBrowse: 'bla',
|
||||
redactUploadHint: 'tekst hentes i minnet, lagres aldri',
|
||||
redactUploadClear: '× Tøm',
|
||||
@@ -118,9 +114,7 @@ const REDACT_I18N = {
|
||||
redactEngine: 'Рушій',
|
||||
redactEngineAzureMini: 'Azure gpt-4o-mini',
|
||||
redactEngineAzureFull: 'Azure gpt-4o',
|
||||
redactEngineGpu: 'GPU (cuttlefish)',
|
||||
redactEngineRegex: 'Лише регулярні вирази',
|
||||
redactEngineHint: 'Рушії Azure використовують кредити BNL Azure. GPU запускає локальний проксі LiteLLM. Лише regex — миттєво і безкоштовно, але не знаходить імен або організацій.',
|
||||
redactEngineHint: 'gpt-4o-mini: 1 кредит — швидко, добре обробляє більшість документів. gpt-4o: 2 кредити — вища точність для складних або багатоособових справ.',
|
||||
redactMode: 'Режим',
|
||||
redactModeStandard: 'Стандартний',
|
||||
redactModeStrict: 'Суворий',
|
||||
@@ -152,7 +146,7 @@ const REDACT_I18N = {
|
||||
redactAliasAdd: 'Додати',
|
||||
redactAliasHint: 'Замініть конкретне ім\'я на власну мітку, напр. «David Jr» → [Junior].',
|
||||
redactUploadAria: 'Завантаження файлів',
|
||||
redactUploadDrop: 'Перетягніть до 5 файлів сюди, або',
|
||||
redactUploadDrop: 'Перетягніть один файл сюди, або',
|
||||
redactUploadBrowse: 'огляд',
|
||||
redactUploadHint: 'текст обробляється в пам\'яті, ніколи не зберігається',
|
||||
redactUploadClear: '× Очистити',
|
||||
@@ -173,9 +167,7 @@ const REDACT_I18N = {
|
||||
redactEngine: 'Silnik',
|
||||
redactEngineAzureMini: 'Azure gpt-4o-mini',
|
||||
redactEngineAzureFull: 'Azure gpt-4o',
|
||||
redactEngineGpu: 'GPU (cuttlefish)',
|
||||
redactEngineRegex: 'Tylko regex',
|
||||
redactEngineHint: 'Silniki Azure używają kredytów Azure BNL. GPU korzysta z lokalnego proxy LiteLLM. Tylko regex jest natychmiastowy i bezpłatny, ale nie znajdzie imion ani organizacji.',
|
||||
redactEngineHint: 'gpt-4o-mini: 1 kredyt — szybko, dobrze radzi sobie z większością dokumentów. gpt-4o: 2 kredyty — wyższa dokładność dla złożonych lub wieloosobowych spraw.',
|
||||
redactMode: 'Tryb',
|
||||
redactModeStandard: 'Standardowy',
|
||||
redactModeStrict: 'Ścisły',
|
||||
@@ -207,7 +199,7 @@ const REDACT_I18N = {
|
||||
redactAliasAdd: 'Dodaj',
|
||||
redactAliasHint: 'Zastąp konkretną nazwę własną etykietą, np. «David Jr» → [Junior].',
|
||||
redactUploadAria: 'Przesyłanie pliku',
|
||||
redactUploadDrop: 'Upuść do 5 plików tutaj lub',
|
||||
redactUploadDrop: 'Upuść jeden plik tutaj lub',
|
||||
redactUploadBrowse: 'przeglądaj',
|
||||
redactUploadHint: 'tekst wyodrębniany w pamięci, nigdy nie przechowywany',
|
||||
redactUploadClear: '× Wyczyść',
|
||||
@@ -1126,6 +1118,9 @@ async function runTool(event) {
|
||||
lastToolPayload = { ...payload };
|
||||
|
||||
setBusy(true);
|
||||
if (state.activeTool === 'redact') {
|
||||
els.results.innerHTML = '<div class="redact-working" role="status" aria-live="polite"><span class="redact-working__spinner" aria-hidden="true"></span><p>Redacting document…</p></div>';
|
||||
}
|
||||
renderTrace([
|
||||
{ label: 'Query interpretation', detail: 'Preparing request.', status: 'running' },
|
||||
]);
|
||||
@@ -1218,7 +1213,7 @@ function setupUpload() {
|
||||
|
||||
async function handleFiles(fileList) {
|
||||
const allowed = ['pdf', 'docx', 'txt'];
|
||||
const files = Array.from(fileList).slice(0, 5);
|
||||
const files = Array.from(fileList).slice(0, 1);
|
||||
|
||||
for (const file of files) {
|
||||
const ext = file.name.split('.').pop().toLowerCase();
|
||||
@@ -1228,7 +1223,7 @@ async function handleFiles(fileList) {
|
||||
}
|
||||
}
|
||||
|
||||
els.status.textContent = files.length === 1 ? `Extracting ${files[0].name}…` : `Extracting ${files.length} files…`;
|
||||
els.status.textContent = `Extracting ${files[0].name}…`;
|
||||
setBusy(true);
|
||||
|
||||
const parts = [];
|
||||
@@ -1256,9 +1251,7 @@ async function handleFiles(fileList) {
|
||||
if (data.truncated) anyTruncated = true;
|
||||
}
|
||||
|
||||
const combined = parts.length === 1
|
||||
? parts[0].text
|
||||
: parts.map((p) => `--- Document: ${p.filename} ---\n\n${p.text}`).join('\n\n');
|
||||
const combined = parts[0].text;
|
||||
|
||||
const MAX_COMBINED = 128000;
|
||||
const combinedTruncated = combined.length > MAX_COMBINED;
|
||||
@@ -1271,9 +1264,7 @@ async function handleFiles(fileList) {
|
||||
els.uploadFileInfo.classList.remove('is-hidden');
|
||||
|
||||
const truncNote = (anyTruncated || combinedTruncated) ? ' — truncated to 128 000 char limit' : '';
|
||||
els.status.textContent = parts.length === 1
|
||||
? `Extracted ${totalChars.toLocaleString()} chars from ${parts[0].filename}${truncNote}.`
|
||||
: `Extracted ${totalChars.toLocaleString()} chars total from ${parts.length} files${truncNote}.`;
|
||||
els.status.textContent = `Extracted ${totalChars.toLocaleString()} chars from ${parts[0].filename}${truncNote}.`;
|
||||
} catch (err) {
|
||||
els.status.textContent = err.message;
|
||||
resetUpload();
|
||||
@@ -1560,10 +1551,13 @@ function renderMainFinding(data) {
|
||||
? `<button type="button" class="upgrade-engine-btn" id="rerunBetterBtn">Re-run with gpt-4o for higher accuracy →</button>`
|
||||
: '';
|
||||
|
||||
const sourceDocIds = lastToolPayload?.doc_ids?.join(',') || '';
|
||||
const suggestedTitle = `Redacted document — ${new Date().toLocaleDateString()}`;
|
||||
const dlRow = `<div class="redact-downloads">
|
||||
<button type="button" class="redact-dl-btn" id="rdlCopy">${t('redactCopy')}</button>
|
||||
<button type="button" class="redact-dl-btn" id="rdlTxt">${t('redactDownloadTxt')}</button>
|
||||
<button type="button" class="redact-dl-btn" id="rdlDocx">${t('redactDownloadDocx')}</button>
|
||||
<button type="button" class="redact-dl-btn js-save-corpus" data-content-id="redactOutputPre" data-tool="redact" data-suggested-title="${escapeHtml(suggestedTitle)}" data-source-doc-ids="${escapeHtml(sourceDocIds)}">Save to My Docs</button>
|
||||
</div>`;
|
||||
|
||||
return `${viewToggle}<pre class="redacted-output" id="redactOutputPre">${highlightRedactedText(lastRedactedText)}</pre>${inventoryHtml}${upgradeBtn}${dlRow}`;
|
||||
|
||||
Reference in New Issue
Block a user