diff --git a/packages/react-ui/src/components/AgentInterface/AgentInterface.tsx b/packages/react-ui/src/components/AgentInterface/AgentInterface.tsx index 4e1c66f82..99dab597a 100644 --- a/packages/react-ui/src/components/AgentInterface/AgentInterface.tsx +++ b/packages/react-ui/src/components/AgentInterface/AgentInterface.tsx @@ -54,6 +54,7 @@ import { SidebarItem } from "./SidebarItem"; import { SidebarSlot } from "./SidebarSlot"; import { MessageLoading, Messages, ScrollArea, ThreadContainer, ThreadHeader } from "./Thread"; import { ThreadList } from "./ThreadList"; +import { WelcomeGlow } from "./WelcomeGlow"; import { WelcomeScreen } from "./WelcomeScreen"; import { Workspace } from "./Workspace"; @@ -167,6 +168,7 @@ interface AgentInterfaceComponent extends FC { MobileHeader: typeof MobileHeader; ThreadHeader: typeof ThreadHeader; Welcome: typeof WelcomeScreen; + WelcomeGlow: typeof WelcomeGlow; Composer: typeof Composer; NewChatButton: typeof NewChatButton; ThreadList: typeof ThreadList; @@ -462,6 +464,7 @@ AgentInterface.Route = Route; AgentInterface.MobileHeader = MobileHeader; AgentInterface.ThreadHeader = ThreadHeader; AgentInterface.Welcome = WelcomeScreen; +AgentInterface.WelcomeGlow = WelcomeGlow; AgentInterface.Composer = Composer; AgentInterface.NewChatButton = NewChatButton; AgentInterface.ThreadList = ThreadList; diff --git a/packages/react-ui/src/components/AgentInterface/ArtifactBrowserPage.tsx b/packages/react-ui/src/components/AgentInterface/ArtifactBrowserPage.tsx index 521b64862..8af9a3fed 100644 --- a/packages/react-ui/src/components/AgentInterface/ArtifactBrowserPage.tsx +++ b/packages/react-ui/src/components/AgentInterface/ArtifactBrowserPage.tsx @@ -8,6 +8,7 @@ import { import { Boxes, Search, X } from "lucide-react"; import { useEffect, useRef, useState, type ReactNode } from "react"; import { Button } from "../Button"; +import { DotMatrixLoader } from "../DotMatrixLoader"; import { IconButton } from "../IconButton"; import { artifactListPath, artifactViewPath } from "./_shared/artifactPaths"; import { useAgentInterfaceLabels } from "./_shared/labelsContext"; @@ -102,6 +103,7 @@ export const ArtifactBrowserPage = ({ categoryName }: { categoryName?: string }) // is decided synchronously with no loading race. const notFound = categoryName !== undefined && category === undefined; const typeFilter = category?.filter.type; + const categoryIllustration = useArtifactIcon(typeFilter?.[0] ?? ""); const [search, setSearch] = useState(""); const [debouncedSearch, setDebouncedSearch] = useState(""); @@ -120,7 +122,7 @@ export const ArtifactBrowserPage = ({ categoryName }: { categoryName?: string }) // Noun derived from the category name (not a hardcoded "Apps" match). const emptyItemLabel = categoryName ? categoryName.toLowerCase() : "artifacts"; const emptyMessage = debouncedSearch - ? `No ${emptyItemLabel} match your search` + ? `No results found for "${debouncedSearch}"` : `No ${emptyItemLabel} yet`; // Initial page + reload on search/category change. @@ -235,7 +237,7 @@ export const ArtifactBrowserPage = ({ categoryName }: { categoryName?: string }) {!error && artifacts.length === 0 && !isLoading && (
- + {debouncedSearch ? categoryIllustration : } {emptyMessage}
@@ -251,7 +253,11 @@ export const ArtifactBrowserPage = ({ categoryName }: { categoryName?: string }) /> ); })} - {isLoading &&
Loading…
} + {isLoading && ( +
+ +
+ )} {!isLoading && nextCursor !== undefined && (
); } else if (!artifact) { - body =
Loading…
; + body = ( +
+ +
+ ); } else if (!renderer) { body = (
diff --git a/packages/react-ui/src/components/AgentInterface/ConversationStarter.tsx b/packages/react-ui/src/components/AgentInterface/ConversationStarter.tsx index 12e03a272..90f9fd138 100644 --- a/packages/react-ui/src/components/AgentInterface/ConversationStarter.tsx +++ b/packages/react-ui/src/components/AgentInterface/ConversationStarter.tsx @@ -9,7 +9,7 @@ import { isChatEmpty } from "./_shared/utils"; export type ConversationStarterVariant = "short" | "long"; interface ConversationStarterItemProps extends ConversationStarterProps { - onClick: (prompt: string) => void; + onClick: () => void; variant: ConversationStarterVariant; } @@ -39,7 +39,6 @@ const hasRenderableIcon = (icon: ReactNode): boolean => { const ConversationStarterItem = ({ displayText, - prompt, onClick, variant, icon, @@ -52,7 +51,7 @@ const ConversationStarterItem = ({