From 2252588bf2da1cb8b65ff15cc177d34872dbff37 Mon Sep 17 00:00:00 2001
From: Mina Choi <mnchoi@o2o.kr>
Date: Mon, 21 Sep 2026 14:04:13 +0900
Subject: [PATCH] =?UTF-8?q?[fix]=20solution/frontend:=20=EB=9E=9C=EB=94=A9?=
 =?UTF-8?q?(/)=20=EC=9E=85=EB=A0=A5=EC=B0=BD=C2=B7=EB=A1=9C=EA=B7=B8?=
 =?UTF-8?q?=EC=9D=B8=20=EC=A7=84=EC=9E=85=EC=A0=90=EC=9D=84=20=3Fbuild=3D1?=
 =?UTF-8?q?=20=EB=92=A4=EB=A1=9C=20=EA=B0=90=EC=B6=98=EB=8B=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

/ 를 그냥 열면 히어로 입력 폼과 헤더 로그인 링크가 항상 떠 있었다. 사장님 지시로
?build=1 쿼리가 있을 때만 두 진입점을 보여주고, 평소 / 는 보여주기 화면으로만 쓴다.

- LandingPage.tsx: useSearchParams 로 buildMode 계산, 히어로 <form> 을 그 값으로 감싼다
- MarketingShell.tsx: showAuthCta prop 추가(기본 true) — 랜딩만 buildMode 를 그대로 넘긴다

SSR 출력으로 확인: / 는 "가게 이름을 입력하세요"·"로그인" 둘 다 없음,
/?build=1 은 둘 다 있음. tsc 통과.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 .../src/components/layout/MarketingShell.tsx  | 12 ++-
 solution/frontend/src/pages/LandingPage.tsx   | 82 ++++++++++---------
 2 files changed, 52 insertions(+), 42 deletions(-)

diff --git a/solution/frontend/src/components/layout/MarketingShell.tsx b/solution/frontend/src/components/layout/MarketingShell.tsx
index 2acf72b..6ad75cd 100644
--- a/solution/frontend/src/components/layout/MarketingShell.tsx
+++ b/solution/frontend/src/components/layout/MarketingShell.tsx
@@ -17,7 +17,13 @@ const NAV = [
   {to: '/pricing', label: '요금'},
 ];
 
-export function MarketingShell({children}: {children: ReactNode}) {
+export function MarketingShell({
+  children,
+  showAuthCta = true,
+}: {
+  children: ReactNode;
+  showAuthCta?: boolean;
+}) {
   const user = useAuthStore((s) => s.user);
 
   return (
@@ -52,7 +58,7 @@ export function MarketingShell({children}: {children: ReactNode}) {
                 히어로의 큰 입력 카드가 이미 그 자리다 — 시작하는 문이 한 화면에 둘이면
                 어느 쪽이 진짜인지 고르게 만든다. 헤더는 로그인만 받는다.
             */}
-            {user ? (
+            {showAuthCta && (user ? (
               <Link
                 to="/sites"
                 className="rounded-md bg-primary px-4 py-2 text-[13px] font-medium text-primary-foreground transition-colors hover:bg-primary/90"
@@ -66,7 +72,7 @@ export function MarketingShell({children}: {children: ReactNode}) {
               >
                 로그인
               </Link>
-            )}
+            ))}
           </div>
         </div>
       </header>
diff --git a/solution/frontend/src/pages/LandingPage.tsx b/solution/frontend/src/pages/LandingPage.tsx
index 8352693..f21c30c 100644
--- a/solution/frontend/src/pages/LandingPage.tsx
+++ b/solution/frontend/src/pages/LandingPage.tsx
@@ -1,5 +1,5 @@
 import {useState, type FormEvent} from 'react';
-import {Link, useNavigate} from 'react-router';
+import {Link, useNavigate, useSearchParams} from 'react-router';
 import {ArrowRight, ArrowUp, Check} from 'lucide-react';
 import {MarketingShell, Section, SectionHead} from '@/components/layout/MarketingShell';
 import {ShowcaseGrid, ShowcasePeeks} from '@/features/marketing/ShowcaseGrid';
@@ -74,6 +74,8 @@ const HEADLINES = [
 export function LandingPage() {
   const navigate = useNavigate();
   const [query, setQuery] = useState('');
+  const [searchParams] = useSearchParams();
+  const buildMode = searchParams.get('build') === '1';
 
   const submit = (event: FormEvent) => {
     event.preventDefault();
@@ -84,7 +86,7 @@ export function LandingPage() {
   };
 
   return (
-    <MarketingShell>
+    <MarketingShell showAuthCta={buildMode}>
       {/* ── 상단 ─────────────────────────────────────── */}
       <section className="relative flex min-h-[calc(100dvh-4rem)] items-center overflow-hidden border-b border-border">
         <div className="mx-auto w-full max-w-6xl px-5 text-center">
@@ -112,45 +114,47 @@ export function LandingPage() {
               <ShowcasePeeks />
             </div>
 
-            <form
-              onSubmit={submit}
-              className="relative z-10 mx-auto max-w-2xl rounded-2xl border border-border bg-card p-4 text-left shadow-[0_18px_50px_-20px_rgb(20_22_34/0.35)]"
-            >
-              <div className="flex items-center gap-2">
-                <img src="/brand/web4ai-wordmark.svg" alt="Web4Ai" className="h-4 w-auto" />
-                <span className="rounded-full bg-muted px-2 py-0.5 text-[10px] font-medium text-muted-foreground">
-                  가게 이름으로 시작
-                </span>
-                {/* 업종부터 고르고 싶은 사람을 위한 갈래. 위저드의 업종 단계로 바로 보낸다. */}
-                <Link
-                  to="/builder?new=1&step=industry"
-                  className="ml-auto rounded-full border border-border px-3 py-1 text-xs text-muted-foreground transition-colors hover:border-foreground/25 hover:text-foreground"
-                >
-                  업종부터 고르기
-                </Link>
-              </div>
+            {buildMode && (
+              <form
+                onSubmit={submit}
+                className="relative z-10 mx-auto max-w-2xl rounded-2xl border border-border bg-card p-4 text-left shadow-[0_18px_50px_-20px_rgb(20_22_34/0.35)]"
+              >
+                <div className="flex items-center gap-2">
+                  <img src="/brand/web4ai-wordmark.svg" alt="Web4Ai" className="h-4 w-auto" />
+                  <span className="rounded-full bg-muted px-2 py-0.5 text-[10px] font-medium text-muted-foreground">
+                    가게 이름으로 시작
+                  </span>
+                  {/* 업종부터 고르고 싶은 사람을 위한 갈래. 위저드의 업종 단계로 바로 보낸다. */}
+                  <Link
+                    to="/builder?new=1&step=industry"
+                    className="ml-auto rounded-full border border-border px-3 py-1 text-xs text-muted-foreground transition-colors hover:border-foreground/25 hover:text-foreground"
+                  >
+                    업종부터 고르기
+                  </Link>
+                </div>
 
-              <input
-                value={query}
-                onChange={(e) => setQuery(e.target.value)}
-                placeholder="가게 이름을 입력하세요"
-                aria-label="가게 이름"
-                className="mt-4 w-full border-0 bg-transparent px-1 text-base outline-none placeholder:text-muted-foreground sm:text-lg"
-              />
+                <input
+                  value={query}
+                  onChange={(e) => setQuery(e.target.value)}
+                  placeholder="가게 이름을 입력하세요"
+                  aria-label="가게 이름"
+                  className="mt-4 w-full border-0 bg-transparent px-1 text-base outline-none placeholder:text-muted-foreground sm:text-lg"
+                />
 
-              <div className="mt-8 flex items-center justify-between gap-3">
-                <p className="truncate text-xs text-muted-foreground">
-                  숙박 · 카페 · 음식점 · 피부과 · 성형외과
-                </p>
-                <button
-                  type="submit"
-                  aria-label="확인하기"
-                  className="grid size-9 shrink-0 place-items-center rounded-full bg-primary text-primary-foreground transition-colors hover:bg-primary/90"
-                >
-                  <ArrowUp className="size-4" aria-hidden />
-                </button>
-              </div>
-            </form>
+                <div className="mt-8 flex items-center justify-between gap-3">
+                  <p className="truncate text-xs text-muted-foreground">
+                    숙박 · 카페 · 음식점 · 피부과 · 성형외과
+                  </p>
+                  <button
+                    type="submit"
+                    aria-label="확인하기"
+                    className="grid size-9 shrink-0 place-items-center rounded-full bg-primary text-primary-foreground transition-colors hover:bg-primary/90"
+                  >
+                    <ArrowUp className="size-4" aria-hidden />
+                  </button>
+                </div>
+              </form>
+            )}
           </div>
         </div>
       </section>