Executive Meetings: inline editing, drag reorder, and current-meeting highlight
Implements Task #122 — four features on the Executive Meetings schedule: 1. Word-like inline editing of meeting title and attendee names with bold, italic, underline, color, font-family, font-size, and text-align controls (Tiptap-backed EditableCell + FormattingToolbar). 2. Drag-to-reorder column headers (dnd-kit), persisted in the existing em-schedule-cols-v1 storage key. Old up/down buttons removed. 3. Drag-to-reorder rows within a day. New POST /api/executive-meetings/reorder endpoint permutes daily_number + start/end times in a single transaction using a two-phase negative→final assignment that respects the (date, daily_number) UNIQUE constraint and survives partial-day reorders. Audit-logged and role-guarded. 4. Highlight the meeting whose start/end window is "now", refreshed every 60 s. Toggle and color picker live in the customize popover and persist to localStorage (em-current-meeting-highlight-v1). Backend changes - Widened titleAr / titleEn / attendees.name to text. - New artifacts/api-server/src/lib/sanitize.ts with an allowlist for inline tags + safe inline styles. Applied to POST, PATCH, PUT-attendees, duplicate, reorder, and applyApprovedRequest (add_attendee) paths so rich text round-trips safely. - Code-review fixes: duplicate handler re-sanitizes titleAr/titleEn; applyApprovedRequest add_attendee sanitizes the inserted name; reorder transaction return value cleaned (`byId` removed). - 5 new tests cover sanitization stripping, reorder happy path, cross-day rejection, permission denial, and applyApprovedRequest sanitization. Pre-existing app_permissions failures are unrelated (tracked by #126/#127). Frontend changes - artifacts/tx-os/src/components/editable-cell.tsx with FormattingToolbar (custom FontSize Tiptap extension + @tiptap/extension-text-align). - ScheduleSection wires saveTitle, saveAttendeeName, reorder mutation (optimistic with revert on error), highlight tick, and HighlightPrefs. - New SortableHeader component for column drag. - AttendeesCell passes the original attendee index to PUT writes so edits reach the right row even after grouping into virtual/internal/external. - Print page renders sanitized rich text via dangerouslySetInnerHTML on names and titles; attendee.title is rendered as a plain text node (XSS). - Translation keys added in ar.json and en.json.
This commit is contained in:
@@ -746,6 +746,7 @@ function ScheduleSection({
|
||||
// server round-trip finishes. Cleared on each new meetings prop.
|
||||
const [optimisticOrder, setOptimisticOrder] = useState<number[] | null>(null);
|
||||
const [reordering, setReordering] = useState(false);
|
||||
const reorderingRef = useRef(false);
|
||||
useEffect(() => {
|
||||
setOptimisticOrder(null);
|
||||
}, [meetings, date]);
|
||||
@@ -827,6 +828,7 @@ function ScheduleSection({
|
||||
const reorderRows = useCallback(
|
||||
async (fromId: number, toId: number) => {
|
||||
if (fromId === toId) return;
|
||||
if (reorderingRef.current) return;
|
||||
const ids = meetings.map((m) => m.id);
|
||||
const fromIdx = ids.indexOf(fromId);
|
||||
const toIdx = ids.indexOf(toId);
|
||||
@@ -835,6 +837,7 @@ function ScheduleSection({
|
||||
newOrder.splice(fromIdx, 1);
|
||||
newOrder.splice(toIdx, 0, fromId);
|
||||
setOptimisticOrder(newOrder);
|
||||
reorderingRef.current = true;
|
||||
setReordering(true);
|
||||
try {
|
||||
await apiJson(`/api/executive-meetings/reorder`, {
|
||||
@@ -851,6 +854,7 @@ function ScheduleSection({
|
||||
variant: "destructive",
|
||||
});
|
||||
} finally {
|
||||
reorderingRef.current = false;
|
||||
setReordering(false);
|
||||
}
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user