feat(home): AI 캐릭터 섹션을 연결한다

SodaLive/Sources/V2/Main/Home/Recommendation/Components/MainHomeAiCharacterSection.swift

@@ -0,0 +1,74 @@
+import SwiftUI
+
+struct MainHomeAiCharacterSection: View {
+    let items: [HomeAiCharacterItem]
+    let onTapCharacter: (Int) -> Void
+
+    init(
+        items: [HomeAiCharacterItem],
+        onTapCharacter: @escaping (Int) -> Void = { _ in }
+    ) {
+        self.items = items
+        self.onTapCharacter = onTapCharacter
+    }
+
+    var body: some View {
+        if !items.isEmpty {
+            VStack(alignment: .leading, spacing: SodaSpacing.s14) {
+                SectionTitle(title: I18n.HomeRecommendation.aiCharacterSectionTitle)
+
+                ScrollView(.horizontal, showsIndicators: false) {
+                    LazyHStack(alignment: .center, spacing: SodaSpacing.s4) {
+                        ForEach(items, id: \.self) { item in
+                            Button {
+                                onTapCharacter(item.characterId)
+                            } label: {
+                                AiCharacterCard(
+                                    name: item.name,
+                                    description: item.description,
+                                    profileImageUrl: item.profileImage,
+                                    chatCount: item.totalChatCount,
+                                    originalTitle: item.originalWorkTitle
+                                )
+                            }
+                            .buttonStyle(.plain)
+                        }
+                    }
+                    .padding(.horizontal, SodaSpacing.s14)
+                }
+            }
+        }
+    }
+}
+
+struct MainHomeAiCharacterSection_Previews: PreviewProvider {
+    private static let previewImageUrl = "https://picsum.photos/500/500"
+
+    static var previews: some View {
+        MainHomeAiCharacterSection(
+            items: [
+                HomeAiCharacterItem(
+                    characterId: 1,
+                    creatorId: 10,
+                    name: "캐릭터 이름",
+                    description: "캐릭터 소개가 들어가는 부분입니다 넘어가는 경우 ...처리",
+                    profileImage: previewImageUrl,
+                    totalChatCount: 14_000,
+                    originalWorkTitle: nil
+                ),
+                HomeAiCharacterItem(
+                    characterId: 2,
+                    creatorId: 11,
+                    name: "캐릭터 이름",
+                    description: "캐릭터 소개가 들어가는 부분입니다 넘어가는 경우 ...처리",
+                    profileImage: previewImageUrl,
+                    totalChatCount: 128,
+                    originalWorkTitle: "작품 이름"
+                )
+            ]
+        )
+        .padding(.vertical, SodaSpacing.s20)
+        .background(Color.black)
+        .previewLayout(.sizeThatFits)
+    }
+}

SodaLive/Sources/V2/Main/Home/Recommendation/Components/MainHomeRecentDebutCreatorSection.swift

@@ -33,20 +33,19 @@ struct MainHomeRecentDebutCreatorSection: View {
 }
 
 private struct MainHomeRecentDebutCreatorItemView: View {
-    private static let itemWidth: CGFloat = 185
-    private static let itemHeight: CGFloat = 234
-
     let item: HomeCreatorItem
     let action: () -> Void
 
     var body: some View {
+        let itemSize = AiCharacterCard.responsiveSize()
+
         Button(action: action) {
             ZStack(alignment: .bottom) {
                 DownsampledKFImage(
                     url: URL(string: item.creatorProfileImage),
-                    size: CGSize(width: Self.itemWidth, height: Self.itemHeight)
+                    size: itemSize
                 )
-                .frame(width: Self.itemWidth, height: Self.itemHeight)
+                .frame(width: itemSize.width, height: itemSize.height)
                 .background(Color.gray800)
                 .clipShape(RoundedRectangle(cornerRadius: SodaSpacing.s14, style: .continuous))
 
@@ -55,7 +54,7 @@ private struct MainHomeRecentDebutCreatorItemView: View {
                     startPoint: .top,
                     endPoint: .bottom
                 )
-                .frame(height: 80)
+                .frame(height: min(80, itemSize.height))
 
                 Text(item.creatorNickname)
                     .appFont(.heading4)
@@ -65,7 +64,7 @@ private struct MainHomeRecentDebutCreatorItemView: View {
                     .padding(.horizontal, SodaSpacing.s12)
                     .padding(.bottom, SodaSpacing.s20)
             }
-            .frame(width: Self.itemWidth, height: Self.itemHeight)
+            .frame(width: itemSize.width, height: itemSize.height)
             .clipShape(RoundedRectangle(cornerRadius: SodaSpacing.s14, style: .continuous))
         }
         .buttonStyle(.plain)