diff --git a/app/[lang]/(hyperjump)/components/landing-ai-agent.tsx b/app/[lang]/(hyperjump)/components/landing-ai-agent.tsx index 702b3f1b..afb973d2 100644 --- a/app/[lang]/(hyperjump)/components/landing-ai-agent.tsx +++ b/app/[lang]/(hyperjump)/components/landing-ai-agent.tsx @@ -1,6 +1,5 @@ "use client"; -import { Button } from "@/components/ui/button"; import { MessageCircle, X } from "lucide-react"; import Image from "next/image"; import { useCallback, useEffect, useRef, useState } from "react"; @@ -10,6 +9,18 @@ import markdownit from "markdown-it"; import { v4 as uuid } from "uuid"; import { sendGAEvent } from "@next/third-parties/google"; +import { Button } from "@/components/ui/button"; +import { + hyperbotAskHyperBot, + hyperbotCommonFollowUp, + hyperbotCommonLoading, + hyperbotDefaultMessages, + hyperbotHeaderGreeting, + hyperbotHeaderSupportAvailability, + hyperbotInputPlaceholder +} from "@/locales/.generated/strings"; +import type { SupportedLanguage } from "@/locales/.generated/types"; + // Types type PrefillAIAgentEvent = CustomEvent<{ message: string }>; type ShowFollowUpMessagesEvent = CustomEvent<{ sessionId: string }>; @@ -24,12 +35,6 @@ type TMessage = { human: string; }; -// Constants -const DEFAULT_MESSAGES = [ - { id: 1, text: "What services do you offer?" }, - { id: 2, text: "Show me examples of past projects" }, - { id: 3, text: "Schedule a free consultation" } -]; const ENABLE_STREAMING = true; // Functions @@ -207,12 +212,17 @@ type GAEvent = { label: string; }; -interface HyperBotToggleProps { - gaEvent?: GAEvent; -} +type HyperBotProps = { + gaEvent: GAEvent; + lang: SupportedLanguage; +}; -// Main component -export default function LandingAIAgent({ gaEvent }: HyperBotToggleProps) { +export default function HyperBot({ gaEvent, lang }: HyperBotProps) { + const defaultMessages = [ + { id: 1, text: hyperbotDefaultMessages(lang)[0] }, + { id: 2, text: hyperbotDefaultMessages(lang)[1] }, + { id: 3, text: hyperbotDefaultMessages(lang)[2] } + ]; const [sessionId, setSessionId] = useState(undefined); const [messages, setMessages] = useState([]); const [followUpMessages, setFollowUpMessages] = useState([]); @@ -444,8 +454,12 @@ export default function LandingAIAgent({ gaEvent }: HyperBotToggleProps) { aria-label="Close chat"> -

Hi there! 👋

-

Start a chat. We are here to help 24/7.

+

+ {hyperbotHeaderGreeting(lang)} +

+

+ {hyperbotHeaderSupportAvailability(lang)} +

{/* Messages */} @@ -467,7 +481,9 @@ export default function LandingAIAgent({ gaEvent }: HyperBotToggleProps) { {!m.ai && isSubmitting && i === messages.length - 1 && (
- Loading... + + {hyperbotCommonLoading(lang)}... +
@@ -480,7 +496,9 @@ export default function LandingAIAgent({ gaEvent }: HyperBotToggleProps) { {/* Follow up messages */} {followUpMessages.length > 0 && !isSubmitting && (
-

Follow up

+

+ {hyperbotCommonFollowUp(lang)} +

{followUpMessages.map((text, id) => (