fix(landing): scroll to success card and simplify CTA on contact sales (#3057)

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>
This commit is contained in:
Bohan Jiang
2026-05-22 14:11:37 +08:00
committed by GitHub
parent eefc6cebaa
commit f0a6738ed9
3 changed files with 20 additions and 4 deletions

View File

@@ -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}

View File

@@ -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.",

View File

@@ -1468,7 +1468,7 @@ export function createZhDict(allowSignup: boolean): LandingDict {
title: "已收到,谢谢!",
message:
"Multica 团队会在三个工作日内回复你。在此期间,欢迎查看我们的文档,或在 GitHub 上为我们点个 Star。",
cta: "返回 multica.ai",
cta: "返回首页",
},
errors: {
generic: "提交失败,请稍后再试。",