fix(audit): UI — L18 (decorative emoji -> Lucide icons), L19 (gated NotesList timer + create-from-url ref-in-effect)

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-06-02 13:30:25 +02:00
parent e7fdf75a6c
commit 8c4c9b967e
40 changed files with 277 additions and 130 deletions

View File

@@ -2,7 +2,7 @@
import { useEffect, useState } from 'react';
import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
import { CheckCircle2, Download, Loader2, XCircle } from 'lucide-react';
import { AlertTriangle, CheckCircle2, Download, Loader2, XCircle } from 'lucide-react';
import { toast } from 'sonner';
import { Button } from '@/components/ui/button';
@@ -325,10 +325,14 @@ export function TemplateSyncButton() {
</div>
) : report.fields.length === 0 ? (
<div className="rounded bg-amber-100 px-2 py-1 text-xs text-amber-900 dark:bg-amber-950 dark:text-amber-200">
This PDF has no AcroForm fields. The CRM&apos;s <code>formValues</code>{' '}
path will fill nothing. Re-export your PDF with form fields enabled, or
place overlays inside Documenso&apos;s editor and use{' '}
<code>prefillFields</code> instead.
<AlertTriangle
className="mr-1 inline h-3.5 w-3.5 align-text-bottom"
aria-hidden
/>
This PDF has no AcroForm fields. The CRM&apos;s <code>formValues</code> path
will fill nothing. Re-export your PDF with form fields enabled, or place
overlays inside Documenso&apos;s editor and use <code>prefillFields</code>{' '}
instead.
</div>
) : (
<>

View File

@@ -262,7 +262,7 @@ export function OnboardingChecklist() {
if (loading) return;
const prev = prevCompletedRef.current;
if (prev !== null && prev < STEPS.length && completed === STEPS.length) {
toast.success('🎉 Setup complete — every onboarding step is checked off.', {
toast.success('Setup complete — every onboarding step is checked off.', {
duration: 6000,
});
// Invalidate the shared status query so the banner + tile collapse

View File

@@ -2,7 +2,7 @@
import { useState } from 'react';
import Link from 'next/link';
import { FileText, ClipboardSignature } from 'lucide-react';
import { FileText, ClipboardSignature, Folder } from 'lucide-react';
import { usePaginatedQuery } from '@/hooks/use-paginated-query';
import { StatusPill, type StatusPillStatus } from '@/components/ui/status-pill';
@@ -153,7 +153,7 @@ export function HubRootView({ portSlug }: Props) {
href={`/${portSlug}/documents?folderId=${f.folderId}` as any}
className="inline-flex items-center gap-1 hover:underline"
>
<span aria-hidden>📁</span>
<Folder className="h-3 w-3" aria-hidden />
{f.folderName}
</Link>
) : null}

View File

@@ -196,11 +196,11 @@ export function NotesList({
// countdown decrements on screen. Reading `Date.now()` directly inside
// render is impure (different value every call); pinning to a state
// value means React Compiler can memoize cleanly.
// The interval is scheduled below ONLY while at least one note is still
// inside its 15-min edit window — see `anyNoteWithinEditWindow`. An idle
// NotesList (every note past its window, or none editable by this user)
// burns no timer and triggers no re-renders.
const [now, setNow] = useState(() => Date.now());
useEffect(() => {
const id = setInterval(() => setNow(Date.now()), 30_000);
return () => clearInterval(id);
}, []);
const aggregateOn = !!aggregate && AGGREGATABLE.has(entityType);
const baseEndpoint = `/api/v1/${NOTES_API_PATH[entityType]}/${entityId}/notes`;
@@ -243,14 +243,15 @@ export function NotesList({
onSuccess: () => invalidateAll(),
});
// Aggregated view: only notes from THIS entity itself are editable
// in-place. Notes pulled in from related entities (e.g. interests
// surfaced under a client) must be edited on the source page so the
// owning entity's timeline records the change.
const selfSource = SELF_SOURCE[entityType];
function canEdit(note: Note): boolean {
if (note.authorId !== currentUserId) return false;
if (note.isLocked) return false;
// Aggregated view: only notes from THIS entity itself are editable
// in-place. Notes pulled in from related entities (e.g. interests
// surfaced under a client) must be edited on the source page so the
// owning entity's timeline records the change.
const selfSource = SELF_SOURCE[entityType];
if (aggregateOn && note.source && note.source !== selfSource) return false;
const elapsed = now - new Date(note.createdAt).getTime();
return elapsed < NOTE_EDIT_WINDOW_MS;
@@ -264,6 +265,27 @@ export function NotesList({
return `${mins}m left to edit`;
}
// Whether THIS user has any note still inside its 15-min edit window.
// Mirrors `canEdit`'s non-time gates (author, not locked, self-source)
// and adds the time check against the current `now`. Drives the countdown
// interval below: it only runs while this is true, so a NotesList with
// nothing editable doesn't re-render every 30s. Recomputed each tick, so
// when the last editable note crosses the threshold this flips false and
// the effect tears the interval down.
const anyNoteWithinEditWindow = notes.some((note) => {
if (note.authorId !== currentUserId) return false;
if (note.isLocked) return false;
if (aggregateOn && note.source && note.source !== selfSource) return false;
const elapsed = now - new Date(note.createdAt).getTime();
return elapsed < NOTE_EDIT_WINDOW_MS;
});
useEffect(() => {
if (!anyNoteWithinEditWindow) return;
const id = setInterval(() => setNow(Date.now()), 30_000);
return () => clearInterval(id);
}, [anyNoteWithinEditWindow]);
return (
<div className="space-y-4">
{/* Create note form */}