fix: Add missing style imports

agent/agent.tsx

@@ -5,6 +5,7 @@ import { GenerativeUIAnnotation, GenerativeUIState } from "./types";
 import { stockbrokerGraph } from "./stockbroker";
 import { ChatOpenAI } from "@langchain/openai";
 import { tripPlannerGraph } from "./trip-planner";
+import { formatMessages } from "./utils/format-messages";
 
 const allToolDescriptions = `- stockbroker: can fetch the price of a ticker, purchase/sell a ticker, or get the user's portfolio
 - tripPlanner: helps the user plan their trip. it can suggest restaurants, and places to stay in any given location.`;
@@ -37,17 +38,25 @@ ${allToolDescriptions}
   const prompt = `You're a highly helpful AI assistant, tasked with routing the user's query to the appropriate tool.
 You should analyze the user's input, and choose the appropriate tool to use.`;
 
-  const recentHumanMessage = state.messages.findLast(
+  const allMessagesButLast = state.messages.slice(0, -1);
-    (m) => m.getType() === "human",
+  const lastMessage = state.messages.at(-1);
-  );
 
-  if (!recentHumanMessage) {
+  const formattedPreviousMessages = formatMessages(allMessagesButLast);
-    throw new Error("No human message found in state");
+  const formattedLastMessage = lastMessage ? formatMessages([lastMessage]) : "";
-  }
+
+  const humanMessage = `Here is the full conversation, excluding the most recent message:
+  
+${formattedPreviousMessages}
+
+Here is the most recent message:
+
+${formattedLastMessage}
+
+Please pick the proper route based on the most recent message, in the context of the entire conversation.`;
 
   const response = await llm.invoke([
     { role: "system", content: prompt },
-    recentHumanMessage,
+    { role: "user", content: humanMessage },
   ]);
 
   const toolCall = response.tool_calls?.[0]?.args as

agent/uis/stockbroker/portfolio-view/index.tsx

@@ -1,3 +1,4 @@
+import "./index.css";
 import { useState } from "react";
 
 export default function PortfolioView() {

agent/uis/stockbroker/stock-price/index.tsx

@@ -1,3 +1,4 @@
+import "./index.css";
 import { useStream } from "@langchain/langgraph-sdk/react";
 import type { AIMessage, Message } from "@langchain/langgraph-sdk";
 import { useState, useEffect, useCallback } from "react";

agent/uis/trip-planner/accommodations-list/index.tsx

@@ -1,3 +1,4 @@
+import "./index.css";
 import { TripDetails } from "../../../trip-planner/types";
 import { useState } from "react";
 
@@ -6,7 +7,6 @@ export default function AccommodationsList({
 }: {
   tripDetails: TripDetails;
 }) {
-  console.log("tripDetails", tripDetails);
   // Placeholder data - ideally would come from props
   const [accommodations] = useState([
     {

agent/uis/trip-planner/book-accommodation/index.tsx

@@ -1,3 +1,4 @@
+import "./index.css";
 import { TripDetails } from "../../../trip-planner/types";
 import { useState } from "react";
 

agent/uis/trip-planner/book-restaurant/index.tsx

@@ -1,3 +1,4 @@
+import "./index.css";
 import { TripDetails } from "../../../trip-planner/types";
 import { useState } from "react";
 

agent/uis/trip-planner/restaurants-list/index.tsx

@@ -1,3 +1,4 @@
+import "./index.css";
 import { TripDetails } from "../../../trip-planner/types";
 import { useState } from "react";