Skip to content

Commit 5810d20

Browse files
TataKKKLTataKKKL
committed
temp frontend
1 parent ce7ed51 commit 5810d20

File tree

4 files changed

+118
-4
lines changed

4 files changed

+118
-4
lines changed

‎visual-tree-search-app/components/ControlPanel.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ const ControlPanel: React.FC<ControlPanelProps> = ({
3434
<div className="bg-white dark:bg-slate-800 shadow-sm border-b sticky top-0 z-10">
3535
<div className="py-3 px-4 max-w-full">
3636
<div className="flex justify-between items-center">
37-
<h1 className="text-2xl font-bold text-sky-950 dark:text-sky-100">Visual Tree Search</h1>
37+
<h1 className="text-2xl font-bold text-sky-950 dark:text-sky-100">Visual Tree Search: Simple Search (BFS/DFS)</h1>
3838

3939
<div className="flex gap-2">
4040
<Button

‎visual-tree-search-app/components/ControlPanelLATS.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ const ControlPanelLATS: React.FC<ControlPanelProps> = ({
3434
<div className="bg-white dark:bg-slate-800 shadow-sm border-b sticky top-0 z-10">
3535
<div className="py-3 px-4 max-w-full">
3636
<div className="flex justify-between items-center">
37-
<h1 className="text-2xl font-bold text-sky-950 dark:text-sky-100">Visual Tree Search</h1>
37+
<h1 className="text-2xl font-bold text-sky-950 dark:text-sky-100">Visual Tree Search: LATS</h1>
3838

3939
<div className="flex gap-2">
4040
<Button

‎visual-tree-search-app/components/Layout.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ const Layout: React.FC<LayoutProps> = ({ children }) => {
1111
return (
1212
<>
1313
<Head>
14-
<title>NextJS Project</title>
14+
<title>Visual Tree Search</title>
1515
<link rel="icon" href="/favicon.ico" />
1616
</Head>
1717

‎visual-tree-search-app/components/MessageLogPanelLATS.tsx‎

Lines changed: 115 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,12 @@ import {
2626
Meh,
2727
ArrowRight,
2828
PlusCircle,
29-
Expand
29+
Expand,
30+
ArrowUp,
31+
Play,
32+
Route,
33+
Trash,
34+
StepForward
3035
} from 'lucide-react';
3136

3237
interface Message {
@@ -62,6 +67,9 @@ interface ParsedMessage {
6267
server_info?: {
6368
hostname?: string;
6469
};
70+
node_id?: string;
71+
value?: number;
72+
visits?: number;
6573
}
6674

6775
interface PathStep {
@@ -147,6 +155,25 @@ const MessageLogPanelLATS: React.FC<MessageLogPanelProps> = ({ messages, message
147155
case 'neutral':
148156
return "bg-gradient-to-r from-slate-50 to-slate-100 dark:from-slate-900/20 dark:to-slate-800/20 border-slate-200 dark:border-slate-800";
149157

158+
// MCTS specific updates
159+
case 'tree_update_node_children_evaluation':
160+
case 'tree_update_node_backpropagation':
161+
case 'tree_update_simulation':
162+
case 'trajectory_update':
163+
case 'removed_simulation':
164+
return "bg-gradient-to-r from-cyan-50 to-cyan-100 dark:from-cyan-900/20 dark:to-cyan-800/20 border-cyan-200 dark:border-cyan-800";
165+
166+
case 'iteration_start':
167+
case 'step_start':
168+
return "bg-gradient-to-r from-blue-50 to-blue-100 dark:from-blue-900/20 dark:to-blue-800/20 border-blue-200 dark:border-blue-800";
169+
170+
case 'node_selected':
171+
case 'node_selected_for_simulation':
172+
case 'node_created':
173+
case 'node_simulated':
174+
case 'node_terminal':
175+
return "bg-gradient-to-r from-green-50 to-green-100 dark:from-green-900/20 dark:to-green-800/20 border-green-200 dark:border-green-800";
176+
150177
default:
151178
return "bg-gradient-to-r from-slate-50 to-slate-100 dark:from-slate-900/20 dark:to-slate-800/20 border-slate-200 dark:border-slate-800";
152179
}
@@ -233,6 +260,30 @@ const MessageLogPanelLATS: React.FC<MessageLogPanelProps> = ({ messages, message
233260
return <Flag className="h-4 w-4 text-blue-500" />;
234261
case 'best_path_update':
235262
return <Target className="h-4 w-4 text-blue-500" />;
263+
case 'tree_update_node_children_evaluation':
264+
return <Brain className="h-4 w-4 text-cyan-500" />;
265+
case 'tree_update_node_backpropagation':
266+
return <ArrowUp className="h-4 w-4 text-cyan-500" />;
267+
case 'tree_update_simulation':
268+
return <Play className="h-4 w-4 text-cyan-500" />;
269+
case 'trajectory_update':
270+
return <Route className="h-4 w-4 text-cyan-500" />;
271+
case 'removed_simulation':
272+
return <Trash className="h-4 w-4 text-cyan-500" />;
273+
case 'iteration_start':
274+
return <RefreshCw className="h-4 w-4 text-blue-500" />;
275+
case 'step_start':
276+
return <StepForward className="h-4 w-4 text-blue-500" />;
277+
case 'node_selected':
278+
return <Target className="h-4 w-4 text-green-500" />;
279+
case 'node_selected_for_simulation':
280+
return <Target className="h-4 w-4 text-green-500" />;
281+
case 'node_created':
282+
return <PlusCircle className="h-4 w-4 text-green-500" />;
283+
case 'node_simulated':
284+
return <Play className="h-4 w-4 text-green-500" />;
285+
case 'node_terminal':
286+
return <Flag className="h-4 w-4 text-green-500" />;
236287
default:
237288
return <Info className="h-4 w-4 text-slate-500" />;
238289
}
@@ -309,6 +360,25 @@ const MessageLogPanelLATS: React.FC<MessageLogPanelProps> = ({ messages, message
309360
case 'neutral':
310361
return "bg-slate-100 dark:bg-slate-800/30 text-slate-600 dark:text-slate-400";
311362

363+
// MCTS specific updates
364+
case 'tree_update_node_children_evaluation':
365+
case 'tree_update_node_backpropagation':
366+
case 'tree_update_simulation':
367+
case 'trajectory_update':
368+
case 'removed_simulation':
369+
return "bg-cyan-100 dark:bg-cyan-800/30 text-cyan-600 dark:text-cyan-400";
370+
371+
case 'iteration_start':
372+
case 'step_start':
373+
return "bg-blue-100 dark:bg-blue-800/30 text-blue-600 dark:text-blue-400";
374+
375+
case 'node_selected':
376+
case 'node_selected_for_simulation':
377+
case 'node_created':
378+
case 'node_simulated':
379+
case 'node_terminal':
380+
return "bg-green-100 dark:bg-green-800/30 text-green-600 dark:text-green-400";
381+
312382
default:
313383
return "bg-slate-100 dark:bg-slate-800/30 text-slate-600 dark:text-slate-400";
314384
}
@@ -477,6 +547,50 @@ const MessageLogPanelLATS: React.FC<MessageLogPanelProps> = ({ messages, message
477547
</div>
478548
);
479549

550+
case 'tree_update_node_children_evaluation':
551+
case 'tree_update_node_backpropagation':
552+
case 'tree_update_simulation':
553+
case 'trajectory_update':
554+
case 'removed_simulation':
555+
return (
556+
<div className="flex items-center gap-2 animate-fadeIn">
557+
{getIcon(message)}
558+
<div className="animate-slideIn">
559+
<div className="text-cyan-600 dark:text-cyan-400">
560+
{message.description || message.type.split('_').join(' ')}
561+
</div>
562+
{message.node_id && (
563+
<div className="text-xs text-slate-500 dark:text-slate-400">
564+
Node ID: {message.node_id}
565+
</div>
566+
)}
567+
</div>
568+
</div>
569+
);
570+
571+
case 'node_selected':
572+
case 'node_selected_for_simulation':
573+
case 'node_created':
574+
case 'node_simulated':
575+
case 'node_terminal':
576+
return (
577+
<div className="flex items-center gap-2 animate-fadeIn">
578+
{getIcon(message)}
579+
<div className="animate-slideIn">
580+
<div className="text-green-600 dark:text-green-400">
581+
{message.description || message.type.split('_').join(' ')}
582+
</div>
583+
{message.node_id && (
584+
<div className="text-xs text-slate-500 dark:text-slate-400">
585+
Node ID: {message.node_id}
586+
{message.value !== undefined && ` | Value: ${message.value.toFixed(2)}`}
587+
{message.visits !== undefined && ` | Visits: ${message.visits}`}
588+
</div>
589+
)}
590+
</div>
591+
</div>
592+
);
593+
480594
default:
481595
return (
482596
<div className="flex items-center gap-2 animate-fadeIn">

0 commit comments

Comments
 (0)