diff --git a/.changeset/fn-7805-quick-add-priority-indicators.md b/.changeset/fn-7805-quick-add-priority-indicators.md new file mode 100644 index 0000000000..e7e0d28d50 --- /dev/null +++ b/.changeset/fn-7805-quick-add-priority-indicators.md @@ -0,0 +1,7 @@ +--- +"@runfusion/fusion": patch +--- + +summary: Quick-add composer now shows icon-only priority/Fast controls with GitHub tracking beside attach. +category: feature +dev: QuickEntryBox + TaskForm reuse a shared priorityIndicator glyph helper; GitHub + Priority relocated into .quick-entry-primary-group; no test-id/payload changes. diff --git a/docs/dashboard-guide.md b/docs/dashboard-guide.md index 9f7671eadd..482d90cd42 100644 --- a/docs/dashboard-guide.md +++ b/docs/dashboard-guide.md @@ -462,7 +462,8 @@ Create requests never send an explicit `column`. The task store resolves the lan Optional workflow steps declared by the active workflow are available from the quick-add action row and the **New Task** dialog's inline quick buttons. For example, the coding workflow's browser verification option appears as a quick drop-down when that workflow is active; each option is seeded from the workflow step's `defaultOn` setting and is sent with the task's `enabledWorkflowSteps` payload at creation time. -Quick Add image attachments use the paperclip icon button in the action row. Supported image files (`png`, `jpeg`, `gif`, `webp`) can be selected from that control, pasted into the Quick Add input, or dragged onto the Quick Add box; all three paths show pending previews before task creation and upload the images to the created task afterward. + +Quick Add image attachments use the paperclip icon button in the action row. Supported image files (`png`, `jpeg`, `gif`, `webp`) can be selected from that control, pasted into the Quick Add input, or dragged onto the Quick Add box; all three paths show pending previews before task creation and upload the images to the created task afterward. The same bottom action row places the GitHub tracking override beside the paperclip; Priority is an icon-only control whose glyph changes by selected level (down arrow for low, flag for normal, up arrow for high, alert for urgent), and Fast is an icon-only lightning control. These icon-only controls keep accessible labels and the same create-payload behavior as the previous text chips. Quick entry, inline quick-create, and the full **New Task** dialog all check for similar active tasks before creating. When possible duplicates exist, the warning lists each match by task description (falling back to title, then “No description”) and lets you open an existing task, cancel, or create anyway with the duplicates acknowledged. diff --git a/packages/dashboard/app/__tests__/quick-entry-action-row-height-parity.test.tsx b/packages/dashboard/app/__tests__/quick-entry-action-row-height-parity.test.tsx index 3af7f5c7c0..23f4e85554 100644 --- a/packages/dashboard/app/__tests__/quick-entry-action-row-height-parity.test.tsx +++ b/packages/dashboard/app/__tests__/quick-entry-action-row-height-parity.test.tsx @@ -89,7 +89,11 @@ vi.mock("lucide-react", () => ({ ChevronRight: () => null, Bot: () => null, Server: () => null, + ArrowDown: () => null, + ArrowUp: () => null, Flag: () => null, + TriangleAlert: () => null, + Zap: () => null, Maximize2: () => null, Minimize2: () => null, })); @@ -182,7 +186,7 @@ describe("quick-entry action row height parity (FN-7680)", () => { // unrelated @media block or the desktop base rule further up the file. const sectionStart = cssContent.indexOf("Quick Entry Mobile Touch + Overflow Fixes"); expect(sectionStart).toBeGreaterThan(-1); - const section = cssContent.slice(sectionStart, sectionStart + 800); + const section = cssContent.slice(sectionStart, sectionStart + 1600); expect(section).toContain("max-width: 768px"); const mobileBlockMatch = section.match( @@ -221,7 +225,7 @@ describe("quick-entry action row height parity (FN-7680)", () => { expect(depTriggerMatch![1].trim()).toBe("3px 8px"); }); - it("renders Save, workflow trigger, Attach, Fast, Priority, and Deps as sibling .btn elements in the same .quick-entry-actions row", () => { + it("renders Save, workflow trigger, Attach, GitHub, Priority, Fast, and Deps as sibling .btn elements in the same .quick-entry-actions row", () => { mockDesktopViewport(); renderQuickEntryBox(); @@ -231,11 +235,12 @@ describe("quick-entry action row height parity (FN-7680)", () => { const save = screen.getByTestId("quick-entry-save"); const trigger = screen.getByTestId("quick-entry-workflow-trigger"); const attach = screen.getByTestId("quick-entry-attach"); - const fast = screen.getByTestId("quick-entry-fast-toggle"); + const github = screen.getByTestId("quick-entry-github-toggle"); const priority = screen.getByTestId("quick-entry-priority-button"); + const fast = screen.getByTestId("quick-entry-fast-toggle"); const deps = screen.getByTestId("quick-entry-deps"); - for (const el of [save, trigger, attach, fast, priority, deps]) { + for (const el of [save, trigger, attach, github, priority, fast, deps]) { expect(el.classList.contains("btn")).toBe(true); expect(actionsRow.contains(el)).toBe(true); } diff --git a/packages/dashboard/app/__tests__/quick-entry-workflow-trigger-height.test.tsx b/packages/dashboard/app/__tests__/quick-entry-workflow-trigger-height.test.tsx index 93a1d70495..80f229130c 100644 --- a/packages/dashboard/app/__tests__/quick-entry-workflow-trigger-height.test.tsx +++ b/packages/dashboard/app/__tests__/quick-entry-workflow-trigger-height.test.tsx @@ -82,7 +82,11 @@ vi.mock("lucide-react", () => ({ ChevronRight: () => null, Bot: () => null, Server: () => null, + ArrowDown: () => null, + ArrowUp: () => null, Flag: () => null, + TriangleAlert: () => null, + Zap: () => null, Maximize2: () => null, Minimize2: () => null, })); @@ -366,18 +370,22 @@ describe("quick-entry-actions fixed-height parity, not just a min-height floor ( expect(depTriggerMatches!.length).toBe(1); }); - it("renders Save, Attach, Fast, and the workflow trigger as siblings in one .quick-entry-actions row (no shell/layout regression; jsdom cannot measure real pixel heights)", () => { + it("renders Save, Attach, GitHub, Priority, Fast, and the workflow trigger as siblings in one .quick-entry-actions row (no shell/layout regression; jsdom cannot measure real pixel heights)", () => { mockDesktopViewport(); renderQuickEntryBox(); const saveButton = screen.getByTestId("quick-entry-save"); const attachButton = screen.getByTestId("quick-entry-attach"); + const githubToggle = screen.getByTestId("quick-entry-github-toggle"); + const priorityButton = screen.getByTestId("quick-entry-priority-button"); const fastToggle = screen.getByTestId("quick-entry-fast-toggle"); const workflowTrigger = screen.getByTestId("quick-entry-workflow-trigger"); const actionsRow = saveButton.closest(".quick-entry-actions"); expect(actionsRow).not.toBeNull(); expect(actionsRow?.contains(attachButton)).toBe(true); + expect(actionsRow?.contains(githubToggle)).toBe(true); + expect(actionsRow?.contains(priorityButton)).toBe(true); expect(actionsRow?.contains(fastToggle)).toBe(true); expect(actionsRow?.contains(workflowTrigger)).toBe(true); }); diff --git a/packages/dashboard/app/components/QuickEntryBox.css b/packages/dashboard/app/components/QuickEntryBox.css index a6d467e9c7..b28446101b 100644 --- a/packages/dashboard/app/components/QuickEntryBox.css +++ b/packages/dashboard/app/components/QuickEntryBox.css @@ -198,11 +198,12 @@ section under one line. /* FNXC:BoardComposer 2026-07-10-12:00: The action row is organized as two logical clusters instead of one undifferentiated wrap of chips: -- `.quick-entry-options-group` — task options (workflow, priority, optional steps, subtask, deps, - models, node, agent, GitHub tracking), wrapping left-to-right with one consistent chip gap. -- `.quick-entry-primary-group` — attach + Fast + Save; margin-left auto keeps it right-aligned so the - distinct Save action always ends the row (and wraps as one unit on narrow columns, never splitting - Save from its neighbors). +- `.quick-entry-options-group` — task options (workflow, optional steps, subtask, deps, + models, node, agent), wrapping left-to-right with one consistent chip gap. +- `.quick-entry-primary-group` — attach + GitHub tracking + Priority + Fast + Save; margin-left auto + keeps it right-aligned so the distinct Save action always ends the row (and wraps as one unit on + narrow columns, never splitting Save from its neighbors). Priority and Fast are icon-only here; the + priority glyph follows the shared up/high, down/low, flag/normal, alert/urgent mapping. Chip HEIGHT consistency is already enforced by the FN-7680/FN-7683 fixed-box rule on `.quick-entry-actions .btn` above (descendant selector — still applies inside these wrappers); these rules only own grouping/spacing/alignment. @@ -315,6 +316,14 @@ surfaces use are untouched. color: var(--text); } +.quick-entry-primary-group .btn.btn-primary:not(.btn-task-create), +.quick-entry-primary-group .btn.btn-primary:not(.btn-task-create):hover, +.quick-entry-primary-group .btn.btn-primary:not(.btn-task-create):focus-visible { + background: var(--cta-bg); + border-color: var(--cta-border); + color: var(--cta-text); +} + /* FNXC:QuickAddWorkflow 2026-06-30-00:00: Quick-add workflow targeting sits in the action row as a compact existing-button dropdown. Use tokenized sizing/colors so the selector wraps with Save/Plan controls on narrow Board and List surfaces without introducing a separate visual hierarchy. diff --git a/packages/dashboard/app/components/QuickEntryBox.tsx b/packages/dashboard/app/components/QuickEntryBox.tsx index f302d91e4f..a4352b3dfa 100644 --- a/packages/dashboard/app/components/QuickEntryBox.tsx +++ b/packages/dashboard/app/components/QuickEntryBox.tsx @@ -8,7 +8,7 @@ import type { Task, Settings, TaskPriority, ResolvedWorkflowOptionalStep, Thinki import type { ModelInfo, Agent, CreateTaskInput, DuplicateMatch, BoardWorkflowDefinition, NodeInfo } from "../api"; import { checkDuplicateTasks, fetchModels, fetchSettings, updateGlobalSettings, fetchAgents, uploadAttachment, fetchWorkflowOptionalSteps } from "../api"; import { DuplicateWarningModal } from "./DuplicateWarningModal"; -import { Link, Paperclip, Brain, Lightbulb, ListTree, Sparkles, Save, ChevronDown, ChevronUp, ChevronRight, Bot, Server, Flag } from "lucide-react"; +import { Link, Paperclip, Brain, Lightbulb, ListTree, Sparkles, Save, ChevronDown, ChevronUp, ChevronRight, Bot, Server, Zap } from "lucide-react"; import { CustomModelDropdown } from "./CustomModelDropdown"; import { LoadingSpinner } from "./LoadingSpinner"; import { getScopedItem, removeScopedItem, setScopedItem } from "../utils/projectStorage"; @@ -17,6 +17,7 @@ import { NodeHealthDot } from "./NodeHealthDot"; import { ProviderIcon } from "./ProviderIcon"; import { WorkflowOptionalStepsDropdown } from "./WorkflowOptionalStepsDropdown"; import { WorkflowIcon } from "./WorkflowIcon"; +import { getPriorityIcon, getPriorityLabel } from "../utils/priorityIndicator"; const STORAGE_KEY = "kb-quick-entry-text"; const ALLOWED_IMAGE_TYPES = ["image/png", "image/jpeg", "image/gif", "image/webp"]; @@ -1636,6 +1637,10 @@ export function QuickEntryBox({ onCreate, addToast, tasks = [], availableModels, const githubToggleLabel = effectiveGithubTracking ? t("tasks.githubTrackingOn", "GitHub tracking ON for next task (project default: {{default}})", { default: projectGithubTrackingDefault ? t("tasks.githubTrackingDefaultOn", "on") : t("tasks.githubTrackingDefaultOff", "off") }) : t("tasks.githubTrackingOff", "GitHub tracking OFF for next task (project default: {{default}})", { default: projectGithubTrackingDefault ? t("tasks.githubTrackingDefaultOn", "on") : t("tasks.githubTrackingDefaultOff", "off") }); + const PriorityIcon = getPriorityIcon(priority); + const priorityLabel = getPriorityLabel(priority); + const priorityButtonLabel = t("tasks.quickEntryPriorityLabel", "Priority: {{priority}}", { priority: priorityLabel }); + const fastToggleLabel = t("tasks.toggleFastMode", "Toggle fast execution mode"); // Show expanded controls based on disclosure state (user preference), not textarea focus const showExpandedControls = isDisclosureExpanded; @@ -1731,10 +1736,14 @@ export function QuickEntryBox({ onCreate, addToast, tasks = [], availableModels, FNXC:BoardComposer 2026-07-10-12:00: First-run review flagged the quick-add composer as disorganized: chips wrapped into four arbitrary-looking rows with Save buried mid-row. Reorganize into two logical clusters inside - the single wrapping action row: an options group (workflow, priority, optional steps, subtask, - deps, models, node, agent, GitHub tracking) and a right-aligned primary group (attach, Fast, - Save) so the primary Save action always reads last/right. All triggers, popovers, and test ids - are unchanged — this is a layout/organization pass only. + the single wrapping action row: an options group (workflow, optional steps, subtask, deps, + models, node, agent) and a right-aligned primary group (attach, GitHub tracking, Priority, + Fast, Save) so status controls sit beside attach and Save still reads last/right. + + FNXC:QuickAddActionRow 2026-07-10-21:45: + Priority and Fast are icon-only in the bottom primary group: priority uses the shared + up/high, down/low, flag/normal, alert/urgent glyph helper, and Fast uses Zap while retaining + title/aria-label/test-id semantics. */}
{showWorkflowSelector && ( @@ -1837,73 +1846,6 @@ export function QuickEntryBox({ onCreate, addToast, tasks = [], availableModels,
)} -
- -
- - {showPriorityPicker && portalRoot && priorityPickerPosition && createPortal( -
e.preventDefault()} - style={{ - position: "fixed", - top: `${priorityPickerPosition.top}px`, - left: `${priorityPickerPosition.left}px`, - width: `${priorityPickerPosition.width}px`, - maxHeight: priorityPickerPosition.maxHeight ? `${priorityPickerPosition.maxHeight}px` : undefined, - overflowY: priorityPickerPosition.maxHeight ? "auto" : undefined, - }} - > -
{t("tasks.selectPriority", "Select priority")}
- {TASK_PRIORITIES.map((taskPriority) => { - const label = `${taskPriority[0].toUpperCase()}${taskPriority.slice(1)}`; - return ( -
e.preventDefault()} - onClick={() => { - setPriority(taskPriority); - setShowPriorityPicker(false); - setPriorityPickerPosition(null); - }} - > - {label} -
- ); - })} -
, - portalRoot, - )} , portalRoot, )} - - {/* FNXC:BoardComposer 2026-07-10-12:00: - Primary action cluster: attach + Fast sit directly beside Save, and Save is the LAST control in - DOM order so it is right-aligned (margin-left auto on the cluster) and reads as the composer's - primary action. Save keeps its distinct `btn-task-create` styling. + Primary action cluster: attach + GitHub tracking + Priority + Fast sit directly beside Save, + and Save is the LAST control in DOM order so it is right-aligned (margin-left auto on the + cluster) and reads as the composer's primary action. Save keeps its distinct `btn-task-create` + styling. FNXC:QuickAddAttachments 2026-06-30-00:00 (relocated 2026-07-10): the attachment affordance stays adjacent to Save (now immediately to its LEFT) preserving the icon-only label, hidden file input trigger, and pending-count badge. @@ -2254,6 +2182,90 @@ export function QuickEntryBox({ onCreate, addToast, tasks = [], availableModels, )} + + +
+ +
+ + {showPriorityPicker && portalRoot && priorityPickerPosition && createPortal( +
e.preventDefault()} + style={{ + position: "fixed", + top: `${priorityPickerPosition.top}px`, + left: `${priorityPickerPosition.left}px`, + width: `${priorityPickerPosition.width}px`, + maxHeight: priorityPickerPosition.maxHeight ? `${priorityPickerPosition.maxHeight}px` : undefined, + overflowY: priorityPickerPosition.maxHeight ? "auto" : undefined, + }} + > +
{t("tasks.selectPriority", "Select priority")}
+ {TASK_PRIORITIES.map((taskPriority) => { + const label = getPriorityLabel(taskPriority); + return ( +
e.preventDefault()} + onClick={() => { + setPriority(taskPriority); + setShowPriorityPicker(false); + setPriorityPickerPosition(null); + }} + > + {label} +
+ ); + })} +
, + portalRoot, + )} + )} @@ -1137,26 +1146,22 @@ export function TaskForm({ )} - {/* FNXC:NewTask 2026-06-23-00:10: Priority — cycles TASK_PRIORITIES via onPriorityChange (Flag affordance, same label shape as QuickEntryBox). */} + {/* FNXC:NewTask 2026-06-23-00:10: Priority — cycles TASK_PRIORITIES via onPriorityChange (shared icon-only glyph language, same accessible label shape as QuickEntryBox). */} {onPriorityChange && ( )} diff --git a/packages/dashboard/app/components/__tests__/NewTaskModal.test.tsx b/packages/dashboard/app/components/__tests__/NewTaskModal.test.tsx index 6b043fef58..3683fa8780 100644 --- a/packages/dashboard/app/components/__tests__/NewTaskModal.test.tsx +++ b/packages/dashboard/app/components/__tests__/NewTaskModal.test.tsx @@ -25,7 +25,10 @@ vi.mock("lucide-react", () => ({ Minimize2: () => null, Workflow: () => null, Paperclip: () => null, + ArrowDown: () => null, + ArrowUp: () => null, Flag: () => null, + TriangleAlert: () => null, Zap: () => null, Brain: () => null, Server: () => null, diff --git a/packages/dashboard/app/components/__tests__/QuickEntryBox.test.tsx b/packages/dashboard/app/components/__tests__/QuickEntryBox.test.tsx index 83e0c8abb8..6e2573d13a 100644 --- a/packages/dashboard/app/components/__tests__/QuickEntryBox.test.tsx +++ b/packages/dashboard/app/components/__tests__/QuickEntryBox.test.tsx @@ -2,7 +2,7 @@ import { readFileSync } from "node:fs"; import { describe, it, expect, vi, beforeEach, afterEach } from "vitest"; import { render, screen, fireEvent, waitFor, act, createEvent } from "@testing-library/react"; import { QuickEntryBox } from "../QuickEntryBox"; -import type { Task } from "@fusion/core"; +import { TASK_PRIORITIES, type Task, type TaskPriority } from "@fusion/core"; import { checkDuplicateTasks, fetchSettings, fetchAgents, uploadAttachment, fetchWorkflowOptionalSteps } from "../../api"; import { useNodes } from "../../hooks/useNodes"; import { scopedKey } from "../../utils/projectStorage"; @@ -211,25 +211,29 @@ vi.mock("../../hooks/useNodes", () => ({ // Mock lucide-react vi.mock("lucide-react", () => { - const MockIcon = (props: any) => ; + const MockIcon = (iconClass: string) => ({ className, ...props }: any) => ; return { - Link: MockIcon, - Paperclip: MockIcon, - Brain: MockIcon, - Lightbulb: MockIcon, - ListTree: MockIcon, - Sparkles: MockIcon, - Save: MockIcon, - X: MockIcon, - ChevronDown: MockIcon, - ChevronUp: MockIcon, - ChevronRight: MockIcon, - Bot: MockIcon, - Server: MockIcon, - Flag: MockIcon, - Github: MockIcon, - Maximize2: MockIcon, - Minimize2: MockIcon, + Link: MockIcon("lucide-link"), + Paperclip: MockIcon("lucide-paperclip"), + Brain: MockIcon("lucide-brain"), + Lightbulb: MockIcon("lucide-lightbulb"), + ListTree: MockIcon("lucide-list-tree"), + Sparkles: MockIcon("lucide-sparkles"), + Save: MockIcon("lucide-save"), + X: MockIcon("lucide-x"), + ChevronDown: MockIcon("lucide-chevron-down"), + ChevronUp: MockIcon("lucide-chevron-up"), + ChevronRight: MockIcon("lucide-chevron-right"), + Bot: MockIcon("lucide-bot"), + Server: MockIcon("lucide-server"), + ArrowDown: MockIcon("lucide-arrow-down"), + ArrowUp: MockIcon("lucide-arrow-up"), + Flag: MockIcon("lucide-flag"), + TriangleAlert: MockIcon("lucide-triangle-alert"), + Zap: MockIcon("lucide-zap"), + Github: MockIcon("lucide-github"), + Maximize2: MockIcon("lucide-maximize-2"), + Minimize2: MockIcon("lucide-minimize-2"), }; }); @@ -407,23 +411,39 @@ function mockMobileViewport() { /* FNXC:BoardComposer 2026-07-10-12:00: -DOM order mirrors the reorganized composer action row: the options group (priority, subtask, deps, -models, node, agent, GitHub) comes first, followed by the right-aligned primary group -(attach, Fast, Save) with Save as the LAST control. +DOM order mirrors the reorganized composer action row: the options group (subtask, deps, +models, node, agent) comes first, followed by the right-aligned primary group (attach, GitHub, +Priority, Fast, Save) with Save as the LAST control. */ const QUICK_ENTRY_ACTION_BUTTONS = [ - ["Priority", "quick-entry-priority-button"], ["Subtask", "subtask-button"], ["Deps", "quick-entry-deps"], ["Models", "quick-entry-models"], ["Node", "quick-entry-node-button"], ["Agent", "quick-entry-agent-button"], - ["GitHub", "quick-entry-github-toggle"], ["Attach", "quick-entry-attach"], + ["GitHub", "quick-entry-github-toggle"], + ["Priority", "quick-entry-priority-button"], ["Fast", "quick-entry-fast-toggle"], ["Save", "quick-entry-save"], ] as const; +const QUICK_ENTRY_PRIORITY_ICON_CLASS: Record = { + low: "lucide-arrow-down", + normal: "lucide-flag", + high: "lucide-arrow-up", + urgent: "lucide-triangle-alert", +}; + +function expectQuickEntryPriorityButton(priority: TaskPriority) { + const label = `${priority[0].toUpperCase()}${priority.slice(1)}`; + const priorityButton = screen.getByTestId("quick-entry-priority-button"); + expect(priorityButton).toHaveAttribute("title", `Priority: ${label}`); + expect(priorityButton).toHaveAttribute("aria-label", `Priority: ${label}`); + expect(priorityButton).not.toHaveTextContent(label); + expect(priorityButton.querySelector("svg")?.classList.contains(QUICK_ENTRY_PRIORITY_ICON_CLASS[priority])).toBe(true); +} + describe("QuickEntryBox", () => { beforeEach(() => { vi.clearAllMocks(); @@ -853,22 +873,31 @@ describe("QuickEntryBox", () => { /* FNXC:BoardComposer 2026-07-10-12:00: - The primary group ends the action row as [Attach, Fast, Save]: Save is the LAST control (right- - aligned primary action) and Attach/Fast sit immediately beside it inside the same cluster. + The primary group ends the action row as [Attach, GitHub, Priority, Fast, Save]: Save is the LAST + control (right-aligned primary action) and Attach/GitHub/Priority/Fast sit immediately beside it + inside the same cluster. */ - it("ends the action row with the primary group: Attach and Fast immediately before Save, Save last", () => { + it("ends the action row with the primary group: status controls beside Attach and Save last", () => { renderQuickEntryBox({}); expandQuickEntry(); const actionButtonTestIds = getActionButtonTestIdsInDomOrder(); - expect(actionButtonTestIds.slice(-3)).toEqual(["quick-entry-attach", "quick-entry-fast-toggle", "quick-entry-save"]); + expect(actionButtonTestIds.slice(-5)).toEqual([ + "quick-entry-attach", + "quick-entry-github-toggle", + "quick-entry-priority-button", + "quick-entry-fast-toggle", + "quick-entry-save", + ]); const primaryGroup = screen.getByTestId("quick-entry-primary-group"); - for (const testId of ["quick-entry-attach", "quick-entry-fast-toggle", "quick-entry-save"]) { + for (const testId of ["quick-entry-attach", "quick-entry-github-toggle", "quick-entry-priority-button", "quick-entry-fast-toggle", "quick-entry-save"]) { expect(primaryGroup.contains(screen.getByTestId(testId))).toBe(true); } const optionsGroup = screen.getByTestId("quick-entry-options-group"); - expect(optionsGroup.contains(screen.getByTestId("quick-entry-save"))).toBe(false); + for (const testId of ["quick-entry-github-toggle", "quick-entry-priority-button", "quick-entry-save"]) { + expect(optionsGroup.contains(screen.getByTestId(testId))).toBe(false); + } }); it("action buttons appear in correct DOM order after reorder", () => { @@ -1066,7 +1095,7 @@ describe("QuickEntryBox", () => { const highOption = await screen.findByTestId("quick-entry-priority-option-high"); await touchPriorityOption(highOption); - expect(priorityButton.textContent).toContain("High"); + expectQuickEntryPriorityButton("high"); await waitFor(() => { expect(screen.queryByTestId("quick-entry-priority-option-normal")).toBeNull(); }); @@ -1259,7 +1288,7 @@ describe("QuickEntryBox", () => { vi.runOnlyPendingTimers(); }); - expect(priorityButton.textContent).toContain("High"); + expectQuickEntryPriorityButton("high"); expect(document.activeElement).not.toBe(textarea); }); @@ -2107,6 +2136,9 @@ describe("QuickEntryBox", () => { const fastToggle = screen.getByTestId("quick-entry-fast-toggle"); expect(fastToggle).toBeTruthy(); expect(fastToggle.getAttribute("aria-pressed")).toBe("false"); + expect(fastToggle).toHaveAttribute("aria-label", "Toggle fast execution mode"); + expect(fastToggle).not.toHaveTextContent("Fast"); + expect(fastToggle.querySelector("svg")?.classList.contains("lucide-zap")).toBe(true); }); it("shows Priority selector in expanded controls", () => { @@ -2115,7 +2147,18 @@ describe("QuickEntryBox", () => { const priorityButton = screen.getByTestId("quick-entry-priority-button"); expect(priorityButton).toBeTruthy(); - expect(priorityButton.textContent).toContain("Normal"); + expectQuickEntryPriorityButton("normal"); + }); + + it("renders the icon-only priority glyph and accessible label for every level", () => { + renderQuickEntryBox({}); + expandQuickEntry(); + + for (const taskPriority of TASK_PRIORITIES) { + openPriorityMenu(); + fireEvent.click(screen.getByTestId(`quick-entry-priority-option-${taskPriority}`)); + expectQuickEntryPriorityButton(taskPriority); + } }); it("submits selected priority through onCreate payload", async () => { @@ -2563,7 +2606,7 @@ describe("QuickEntryBox", () => { }); expandQuickEntry(); - expect(screen.getByTestId("quick-entry-priority-button").textContent).toContain("Normal"); + expectQuickEntryPriorityButton("normal"); }); it("resets priority to normal after Subtask flow", async () => { @@ -2582,7 +2625,7 @@ describe("QuickEntryBox", () => { }); expandQuickEntry(); - expect(screen.getByTestId("quick-entry-priority-button").textContent).toContain("Normal"); + expectQuickEntryPriorityButton("normal"); }); it("opens dependency dropdown when clicking deps button", () => { diff --git a/packages/dashboard/app/components/__tests__/TaskForm.test.tsx b/packages/dashboard/app/components/__tests__/TaskForm.test.tsx index f34f951b55..d40e2156df 100644 --- a/packages/dashboard/app/components/__tests__/TaskForm.test.tsx +++ b/packages/dashboard/app/components/__tests__/TaskForm.test.tsx @@ -13,7 +13,10 @@ vi.mock("lucide-react", () => ({ Maximize2: () => null, Minimize2: () => null, Paperclip: () => null, + ArrowDown: () => null, + ArrowUp: () => null, Flag: () => null, + TriangleAlert: () => null, Zap: () => null, Brain: () => null, Server: () => null, diff --git a/packages/dashboard/app/utils/__tests__/priorityIndicator.test.tsx b/packages/dashboard/app/utils/__tests__/priorityIndicator.test.tsx new file mode 100644 index 0000000000..6d3680810d --- /dev/null +++ b/packages/dashboard/app/utils/__tests__/priorityIndicator.test.tsx @@ -0,0 +1,21 @@ +import { describe, expect, it } from "vitest"; +import { ArrowDown, ArrowUp, Flag, TriangleAlert } from "lucide-react"; +import { TASK_PRIORITIES, type TaskPriority } from "@fusion/core"; +import { getPriorityIcon, getPriorityLabel, priorityIndicator } from "../priorityIndicator"; + +const expectedIndicators: Record = { + low: { icon: ArrowDown, label: "Low" }, + normal: { icon: Flag, label: "Normal" }, + high: { icon: ArrowUp, label: "High" }, + urgent: { icon: TriangleAlert, label: "Urgent" }, +}; + +describe("priorityIndicator", () => { + it("returns the shared glyph and label for every task priority", () => { + for (const priority of TASK_PRIORITIES) { + expect(priorityIndicator(priority)).toEqual(expectedIndicators[priority]); + expect(getPriorityIcon(priority)).toBe(expectedIndicators[priority].icon); + expect(getPriorityLabel(priority)).toBe(expectedIndicators[priority].label); + } + }); +}); diff --git a/packages/dashboard/app/utils/priorityIndicator.tsx b/packages/dashboard/app/utils/priorityIndicator.tsx new file mode 100644 index 0000000000..c16382f8b4 --- /dev/null +++ b/packages/dashboard/app/utils/priorityIndicator.tsx @@ -0,0 +1,30 @@ +import { ArrowDown, ArrowUp, Flag, TriangleAlert, type LucideIcon } from "lucide-react"; +import type { TaskPriority } from "@fusion/core"; + +export interface PriorityIndicator { + icon: LucideIcon; + label: string; +} + +/* +FNXC:QuickAddPriorityIndicator 2026-07-10-12:00: +Quick-add and New Task priority affordances must share one glyph language: ArrowUp means high, ArrowDown means low, Flag means normal, and TriangleAlert means urgent. Keep this helper as the single source so icon-only priority buttons do not drift across composer surfaces. +*/ +const PRIORITY_INDICATORS: Record = { + low: { icon: ArrowDown, label: "Low" }, + normal: { icon: Flag, label: "Normal" }, + high: { icon: ArrowUp, label: "High" }, + urgent: { icon: TriangleAlert, label: "Urgent" }, +}; + +export function priorityIndicator(priority: TaskPriority): PriorityIndicator { + return PRIORITY_INDICATORS[priority]; +} + +export function getPriorityIcon(priority: TaskPriority): LucideIcon { + return priorityIndicator(priority).icon; +} + +export function getPriorityLabel(priority: TaskPriority): string { + return priorityIndicator(priority).label; +}