From f0a6738ed955d80c0d910477fd2ce6a896cda849 Mon Sep 17 00:00:00 2001
From: Bohan Jiang <52446949+Bohan-J@users.noreply.github.com>
Date: Fri, 22 May 2026 14:11:37 +0800
Subject: [PATCH] fix(landing): scroll to success card and simplify CTA on
 contact sales (#3057)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

After submit, the tall form collapses into the much shorter success card;
the browser keeps the scroll offset so the user lands on the footer and
has to scroll up to see the confirmation. Scroll the page back to the
success card on success.

Also shorten the awkward "Back to multica.ai" / "返回 multica.ai" CTA to
"Back to home" / "返回首页".

MUL-2493

Co-authored-by: multica-agent <github@multica.ai>
---
 .../components/contact-sales-page-client.tsx  | 20 +++++++++++++++++--
 apps/web/features/landing/i18n/en.ts          |  2 +-
 apps/web/features/landing/i18n/zh.ts          |  2 +-
 3 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/apps/web/features/landing/components/contact-sales-page-client.tsx b/apps/web/features/landing/components/contact-sales-page-client.tsx
index f67c54a69..ae8f620c9 100644
--- a/apps/web/features/landing/components/contact-sales-page-client.tsx
+++ b/apps/web/features/landing/components/contact-sales-page-client.tsx
@@ -1,7 +1,7 @@
 "use client";
 
 import Link from "next/link";
-import { useId, useMemo, useState } from "react";
+import { useEffect, useId, useMemo, useRef, useState } from "react";
 import { LandingHeader } from "./landing-header";
 import { LandingFooter } from "./landing-footer";
 import { useLocale } from "../i18n";
@@ -64,9 +64,22 @@ export function ContactSalesPageClient() {
 
   const [form, setForm] = useState<FormState>(EMPTY_FORM);
   const [state, setState] = useState<SubmitState>({ status: "idle" });
+  const successAnchorRef = useRef<HTMLDivElement | null>(null);
 
   const isBusy = state.status === "submitting";
 
+  // After a successful submit, the tall form collapses into the much shorter
+  // success card. The browser keeps the scroll offset, which lands the user
+  // on the footer — they have to scroll up to see the confirmation. Pull the
+  // page back so the thank-you message is in view.
+  useEffect(() => {
+    if (state.status !== "success") return;
+    successAnchorRef.current?.scrollIntoView({
+      behavior: "smooth",
+      block: "start",
+    });
+  }, [state.status]);
+
   const emailDomain = useMemo(() => {
     const at = form.businessEmail.lastIndexOf("@");
     if (at < 0) return "";
@@ -148,7 +161,10 @@ export function ContactSalesPageClient() {
     <>
       <LandingHeader variant="light" />
       <main className="bg-[#f7f8fa] text-[#0a0d12]">
-        <div className="mx-auto max-w-[760px] px-4 py-12 sm:px-6 sm:py-16 lg:py-20">
+        <div
+          ref={successAnchorRef}
+          className="mx-auto max-w-[760px] px-4 py-12 sm:px-6 sm:py-16 lg:py-20"
+        >
           <div className="mb-8 text-center">
             <p className="text-[12px] font-semibold uppercase tracking-[0.12em] text-[#0a0d12]/45">
               {c.eyebrow}
diff --git a/apps/web/features/landing/i18n/en.ts b/apps/web/features/landing/i18n/en.ts
index d2549ac30..05aaf63c0 100644
--- a/apps/web/features/landing/i18n/en.ts
+++ b/apps/web/features/landing/i18n/en.ts
@@ -1471,7 +1471,7 @@ export function createEnDict(allowSignup: boolean): LandingDict {
       title: "Thanks — we got it.",
       message:
         "A member of the Multica team will respond within three business days. In the meantime, feel free to explore the docs or star us on GitHub.",
-      cta: "Back to multica.ai",
+      cta: "Back to home",
     },
     errors: {
       generic: "Something went wrong — please try again in a moment.",
diff --git a/apps/web/features/landing/i18n/zh.ts b/apps/web/features/landing/i18n/zh.ts
index be144ca3a..24bd53559 100644
--- a/apps/web/features/landing/i18n/zh.ts
+++ b/apps/web/features/landing/i18n/zh.ts
@@ -1468,7 +1468,7 @@ export function createZhDict(allowSignup: boolean): LandingDict {
       title: "已收到，谢谢！",
       message:
         "Multica 团队会在三个工作日内回复你。在此期间，欢迎查看我们的文档，或在 GitHub 上为我们点个 Star。",
-      cta: "返回 multica.ai",
+      cta: "返回首页",
     },
     errors: {
       generic: "提交失败，请稍后再试。",