Improve chat navigation, model selection, and streaming

components/ai-elements/open-in-chat.tsx

@@ -11,10 +11,10 @@ import {
 } from "@/components/ui/dropdown-menu";
 import { cn } from "@/lib/utils";
 import {
-  ChevronDownIcon,
-  ExternalLinkIcon,
-  MessageCircleIcon,
-} from "lucide-react";
+  RiArrowDownSLine,
+  RiExternalLinkLine,
+  RiChat3Line,
+} from "@remixicon/react";
 import { type ComponentProps, createContext, useContext } from "react";
 
 const providers = {
@@ -140,7 +140,7 @@ const providers = {
       `https://t3.chat/new?${new URLSearchParams({
         q,
       })}`,
-    icon: <MessageCircleIcon />,
+    icon: <RiChat3Line />,
   },
   v0: {
     title: "Open in v0",
@@ -238,7 +238,7 @@ export const OpenInTrigger = ({ children, ...props }: OpenInTriggerProps) => (
     {children ?? (
       <Button type="button" variant="outline">
         Open in chat
-        <ChevronDownIcon className="size-4" />
+        <RiArrowDownSLine className="size-4" />
       </Button>
     )}
   </DropdownMenuTrigger>
@@ -258,7 +258,7 @@ export const OpenInChatGPT = (props: OpenInChatGPTProps) => {
       >
         <span className="shrink-0">{providers.chatgpt.icon}</span>
         <span className="flex-1">{providers.chatgpt.title}</span>
-        <ExternalLinkIcon className="size-4 shrink-0" />
+        <RiExternalLinkLine className="size-4 shrink-0" />
       </a>
     </DropdownMenuItem>
   );
@@ -278,7 +278,7 @@ export const OpenInClaude = (props: OpenInClaudeProps) => {
       >
         <span className="shrink-0">{providers.claude.icon}</span>
         <span className="flex-1">{providers.claude.title}</span>
-        <ExternalLinkIcon className="size-4 shrink-0" />
+        <RiExternalLinkLine className="size-4 shrink-0" />
       </a>
     </DropdownMenuItem>
   );
@@ -298,7 +298,7 @@ export const OpenInT3 = (props: OpenInT3Props) => {
       >
         <span className="shrink-0">{providers.t3.icon}</span>
         <span className="flex-1">{providers.t3.title}</span>
-        <ExternalLinkIcon className="size-4 shrink-0" />
+        <RiExternalLinkLine className="size-4 shrink-0" />
       </a>
     </DropdownMenuItem>
   );
@@ -318,7 +318,7 @@ export const OpenInScira = (props: OpenInSciraProps) => {
       >
         <span className="shrink-0">{providers.scira.icon}</span>
         <span className="flex-1">{providers.scira.title}</span>
-        <ExternalLinkIcon className="size-4 shrink-0" />
+        <RiExternalLinkLine className="size-4 shrink-0" />
       </a>
     </DropdownMenuItem>
   );
@@ -338,7 +338,7 @@ export const OpenInv0 = (props: OpenInv0Props) => {
       >
         <span className="shrink-0">{providers.v0.icon}</span>
         <span className="flex-1">{providers.v0.title}</span>
-        <ExternalLinkIcon className="size-4 shrink-0" />
+        <RiExternalLinkLine className="size-4 shrink-0" />
       </a>
     </DropdownMenuItem>
   );
@@ -358,7 +358,7 @@ export const OpenInCursor = (props: OpenInCursorProps) => {
       >
         <span className="shrink-0">{providers.cursor.icon}</span>
         <span className="flex-1">{providers.cursor.title}</span>
-        <ExternalLinkIcon className="size-4 shrink-0" />
+        <RiExternalLinkLine className="size-4 shrink-0" />
       </a>
     </DropdownMenuItem>
   );