fix: add answer type to all Record<NodeType> icon and color maps

Fixes NodeList, ContinuationModal, NodePicker, and TreePreviewNode.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
chihlasm
2026-02-18 01:34:33 -05:00
parent e19c740603
commit 225a7aaf08
4 changed files with 20 additions and 10 deletions

View File

@@ -21,13 +21,15 @@ interface ContinuationModalProps {
const nodeTypeIcons: Record<NodeType, React.ReactNode> = { const nodeTypeIcons: Record<NodeType, React.ReactNode> = {
decision: <HelpCircle className="h-4 w-4 text-blue-500" />, decision: <HelpCircle className="h-4 w-4 text-blue-500" />,
action: <Zap className="h-4 w-4 text-amber-500" />, action: <Zap className="h-4 w-4 text-amber-500" />,
solution: <CheckCircle className="h-4 w-4 text-green-500" /> solution: <CheckCircle className="h-4 w-4 text-green-500" />,
answer: <HelpCircle className="h-4 w-4 opacity-40" />
} }
const nodeTypeLabels: Record<NodeType, string> = { const nodeTypeLabels: Record<NodeType, string> = {
decision: 'Decision', decision: 'Decision',
action: 'Action', action: 'Action',
solution: 'Solution' solution: 'Solution',
answer: 'Answer'
} }
export function ContinuationModal({ export function ContinuationModal({

View File

@@ -91,13 +91,15 @@ function NodeListItem({
const nodeTypeIcons: Record<NodeType, React.ReactNode> = { const nodeTypeIcons: Record<NodeType, React.ReactNode> = {
decision: <HelpCircle className="h-4 w-4" />, decision: <HelpCircle className="h-4 w-4" />,
action: <Zap className="h-4 w-4" />, action: <Zap className="h-4 w-4" />,
solution: <CheckCircle className="h-4 w-4" /> solution: <CheckCircle className="h-4 w-4" />,
answer: <HelpCircle className="h-4 w-4 opacity-50" />
} }
const nodeTypeColors: Record<NodeType, string> = { const nodeTypeColors: Record<NodeType, string> = {
decision: 'bg-blue-500/20 text-blue-400', decision: 'bg-blue-500/20 text-blue-400',
action: 'bg-yellow-500/20 text-yellow-400', action: 'bg-yellow-500/20 text-yellow-400',
solution: 'bg-green-500/20 text-green-400' solution: 'bg-green-500/20 text-green-400',
answer: 'bg-muted text-muted-foreground border border-dashed border-border'
} }
const getNodeLabel = () => { const getNodeLabel = () => {

View File

@@ -13,14 +13,16 @@ const CREATE_SOLUTION = `${CREATE_PREFIX}solution__`
const NODE_TYPE_SYMBOLS: Record<NodeType, string> = { const NODE_TYPE_SYMBOLS: Record<NodeType, string> = {
decision: '\u24D8', // Information/question symbol decision: '\u24D8', // Information/question symbol
action: '\u26A1', // Lightning bolt for action action: '\u26A1', // Lightning bolt for action
solution: '\u2713' // Checkmark for solution solution: '\u2713', // Checkmark for solution
answer: '\u25CC' // Dashed circle for placeholder
} }
// Node type labels for UI // Node type labels for UI
const NODE_TYPE_LABELS: Record<NodeType, string> = { const NODE_TYPE_LABELS: Record<NodeType, string> = {
decision: 'Decision', decision: 'Decision',
action: 'Action', action: 'Action',
solution: 'Solution' solution: 'Solution',
answer: 'Answer'
} }
interface NodePickerProps { interface NodePickerProps {

View File

@@ -87,25 +87,29 @@ export function TreePreviewNode({
const nodeTypeColors: Record<NodeType, string> = { const nodeTypeColors: Record<NodeType, string> = {
decision: 'border-blue-500/50 bg-blue-500/10', decision: 'border-blue-500/50 bg-blue-500/10',
action: 'border-yellow-500/50 bg-yellow-500/10', action: 'border-yellow-500/50 bg-yellow-500/10',
solution: 'border-green-500/50 bg-green-500/10' solution: 'border-green-500/50 bg-green-500/10',
answer: 'border-dashed border-border bg-muted/50'
} }
const nodeTypeSelectedColors: Record<NodeType, string> = { const nodeTypeSelectedColors: Record<NodeType, string> = {
decision: 'border-blue-500 bg-blue-500/20 ring-2 ring-blue-500/50 shadow-lg shadow-blue-500/20', decision: 'border-blue-500 bg-blue-500/20 ring-2 ring-blue-500/50 shadow-lg shadow-blue-500/20',
action: 'border-yellow-500 bg-yellow-500/20 ring-2 ring-yellow-500/50 shadow-lg shadow-yellow-500/20', action: 'border-yellow-500 bg-yellow-500/20 ring-2 ring-yellow-500/50 shadow-lg shadow-yellow-500/20',
solution: 'border-green-500 bg-green-500/20 ring-2 ring-green-500/50 shadow-lg shadow-green-500/20' solution: 'border-green-500 bg-green-500/20 ring-2 ring-green-500/50 shadow-lg shadow-green-500/20',
answer: 'border-border bg-muted/50'
} }
const nodeTypeHoveredColors: Record<NodeType, string> = { const nodeTypeHoveredColors: Record<NodeType, string> = {
decision: 'border-blue-400 bg-blue-500/15 ring-1 ring-blue-400/50', decision: 'border-blue-400 bg-blue-500/15 ring-1 ring-blue-400/50',
action: 'border-yellow-400 bg-yellow-500/15 ring-1 ring-yellow-400/50', action: 'border-yellow-400 bg-yellow-500/15 ring-1 ring-yellow-400/50',
solution: 'border-green-400 bg-green-500/15 ring-1 ring-green-400/50' solution: 'border-green-400 bg-green-500/15 ring-1 ring-green-400/50',
answer: 'border-border bg-muted/50'
} }
const nodeTypeIcons: Record<NodeType, React.ReactNode> = { const nodeTypeIcons: Record<NodeType, React.ReactNode> = {
decision: <HelpCircle className="h-4 w-4 text-blue-500" />, decision: <HelpCircle className="h-4 w-4 text-blue-500" />,
action: <Zap className="h-4 w-4 text-yellow-500" />, action: <Zap className="h-4 w-4 text-yellow-500" />,
solution: <CheckCircle className="h-4 w-4 text-green-500" /> solution: <CheckCircle className="h-4 w-4 text-green-500" />,
answer: <HelpCircle className="h-4 w-4 opacity-40" />
} }
const getNodeLabel = () => { const getNodeLabel = () => {