feat: implement survey promotion popup with daily dismissal and bump …

apps/landing/src/app/page.tsx

@@ -1,5 +1,6 @@
 import { Box, Center, Flex, Image, Text, VStack } from '@devup-ui/react'
 
+import HomePopup from '@/components/home/HomePopup'
 import PillButton from '@/components/home/PillButton'
 import IconDiscord from '@/components/icons/IconDiscord'
 import IconKakao from '@/components/icons/IconKakao'
@@ -27,6 +28,7 @@ const DESCRIPTIONS = [
 export default function HomePage() {
   return (
     <VStack alignItems="center" bg="$background" position="relative">
+      <HomePopup />
       <Box
         px={['16px', null, '30px', '80px']}
         py={['40px', null, null, '100px']}

apps/landing/src/components/home/HomePopup.tsx

@@ -0,0 +1,103 @@
+'use client'
+
+import { Box, Flex, Image, Text, VStack } from '@devup-ui/react'
+import { useEffect, useState } from 'react'
+
+const POPUP_STORAGE_KEY = 'braillify-popup-hide-until'
+const SURVEY_URL =
+  'https://docs.google.com/forms/d/e/1FAIpQLSdXdiajD92xptfYMhFT9Xsu2hWgrCA21DMSnUlCUsB-X0lZLw/viewform'
+
+export default function HomePopup() {
+  const [open, setOpen] = useState(false)
+
+  useEffect(() => {
+    const hideUntil = localStorage.getItem(POPUP_STORAGE_KEY)
+    if (hideUntil && Date.now() < Number(hideUntil)) return
+    setOpen(true)
+  }, [])
+
+  if (!open) return null
+
+  const handleHideForToday = () => {
+    const tomorrow = new Date()
+    tomorrow.setHours(24, 0, 0, 0)
+    localStorage.setItem(POPUP_STORAGE_KEY, String(tomorrow.getTime()))
+    setOpen(false)
+  }
+
+  const handleClose = () => setOpen(false)
+
+  return (
+    <Flex
+      alignItems="center"
+      bg="rgba(0, 0, 0, 0.5)"
+      inset="0"
+      justifyContent="center"
+      onClick={handleClose}
+      p="16px"
+      position="fixed"
+      zIndex="9999"
+    >
+      <VStack
+        bg="$containerBackground"
+        borderRadius="16px"
+        maxH="600px"
+        maxW="480px"
+        onClick={(e) => e.stopPropagation()}
+        overflow="hidden"
+        w="min(402px, calc(100vw - 32px), calc((100dvh - 96px) * 0.75))"
+      >
+        <Box
+          aria-label="이용자 설문조사 참여하기"
+          aspectRatio="3 / 4"
+          as="a"
+          cursor="pointer"
+          display="block"
+          href={SURVEY_URL}
+          overflow="hidden"
+          rel="noopener noreferrer"
+          target="_blank"
+          w="100%"
+        >
+          <Image
+            alt="Braillify 이용자 설문조사 안내"
+            display="block"
+            h="100%"
+            objectFit="cover"
+            src="/images/home/popup.png"
+            w="100%"
+          />
+        </Box>
+        <Flex borderTop="1px solid $border" flexShrink="0">
+          <Box
+            as="button"
+            bg="transparent"
+            border="none"
+            color="$caption"
+            cursor="pointer"
+            flex="1"
+            onClick={handleHideForToday}
+            py="16px"
+            type="button"
+          >
+            <Text typography="bodyBold">오늘 하루 안 보기</Text>
+          </Box>
+          <Box bg="$border" flexShrink="0" w="1px" />
+          <Box
+            as="button"
+            bg="transparent"
+            border="none"
+            color="$text"
+            cursor="pointer"
+            flex="1"
+            onClick={handleClose}
+            py="16px"
+            type="button"
+          >
+            <Text typography="bodyBold">닫기</Text>
+          </Box>
+        </Flex>
+      </VStack>
+    </Flex>
+  )
+}