From 624c12817e285103dc576b1705f76180c40068c9 Mon Sep 17 00:00:00 2001
From: Yu Sung <hwchon1234@gmail.com>
Date: Tue, 22 Jul 2025 03:58:10 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EB=A9=94=EC=9D=B8=20=EB=9D=BC=EC=9D=B4?=
 =?UTF-8?q?=EB=B8=8C=20-=20=EC=B5=9C=EA=B7=BC=20=EC=A2=85=EB=A3=8C?=
 =?UTF-8?q?=ED=95=9C=20=EB=9D=BC=EC=9D=B4=EB=B8=8C=20UI=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Live/LatestFinishedLiveItemView.swift     | 51 ++++++++++++++
 SodaLive/Sources/Live/LiveView.swift          |  4 ++
 .../Live/SectionLatestFinishedLiveView.swift  | 68 +++++++++++++++++++
 3 files changed, 123 insertions(+)
 create mode 100644 SodaLive/Sources/Live/LatestFinishedLiveItemView.swift
 create mode 100644 SodaLive/Sources/Live/SectionLatestFinishedLiveView.swift

diff --git a/SodaLive/Sources/Live/LatestFinishedLiveItemView.swift b/SodaLive/Sources/Live/LatestFinishedLiveItemView.swift
new file mode 100644
index 0000000..bae569c
--- /dev/null
+++ b/SodaLive/Sources/Live/LatestFinishedLiveItemView.swift
@@ -0,0 +1,51 @@
+//
+//  LatestFinishedLiveItemView.swift
+//  SodaLive
+//
+//  Created by klaus on 7/22/25.
+//
+
+import SwiftUI
+import Kingfisher
+
+struct LatestFinishedLiveItemView: View {
+    
+    let item: GetLatestFinishedLiveResponse
+    
+    var body: some View {
+        VStack(spacing: 0) {
+            KFImage(URL(string: item.profileImageUrl))
+                .cancelOnDisappear(true)
+                .resizable()
+                .scaledToFill()
+                .frame(width: 84, height: 84, alignment: .top)
+                .clipShape(Circle())
+                           
+            Text(item.nickname)
+                .font(.custom(Font.preRegular.rawValue, size: 16))
+                .foregroundColor(.white)
+                .padding(.top, 20)
+            
+            Spacer()
+            
+            Text(item.timeAgo)
+                .font(.custom(Font.preRegular.rawValue, size: 16))
+                .foregroundColor(Color(hex: "78909C"))
+        }
+        .padding(16)
+        .frame(width: 144, height: 204)
+        .background(Color(hex: "263238"))
+        .cornerRadius(16)
+    }
+}
+
+#Preview {
+    LatestFinishedLiveItemView(
+        item: GetLatestFinishedLiveResponse(
+            memberId: 1,
+            nickname: "크리에이터 1",
+            profileImageUrl: "https://cf.sodalive.net/profile/34638/34638-profile-5bfc2bac-3278-48f8-b60c-1294b615f629-8832-1751707083877",
+            timeAgo: "5분전"
+        )
+    )
+}
diff --git a/SodaLive/Sources/Live/LiveView.swift b/SodaLive/Sources/Live/LiveView.swift
index 8dff9fe..e0a95d1 100644
--- a/SodaLive/Sources/Live/LiveView.swift
+++ b/SodaLive/Sources/Live/LiveView.swift
@@ -85,6 +85,10 @@ struct LiveView: View {
                                 SectionRecommendLiveView(items: viewModel.recommendLiveItems)
                             }
                             
+                            if viewModel.latestFinishedLiveItems.count > 0 {
+                                SectionLatestFinishedLiveView(items: viewModel.latestFinishedLiveItems)
+                            }
+                            
                             if viewModel.replayLiveItems.count > 0 {
                                 LiveReplayListView(contentList: viewModel.replayLiveItems)
                             }
diff --git a/SodaLive/Sources/Live/SectionLatestFinishedLiveView.swift b/SodaLive/Sources/Live/SectionLatestFinishedLiveView.swift
new file mode 100644
index 0000000..83d4514
--- /dev/null
+++ b/SodaLive/Sources/Live/SectionLatestFinishedLiveView.swift
@@ -0,0 +1,68 @@
+//
+//  SectionLatestFinishedLiveView.swift
+//  SodaLive
+//
+//  Created by klaus on 7/22/25.
+//
+
+import SwiftUI
+
+struct SectionLatestFinishedLiveView: View {
+    
+    let items: [GetLatestFinishedLiveResponse]
+    
+    @AppStorage("token") private var token: String = UserDefaults.string(forKey: UserDefaultsKey.token)
+    
+    var body: some View {
+        VStack(alignment: .leading, spacing: 16) {
+            HStack(spacing: 0) {
+                Text("최근")
+                    .font(.custom(Font.preBold.rawValue, size: 24))
+                    .foregroundColor(.button)
+                
+                Text(" 종료한 라이브")
+                    .font(.custom(Font.preBold.rawValue, size: 24))
+                    .foregroundColor(.white)
+            }
+            .padding(.horizontal, 24)
+            
+            ScrollView(.horizontal, showsIndicators: false) {
+                HStack(spacing: 16) {
+                    ForEach(0..<items.count, id: \.self) {
+                        let item = items[$0]
+                        LatestFinishedLiveItemView(item: item)
+                            .onTapGesture {
+                                if !token.trimmingCharacters(in: .whitespacesAndNewlines).isEmpty {
+                                    AppState.shared
+                                        .setAppStep(step: .creatorDetail(userId: item.memberId))
+                                } else {
+                                    AppState.shared
+                                        .setAppStep(step: .login)
+                                }
+                            }
+                    }
+                }
+                .padding(.horizontal, 24)
+            }
+        }
+    }
+}
+
+#Preview {
+    SectionLatestFinishedLiveView(
+        items: [
+            GetLatestFinishedLiveResponse(
+                memberId: 1,
+                nickname: "크리에이터 1",
+                profileImageUrl: "https://cf.sodalive.net/profile/34638/34638-profile-5bfc2bac-3278-48f8-b60c-1294b615f629-8832-1751707083877",
+                timeAgo: "5분전"
+            ),
+            GetLatestFinishedLiveResponse(
+                memberId: 2,
+                nickname: "크리에이터 2",
+                profileImageUrl: "https://cf.sodalive.net/profile/34638/34638-profile-5bfc2bac-3278-48f8-b60c-1294b615f629-8832-1751707083877",
+                timeAgo: "1시간전"
+            )
+        ]
+    )
+}