Hotfix : 투어 가이드 디자인 조정.

[GulSam00]

📌 PR 제목

[Type] : 작업 내용 요약

📌 변경 사항

💬 추가 참고 사항

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
singcode	Ready	Preview	Jul 30, 2026 3:36pm

[qodo-code-review]

PR Summary by Qodo

Fix Search tour tooltip overflow on small mobile screens; bump TWA version to 8

🐞 Bug fix ⚙️ Configuration changes 🕐 10-20 Minutes

AI Description

• Prevent search tutorial tooltip from overflowing on sub-375px mobile viewports.
• Keep the tooltip’s desktop max width behavior while making it responsive on mobile.
• Bump TWA Android wrapper version metadata from 7 to 8.

Diagram

graph TD
  A["Mobile viewport"] --> B["SearchTour.tsx"] --> C["react-joyride tooltip"] --> D["Tooltip UI"]
  E["twa-manifest.json"] --> F["TWA build/version"]

Loading

High-Level Assessment

The following are alternative approaches to this PR:

1. Use `maxWidth` + auto width instead of fixed `width`

• ➕ Lets content determine width up to a safe viewport max
• ➕ Often reduces layout edge-cases with long content
• ➖ May change current visual layout compared to the 380px fixed baseline
• ➖ Depending on library internals, maxWidth may be harder to enforce consistently than width

2. Apply a CSS override targeting Joyride tooltip class on small screens

• ➕ Centralized styling without touching per-tour configuration
• ➕ Easy to adjust with media queries
• ➖ More brittle: depends on library class names/DOM structure
• ➖ Harder to scope to only this tour if multiple Joyride usages exist

3. Provide a custom tooltip component for fully responsive layout

• ➕ Maximum control over layout, padding, and overflow handling
• ➕ Can standardize responsive behavior across all tours
• ➖ More code and maintenance for a small hotfix
• ➖ Higher risk of behavioral drift from library defaults

Recommendation: The current approach (setting a responsive width: min(380px, calc(100vw - 32px)) in the tour’s tooltip options) is a good hotfix: it is localized, preserves the existing desktop cap (380px), and directly addresses the small-viewport overflow. Consider the CSS-override or custom tooltip only if multiple tours need consistent responsive styling.

Files changed (2) +6 / -3

Bug fix (1) +3 / -0

SearchTour.tsxMake search tour tooltip width responsive on small screens +3/-0

Make search tour tooltip width responsive on small screens

• Overrides the Joyride tooltip width to 'min(380px, calc(100vw - 32px))' to prevent horizontal overflow on ≤375px devices while keeping the 380px max on larger screens.

apps/web/src/app/search/SearchTour.tsx

Other (1) +3 / -3

twa-manifest.jsonBump TWA app version metadata from 7 to 8 +3/-3

Bump TWA app version metadata from 7 to 8

• Updates 'appVersionName', 'appVersionCode', and 'appVersion' to 8 to reflect the new Android wrapper/package version.

apps/twa/twa-manifest.json

[qodo-code-review]

Code Review by Qodo

🐞 Bugs (0) 📘 Rule violations (0) 📎 Requirement gaps (0)

Great, no issues found!

Qodo reviewed your code and found no material issues that require review

_{To customize comments, go to the Qodo configuration screen, or learn more in the docs.}