From 40f429d2c9675023f1f999fa71b7b2e915192d1a Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Thu, 26 Oct 2023 17:13:20 +0900
Subject: [PATCH 01/18] =?UTF-8?q?feat:=20Triple=20Document=EC=97=90?=
 =?UTF-8?q?=EC=84=9C=20prop=EC=9C=BC=EB=A1=9C=20guestMode=EB=A5=BC=20?=
 =?UTF-8?q?=EB=B0=9B=EC=9D=84=20=EC=88=98=20=EC=9E=88=EB=8F=84=EB=A1=9D=20?=
 =?UTF-8?q?=ED=83=80=EC=9E=85=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- '서울콘' 행사 대응용
- '서울콘' 행사를 통해 triple-content-web의 페이지로 유입된 사용자들은 모두 비로그인 상태이며, 로그인이 필요한 기능을 사용할 수 없음. 더불어 트리플앱으로의 연결을 유도하는 루트도 보지 않아야 함
- Triple Document로 제공되는 가이드와 POI 영역에서 로그인 및 앱과의 연결과 관련된 부분들을 guestMode라는 값을 기준으로 분기하기 위하여 값을 추가(예 : guestMode가 true인 경우, Pois 컴포넌트의 스크랩 버튼 숨기기)
---
 packages/triple-document/src/types.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/triple-document/src/types.ts b/packages/triple-document/src/types.ts
index 260a60f30c..50eb0bff69 100644
--- a/packages/triple-document/src/types.ts
+++ b/packages/triple-document/src/types.ts
@@ -46,6 +46,7 @@ export type TripleDocumentContext = {
   onTNAProductsFetch?: TnaProductsFetcher
   imageSourceComponent?: ImageSourceType
   deepLink?: string
+  guestMode?: boolean
 } & MediaConfig
 
 export interface ElementSet {

From c03da405466170de1a3bb6a0e9978842cee28e80 Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Thu, 26 Oct 2023 17:17:37 +0900
Subject: [PATCH 02/18] =?UTF-8?q?feat:=20guestMode=20=EA=B0=92=EC=9D=84=20?=
 =?UTF-8?q?=EA=B0=80=EC=A7=80=EB=8A=94=20context=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/triple-document/src/index.ts         |  1 +
 .../src/prop-context/guest-mode.ts            | 13 +++++
 .../triple-document/src/triple-document.tsx   | 53 ++++++++++---------
 3 files changed, 43 insertions(+), 24 deletions(-)
 create mode 100644 packages/triple-document/src/prop-context/guest-mode.ts

diff --git a/packages/triple-document/src/index.ts b/packages/triple-document/src/index.ts
index 7a0bbc4de5..c39f3d051a 100644
--- a/packages/triple-document/src/index.ts
+++ b/packages/triple-document/src/index.ts
@@ -8,6 +8,7 @@ export { Slot } from './elements/tna/slot'
 export { PricePolicyCouponInfo } from './elements/tna/price-policy-coupon-info'
 
 export { useDeepLink } from './prop-context/deep-link'
+export { useGuestMode } from './prop-context/guest-mode'
 export { useImageClickHandler } from './prop-context/image-click-handler'
 export { useImageSource } from './prop-context/image-source'
 export { useLinkClickHandler } from './prop-context/link-click-handler'
diff --git a/packages/triple-document/src/prop-context/guest-mode.ts b/packages/triple-document/src/prop-context/guest-mode.ts
new file mode 100644
index 0000000000..1fb93cbc9d
--- /dev/null
+++ b/packages/triple-document/src/prop-context/guest-mode.ts
@@ -0,0 +1,13 @@
+import { createContext, useContext } from 'react'
+
+const GuestModeContext = createContext<boolean | undefined>(undefined)
+
+/**
+ * guestMode
+ * true인 경우, 로그인이 필요한 동작(스크랩, 리뷰쓰기)등이 불가능하며, 앱으로 연결되는 루트를 차단합니다.
+ */
+export const GuestModeProvider = GuestModeContext.Provider
+
+export function useGuestMode() {
+  return useContext(GuestModeContext)
+}
diff --git a/packages/triple-document/src/triple-document.tsx b/packages/triple-document/src/triple-document.tsx
index 5d932304a5..28e231c304 100644
--- a/packages/triple-document/src/triple-document.tsx
+++ b/packages/triple-document/src/triple-document.tsx
@@ -21,6 +21,7 @@ import { DeepLinkProvider } from './prop-context/deep-link'
 import { MediaConfigProvider } from './prop-context/media-config'
 import ELEMENTS from './elements'
 import useEventResourceTracker from './use-resource-event-tracker'
+import { GuestModeProvider } from './prop-context/guest-mode'
 
 export function TripleDocument({
   children,
@@ -34,6 +35,7 @@ export function TripleDocument({
   videoAutoPlay,
   hideVideoControls,
   optimized = false,
+  guestMode,
 }: {
   customElements?: ElementSet
   children: TripleElementData[]
@@ -97,33 +99,36 @@ export function TripleDocument({
                 hideVideoControls={hideVideoControls}
                 optimized={optimized}
               >
-                {children.map(({ type, value }, i) => {
-                  const RegularElement = ELEMENTS[type]
-                  const CustomElement = customElements[type]
+                <GuestModeProvider value={guestMode}>
+                  {children.map(({ type, value }, i) => {
+                    const RegularElement = ELEMENTS[type]
+                    const CustomElement = customElements[type]
 
-                  const Element = CustomElement || RegularElement
+                    const Element = CustomElement || RegularElement
 
-                  return (
-                    Element && (
-                      <Element
-                        key={i}
-                        value={value}
-                        {...(CustomElement
-                          ? {
-                              onResourceClick: resourceClickHandler,
-                              onImageClick,
-                              onLinkClick: linkClickHandler,
-                              ImageSource: imageSourceComponent,
-                              deepLink,
-                              videoAutoPlay,
-                              hideVideoControls,
-                              optimized,
-                            }
-                          : {})}
-                      />
+                    return (
+                      Element && (
+                        <Element
+                          key={i}
+                          value={value}
+                          {...(CustomElement
+                            ? {
+                                onResourceClick: resourceClickHandler,
+                                onImageClick,
+                                onLinkClick: linkClickHandler,
+                                ImageSource: imageSourceComponent,
+                                deepLink,
+                                videoAutoPlay,
+                                hideVideoControls,
+                                optimized,
+                                guestMode,
+                              }
+                            : {})}
+                        />
+                      )
                     )
-                  )
-                })}
+                  })}
+                </GuestModeProvider>
               </MediaConfigProvider>
             </DeepLinkProvider>
           </ImageSourceProvider>

From dd006d72926564ec47ed52b02d58e0fa38f8f392 Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Thu, 26 Oct 2023 17:31:59 +0900
Subject: [PATCH 03/18] =?UTF-8?q?feat:=20Poi=20list=EC=97=90=EC=84=9C=20?=
 =?UTF-8?q?=EC=82=AC=EC=9A=A9=ED=95=98=EB=8A=94=20=EC=97=98=EB=A6=AC?=
 =?UTF-8?q?=EB=A8=BC=ED=8A=B8=EB=93=A4=EC=9D=98=20props=20=ED=83=80?=
 =?UTF-8?q?=EC=9E=85=EC=97=90=20guestMode=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/poi-list-elements/src/types.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/poi-list-elements/src/types.ts b/packages/poi-list-elements/src/types.ts
index e4c8a7ee4d..971d24a470 100644
--- a/packages/poi-list-elements/src/types.ts
+++ b/packages/poi-list-elements/src/types.ts
@@ -9,6 +9,7 @@ export type ActionButtonElement = ReactNode
 
 export interface PoiListElementBaseProps<T extends PoiListElementType> {
   poi: T
+  guestMode?: boolean
   onClick?: MouseEventHandler<HTMLLIElement>
 }
 

From c5c66ff25e3ae73587f46761237abff62d23ab15 Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Thu, 26 Oct 2023 17:40:32 +0900
Subject: [PATCH 04/18] =?UTF-8?q?fix:=20Poi=20=EC=97=98=EB=A6=AC=EB=A8=BC?=
 =?UTF-8?q?=ED=8A=B8=EB=93=A4=EC=97=90=EC=84=9C=20guestMode=EC=9D=B8=20?=
 =?UTF-8?q?=EA=B2=BD=EC=9A=B0=20=EC=8A=A4=ED=81=AC=EB=9E=A9=20=EB=B2=84?=
 =?UTF-8?q?=ED=8A=BC=20=EC=88=A8=EA=B9=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- extended-poi-list-element는 Pois 엘리먼트에서 사용되지 않으나, poi-list-elements에서의 사용성 통일을 위해 다른 poi element들과 동일하게 숨김 로직 반영
---
 .../src/carousel-element.tsx                  | 24 ++++++++--------
 .../src/compact-poi-list-element.tsx          | 28 ++++++++++---------
 .../src/extended-poi-list-element.tsx         |  3 +-
 3 files changed, 30 insertions(+), 25 deletions(-)

diff --git a/packages/poi-list-elements/src/carousel-element.tsx b/packages/poi-list-elements/src/carousel-element.tsx
index 0393c36cbb..c52ee68856 100644
--- a/packages/poi-list-elements/src/carousel-element.tsx
+++ b/packages/poi-list-elements/src/carousel-element.tsx
@@ -34,6 +34,7 @@ function PoiCarouselElement<T extends PoiListElementType>({
   imageFrame,
   onImpress,
   optimized,
+  guestMode,
 }: PoiListElementBaseProps<T> & {
   actionButtonElement?: ActionButtonElement
   description?: ReactNode
@@ -52,6 +53,17 @@ function PoiCarouselElement<T extends PoiListElementType>({
 
   const name = nameOverride || names.ko || names.en || names.local
   const regionName = regionNames?.ko || regionNames?.en || regionNames?.local
+  const ActionButton = actionButtonElement || (
+    <Container
+      position="absolute"
+      css={{
+        top: '3px',
+        right: '3px',
+      }}
+    >
+      <OverlayScrapButton resource={poi} size={36} />
+    </Container>
+  )
 
   return (
     <Carousel.Item
@@ -91,17 +103,7 @@ function PoiCarouselElement<T extends PoiListElementType>({
           : vicinity}
       </Text>
 
-      {actionButtonElement || (
-        <Container
-          position="absolute"
-          css={{
-            top: '3px',
-            right: '3px',
-          }}
-        >
-          <OverlayScrapButton resource={poi} size={36} />
-        </Container>
-      )}
+      {!guestMode ? ActionButton : null}
 
       {additionalInfo}
     </Carousel.Item>
diff --git a/packages/poi-list-elements/src/compact-poi-list-element.tsx b/packages/poi-list-elements/src/compact-poi-list-element.tsx
index cffa0cc0ac..47a2e3dc22 100644
--- a/packages/poi-list-elements/src/compact-poi-list-element.tsx
+++ b/packages/poi-list-elements/src/compact-poi-list-element.tsx
@@ -41,6 +41,7 @@ export function CompactPoiListElement<T extends PoiListElementType>({
     source: { names, image, areas, vicinity },
   },
   onClick,
+  guestMode,
 }: CompactPoiListElementProps<T>) {
   const [actionButtonWidth, setActionButtonWidth] = useState(0)
   const actionButtonRef = useRef<HTMLDivElement & { width?: number }>(null)
@@ -55,6 +56,19 @@ export function CompactPoiListElement<T extends PoiListElementType>({
 
   const name = nameOverride || names.ko || names.en || names.local
   const regionName = regionNames?.ko || regionNames?.en || regionNames?.local
+  const ActionButton = actionButtonElement ? (
+    <div ref={actionButtonRef}>{actionButtonElement}</div>
+  ) : (
+    <Container
+      position="absolute"
+      css={{
+        top: 0,
+        right: 0,
+      }}
+    >
+      <OutlineScrapButton resource={poi} size={34} />
+    </Container>
+  )
 
   return (
     <ResourceListItem onClick={onClick}>
@@ -86,19 +100,7 @@ export function CompactPoiListElement<T extends PoiListElementType>({
           .join(' · ')}
       </Text>
 
-      {actionButtonElement ? (
-        <div ref={actionButtonRef}>{actionButtonElement}</div>
-      ) : (
-        <Container
-          position="absolute"
-          css={{
-            top: 0,
-            right: 0,
-          }}
-        >
-          <OutlineScrapButton resource={poi} size={34} />
-        </Container>
-      )}
+      {!guestMode ? ActionButton : null}
     </ResourceListItem>
   )
 }
diff --git a/packages/poi-list-elements/src/extended-poi-list-element.tsx b/packages/poi-list-elements/src/extended-poi-list-element.tsx
index 28efb1e4de..5419e1086c 100644
--- a/packages/poi-list-elements/src/extended-poi-list-element.tsx
+++ b/packages/poi-list-elements/src/extended-poi-list-element.tsx
@@ -54,6 +54,7 @@ export function ExtendedPoiListElement<T extends PoiListElementType>({
   isAdvertisement,
   notes,
   optimized,
+  guestMode,
 }: ExtendedPoiListElementProps<T> & { optimized?: boolean }) {
   const { t } = useTranslation('common-web')
 
@@ -105,7 +106,7 @@ export function ExtendedPoiListElement<T extends PoiListElementType>({
       reviewsRating={reviewsRatingWithGraphql ?? rawReviewsRating}
       scrapsCount={scrapsCount}
       onClick={onClick}
-      hideScrapButton={hideScrapButton}
+      hideScrapButton={hideScrapButton || guestMode}
       maxCommentLines={maxCommentLines}
       isAdvertisement={isAdvertisement}
       optimized={optimized}

From 4d790d9da4324fe47f28ba047187cda1a77bf21d Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Thu, 26 Oct 2023 17:32:47 +0900
Subject: [PATCH 05/18] =?UTF-8?q?feat:=20Poi=20list=EC=97=90=EC=84=9C=20po?=
 =?UTF-8?q?i=20=EC=97=98=EB=A6=AC=EB=A8=BC=ED=8A=B8=EC=97=90=20guestMode?=
 =?UTF-8?q?=20=EB=82=B4=EB=A0=A4=EC=A4=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/triple-document/src/elements/pois.tsx | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/packages/triple-document/src/elements/pois.tsx b/packages/triple-document/src/elements/pois.tsx
index 87ec0ea568..f645e4d03f 100644
--- a/packages/triple-document/src/elements/pois.tsx
+++ b/packages/triple-document/src/elements/pois.tsx
@@ -9,6 +9,7 @@ import {
 import { Text } from '@titicaca/core-elements'
 
 import { useResourceClickHandler } from '../prop-context/resource-click-handler'
+import { useGuestMode } from '../prop-context/guest-mode'
 
 import ResourceList from './shared/resource-list'
 import DocumentCarousel from './shared/document-carousel'
@@ -43,6 +44,7 @@ export default function Pois<T extends ExtendedPoiListElementData>({
     pois: T[]
   }
 }) {
+  const guestMode = useGuestMode()
   const onResourceClick = useResourceClickHandler()
 
   const Container = display === 'list' ? ResourceList : DocumentCarousel
@@ -74,6 +76,7 @@ export default function Pois<T extends ExtendedPoiListElementData>({
             display,
             poi,
           })}
+          guestMode={guestMode}
         />
       ))}
     </Container>

From 228a8a093fa05a18c6d600a9c040785d1f84c3cc Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Fri, 27 Oct 2023 14:29:53 +0900
Subject: [PATCH 06/18] =?UTF-8?q?feat:=20Poi-detail=20image-carousel?=
 =?UTF-8?q?=EC=97=90=EC=84=9C=20prop=EC=9C=BC=EB=A1=9C=20guestMode?=
 =?UTF-8?q?=EB=A5=BC=20=EB=B0=9B=EC=9D=84=20=EC=88=98=20=EC=9E=88=EB=8F=84?=
 =?UTF-8?q?=EB=A1=9D=20=ED=83=80=EC=9E=85=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- '서울콘' 행사 대응용
- '서울콘' 행사를 통해 triple-content-web의 페이지로 유입된 사용자들은 모두 비로그인 상태이며, 로그인이 필요한 기능을 사용할 수 없음. 더불어 트리플앱으로의 연결을 유도하는 루트도 보지 않아야 함
-  image-carousel에서 로그인 및 앱과의 연결과 관련된 부분들을 guestMode라는 값을 기준으로 분기하기 위하여 값을 추가(예 : guestMode가 true인 경우, 사진이 5장 이상일 때 '트리플 앱에서 보기' 노출로직 숨김)
---
 packages/poi-detail/src/image-carousel/carousel-section.tsx | 2 ++
 packages/poi-detail/src/image-carousel/index.tsx            | 1 +
 2 files changed, 3 insertions(+)

diff --git a/packages/poi-detail/src/image-carousel/carousel-section.tsx b/packages/poi-detail/src/image-carousel/carousel-section.tsx
index fc0656af48..fb124d2de6 100644
--- a/packages/poi-detail/src/image-carousel/carousel-section.tsx
+++ b/packages/poi-detail/src/image-carousel/carousel-section.tsx
@@ -18,6 +18,8 @@ export interface CarouselSectionProps extends CarouselProps {
   onBusinessHoursClick?: () => void
   onPlaceholderClick: () => void
   height?: number
+  /** true인 경우, 로그인이 필요한 일부 동작을 막고, 트리플앱으로 연결되는 루트를 차단합니다 */
+  guestMode?: boolean
 }
 
 export default function CarouselSection({
diff --git a/packages/poi-detail/src/image-carousel/index.tsx b/packages/poi-detail/src/image-carousel/index.tsx
index 70ecb45105..ffec2d7320 100644
--- a/packages/poi-detail/src/image-carousel/index.tsx
+++ b/packages/poi-detail/src/image-carousel/index.tsx
@@ -14,6 +14,7 @@ type ImageCarouselProps = Pick<
   | 'optimized'
   | 'borderRadius'
   | 'height'
+  | 'guestMode'
 >
 
 export default function ImageCarousel(props: ImageCarouselProps) {

From 0fadc2cea3434a81d2db1efc83432164bcf44387 Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Fri, 27 Oct 2023 14:36:31 +0900
Subject: [PATCH 07/18] =?UTF-8?q?feat:=20placeholder=20=EC=BB=B4=ED=8F=AC?=
 =?UTF-8?q?=EB=84=8C=ED=8A=B8=EC=97=90=20guestMode=EB=A5=BC=20prop?=
 =?UTF-8?q?=EC=9C=BC=EB=A1=9C=20=EC=A0=84=EB=8B=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/image-carousel/carousel-section.tsx   |  7 +++++-
 .../src/image-carousel/placeholder.tsx        | 22 ++++++++++++-------
 2 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/packages/poi-detail/src/image-carousel/carousel-section.tsx b/packages/poi-detail/src/image-carousel/carousel-section.tsx
index fb124d2de6..e048b79307 100644
--- a/packages/poi-detail/src/image-carousel/carousel-section.tsx
+++ b/packages/poi-detail/src/image-carousel/carousel-section.tsx
@@ -31,6 +31,7 @@ export default function CarouselSection({
   onPlaceholderClick,
   onBusinessHoursClick,
   borderRadius,
+  guestMode,
   ...props
 }: CarouselSectionProps) {
   return (
@@ -47,7 +48,11 @@ export default function CarouselSection({
         {images.length > 0 ? (
           <Carousel images={images} borderRadius={borderRadius} {...props} />
         ) : (
-          <Placeholder onClick={onPlaceholderClick} noContent={loading} />
+          <Placeholder
+            onClick={onPlaceholderClick}
+            noContent={loading}
+            guestMode={guestMode}
+          />
         )}
         {!permanentlyClosed && onBusinessHoursClick ? (
           <BusinessHoursNote
diff --git a/packages/poi-detail/src/image-carousel/placeholder.tsx b/packages/poi-detail/src/image-carousel/placeholder.tsx
index 5be99ccb77..8fdb38d984 100644
--- a/packages/poi-detail/src/image-carousel/placeholder.tsx
+++ b/packages/poi-detail/src/image-carousel/placeholder.tsx
@@ -39,6 +39,7 @@ const ImagePlaceholderContent = styled.div<{ large?: boolean }>`
 interface ImagePlaceholderProps {
   large?: boolean
   noContent?: boolean
+  guestMode?: boolean
   onClick: () => void
 }
 
@@ -68,22 +69,27 @@ function ImagePlaceholder({
   )
 }
 
-interface ResponsiveImagePlaceholderProps {
-  onClick: () => void
-  noContent?: boolean
-}
-
 export default function ResponsiveImagePlaceholder({
   onClick,
   noContent,
-}: ResponsiveImagePlaceholderProps) {
+  guestMode,
+}: Omit<ImagePlaceholderProps, 'large'>) {
   return (
     <>
       <Responsive maxWidth={706}>
-        <ImagePlaceholder noContent={noContent} onClick={onClick} />
+        <ImagePlaceholder
+          noContent={noContent}
+          guestMode={guestMode}
+          onClick={onClick}
+        />
       </Responsive>
       <Responsive minWidth={707}>
-        <ImagePlaceholder noContent={noContent} large onClick={onClick} />
+        <ImagePlaceholder
+          noContent={noContent}
+          guestMode={guestMode}
+          large
+          onClick={onClick}
+        />
       </Responsive>
     </>
   )

From 9fc0d6d979e6f86b5db85f8bfc1e4b077c82b545 Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Fri, 27 Oct 2023 14:39:02 +0900
Subject: [PATCH 08/18] =?UTF-8?q?feat:=20guestMode=EA=B0=80=20true?=
 =?UTF-8?q?=EC=9D=B8=20=EA=B2=BD=EC=9A=B0,=20=EC=82=AC=EC=A7=84=EC=9D=B4?=
 =?UTF-8?q?=20=EC=97=86=EC=9D=84=20=EB=95=8C=20=EC=82=AC=EC=A7=84=20?=
 =?UTF-8?q?=EC=95=84=EC=9D=B4=EC=BD=98=EB=A7=8C=20=EB=82=98=ED=83=80?=
 =?UTF-8?q?=EB=82=98=EA=B2=8C=20=ED=95=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 아이콘 이미지는 guestMode 용으로 교체 필요
---
 packages/poi-detail/src/image-carousel/placeholder.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/poi-detail/src/image-carousel/placeholder.tsx b/packages/poi-detail/src/image-carousel/placeholder.tsx
index 8fdb38d984..a3609754ab 100644
--- a/packages/poi-detail/src/image-carousel/placeholder.tsx
+++ b/packages/poi-detail/src/image-carousel/placeholder.tsx
@@ -47,13 +47,17 @@ function ImagePlaceholder({
   large,
   noContent,
   onClick,
+  guestMode,
 }: ImagePlaceholderProps) {
   const { t } = useTranslation('common-web')
 
   return (
     <ImagePlaceholderContainer large={large} onClick={onClick}>
       <ImagePlaceholderContent large={large}>
-        {noContent ? null : (
+        {noContent ? null : guestMode ? (
+          /** TODO : 아이콘 이미지 guestMode 용으로 교체  */
+          <PlaceholderIcon src="https://assets.triple.guide/images/img-empty-photo-m@4x.png" />
+        ) : (
           <>
             <PlaceholderIcon src="https://assets.triple.guide/images/img-empty-photo-m@4x.png" />
             <Text size="small" color="gray" alpha={0.3}>

From d08da25e70854f5068e8fb2717d087025434c0b4 Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Fri, 27 Oct 2023 14:44:23 +0900
Subject: [PATCH 09/18] =?UTF-8?q?feat:=20guestMode=EA=B0=80=20true?=
 =?UTF-8?q?=EC=9D=B8=20=EA=B2=BD=EC=9A=B0,=20=EC=82=AC=EC=A7=84=EC=9D=B4?=
 =?UTF-8?q?=205=EC=9E=A5=20=EC=9D=B4=EC=83=81=EC=9D=BC=20=EB=95=8C=20?=
 =?UTF-8?q?=EB=82=98=ED=83=80=EB=82=98=EB=8A=94=20=EC=95=B1=EC=9C=BC?=
 =?UTF-8?q?=EB=A1=9C=20=EC=97=B0=EA=B2=B0=20overlay=EC=98=81=EC=97=AD=20?=
 =?UTF-8?q?=EB=AF=B8=ED=91=9C=EC=8B=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../poi-detail/src/image-carousel/carousel-section.tsx     | 7 ++++++-
 packages/poi-detail/src/image-carousel/carousel.tsx        | 6 +++++-
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/packages/poi-detail/src/image-carousel/carousel-section.tsx b/packages/poi-detail/src/image-carousel/carousel-section.tsx
index e048b79307..f34a939c73 100644
--- a/packages/poi-detail/src/image-carousel/carousel-section.tsx
+++ b/packages/poi-detail/src/image-carousel/carousel-section.tsx
@@ -46,7 +46,12 @@ export default function CarouselSection({
     >
       <Container position="relative">
         {images.length > 0 ? (
-          <Carousel images={images} borderRadius={borderRadius} {...props} />
+          <Carousel
+            images={images}
+            borderRadius={borderRadius}
+            guestMode={guestMode}
+            {...props}
+          />
         ) : (
           <Placeholder
             onClick={onPlaceholderClick}
diff --git a/packages/poi-detail/src/image-carousel/carousel.tsx b/packages/poi-detail/src/image-carousel/carousel.tsx
index 7a060d21d8..8d53031c02 100644
--- a/packages/poi-detail/src/image-carousel/carousel.tsx
+++ b/packages/poi-detail/src/image-carousel/carousel.tsx
@@ -39,6 +39,7 @@ export interface CarouselProps {
   optimized?: boolean
   borderRadius?: number
   height?: number
+  guestMode?: boolean
 }
 
 export default function Carousel({
@@ -50,6 +51,7 @@ export default function Carousel({
   optimized,
   borderRadius = 6,
   height,
+  guestMode,
 }: CarouselProps) {
   const app = useTripleClientMetadata()
   const { trackEvent, trackSimpleEvent } = useEventTrackingContext()
@@ -133,7 +135,9 @@ export default function Carousel({
         )
 
   const CTA = ({ currentIndex }: { currentIndex: number }) =>
-    !app && currentIndex === SHOW_CTA_FROM_INDEX ? <CtaOverlay /> : null
+    !app && !guestMode && currentIndex === SHOW_CTA_FROM_INDEX ? (
+      <CtaOverlay />
+    ) : null
 
   return (
     <>

From 3664704ae466b2f03d36baca19accfabae6773ec Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Fri, 27 Oct 2023 16:26:55 +0900
Subject: [PATCH 10/18] =?UTF-8?q?feat:=20guestMode=EA=B0=80=20true?=
 =?UTF-8?q?=EC=9D=B8=20=EA=B2=BD=EC=9A=B0,=20=EC=82=AC=EC=A7=84=EC=9D=84?=
 =?UTF-8?q?=205=EC=9E=A5=EA=B9=8C=EC=A7=80=EB=A7=8C=20=EB=85=B8=EC=B6=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/poi-detail/src/image-carousel/carousel.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/poi-detail/src/image-carousel/carousel.tsx b/packages/poi-detail/src/image-carousel/carousel.tsx
index 8d53031c02..17b6e12878 100644
--- a/packages/poi-detail/src/image-carousel/carousel.tsx
+++ b/packages/poi-detail/src/image-carousel/carousel.tsx
@@ -56,7 +56,9 @@ export default function Carousel({
   const app = useTripleClientMetadata()
   const { trackEvent, trackSimpleEvent } = useEventTrackingContext()
   const [currentPage, setCurrentPage] = useState(0)
-  const visibleImages = app ? images : images.slice(0, SHOW_CTA_FROM_INDEX + 1)
+  const visibleImages = app
+    ? images
+    : images.slice(0, guestMode ? SHOW_CTA_FROM_INDEX : SHOW_CTA_FROM_INDEX + 1)
 
   const handleImageClick = useCallback(
     (event?: MouseEvent, media?: ImageMeta) => {

From 49d6f1b26df2aec97c59bdc69eb4fd4ed2dbc4b9 Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Fri, 27 Oct 2023 16:43:21 +0900
Subject: [PATCH 11/18] =?UTF-8?q?feat:=20guestMode=EA=B0=80=20true?=
 =?UTF-8?q?=EC=9D=BC=20=EB=95=8C=EC=9D=98=20=EC=82=AC=EC=A7=84=20=EC=9D=B8?=
 =?UTF-8?q?=EB=8D=B1=EC=8A=A4=20=ED=91=9C=EA=B8=B0=EB=B0=A9=EC=8B=9D=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 5장째 사진에도 인덱스를 보여줌
- 사진 총 장수를 최대 5까지만 표기
---
 .../src/image-carousel/carousel.tsx           | 28 +++++++++++++++----
 1 file changed, 22 insertions(+), 6 deletions(-)

diff --git a/packages/poi-detail/src/image-carousel/carousel.tsx b/packages/poi-detail/src/image-carousel/carousel.tsx
index 17b6e12878..bb0d8a1686 100644
--- a/packages/poi-detail/src/image-carousel/carousel.tsx
+++ b/packages/poi-detail/src/image-carousel/carousel.tsx
@@ -129,12 +129,28 @@ export default function Carousel({
     ],
   )
 
-  const ConditionalPageLabel = app
-    ? undefined
-    : ({ currentIndex }: { currentIndex: number }) =>
-        !totalImagesCount || currentIndex === SHOW_CTA_FROM_INDEX ? null : (
-          <PageLabel currentIndex={currentPage} totalCount={totalImagesCount} />
-        )
+  const publicPageLabelRenderer = ({
+    currentIndex,
+  }: {
+    currentIndex: number
+  }) => {
+    if (!totalImagesCount) {
+      return null
+    }
+
+    if (guestMode || currentIndex !== SHOW_CTA_FROM_INDEX) {
+      const totalCount =
+        guestMode && totalImagesCount > SHOW_CTA_FROM_INDEX
+          ? SHOW_CTA_FROM_INDEX
+          : totalImagesCount
+
+      return <PageLabel currentIndex={currentPage} totalCount={totalCount} />
+    }
+
+    return null
+  }
+
+  const ConditionalPageLabel = app ? undefined : publicPageLabelRenderer
 
   const CTA = ({ currentIndex }: { currentIndex: number }) =>
     !app && !guestMode && currentIndex === SHOW_CTA_FROM_INDEX ? (

From 4df8861b8b61882d4432431cf54238531667517e Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Mon, 30 Oct 2023 13:32:01 +0900
Subject: [PATCH 12/18] =?UTF-8?q?feat:=20Poi=20list=EC=97=90=20=EC=82=AC?=
 =?UTF-8?q?=EC=9A=A9=EB=90=98=EB=8A=94=20=EC=97=98=EB=A6=AC=EB=A8=BC?=
 =?UTF-8?q?=ED=8A=B8=EC=9D=98=20=EC=9D=B4=EB=A6=84=EA=B3=BC=20=EB=A6=AC?=
 =?UTF-8?q?=EC=A0=84=EB=AA=85=20=EC=98=81=EC=97=AD=EC=97=90=20=EB=8C=80?=
 =?UTF-8?q?=ED=91=9C=EC=96=B4=EA=B0=92(primary)=EC=9D=B4=20=EA=B0=80?=
 =?UTF-8?q?=EC=9E=A5=20=EC=9A=B0=EC=84=A0=EC=A0=81=EC=9C=BC=EB=A1=9C=20?=
 =?UTF-8?q?=ED=91=9C=EA=B8=B0=EB=90=98=EB=8F=84=EB=A1=9D=20=ED=95=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 서울콘용 영문 Poi 및 가이드 데이터 표시에 대응
- 영문 데이터에는 제목과 리전의 대표어값에 항상 영문 데이터를 넣도록 약속됨
---
 packages/poi-list-elements/src/carousel-element.tsx      | 9 +++++++--
 .../poi-list-elements/src/compact-poi-list-element.tsx   | 9 +++++++--
 2 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/packages/poi-list-elements/src/carousel-element.tsx b/packages/poi-list-elements/src/carousel-element.tsx
index 0393c36cbb..448f09c6be 100644
--- a/packages/poi-list-elements/src/carousel-element.tsx
+++ b/packages/poi-list-elements/src/carousel-element.tsx
@@ -50,8 +50,13 @@ function PoiCarouselElement<T extends PoiListElementType>({
 
   const { names: regionNames } = region?.source || {}
 
-  const name = nameOverride || names.ko || names.en || names.local
-  const regionName = regionNames?.ko || regionNames?.en || regionNames?.local
+  const name =
+    nameOverride || names.primary || names.ko || names.en || names.local
+  const regionName =
+    regionNames?.primary ||
+    regionNames?.ko ||
+    regionNames?.en ||
+    regionNames?.local
 
   return (
     <Carousel.Item
diff --git a/packages/poi-list-elements/src/compact-poi-list-element.tsx b/packages/poi-list-elements/src/compact-poi-list-element.tsx
index cffa0cc0ac..8d3575beb8 100644
--- a/packages/poi-list-elements/src/compact-poi-list-element.tsx
+++ b/packages/poi-list-elements/src/compact-poi-list-element.tsx
@@ -53,8 +53,13 @@ export function CompactPoiListElement<T extends PoiListElementType>({
 
   const { names: regionNames } = region?.source || {}
 
-  const name = nameOverride || names.ko || names.en || names.local
-  const regionName = regionNames?.ko || regionNames?.en || regionNames?.local
+  const name =
+    nameOverride || names.primary || names.ko || names.en || names.local
+  const regionName =
+    regionNames?.primary ||
+    regionNames?.ko ||
+    regionNames?.en ||
+    regionNames?.local
 
   return (
     <ResourceListItem onClick={onClick}>

From 4b62eabc3081d7194ba789d4c795214de849a3b4 Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Mon, 30 Oct 2023 13:36:05 +0900
Subject: [PATCH 13/18] =?UTF-8?q?fix:=20Poi=20=EC=97=98=EB=A6=AC=EB=A8=BC?=
 =?UTF-8?q?=ED=8A=B8=EB=93=A4=EC=97=90=EC=84=9C=20guestMode=EC=9D=B8=20?=
 =?UTF-8?q?=EA=B2=BD=EC=9A=B0=20=EC=8A=A4=ED=81=AC=EB=9E=A9=20=EB=B2=84?=
 =?UTF-8?q?=ED=8A=BC=20=EC=88=A8=EA=B9=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- extended-poi-list-element는 Pois 엘리먼트에서 사용되지 않아 적용제외
---
 .../src/carousel-element.tsx                  | 24 ++++++++--------
 .../src/compact-poi-list-element.tsx          | 28 ++++++++++---------
 2 files changed, 28 insertions(+), 24 deletions(-)

diff --git a/packages/poi-list-elements/src/carousel-element.tsx b/packages/poi-list-elements/src/carousel-element.tsx
index 0393c36cbb..c52ee68856 100644
--- a/packages/poi-list-elements/src/carousel-element.tsx
+++ b/packages/poi-list-elements/src/carousel-element.tsx
@@ -34,6 +34,7 @@ function PoiCarouselElement<T extends PoiListElementType>({
   imageFrame,
   onImpress,
   optimized,
+  guestMode,
 }: PoiListElementBaseProps<T> & {
   actionButtonElement?: ActionButtonElement
   description?: ReactNode
@@ -52,6 +53,17 @@ function PoiCarouselElement<T extends PoiListElementType>({
 
   const name = nameOverride || names.ko || names.en || names.local
   const regionName = regionNames?.ko || regionNames?.en || regionNames?.local
+  const ActionButton = actionButtonElement || (
+    <Container
+      position="absolute"
+      css={{
+        top: '3px',
+        right: '3px',
+      }}
+    >
+      <OverlayScrapButton resource={poi} size={36} />
+    </Container>
+  )
 
   return (
     <Carousel.Item
@@ -91,17 +103,7 @@ function PoiCarouselElement<T extends PoiListElementType>({
           : vicinity}
       </Text>
 
-      {actionButtonElement || (
-        <Container
-          position="absolute"
-          css={{
-            top: '3px',
-            right: '3px',
-          }}
-        >
-          <OverlayScrapButton resource={poi} size={36} />
-        </Container>
-      )}
+      {!guestMode ? ActionButton : null}
 
       {additionalInfo}
     </Carousel.Item>
diff --git a/packages/poi-list-elements/src/compact-poi-list-element.tsx b/packages/poi-list-elements/src/compact-poi-list-element.tsx
index cffa0cc0ac..47a2e3dc22 100644
--- a/packages/poi-list-elements/src/compact-poi-list-element.tsx
+++ b/packages/poi-list-elements/src/compact-poi-list-element.tsx
@@ -41,6 +41,7 @@ export function CompactPoiListElement<T extends PoiListElementType>({
     source: { names, image, areas, vicinity },
   },
   onClick,
+  guestMode,
 }: CompactPoiListElementProps<T>) {
   const [actionButtonWidth, setActionButtonWidth] = useState(0)
   const actionButtonRef = useRef<HTMLDivElement & { width?: number }>(null)
@@ -55,6 +56,19 @@ export function CompactPoiListElement<T extends PoiListElementType>({
 
   const name = nameOverride || names.ko || names.en || names.local
   const regionName = regionNames?.ko || regionNames?.en || regionNames?.local
+  const ActionButton = actionButtonElement ? (
+    <div ref={actionButtonRef}>{actionButtonElement}</div>
+  ) : (
+    <Container
+      position="absolute"
+      css={{
+        top: 0,
+        right: 0,
+      }}
+    >
+      <OutlineScrapButton resource={poi} size={34} />
+    </Container>
+  )
 
   return (
     <ResourceListItem onClick={onClick}>
@@ -86,19 +100,7 @@ export function CompactPoiListElement<T extends PoiListElementType>({
           .join(' · ')}
       </Text>
 
-      {actionButtonElement ? (
-        <div ref={actionButtonRef}>{actionButtonElement}</div>
-      ) : (
-        <Container
-          position="absolute"
-          css={{
-            top: 0,
-            right: 0,
-          }}
-        >
-          <OutlineScrapButton resource={poi} size={34} />
-        </Container>
-      )}
+      {!guestMode ? ActionButton : null}
     </ResourceListItem>
   )
 }

From b5ac5893abcec73180ae7bfdef85d22c36d1f902 Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Mon, 30 Oct 2023 13:44:20 +0900
Subject: [PATCH 14/18] =?UTF-8?q?fix:=20guestMode=20=ED=83=80=EC=9E=85?=
 =?UTF-8?q?=EC=9D=84=20Poi=20=EC=97=98=EB=A6=AC=EB=A8=BC=ED=8A=B8=20?=
 =?UTF-8?q?=EA=B3=B5=ED=86=B5=EC=97=90=EC=84=9C=20=EC=A0=9C=EC=99=B8?=
 =?UTF-8?q?=ED=95=98=EA=B3=A0=20=ED=8A=B8=EB=A6=AC=ED=94=8C=20=EB=8F=84?=
 =?UTF-8?q?=ED=81=90=EB=A8=BC=ED=8A=B8=20Pois=20=EC=97=90=EC=84=9C=20?=
 =?UTF-8?q?=EC=82=AC=EC=9A=A9=ED=95=98=EB=8A=94=20=EC=97=98=EB=A6=AC?=
 =?UTF-8?q?=EB=A8=BC=ED=8A=B8=EB=93=A4=EC=97=90=EB=A7=8C=20=EC=A0=95?=
 =?UTF-8?q?=EC=9D=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/poi-list-elements/src/carousel-element.tsx         | 1 +
 packages/poi-list-elements/src/compact-poi-list-element.tsx | 1 +
 packages/poi-list-elements/src/types.ts                     | 1 -
 3 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/poi-list-elements/src/carousel-element.tsx b/packages/poi-list-elements/src/carousel-element.tsx
index c52ee68856..556fd70a84 100644
--- a/packages/poi-list-elements/src/carousel-element.tsx
+++ b/packages/poi-list-elements/src/carousel-element.tsx
@@ -44,6 +44,7 @@ function PoiCarouselElement<T extends PoiListElementType>({
   imageFrame?: FrameRatioAndSizes
   onImpress?: () => void
   optimized?: boolean
+  guestMode?: boolean
 }) {
   if (!poi) {
     return null
diff --git a/packages/poi-list-elements/src/compact-poi-list-element.tsx b/packages/poi-list-elements/src/compact-poi-list-element.tsx
index 47a2e3dc22..acc62cbe74 100644
--- a/packages/poi-list-elements/src/compact-poi-list-element.tsx
+++ b/packages/poi-list-elements/src/compact-poi-list-element.tsx
@@ -17,6 +17,7 @@ import { getTypeNames } from './get-type-names'
 interface CompactPoiListElementBaseProps<T extends PoiListElementType>
   extends PoiListElementBaseProps<T> {
   actionButtonElement?: ActionButtonElement
+  guestMode?: boolean
 }
 
 export type CompactPoiListElementProps<T extends PoiListElementType> =
diff --git a/packages/poi-list-elements/src/types.ts b/packages/poi-list-elements/src/types.ts
index 971d24a470..e4c8a7ee4d 100644
--- a/packages/poi-list-elements/src/types.ts
+++ b/packages/poi-list-elements/src/types.ts
@@ -9,7 +9,6 @@ export type ActionButtonElement = ReactNode
 
 export interface PoiListElementBaseProps<T extends PoiListElementType> {
   poi: T
-  guestMode?: boolean
   onClick?: MouseEventHandler<HTMLLIElement>
 }
 

From 4905f4be4ae4811bf1931be134fa87dbc9226d92 Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Mon, 6 Nov 2023 11:42:34 +0900
Subject: [PATCH 15/18] =?UTF-8?q?feat:=20Poi=20image-carousel=EC=97=90?=
 =?UTF-8?q?=EC=84=9C=20poi=20type=EB=8F=84=20=EB=B0=9B=EB=8F=84=EB=A1=9D?=
 =?UTF-8?q?=20=ED=95=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/poi-detail/src/image-carousel/carousel-section.tsx | 3 +++
 packages/poi-detail/src/image-carousel/index.tsx            | 1 +
 2 files changed, 4 insertions(+)

diff --git a/packages/poi-detail/src/image-carousel/carousel-section.tsx b/packages/poi-detail/src/image-carousel/carousel-section.tsx
index f34a939c73..f88837b91d 100644
--- a/packages/poi-detail/src/image-carousel/carousel-section.tsx
+++ b/packages/poi-detail/src/image-carousel/carousel-section.tsx
@@ -4,6 +4,8 @@ import Carousel, { CarouselProps } from './carousel'
 import Placeholder from './placeholder'
 import { BusinessHoursNote, PermanentlyClosedNote } from './note'
 
+type PoiType = 'attraction' | 'hotel' | 'restaurant'
+
 export interface CarouselSectionProps extends CarouselProps {
   loading: boolean
   currentBusinessHours?:
@@ -20,6 +22,7 @@ export interface CarouselSectionProps extends CarouselProps {
   height?: number
   /** true인 경우, 로그인이 필요한 일부 동작을 막고, 트리플앱으로 연결되는 루트를 차단합니다 */
   guestMode?: boolean
+  type?: PoiType
 }
 
 export default function CarouselSection({
diff --git a/packages/poi-detail/src/image-carousel/index.tsx b/packages/poi-detail/src/image-carousel/index.tsx
index ffec2d7320..825cfa5354 100644
--- a/packages/poi-detail/src/image-carousel/index.tsx
+++ b/packages/poi-detail/src/image-carousel/index.tsx
@@ -15,6 +15,7 @@ type ImageCarouselProps = Pick<
   | 'borderRadius'
   | 'height'
   | 'guestMode'
+  | 'type'
 >
 
 export default function ImageCarousel(props: ImageCarouselProps) {

From d5154dc924187196aaf9d741d6b261256395435f Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Mon, 6 Nov 2023 11:52:33 +0900
Subject: [PATCH 16/18] =?UTF-8?q?feat:=20=EC=9D=B4=EB=AF=B8=EC=A7=80=20?=
 =?UTF-8?q?=EC=97=86=EC=9D=84=20=EB=95=8C=20=ED=91=9C=EC=8B=9C=ED=95=98?=
 =?UTF-8?q?=EB=8A=94=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=EB=A1=9C=20typ?=
 =?UTF-8?q?e=20prop=20=EC=A0=84=EB=8B=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/poi-detail/src/image-carousel/carousel-section.tsx | 4 +++-
 packages/poi-detail/src/image-carousel/placeholder.tsx      | 3 +++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/packages/poi-detail/src/image-carousel/carousel-section.tsx b/packages/poi-detail/src/image-carousel/carousel-section.tsx
index f88837b91d..d5adac1238 100644
--- a/packages/poi-detail/src/image-carousel/carousel-section.tsx
+++ b/packages/poi-detail/src/image-carousel/carousel-section.tsx
@@ -4,7 +4,7 @@ import Carousel, { CarouselProps } from './carousel'
 import Placeholder from './placeholder'
 import { BusinessHoursNote, PermanentlyClosedNote } from './note'
 
-type PoiType = 'attraction' | 'hotel' | 'restaurant'
+export type PoiType = 'attraction' | 'hotel' | 'restaurant'
 
 export interface CarouselSectionProps extends CarouselProps {
   loading: boolean
@@ -35,6 +35,7 @@ export default function CarouselSection({
   onBusinessHoursClick,
   borderRadius,
   guestMode,
+  type,
   ...props
 }: CarouselSectionProps) {
   return (
@@ -60,6 +61,7 @@ export default function CarouselSection({
             onClick={onPlaceholderClick}
             noContent={loading}
             guestMode={guestMode}
+            type={type}
           />
         )}
         {!permanentlyClosed && onBusinessHoursClick ? (
diff --git a/packages/poi-detail/src/image-carousel/placeholder.tsx b/packages/poi-detail/src/image-carousel/placeholder.tsx
index a3609754ab..fe51ff6259 100644
--- a/packages/poi-detail/src/image-carousel/placeholder.tsx
+++ b/packages/poi-detail/src/image-carousel/placeholder.tsx
@@ -2,6 +2,8 @@ import { useTranslation } from '@titicaca/next-i18next'
 import styled, { css } from 'styled-components'
 import { Text, Responsive } from '@titicaca/core-elements'
 
+import { PoiType } from './carousel-section'
+
 const ImagePlaceholderContainer = styled.div<{ large?: boolean }>`
   width: 100%;
   overflow: hidden;
@@ -40,6 +42,7 @@ interface ImagePlaceholderProps {
   large?: boolean
   noContent?: boolean
   guestMode?: boolean
+  type?: PoiType
   onClick: () => void
 }
 

From 837219cf99a288860ec5324f1cc77e9b64252b85 Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Mon, 6 Nov 2023 17:47:44 +0900
Subject: [PATCH 17/18] =?UTF-8?q?feat:=20guestmode=EC=9D=B4=EB=A9=B4?=
 =?UTF-8?q?=EC=84=9C=20=EB=8C=80=ED=91=9C=EC=82=AC=EC=A7=84=EC=9D=B4=20?=
 =?UTF-8?q?=EC=97=86=EC=9D=84=20=EB=95=8C,=20poi=20type=EB=B3=84=EB=A1=9C?=
 =?UTF-8?q?=20=EB=8B=A4=EB=A5=B8=20=EC=95=84=EC=9D=B4=EC=BD=98=20=EB=85=B8?=
 =?UTF-8?q?=EC=B6=9C=ED=95=98=EB=8F=84=EB=A1=9D=20=ED=95=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/image-carousel/placeholder.tsx        | 21 +++++++++++++++----
 1 file changed, 17 insertions(+), 4 deletions(-)

diff --git a/packages/poi-detail/src/image-carousel/placeholder.tsx b/packages/poi-detail/src/image-carousel/placeholder.tsx
index fe51ff6259..ed900af287 100644
--- a/packages/poi-detail/src/image-carousel/placeholder.tsx
+++ b/packages/poi-detail/src/image-carousel/placeholder.tsx
@@ -4,6 +4,13 @@ import { Text, Responsive } from '@titicaca/core-elements'
 
 import { PoiType } from './carousel-section'
 
+const DEFAULT_ICON_URLS: Record<PoiType, string> = {
+  attraction: 'https://assets.triple.guide/images/seoulcon/default/ic_spot.svg',
+  hotel: 'https://assets.triple.guide/images/seoulcon/default/ic_hotel.svg',
+  restaurant:
+    'https://assets.triple.guide/images/seoulcon/default/ic_restaurant.svg',
+}
+
 const ImagePlaceholderContainer = styled.div<{ large?: boolean }>`
   width: 100%;
   overflow: hidden;
@@ -49,8 +56,9 @@ interface ImagePlaceholderProps {
 function ImagePlaceholder({
   large,
   noContent,
-  onClick,
   guestMode,
+  type,
+  onClick,
 }: ImagePlaceholderProps) {
   const { t } = useTranslation('common-web')
 
@@ -58,8 +66,10 @@ function ImagePlaceholder({
     <ImagePlaceholderContainer large={large} onClick={onClick}>
       <ImagePlaceholderContent large={large}>
         {noContent ? null : guestMode ? (
-          /** TODO : 아이콘 이미지 guestMode 용으로 교체  */
-          <PlaceholderIcon src="https://assets.triple.guide/images/img-empty-photo-m@4x.png" />
+          <PlaceholderIcon
+            src={DEFAULT_ICON_URLS[type || 'attraction']}
+            css={{ opacity: 0.3 }}
+          />
         ) : (
           <>
             <PlaceholderIcon src="https://assets.triple.guide/images/img-empty-photo-m@4x.png" />
@@ -77,9 +87,10 @@ function ImagePlaceholder({
 }
 
 export default function ResponsiveImagePlaceholder({
-  onClick,
   noContent,
   guestMode,
+  type,
+  onClick,
 }: Omit<ImagePlaceholderProps, 'large'>) {
   return (
     <>
@@ -87,6 +98,7 @@ export default function ResponsiveImagePlaceholder({
         <ImagePlaceholder
           noContent={noContent}
           guestMode={guestMode}
+          type={type}
           onClick={onClick}
         />
       </Responsive>
@@ -94,6 +106,7 @@ export default function ResponsiveImagePlaceholder({
         <ImagePlaceholder
           noContent={noContent}
           guestMode={guestMode}
+          type={type}
           large
           onClick={onClick}
         />

From f1ef37af261694f65038e0c93e9b3f4e980221c6 Mon Sep 17 00:00:00 2001
From: seulgiyoon <sgyoon.info@gmail.com>
Date: Tue, 7 Nov 2023 09:36:43 +0900
Subject: [PATCH 18/18] =?UTF-8?q?fix:=20guestmode=EC=9A=A9=20=EB=94=94?=
 =?UTF-8?q?=ED=8F=B4=ED=8A=B8=20=EC=95=84=EC=9D=B4=EC=BD=98=20=EB=84=88?=
 =?UTF-8?q?=EB=B9=84=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/poi-detail/src/image-carousel/placeholder.tsx | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/packages/poi-detail/src/image-carousel/placeholder.tsx b/packages/poi-detail/src/image-carousel/placeholder.tsx
index ed900af287..63b80bbffd 100644
--- a/packages/poi-detail/src/image-carousel/placeholder.tsx
+++ b/packages/poi-detail/src/image-carousel/placeholder.tsx
@@ -27,8 +27,6 @@ const ImagePlaceholderContainer = styled.div<{ large?: boolean }>`
 `
 
 const PlaceholderIcon = styled.img`
-  width: 60px;
-  height: 60px;
   vertical-align: baseline;
 `
 
@@ -68,11 +66,15 @@ function ImagePlaceholder({
         {noContent ? null : guestMode ? (
           <PlaceholderIcon
             src={DEFAULT_ICON_URLS[type || 'attraction']}
+            width={40}
             css={{ opacity: 0.3 }}
           />
         ) : (
           <>
-            <PlaceholderIcon src="https://assets.triple.guide/images/img-empty-photo-m@4x.png" />
+            <PlaceholderIcon
+              src="https://assets.triple.guide/images/img-empty-photo-m@4x.png"
+              width={60}
+            />
             <Text size="small" color="gray" alpha={0.3}>
               {t([
                 'igosyi-ceos-beonjjae-sajineul-olryeojuseyo.',