탐색 - 크리에이터 랭킹 UI 추가

SodaLive/Sources/Content/Detail/ContentDetailView.swift

@@ -7,7 +7,6 @@
 
 import SwiftUI
 import Kingfisher
-import GoogleMobileAds
 import RefreshableScrollView
 
 struct ContentDetailView: View {

SodaLive/Sources/Content/Main/ContentMainView.swift

@@ -6,7 +6,6 @@
 //
 
 import SwiftUI
-import GoogleMobileAds
 import RefreshableScrollView
 
 struct ContentMainView: View {

SodaLive/Sources/Explorer/ExplorerSectionView.swift

@@ -0,0 +1,137 @@
+//
+//  ExplorerSectionView.swift
+//  SodaLive
+//
+//  Created by klaus on 2023/10/14.
+//
+
+import SwiftUI
+import Kingfisher
+
+struct ExplorerSectionView: View {
+    
+    let section: GetExplorerSectionResponse
+    let rankingCrawns = ["ic_crown_1", "ic_crown_2", "ic_crown_3"]
+    let rankingColors = [
+        [Color(hex: "ffdc00"), Color(hex: "ffb600")],
+        [Color(hex: "ffffff"), Color(hex: "9f9f9f")],
+        [Color(hex: "e6a77a"), Color(hex: "c67e4a")],
+        [Color(hex: "ffffff").opacity(0), Color(hex: "ffffff").opacity(0)]
+    ]
+    
+    var body: some View {
+        VStack(alignment: .leading, spacing: 13.3) {
+            VStack(alignment: .leading, spacing: 4) {
+                if let coloredTitle = section.coloredTitle, let color = section.color {
+                    let titleArray = section.title.components(separatedBy: coloredTitle)
+                    HStack(spacing: 0) {
+                        Text(titleArray[0])
+                            .font(.custom(Font.bold.rawValue, size: 18.3))
+                            .foregroundColor(Color(hex: "eeeeee"))
+                        
+                        Text(coloredTitle)
+                            .font(.custom(Font.bold.rawValue, size: 18.3))
+                            .foregroundColor(Color(hex: color))
+                        
+                        if titleArray.count > 1 {
+                            Text(titleArray[1])
+                                .font(.custom(Font.bold.rawValue, size: 18.3))
+                                .foregroundColor(Color(hex: "eeeeee"))
+                        }
+                    }
+                } else {
+                    Text(section.title)
+                        .font(.custom(Font.bold.rawValue, size: 18.3))
+                        .foregroundColor(Color(hex: "eeeeee"))
+                }
+                
+                if let desc = section.desc {
+                    Text(desc)
+                        .font(.custom(Font.medium.rawValue, size: 11))
+                        .foregroundColor(Color(hex: "777777"))
+                }
+            }
+            .frame(width: screenSize().width - 26.7, alignment: .leading)
+            
+            ScrollView(.horizontal, showsIndicators: false) {
+                HStack(spacing: 13.3) {
+                    ForEach(0..<section.creators.count, id: \.self) { index in
+                        let creator = section.creators[index]
+                        VStack(spacing: 0) {
+                            if let desc = section.desc {
+                                ZStack {
+                                    KFImage(URL(string: creator.profileImageUrl))
+                                        .cancelOnDisappear(true)
+                                        .downsampling(size: CGSize(width: 90, height: 90))
+                                        .resizable()
+                                        .clipShape(Circle())
+                                        .frame(width: 90, height: 90)
+                                        .overlay(
+                                            Circle()
+                                                .stroke(
+                                                    AngularGradient(colors: rankingColors[index < 4 ? index : 3], center: .center),
+                                                    lineWidth: 3
+                                                )
+                                        )
+                                    
+                                    if index < 3 {
+                                        VStack(alignment: .trailing, spacing: 0) {
+                                            Spacer()
+                                            
+                                            Image(rankingCrawns[index])
+                                                .resizable()
+                                                .frame(width: 37, height: 37)
+                                        }
+                                        .frame(width: 93.3, height: 93.3, alignment: .trailing)
+                                    }
+                                }
+                                .frame(width: 93.3, height: 93.3)
+                            } else {
+                                KFImage(URL(string: creator.profileImageUrl))
+                                    .cancelOnDisappear(true)
+                                    .downsampling(size: CGSize(width: 93, height: 93))
+                                    .resizable()
+                                    .clipShape(Circle())
+                                    .frame(width: 93, height: 93)
+                            }
+                            
+                            Text(creator.nickname)
+                                .font(.custom(Font.medium.rawValue, size: 11.3))
+                                .foregroundColor(Color(hex: "eeeeee"))
+                                .lineLimit(1)
+                                .frame(width: 93.3)
+                                .padding(.top, 13.3)
+                            
+                            Text(creator.tags)
+                                .font(.custom(Font.medium.rawValue, size: 10))
+                                .foregroundColor(Color(hex: "9970ff"))
+                                .lineLimit(1)
+                                .frame(width: 93.3)
+                                .padding(.top, 3.3)
+                        }
+                        .contentShape(Rectangle())
+                        .onTapGesture {
+                            AppState.shared
+                                .setAppStep(step: .creatorDetail(userId: creator.id))
+                        }
+                    }
+                }
+            }
+            .frame(width: screenSize().width - 26.7, alignment: .leading)
+        }
+    }
+}
+
+struct ExplorerSectionView_Previews: PreviewProvider {
+    static var previews: some View {
+        ExplorerSectionView(
+            section: GetExplorerSectionResponse(
+                title: "",
+                coloredTitle: nil,
+                color: nil,
+                desc: nil,
+                creators: []
+            )
+        )
+    }
+}

SodaLive/Sources/Explorer/ExplorerView.swift

@@ -7,7 +7,6 @@
 
 import SwiftUI
 import Kingfisher
-import GoogleMobileAds
 
 struct ExplorerView: View {
     
@@ -85,68 +84,7 @@ struct ExplorerView: View {
                         ScrollView(.vertical, showsIndicators: false) {
                             VStack(spacing: 26.7) {
                                 ForEach(0..<viewModel.explorerSections.count, id: \.self) { index in
-                                    let section = viewModel.explorerSections[index]
+                                    ExplorerSectionView(section: viewModel.explorerSections[index])
-                                    VStack(alignment: .leading, spacing: 13.3) {
-                                        if let coloredTitle = section.coloredTitle, let color = section.color {
-                                            let titleArray = section.title.components(separatedBy: coloredTitle)
-                                            HStack(spacing: 0) {
-                                                Text(titleArray[0])
-                                                    .font(.custom(Font.bold.rawValue, size: 18.3))
-                                                    .foregroundColor(Color(hex: "eeeeee"))
-                                                
-                                                Text(coloredTitle)
-                                                    .font(.custom(Font.bold.rawValue, size: 18.3))
-                                                    .foregroundColor(Color(hex: color))
-                                                
-                                                if titleArray.count > 1 {
-                                                    Text(titleArray[1])
-                                                        .font(.custom(Font.bold.rawValue, size: 18.3))
-                                                        .foregroundColor(Color(hex: "eeeeee"))
-                                                }
-                                            }
-                                            .frame(width: screenSize().width - 26.7, alignment: .leading)
-                                        } else {
-                                            Text(section.title)
-                                                .font(.custom(Font.bold.rawValue, size: 18.3))
-                                                .foregroundColor(Color(hex: "eeeeee"))
-                                                .frame(width: screenSize().width - 26.7, alignment: .leading)
-                                        }
-                                        
-                                        ScrollView(.horizontal, showsIndicators: false) {
-                                            HStack(spacing: 13.3) {
-                                                ForEach(section.creators, id: \.self) { creator in
-                                                    VStack(spacing: 0) {
-                                                        KFImage(URL(string: creator.profileImageUrl))
-                                                            .cancelOnDisappear(true)
-                                                            .downsampling(size: CGSize(width: 93.3, height: 93.3))
-                                                            .resizable()
-                                                            .frame(width: 93.3, height: 93.3)
-                                                            .clipShape(Circle())
-                                                        
-                                                        Text(creator.nickname)
-                                                            .font(.custom(Font.medium.rawValue, size: 11.3))
-                                                            .foregroundColor(Color(hex: "eeeeee"))
-                                                            .lineLimit(1)
-                                                            .frame(width: 93.3)
-                                                            .padding(.top, 13.3)
-                                                        
-                                                        Text(creator.tags)
-                                                            .font(.custom(Font.medium.rawValue, size: 10))
-                                                            .foregroundColor(Color(hex: "9970ff"))
-                                                            .lineLimit(1)
-                                                            .frame(width: 93.3)
-                                                            .padding(.top, 3.3)
-                                                    }
-                                                    .contentShape(Rectangle())
-                                                    .onTapGesture {
-                                                        AppState.shared
-                                                            .setAppStep(step: .creatorDetail(userId: creator.id))
-                                                    }
-                                                }
-                                            }
-                                        }
-                                        .frame(width: screenSize().width - 26.7, alignment: .leading)
-                                    }
                                 }
                             }
                             .padding(.vertical, 40)

SodaLive/Sources/Explorer/GetExplorerResponse.swift

@@ -15,6 +15,7 @@ struct GetExplorerSectionResponse: Decodable, Hashable {
     let title: String
     let coloredTitle: String?
     let color: String?
+    let desc: String?
     let creators: [GetExplorerSectionCreatorResponse]
 }
 

SodaLive/Sources/Live/Room/LiveRoomView.swift

@@ -8,7 +8,6 @@
 import SwiftUI
 import Kingfisher
 import PopupView
-import GoogleMobileAds
 
 struct LiveRoomView: View {
     @State private var isShowingNewChat = false