feat(frontend): update data-placeholder when switching to plan mode (#11674)

frontend/src/components/features/chat/components/chat-input-field.tsx

@@ -1,5 +1,7 @@
 import React from "react";
 import { useTranslation } from "react-i18next";
+import { I18nKey } from "#/i18n/declaration";
+import { useConversationStore } from "#/state/conversation-store";
 
 interface ChatInputFieldProps {
   chatInputRef: React.RefObject<HTMLDivElement | null>;
@@ -20,6 +22,12 @@ export function ChatInputField({
 }: ChatInputFieldProps) {
   const { t } = useTranslation();
 
+  const conversationMode = useConversationStore(
+    (state) => state.conversationMode,
+  );
+
+  const isPlanMode = conversationMode === "plan";
+
   return (
     <div
       className="box-border content-stretch flex flex-row items-center justify-start min-h-6 p-0 relative shrink-0 flex-1"
@@ -30,7 +38,11 @@ export function ChatInputField({
           ref={chatInputRef}
           className="chat-input bg-transparent text-white text-[16px] font-normal leading-[20px] outline-none resize-none custom-scrollbar min-h-[20px] max-h-[400px] [text-overflow:inherit] [text-wrap-mode:inherit] [white-space-collapse:inherit] block whitespace-pre-wrap"
           contentEditable
-          data-placeholder={t("SUGGESTIONS$WHAT_TO_BUILD")}
+          data-placeholder={
+            isPlanMode
+              ? t(I18nKey.COMMON$LET_S_WORK_ON_A_PLAN)
+              : t(I18nKey.SUGGESTIONS$WHAT_TO_BUILD)
+          }
           data-testid="chat-input"
           onInput={onInput}
           onPaste={onPaste}

frontend/src/i18n/declaration.ts

@@ -937,4 +937,5 @@ export enum I18nKey {
   AGENT_STATUS$WAITING_FOR_USER_CONFIRMATION = "AGENT_STATUS$WAITING_FOR_USER_CONFIRMATION",
   COMMON$MORE_OPTIONS = "COMMON$MORE_OPTIONS",
   COMMON$CREATE_A_PLAN = "COMMON$CREATE_A_PLAN",
+  COMMON$LET_S_WORK_ON_A_PLAN = "COMMON$LET_S_WORK_ON_A_PLAN",
 }

frontend/src/i18n/translation.json

@@ -14990,5 +14990,21 @@
     "tr": "Bir plan oluştur",
     "de": "Einen Plan erstellen",
     "uk": "Створити план"
+  },
+  "COMMON$LET_S_WORK_ON_A_PLAN": {
+    "en": "Let’s work on a plan",
+    "ja": "プランに取り組みましょう",
+    "zh-CN": "让我们制定一个计划吧",
+    "zh-TW": "讓我們來制定計劃吧",
+    "ko-KR": "계획을 세워봅시다",
+    "no": "La oss lage en plan",
+    "it": "Lavoriamo su un piano",
+    "pt": "Vamos trabalhar em um plano",
+    "es": "Trabajemos en un plan",
+    "ar": "لنضع خطة معًا",
+    "fr": "Travaillons sur un plan",
+    "tr": "Bir plan üzerinde çalışalım",
+    "de": "Lassen Sie uns an einem Plan arbeiten",
+    "uk": "Давайте розробимо план"
   }
 }