From c440e8abd9bcb2bc6452cb5047059f15f6a69843 Mon Sep 17 00:00:00 2001
From: Yu Sung <hwchon1234@gmail.com>
Date: Sun, 15 Oct 2023 05:50:54 +0900
Subject: [PATCH] =?UTF-8?q?=EC=BD=98=ED=85=90=EC=B8=A0=20=EB=A9=94?=
 =?UTF-8?q?=EC=9D=B8=20-=20=EC=9D=B8=EA=B8=B0=20=EC=BD=98=ED=85=90?=
 =?UTF-8?q?=EC=B8=A0=20=EC=98=81=EC=97=AD=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Content/Main/ContentMainRankingView.swift | 140 ++++++++++++++++++
 .../Content/Main/ContentMainView.swift        |   6 +
 .../Content/Main/ContentMainViewModel.swift   |   2 +
 .../Main/GetAudioContentMainResponse.swift    |  18 +++
 4 files changed, 166 insertions(+)
 create mode 100644 SodaLive/Sources/Content/Main/ContentMainRankingView.swift

diff --git a/SodaLive/Sources/Content/Main/ContentMainRankingView.swift b/SodaLive/Sources/Content/Main/ContentMainRankingView.swift
new file mode 100644
index 0000000..254be0d
--- /dev/null
+++ b/SodaLive/Sources/Content/Main/ContentMainRankingView.swift
@@ -0,0 +1,140 @@
+//
+//  ContentMainRankingView.swift
+//  SodaLive
+//
+//  Created by klaus on 2023/10/15.
+//
+
+import SwiftUI
+import Kingfisher
+
+struct ContentMainRankingView: View {
+    
+    let item: GetAudioContentRanking
+    
+    let rows = [
+        GridItem(.fixed(60), alignment: .leading),
+        GridItem(.fixed(60), alignment: .leading),
+        GridItem(.fixed(60), alignment: .leading)
+    ]
+    
+    var body: some View {
+        VStack(spacing: 0) {
+            HStack(spacing: 0) {
+                Text("인기 콘텐츠")
+                    .font(.custom(Font.bold.rawValue, size: 18.3))
+                    .foregroundColor(Color(hex: "eeeeee"))
+                
+                Spacer()
+                
+                Image("ic_forward")
+                    .onTapGesture {}
+            }
+            
+            VStack(spacing: 8) {
+                Text("\(item.startDate) ~ \(item.endDate)")
+                    .font(.custom(Font.bold.rawValue, size: 14.7))
+                    .foregroundColor(Color(hex: "eeeeee"))
+                
+                Text("※ 인기 콘텐츠의 순위는 매주 업데이트됩니다.")
+                    .font(.custom(Font.light.rawValue, size: 13.3))
+                    .foregroundColor(Color(hex: "bbbbbb"))
+            }
+            .padding(.vertical, 8)
+            .frame(width: screenSize().width - 26.7)
+            .background(Color(hex: "222222"))
+            .padding(.top, 13.3)
+            
+            ScrollView(.horizontal, showsIndicators: false) {
+                LazyHGrid(rows: rows, spacing: 13.3) {
+                    ForEach(0..<item.items.count, id: \.self) { index in
+                        let content = item.items[index]
+                        HStack(spacing: 0) {
+                            KFImage(URL(string: content.coverImageUrl))
+                                .resizable()
+                                .frame(width: 60, height: 60)
+                                .cornerRadius(2.7)
+                            
+                            Text("\(index + 1)")
+                                .font(.custom(Font.bold.rawValue, size: 16.7))
+                                .foregroundColor(Color(hex: "3bb9f1"))
+                                .padding(.horizontal, 12)
+                            
+                            VStack(alignment: .leading, spacing: 8) {
+                                Text(content.title)
+                                    .lineLimit(2)
+                                    .font(.custom(Font.medium.rawValue, size: 13.3))
+                                    .foregroundColor(Color(hex: "d2d2d2"))
+                                
+                                Text(content.creatorNickname)
+                                    .font(.custom(Font.medium.rawValue, size: 11))
+                                    .foregroundColor(Color(hex: "777777"))
+                            }
+                        }
+                        .frame(maxWidth: screenSize().width * 0.66, alignment: .leading)
+                        .onTapGesture {
+                            AppState
+                                .shared
+                                .setAppStep(step: .contentDetail(contentId: content.contentId))
+                        }
+                    }
+                }
+                .frame(height: 207)
+            }
+            .padding(.top, 13.3)
+        }
+    }
+}
+
+struct ContentMainRankingView_Previews: PreviewProvider {
+    static var previews: some View {
+        ContentMainRankingView(
+            item: GetAudioContentRanking(
+                startDate: "2023년 10월 2일",
+                endDate: "10월 9일",
+                items: [
+                    GetAudioContentRankingItem(
+                        contentId: 10,
+                        title: "sdffsfddfs",
+                        coverImageUrl: "https://test-cf.sodalive.net/audio_content_cover/27/27-cover-77e3a23f-23f2-467c-867f-3e6b7e08060c-9136-1696424061456",
+                        themeStr: "커버곡",
+                        price: 10,
+                        duration: "00:30:20",
+                        creatorId: 1,
+                        creatorNickname: "ㄹㄴ어ㅏㅣㅇㄴ런아ㅣ"
+                    ),
+                    GetAudioContentRankingItem(
+                        contentId: 10,
+                        title: "sdffsfddfs",
+                        coverImageUrl: "https://test-cf.sodalive.net/audio_content_cover/27/27-cover-77e3a23f-23f2-467c-867f-3e6b7e08060c-9136-1696424061456",
+                        themeStr: "커버곡",
+                        price: 10,
+                        duration: "00:30:20",
+                        creatorId: 1,
+                        creatorNickname: "ㄹㄴ어ㅏㅣㅇㄴ런아ㅣ"
+                    ),
+                    GetAudioContentRankingItem(
+                        contentId: 10,
+                        title: "sdffsfddfs",
+                        coverImageUrl: "https://test-cf.sodalive.net/audio_content_cover/27/27-cover-77e3a23f-23f2-467c-867f-3e6b7e08060c-9136-1696424061456",
+                        themeStr: "커버곡",
+                        price: 10,
+                        duration: "00:30:20",
+                        creatorId: 1,
+                        creatorNickname: "ㄹㄴ어ㅏㅣㅇㄴ런아ㅣ"
+                    ),
+                    GetAudioContentRankingItem(
+                        contentId: 10,
+                        title: "sdffsfddfs",
+                        coverImageUrl: "https://test-cf.sodalive.net/audio_content_cover/27/27-cover-77e3a23f-23f2-467c-867f-3e6b7e08060c-9136-1696424061456",
+                        themeStr: "커버곡",
+                        price: 10,
+                        duration: "00:30:20",
+                        creatorId: 1,
+                        creatorNickname: "ㄹㄴ어ㅏㅣㅇㄴ런아ㅣ"
+                    ),
+                ]
+            )
+        )
+    }
+}
diff --git a/SodaLive/Sources/Content/Main/ContentMainView.swift b/SodaLive/Sources/Content/Main/ContentMainView.swift
index 44f05f3..d9d11b9 100644
--- a/SodaLive/Sources/Content/Main/ContentMainView.swift
+++ b/SodaLive/Sources/Content/Main/ContentMainView.swift
@@ -55,6 +55,12 @@ struct ContentMainView: View {
                     )
                     .padding(.horizontal, 13.3)
                     
+                    if let contentRanking = viewModel.contentRanking {
+                        ContentMainRankingView(item: contentRanking)
+                            .padding(.top, 40)
+                            .padding(.horizontal, 13.3)
+                    }
+                    
                     if viewModel.curationList.count > 0 {
                         ContentMainCurationView(items: viewModel.curationList)
                             .padding(.top, 40)
diff --git a/SodaLive/Sources/Content/Main/ContentMainViewModel.swift b/SodaLive/Sources/Content/Main/ContentMainViewModel.swift
index 06480e1..98d4d2e 100644
--- a/SodaLive/Sources/Content/Main/ContentMainViewModel.swift
+++ b/SodaLive/Sources/Content/Main/ContentMainViewModel.swift
@@ -24,6 +24,7 @@ final class ContentMainViewModel: ObservableObject {
     @Published var orderList = [GetAudioContentMainItem]()
     @Published var themeList = [String]()
     @Published var curationList = [GetAudioContentCurationResponse]()
+    @Published var contentRanking: GetAudioContentRanking? = nil
     
     @Published var selectedTheme = "전체" {
         didSet {
@@ -64,6 +65,7 @@ final class ContentMainViewModel: ObservableObject {
                         self.bannerList.append(contentsOf: data.bannerList)
                         self.orderList.append(contentsOf: data.orderList)
                         self.curationList.append(contentsOf: data.curationList)
+                        self.contentRanking = data.contentRanking
                         
                         self.themeList.append("전체")
                         self.themeList.append(contentsOf: data.themeList)
diff --git a/SodaLive/Sources/Content/Main/GetAudioContentMainResponse.swift b/SodaLive/Sources/Content/Main/GetAudioContentMainResponse.swift
index 6c1692d..2a3da3f 100644
--- a/SodaLive/Sources/Content/Main/GetAudioContentMainResponse.swift
+++ b/SodaLive/Sources/Content/Main/GetAudioContentMainResponse.swift
@@ -14,6 +14,24 @@ struct GetAudioContentMainResponse: Decodable {
     let themeList: [String]
     let newContentList: [GetAudioContentMainItem]
     let curationList: [GetAudioContentCurationResponse]
+    let contentRanking: GetAudioContentRanking
+}
+
+struct GetAudioContentRanking: Decodable {
+    let startDate: String
+    let endDate: String
+    let items: [GetAudioContentRankingItem]
+}
+
+struct GetAudioContentRankingItem: Decodable {
+    let contentId: Int
+    let title: String
+    let coverImageUrl: String
+    let themeStr: String
+    let price: Int
+    let duration: String
+    let creatorId: Int
+    let creatorNickname: String
 }
 
 struct GetNewContentUploadCreator: Decodable {