라이브 상세

- 크리에이터는 예약자(참여자) 표시

Podfile.lock

@@ -51,4 +51,4 @@ SPEC CHECKSUMS:
 
 PODFILE CHECKSUM: cdff30c96e85662f4de75ddd8d54358311c1e629
 
-COCOAPODS: 1.12.1
+COCOAPODS: 1.14.3

SodaLive.xcworkspace/xcshareddata/swiftpm/Package.resolved

@@ -180,6 +180,24 @@
         "version" : "6.6.0"
       }
     },
+    {
+      "identity" : "sdwebimage",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/SDWebImage/SDWebImage.git",
+      "state" : {
+        "revision" : "59730af512c06fb569c119d737df4c1c499e001d",
+        "version" : "5.18.10"
+      }
+    },
+    {
+      "identity" : "sdwebimageswiftui",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/SDWebImage/SDWebImageSwiftUI.git",
+      "state" : {
+        "revision" : "261b6cec35686d2dc192b809ab50742b4502a73b",
+        "version" : "2.2.6"
+      }
+    },
     {
       "identity" : "swift-protobuf",
       "kind" : "remoteSourceControl",

SodaLive/Resources/Assets.xcassets/btn_add.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "btn_add.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/btn_minus_round_rect.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "btn_minus_round_rect.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/btn_plus_round_rect.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "btn_plus_round_rect.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/ic_card_can_gray.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "ic_card_can_gray.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/ic_card_time_small_gray.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "ic_card_time_small_gray.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/ic_coupon.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "ic_coupon.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/ic_logo2.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "ic_logo2.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/ic_notice_triangle.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "ic_notice_triangle.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/ic_pin.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "ic_pin.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/ic_pin_cancel.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "ic_pin_cancel.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/ic_refresh.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "ic_refresh.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/ic_roulette.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "ic_roulette.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/ic_roulette_settings.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "ic_roulette_settings.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/ic_short_play.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "ic_short_play.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/ic_thumb_play_blue.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "ic_thumb_play_blue.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/ic_trash_can.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "ic_trash_can.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/img_sample.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "img_sample.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/splash/splash_bg_2024.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "splash_bg_2024.jpg",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/splash/splash_logo_2024.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "splash_logo_2024.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Resources/Assets.xcassets/splash/splash_logo_dragon_2024.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "splash_logo_dragon_2024.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

SodaLive/Sources/App/AppStep.swift

@@ -72,8 +72,6 @@ enum AppStep {
     
     case userProfileFanTalkAll(userId: Int)
     
-    case creatorNoticeWrite(notice: String)
-    
     case createLive(
         timeSettingMode: LiveRoomCreateViewModel.TimeSettingMode,
         onSuccess: (CreateLiveRoomResponse) -> Void
@@ -113,4 +111,14 @@ enum AppStep {
     case curationAll(title: String, curationId: Int)
     
     case contentRankingAll
+    
+    case creatorCommunityAll(creatorId: Int)
+    
+    case creatorCommunityWrite(onSuccess: () -> Void)
+    
+    case creatorCommunityModify(postId: Int, onSuccess: () -> Void)
+    
+    case canCoupon
+    
+    case contentAllByTheme(themeId: Int)
 }

SodaLive/Sources/Content/All/ByTheme/ContentAllByThemeView.swift

@@ -0,0 +1,111 @@
+//
+//  ContentAllByThemeView.swift
+//  SodaLive
+//
+//  Created by klaus on 2/14/24.
+//
+
+import SwiftUI
+
+struct ContentAllByThemeView: View {
+    @StateObject var viewModel = ContentAllByThemeViewModel()
+    
+    let themeId: Int
+    
+    let columns = [
+        GridItem(.flexible(), alignment: .top),
+        GridItem(.flexible(), alignment: .top),
+        GridItem(.flexible(), alignment: .top)
+    ]
+    
+    var body: some View {
+        NavigationView {
+            BaseView(isLoading: $viewModel.isLoading) {
+                VStack(alignment: .leading, spacing: 0) {
+                    DetailNavigationBar(title: viewModel.theme)
+                    
+                    HStack(spacing: 13.3) {
+                        Spacer()
+                        
+                        Text("최신순")
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .foregroundColor(
+                                Color(hex: "e2e2e2")
+                                    .opacity(viewModel.sort == .NEWEST ? 1 : 0.5)
+                            )
+                            .onTapGesture {
+                                if viewModel.sort != .NEWEST {
+                                    viewModel.sort = .NEWEST
+                                }
+                            }
+                        
+                        Text("높은 가격순")
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .foregroundColor(
+                                Color(hex: "e2e2e2")
+                                    .opacity(viewModel.sort == .PRICE_HIGH ? 1 : 0.5)
+                            )
+                            .onTapGesture {
+                                if viewModel.sort != .PRICE_HIGH {
+                                    viewModel.sort = .PRICE_HIGH
+                                }
+                            }
+                        
+                        Text("낮은 가격순")
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .foregroundColor(
+                                Color(hex: "e2e2e2")
+                                    .opacity(viewModel.sort == .PRICE_LOW ? 1 : 0.5)
+                            )
+                            .onTapGesture {
+                                if viewModel.sort != .PRICE_LOW {
+                                    viewModel.sort = .PRICE_LOW
+                                }
+                            }
+                    }
+                    .padding(.vertical, 13.3)
+                    .padding(.horizontal, 20)
+                    .background(Color(hex: "161616"))
+                    .padding(.top, 13.3)
+                    
+                    HStack(spacing: 0) {
+                        Text("전체")
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .foregroundColor(Color(hex: "e2e2e2"))
+                        
+                        Text("\(viewModel.totalCount)")
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .foregroundColor(Color(hex: "ff5c49"))
+                            .padding(.leading, 8)
+                        
+                        Text("개")
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .foregroundColor(Color(hex: "e2e2e2"))
+                            .padding(.leading, 2)
+                        
+                        Spacer()
+                    }
+                    .padding(.vertical, 13.3)
+                    .padding(.horizontal, 20)
+                    
+                    ScrollView(.vertical, showsIndicators: false) {
+                        LazyVGrid(columns: columns, spacing: 13.3) {
+                            ForEach(0..<viewModel.contentList.count, id: \.self) { index in
+                                ContentNewAllItemView(item: viewModel.contentList[index])
+                                    .onAppear {
+                                        if index == viewModel.contentList.count - 1 {
+                                            viewModel.getContentList()
+                                        }
+                                    }
+                            }
+                        }
+                    }
+                }
+                .onAppear {
+                    viewModel.themeId = themeId
+                    viewModel.getContentList()
+                }
+            }
+        }
+    }
+}

SodaLive/Sources/Content/All/ByTheme/ContentAllByThemeViewModel.swift

@@ -0,0 +1,96 @@
+//
+//  ContentAllByThemeViewModel.swift
+//  SodaLive
+//
+//  Created by klaus on 2/14/24.
+//
+
+import Foundation
+import Combine
+
+final class ContentAllByThemeViewModel: ObservableObject {
+    enum Sort: String {
+        case NEWEST, PRICE_HIGH, PRICE_LOW
+    }
+    
+    private let repository = ContentRepository()
+    private var subscription = Set<AnyCancellable>()
+    
+    @Published var errorMessage = ""
+    @Published var isShowPopup = false
+    @Published var isLoading = false
+    
+    @Published var theme = ""
+    @Published var totalCount = 0
+    @Published var sort = Sort.NEWEST {
+        didSet {
+            page = 1
+            isLast = false
+            getContentList()
+        }
+    }
+    
+    @Published var contentList: [GetAudioContentMainItem] = []
+    
+    var themeId = 0
+    var page = 1
+    var isLast = false
+    private let pageSize = 10
+    
+    func getContentList() {
+        if (!isLast && !isLoading) {
+            isLoading = true
+            
+            repository.getAudioContentByTheme(
+                themeId: themeId,
+                page: page,
+                size: pageSize,
+                sort: sort
+            )
+            .sink { result in
+                switch result {
+                case .finished:
+                    DEBUG_LOG("finish")
+                case .failure(let error):
+                    ERROR_LOG(error.localizedDescription)
+                }
+            } receiveValue: { [unowned self] response in
+                let responseData = response.data
+                
+                do {
+                    let jsonDecoder = JSONDecoder()
+                    let decoded = try jsonDecoder.decode(ApiResponse<GetContentByThemeResponse>.self, from: responseData)
+                    
+                    if let data = decoded.data, decoded.success {
+                        if page == 1 {
+                            self.contentList.removeAll()
+                        }
+                        
+                        if !data.items.isEmpty {
+                            page += 1
+                            self.theme = data.theme
+                            self.totalCount = data.totalCount
+                            self.contentList.append(contentsOf: data.items)
+                        } else {
+                            isLast = true
+                        }
+                    } else {
+                        if let message = decoded.message {
+                            self.errorMessage = message
+                        } else {
+                            self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
+                        }
+                        
+                        self.isShowPopup = true
+                    }
+                } catch {
+                    self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
+                    self.isShowPopup = true
+                }
+                
+                self.isLoading = false
+            }
+            .store(in: &subscription)
+        }
+    }
+}

SodaLive/Sources/Content/All/ByTheme/GetContentByThemeResponse.swift

@@ -0,0 +1,14 @@
+//
+//  GetContentByThemeResponse.swift
+//  SodaLive
+//
+//  Created by klaus on 2/14/24.
+//
+
+import Foundation
+
+struct GetContentByThemeResponse: Decodable {
+    let theme: String
+    let totalCount: Int
+    let items: [GetAudioContentMainItem]
+}

SodaLive/Sources/Content/All/ContentNewAllItemView.swift

@@ -15,40 +15,86 @@ struct ContentNewAllItemView: View {
     @State var width: CGFloat = 0
     
     var body: some View {
-        VStack(alignment: .leading, spacing: 8) {
+        NavigationLink {
-            KFImage(URL(string: item.coverImageUrl))
+            ContentDetailView(contentId: item.contentId)
-                .resizable()
+        } label: {
-                .scaledToFill()
+            VStack(alignment: .leading, spacing: 8) {
-                .frame(width: width, height: width, alignment: .top)
+                ZStack(alignment: .bottom) {
-                .cornerRadius(2.7)
+                    KFImage(URL(string: item.coverImageUrl))
+                        .resizable()
+                        .scaledToFill()
+                        .frame(width: width, height: width, alignment: .top)
+                        .cornerRadius(2.7)
                     
-            Text(item.title)
+                    VStack(spacing: 0) {
-                .font(.custom(Font.medium.rawValue, size: 13.3))
+                        Spacer()
-                .foregroundColor(Color(hex: "d2d2d2"))
-                .frame(width: width, alignment: .leading)
-                .multilineTextAlignment(.leading)
-                .fixedSize(horizontal: false, vertical: true)
-                .lineLimit(2)
                         
-            HStack(spacing: 5.3) {
+                        HStack(spacing: 0) {
-                KFImage(URL(string: item.creatorProfileImageUrl))
+                            HStack(spacing: 2) {
-                    .resizable()
+                                if item.price > 0 {
-                    .scaledToFill()
+                                    Image("ic_card_can_gray")
-                    .frame(width: 21.3, height: 21.3)
-                    .clipShape(Circle())
-                    .onTapGesture { AppState.shared.setAppStep(step: .creatorDetail(userId: item.creatorId)) }
                                     
-                Text(item.creatorNickname)
+                                    Text("\(item.price)")
-                    .font(.custom(Font.medium.rawValue, size: 12))
+                                        .font(.custom(Font.medium.rawValue, size: 8.3))
-                    .foregroundColor(Color(hex: "777777"))
+                                        .foregroundColor(Color.white)
-                    .lineLimit(1)
+                                } else {
+                                    Text("무료")
+                                        .font(.custom(Font.medium.rawValue, size: 8.3))
+                                        .foregroundColor(Color.white)
+                                }
+                            }
+                            .padding(3)
+                            .background(Color(hex: "333333").opacity(0.7))
+                            .cornerRadius(10)
+                            .padding(.leading, 2.7)
+                            .padding(.bottom, 2.7)
+                            
+                            Spacer()
+                            
+                            HStack(spacing: 2) {
+                                Image("ic_card_time_small_gray")
+                                
+                                Text(item.duration)
+                                    .font(.custom(Font.medium.rawValue, size: 8.3))
+                                    .foregroundColor(Color.white)
+                            }
+                            .padding(3)
+                            .background(Color(hex: "333333").opacity(0.7))
+                            .cornerRadius(10)
+                            .padding(.trailing, 2.7)
+                            .padding(.bottom, 2.7)
+                        }
+                    }
+                }
+                .frame(width: width, height: width)
+                
+                Text(item.title)
+                    .font(.custom(Font.medium.rawValue, size: 13.3))
+                    .foregroundColor(Color(hex: "d2d2d2"))
+                    .frame(width: width, alignment: .leading)
+                    .multilineTextAlignment(.leading)
+                    .fixedSize(horizontal: false, vertical: true)
+                    .lineLimit(2)
+                
+                HStack(spacing: 5.3) {
+                    KFImage(URL(string: item.creatorProfileImageUrl))
+                        .resizable()
+                        .scaledToFill()
+                        .frame(width: 21.3, height: 21.3)
+                        .clipShape(Circle())
+                        .onTapGesture { AppState.shared.setAppStep(step: .creatorDetail(userId: item.creatorId)) }
+                    
+                    Text(item.creatorNickname)
+                        .font(.custom(Font.medium.rawValue, size: 12))
+                        .foregroundColor(Color(hex: "777777"))
+                        .lineLimit(1)
+                }
+                .padding(.bottom, 10)
+            }
+            .frame(width: width)
+            .onAppear {
+                width = (screenSize().width - 54) / 3
             }
-            .padding(.bottom, 10)
-        }
-        .frame(width: width)
-        .onTapGesture { AppState.shared.setAppStep(step: .contentDetail(contentId: item.contentId)) }
-        .onAppear {
-            width = (screenSize().width - 40) / 2
         }
     }
 }

SodaLive/Sources/Content/All/ContentNewAllView.swift

@@ -12,68 +12,69 @@ struct ContentNewAllView: View {
     @StateObject var viewModel = ContentNewAllViewModel()
     
     let columns = [
+        GridItem(.flexible(), alignment: .top),
         GridItem(.flexible(), alignment: .top),
         GridItem(.flexible(), alignment: .top)
     ]
     
     var body: some View {
-        BaseView(isLoading: $viewModel.isLoading) {
+        NavigationView {
-            VStack(spacing: 0) {
+            BaseView(isLoading: $viewModel.isLoading) {
-                DetailNavigationBar(title: "새로운 콘텐츠")
+                VStack(alignment: .leading, spacing: 0) {
+                    DetailNavigationBar(title: "새로운 콘텐츠")
                     
-                Text("※ 최근 2주간 등록된 새로운 콘텐츠 입니다.")
+                    Text("※ 최근 2주간 등록된 새로운 콘텐츠 입니다.")
-                    .font(.custom(Font.medium.rawValue, size: 14.7))
+                        .font(.custom(Font.medium.rawValue, size: 14.7))
-                    .foregroundColor(Color(hex: "bbbbbb"))
+                        .foregroundColor(Color(hex: "bbbbbb"))
-                    .padding(.horizontal, 13.3)
+                        .padding(.horizontal, 13.3)
-                    .padding(.vertical, 8)
+                        .padding(.vertical, 8)
-                    .frame(width: screenSize().width, alignment: .leading)
+                        .frame(width: screenSize().width, alignment: .leading)
-                    .background(Color(hex: "222222"))
+                        .background(Color(hex: "222222"))
-                    .padding(.top, 13.3)
+                        .padding(.top, 13.3)
                     
-                ContentMainNewContentThemeView(
+                    ContentMainNewContentThemeView(
-                    themes: viewModel.themeList,
+                        themes: viewModel.themeList,
-                    selectTheme: {
+                        selectTheme: {
-                        viewModel.selectedTheme = $0
+                            viewModel.selectedTheme = $0
-                    },
+                        },
-                    selectedTheme: $viewModel.selectedTheme
+                        selectedTheme: $viewModel.selectedTheme
-                ).padding(.top, 13.3)
+                    ).padding(.top, 13.3)
                     
-                HStack(spacing: 0) {
+                    HStack(spacing: 0) {
-                    Text("전체")
+                        Text("전체")
-                        .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
-                        .foregroundColor(Color(hex: "e2e2e2"))
+                            .foregroundColor(Color(hex: "e2e2e2"))
                         
-                    Text("\(viewModel.totalCount)")
+                        Text("\(viewModel.totalCount)")
-                        .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
-                        .foregroundColor(Color(hex: "ff5c49"))
+                            .foregroundColor(Color(hex: "ff5c49"))
-                        .padding(.leading, 8)
+                            .padding(.leading, 8)
                         
-                    Text("개")
+                        Text("개")
-                        .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
-                        .foregroundColor(Color(hex: "e2e2e2"))
+                            .foregroundColor(Color(hex: "e2e2e2"))
-                        .padding(.leading, 2)
+                            .padding(.leading, 2)
+                    }
+                    .padding(.vertical, 13.3)
+                    .padding(.horizontal, 20)
                     
-                    Spacer()
+                    ScrollView(.vertical, showsIndicators: false) {
-                }
+                        LazyVGrid(columns: columns, spacing: 13.3) {
-                .padding(.vertical, 13.3)
+                            ForEach(0..<viewModel.newContentList.count, id: \.self) { index in
-                .padding(.horizontal, 20)
+                                ContentNewAllItemView(item: viewModel.newContentList[index])
-                
+                                    .onAppear {
-                ScrollView(.vertical, showsIndicators: false) {
+                                        if index == viewModel.newContentList.count - 1 {
-                    LazyVGrid(columns: columns, spacing: 13.3) {
+                                            viewModel.getNewContentList()
-                        ForEach(0..<viewModel.newContentList.count, id: \.self) { index in
+                                        }
-                            ContentNewAllItemView(item: viewModel.newContentList[index])
-                                .onAppear {
-                                    if index == viewModel.newContentList.count - 1 {
-                                        viewModel.getNewContentList()
                                     }
-                                }
+                            }
                         }
                     }
                 }
-            }
+                .onAppear {
-            .onAppear {
+                    viewModel.getThemeList()
-                viewModel.getThemeList()
+                    viewModel.getNewContentList()
-                viewModel.getNewContentList()
+                }
             }
         }
     }

SodaLive/Sources/Content/All/ContentRankingAllView.swift

@@ -13,135 +13,145 @@ struct ContentRankingAllView: View {
     @StateObject var viewModel = ContentRankingAllViewModel()
     
     var body: some View {
-        BaseView(isLoading: $viewModel.isLoading) {
+        NavigationView {
-            VStack(spacing: 0) {
+            BaseView(isLoading: $viewModel.isLoading) {
-                DetailNavigationBar(title: "인기 콘텐츠")
+                VStack(spacing: 0) {
+                    DetailNavigationBar(title: "인기 콘텐츠")
                     
-                VStack(spacing: 8) {
+                    VStack(spacing: 8) {
-                    Text("\(viewModel.dateString)")
+                        Text("\(viewModel.dateString)")
-                        .font(.custom(Font.bold.rawValue, size: 14.7))
+                            .font(.custom(Font.bold.rawValue, size: 14.7))
-                        .foregroundColor(Color(hex: "eeeeee"))
+                            .foregroundColor(Color(hex: "eeeeee"))
                         
-                    Text("※ 인기 콘텐츠의 순위는 매주 업데이트됩니다.")
+                        Text("※ 인기 콘텐츠의 순위는 매주 업데이트됩니다.")
-                        .font(.custom(Font.light.rawValue, size: 13.3))
+                            .font(.custom(Font.light.rawValue, size: 13.3))
-                        .foregroundColor(Color(hex: "bbbbbb"))
+                            .foregroundColor(Color(hex: "bbbbbb"))
-                }
+                    }
-                .padding(.vertical, 8)
+                    .padding(.vertical, 8)
-                .frame(width: screenSize().width - 26.7)
+                    .frame(width: screenSize().width - 26.7)
-                .background(Color(hex: "222222"))
+                    .background(Color(hex: "222222"))
-                .padding(.top, 13.3)
+                    .padding(.top, 13.3)
                     
-                ScrollView(.vertical, showsIndicators: false) {
+                    ContentMainRankingSortView(
-                    VStack(spacing: 20) {
+                        sorts: viewModel.contentRankingSortList,
-                        ForEach(0..<viewModel.contentRankingItemList.count, id: \.self) { index in
+                        selectSort: { viewModel.selectedContentRankingSort = $0 },
-                            let item = viewModel.contentRankingItemList[index]
+                        selectedSort: $viewModel.selectedContentRankingSort
-                            HStack(spacing: 0) {
+                    )
-                                KFImage(URL(string: item.coverImageUrl))
+                    .frame(width: screenSize().width - 26.7)
-                                    .resizable()
+                    .padding(.vertical, 16.7)
-                                    .scaledToFill()
-                                    .frame(width: 66.7, height: 66.7, alignment: .top)
-                                    .clipped()
-                                    .cornerRadius(5.3)
                     
-                                Text("\(index + 1)")
+                    ScrollView(.vertical, showsIndicators: false) {
-                                    .font(.custom(Font.bold.rawValue, size: 16.7))
+                        LazyVStack(spacing: 20) {
-                                    .foregroundColor(Color(hex: "3bb9f1"))
+                            ForEach(0..<viewModel.contentRankingItemList.count, id: \.self) { index in
-                                    .padding(.horizontal, 12)
+                                let item = viewModel.contentRankingItemList[index]
-                                
+                                NavigationLink {
-                                VStack(alignment: .leading, spacing: 0) {
+                                    ContentDetailView(contentId: item.contentId)
-                                    HStack(spacing: 8) {
+                                } label: {
-                                        Text(item.themeStr)
+                                    HStack(spacing: 0) {
-                                            .font(.custom(Font.medium.rawValue, size: 8))
+                                        KFImage(URL(string: item.coverImageUrl))
-                                            .foregroundColor(Color(hex: "3bac6a"))
-                                            .padding(2.6)
-                                            .background(Color(hex: "28312b"))
-                                            .cornerRadius(2.6)
-                                        
-                                        Text(item.duration)
-                                            .font(.custom(Font.medium.rawValue, size: 8))
-                                            .foregroundColor(Color(hex: "777777"))
-                                            .padding(2.6)
-                                            .background(Color(hex: "222222"))
-                                            .cornerRadius(2.6)
-                                    }
-                                    
-                                    Text(item.creatorNickname)
-                                        .font(.custom(Font.medium.rawValue, size: 10.7))
-                                        .foregroundColor(Color(hex: "777777"))
-                                        .padding(.vertical, 8)
-                                    
-                                    Text(item.title)
-                                        .font(.custom(Font.medium.rawValue, size: 12))
-                                        .foregroundColor(Color(hex: "d2d2d2"))
-                                        .lineLimit(2)
-                                        .padding(.top, 2.7)
-                                }
-                                
-                                Spacer()
-                                
-                                if item.price > 0 {
-                                    HStack(spacing: 8) {
-                                        Image("ic_can")
                                             .resizable()
-                                            .frame(width: 17, height: 17)
+                                            .scaledToFill()
+                                            .frame(width: 66.7, height: 66.7, alignment: .top)
+                                            .clipped()
+                                            .cornerRadius(5.3)
                                         
-                                        Text("\(item.price)")
+                                        Text("\(index + 1)")
-                                            .font(.custom(Font.medium.rawValue, size: 12))
+                                            .font(.custom(Font.bold.rawValue, size: 16.7))
-                                            .foregroundColor(Color(hex: "909090"))
+                                            .foregroundColor(Color(hex: "3bb9f1"))
+                                            .padding(.horizontal, 12)
+                                        
+                                        VStack(alignment: .leading, spacing: 0) {
+                                            HStack(spacing: 8) {
+                                                Text(item.themeStr)
+                                                    .font(.custom(Font.medium.rawValue, size: 8))
+                                                    .foregroundColor(Color(hex: "3bac6a"))
+                                                    .padding(2.6)
+                                                    .background(Color(hex: "28312b"))
+                                                    .cornerRadius(2.6)
+                                                
+                                                Text(item.duration)
+                                                    .font(.custom(Font.medium.rawValue, size: 8))
+                                                    .foregroundColor(Color(hex: "777777"))
+                                                    .padding(2.6)
+                                                    .background(Color(hex: "222222"))
+                                                    .cornerRadius(2.6)
+                                            }
+                                            
+                                            Text(item.creatorNickname)
+                                                .font(.custom(Font.medium.rawValue, size: 10.7))
+                                                .foregroundColor(Color(hex: "777777"))
+                                                .padding(.vertical, 8)
+                                            
+                                            Text(item.title)
+                                                .font(.custom(Font.medium.rawValue, size: 12))
+                                                .foregroundColor(Color(hex: "d2d2d2"))
+                                                .lineLimit(2)
+                                                .padding(.top, 2.7)
+                                        }
+                                        
+                                        Spacer()
+                                        
+                                        if item.price > 0 {
+                                            HStack(spacing: 8) {
+                                                Image("ic_can")
+                                                    .resizable()
+                                                    .frame(width: 17, height: 17)
+                                                
+                                                Text("\(item.price)")
+                                                    .font(.custom(Font.medium.rawValue, size: 12))
+                                                    .foregroundColor(Color(hex: "909090"))
+                                            }
+                                        } else {
+                                            Text("무료")
+                                                .font(.custom(Font.medium.rawValue, size: 12))
+                                                .foregroundColor(Color(hex: "ffffff"))
+                                                .padding(.horizontal, 5.3)
+                                                .padding(.vertical, 2.7)
+                                                .background(Color(hex: "cf5c37"))
+                                                .cornerRadius(2.6)
+                                        }
+                                    }
+                                    .frame(height: 66.7)
+                                    .contentShape(Rectangle())
+                                    .onAppear {
+                                        if index == viewModel.contentRankingItemList.count - 1 {
+                                            viewModel.getContentRanking()
+                                        }
                                     }
-                                } else {
-                                    Text("무료")
-                                        .font(.custom(Font.medium.rawValue, size: 12))
-                                        .foregroundColor(Color(hex: "ffffff"))
-                                        .padding(.horizontal, 5.3)
-                                        .padding(.vertical, 2.7)
-                                        .background(Color(hex: "cf5c37"))
-                                        .cornerRadius(2.6)
-                                }
-                            }
-                            .frame(height: 66.7)
-                            .contentShape(Rectangle())
-                            .onTapGesture {
-                                AppState
-                                    .shared
-                                    .setAppStep(step: .contentDetail(contentId: item.contentId))
-                            }
-                            .onAppear {
-                                if index == viewModel.contentRankingItemList.count - 1 {
-                                    viewModel.getContentRanking()
                                 }
                             }
                         }
                     }
+                    .padding(13.3)
                 }
-                .padding(13.3)
-            }
                 
-            if viewModel.isLoading {
+                if viewModel.isLoading {
-                LoadingView()
+                    LoadingView()
-            }
-        }
-        .popup(isPresented: $viewModel.isShowPopup, type: .toast, position: .top, autohideIn: 2) {
-            GeometryReader { geo in
-                HStack {
-                    Spacer()
-                    Text(viewModel.errorMessage)
-                        .padding(.vertical, 13.3)
-                        .padding(.horizontal, 6.7)
-                        .frame(width: geo.size.width - 66.7, alignment: .center)
-                        .font(.custom(Font.medium.rawValue, size: 12))
-                        .background(Color(hex: "9970ff"))
-                        .foregroundColor(Color.white)
-                        .multilineTextAlignment(.leading)
-                        .fixedSize(horizontal: false, vertical: true)
-                        .cornerRadius(20)
-                        .padding(.top, 66.7)
-                    Spacer()
                 }
             }
-        }
+            .popup(isPresented: $viewModel.isShowPopup, type: .toast, position: .top, autohideIn: 2) {
-        .onAppear {
+                GeometryReader { geo in
-            viewModel.getContentRanking()
+                    HStack {
+                        Spacer()
+                        Text(viewModel.errorMessage)
+                            .padding(.vertical, 13.3)
+                            .padding(.horizontal, 6.7)
+                            .frame(width: geo.size.width - 66.7, alignment: .center)
+                            .font(.custom(Font.medium.rawValue, size: 12))
+                            .background(Color(hex: "9970ff"))
+                            .foregroundColor(Color.white)
+                            .multilineTextAlignment(.leading)
+                            .fixedSize(horizontal: false, vertical: true)
+                            .cornerRadius(20)
+                            .padding(.top, 66.7)
+                        Spacer()
+                    }
+                }
+            }
+            .onAppear {
+                viewModel.getContentRankingSortType()
+                viewModel.getContentRanking()
+            }
         }
     }
 }

SodaLive/Sources/Content/All/ContentRankingAllViewModel.swift

@@ -19,6 +19,15 @@ final class ContentRankingAllViewModel: ObservableObject {
     
     @Published var dateString = ""
     @Published var contentRankingItemList = [GetAudioContentRankingItem]()
+    @Published var contentRankingSortList = [String]()
+    
+    @Published var selectedContentRankingSort = "매출" {
+        didSet {
+            page = 1
+            isLast = false
+            getContentRanking()
+        }
+    }
     
     var page = 1
     var isLast = false
@@ -28,7 +37,7 @@ final class ContentRankingAllViewModel: ObservableObject {
         if (!isLast && !isLoading && page <= 5) {
             isLoading = true
             
-            repository.getContentRanking(page: page, size: pageSize)
+            repository.getContentRanking(page: page, size: pageSize, sortType: selectedContentRankingSort)
                 .sink { result in
                     switch result {
                     case .finished:
@@ -76,4 +85,40 @@ final class ContentRankingAllViewModel: ObservableObject {
                 .store(in: &subscription)
         }
     }
+    
+    func getContentRankingSortType() {
+        repository.getContentRankingSortType()
+            .sink { result in
+                switch result {
+                case .finished:
+                    DEBUG_LOG("finish")
+                case .failure(let error):
+                    ERROR_LOG(error.localizedDescription)
+                }
+            } receiveValue: { [unowned self] response in
+                let responseData = response.data
+                
+                do {
+                    let jsonDecoder = JSONDecoder()
+                    let decoded = try jsonDecoder.decode(ApiResponse<[String]>.self, from: responseData)
+                    
+                    if let data = decoded.data, decoded.success {
+                        self.contentRankingSortList.removeAll()
+                        self.contentRankingSortList.append(contentsOf: data)
+                    } else {
+                        if let message = decoded.message {
+                            self.errorMessage = message
+                        } else {
+                            self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
+                        }
+                        
+                        self.isShowPopup = true
+                    }
+                } catch {
+                    self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
+                    self.isShowPopup = true
+                }
+            }
+            .store(in: &subscription)
+    }
 }

SodaLive/Sources/Content/Category/CategoryApi.swift

@@ -0,0 +1,45 @@
+//
+//  CategoryApi.swift
+//  SodaLive
+//
+//  Created by klaus on 2/7/24.
+//
+
+import Foundation
+import Moya
+
+enum CategoryApi {
+    case getCategoryList(creatorId: Int)
+}
+
+extension CategoryApi: TargetType {
+    var baseURL: URL {
+        return URL(string: BASE_URL)!
+    }
+    
+    var path: String {
+        switch self {
+        case .getCategoryList:
+            return "/category"
+        }
+    }
+    
+    var method: Moya.Method {
+        switch self {
+        case .getCategoryList:
+            return .get
+        }
+    }
+    
+    var task: Moya.Task {
+        switch self {
+        case .getCategoryList(let creatorId):
+            let parameters = ["creatorId": creatorId] as [String : Any]
+            return .requestParameters(parameters: parameters, encoding: URLEncoding.queryString)
+        }
+    }
+    
+    var headers: [String : String]? {
+        return ["Authorization": "Bearer \(UserDefaults.string(forKey: UserDefaultsKey.token))"]
+    }
+}

SodaLive/Sources/Content/Category/ContentListCategoryView.swift

@@ -0,0 +1,59 @@
+//
+//  ContentListCategoryView.swift
+//  SodaLive
+//
+//  Created by klaus on 2/7/24.
+//
+
+import SwiftUI
+
+struct ContentListCategoryView: View {
+    let categoryList: [GetCategoryListResponse]
+    let selectCategory: (Int) -> Void
+    
+    @Binding var selectedCategory: String
+    
+    var body: some View {
+        ScrollView(.horizontal, showsIndicators: false) {
+            HStack(spacing: 8) {
+                ForEach(0..<categoryList.count, id: \.self) { index in
+                    let category = categoryList[index]
+                    Text(category.category)
+                        .font(.custom(Font.medium.rawValue, size: 14.7))
+                        .foregroundColor(Color(hex: selectedCategory == category.category ? "3bb9f1" : "777777"))
+                        .padding(.horizontal, 13.3)
+                        .padding(.vertical, 9.3)
+                        .border(
+                            Color(hex: selectedCategory == category.category ? "3bb9f1" : "eeeeee"),
+                            width: 0.5
+                        )
+                        .cornerRadius(16.7)
+                        .overlay(
+                            RoundedRectangle(cornerRadius: CGFloat(16.7))
+                                .stroke(lineWidth: 0.5)
+                                .foregroundColor(Color(hex: selectedCategory == category.category ? "3bb9f1" : "eeeeee"))
+                        )
+                        .onTapGesture {
+                            if selectedCategory != category.category {
+                                selectedCategory = category.category
+                                selectCategory(category.categoryId)
+                            }
+                        }
+                }
+            }
+        }
+    }
+}
+
+#Preview {
+    
+    ContentListCategoryView(
+        categoryList: [
+            GetCategoryListResponse(categoryId: 0, category: "전체"),
+            GetCategoryListResponse(categoryId: 1, category: "test"),
+            GetCategoryListResponse(categoryId: 0, category: "test2")
+        ],
+        selectCategory: { _ in },
+        selectedCategory: .constant("전체")
+    )
+}

SodaLive/Sources/Content/Category/GetCategoryListResponse.swift

@@ -0,0 +1,13 @@
+//
+//  GetCategoryListResponse.swift
+//  SodaLive
+//
+//  Created by klaus on 2/7/24.
+//
+
+import Foundation
+
+struct GetCategoryListResponse: Decodable {
+    let categoryId: Int
+    let category: String
+}

SodaLive/Sources/Content/ContentApi.swift

@@ -9,7 +9,7 @@ import Foundation
 import Moya
 
 enum ContentApi {
-    case getAudioContentList(userId: Int, page: Int, size: Int, sort: ContentListViewModel.Sort)
+    case getAudioContentList(userId: Int, categoryId: Int, page: Int, size: Int, sort: ContentListViewModel.Sort)
     case getAudioContentDetail(audioContentId: Int)
     case likeContent(request: PutAudioContentLikeRequest)
     case registerComment(request: RegisterAudioContentCommentRequest)
@@ -22,14 +22,21 @@ enum ContentApi {
     case getAudioContentCommentReplyList(commentId: Int, page: Int, size: Int)
     case deleteAudioContent(audioContentId: Int)
     case modifyAudioContent(parameters: [MultipartFormData])
-    case getMain
+    case getNewContentUploadCreatorList
+    case getMainBannerList
+    case getMainOrderList
     case getNewContentOfTheme(theme: String)
+    case getCurationList(page: Int, size: Int)
     case donation(request: AudioContentDonationRequest)
     case modifyComment(request: ModifyCommentRequest)
     case getNewContentThemeList
     case getNewContentAllOfTheme(theme: String, page: Int, size: Int)
     case getAudioContentListByCurationId(curationId: Int, page: Int, size: Int, sort: ContentCurationViewModel.Sort)
-    case getContentRanking(page: Int, size: Int)
+    case getContentRanking(page: Int, size: Int, sortType: String)
+    case getContentRankingSortType
+    case pinContent(contentId: Int)
+    case unpinContent(contentId: Int)
+    case getAudioContentByTheme(themeId: Int, page: Int, size: Int, sort: ContentAllByThemeViewModel.Sort)
 }
 
 extension ContentApi: TargetType {
@@ -78,12 +85,21 @@ extension ContentApi: TargetType {
         case .modifyAudioContent:
             return "/audio-content"
             
-        case .getMain:
+        case .getNewContentUploadCreatorList:
-            return "/audio-content/main"
+            return "/audio-content/main/new-content-upload-creator"
+            
+        case .getMainBannerList:
+            return "/audio-content/main/banner-list"
+            
+        case .getMainOrderList:
+            return "/audio-content/main/order-list"
             
         case .getNewContentOfTheme:
             return "/audio-content/main/new"
             
+        case .getCurationList:
+            return "/audio-content/main/curation-list"
+            
         case .donation:
             return "/audio-content/donation"
             
@@ -101,20 +117,36 @@ extension ContentApi: TargetType {
             
         case .getContentRanking:
             return  "/audio-content/ranking"
+            
+        case .getContentRankingSortType:
+            return  "/audio-content/ranking-sort-type"
+            
+        case .pinContent(let contentId):
+            return  "/audio-content/pin-to-the-top/\(contentId)"
+            
+        case .unpinContent(let contentId):
+            return  "/audio-content/unpin-at-the-top/\(contentId)"
+            
+        case .getAudioContentByTheme(let themeId, _, _, _):
+            return "/audio-content/theme/\(themeId)/content"
         }
     }
     
     var method: Moya.Method {
         switch self {
         case .getAudioContentList, .getAudioContentDetail, .getOrderList, .getAudioContentThemeList,
-                .getAudioContentCommentList, .getAudioContentCommentReplyList, .getMain, .getNewContentOfTheme,
+                .getAudioContentCommentList, .getAudioContentCommentReplyList, .getNewContentOfTheme,
-                .getNewContentThemeList, .getNewContentAllOfTheme, .getAudioContentListByCurationId, .getContentRanking:
+                .getNewContentThemeList, .getNewContentAllOfTheme, .getAudioContentListByCurationId, .getContentRanking,
+                .getContentRankingSortType:
             return .get
             
-        case .likeContent, .modifyAudioContent, .modifyComment:
+        case .getMainBannerList, .getMainOrderList, .getNewContentUploadCreatorList, .getCurationList, .getAudioContentByTheme:
+            return .get
+            
+        case .likeContent, .modifyAudioContent, .modifyComment, .unpinContent:
             return .put
             
-        case .registerComment, .orderAudioContent, .addAllPlaybackTracking, .uploadAudioContent, .donation:
+        case .registerComment, .orderAudioContent, .addAllPlaybackTracking, .uploadAudioContent, .donation, .pinContent:
             return .post
             
         case .deleteAudioContent:
@@ -124,9 +156,10 @@ extension ContentApi: TargetType {
     
     var task: Moya.Task {
         switch self {
-        case .getAudioContentList(let userId, let page, let size, let sort):
+        case .getAudioContentList(let userId, let categoryId, let page, let size, let sort):
             let parameters = [
                 "creator-id": userId,
+                "category-id": categoryId,
                 "page": page - 1,
                 "size": size,
                 "sort-type": sort
@@ -158,7 +191,7 @@ extension ContentApi: TargetType {
         case .addAllPlaybackTracking(let request):
             return .requestJSONEncodable(request)
             
-        case .getAudioContentThemeList, .getMain:
+        case .getAudioContentThemeList, .getMainBannerList, .getMainOrderList, .getNewContentUploadCreatorList:
             return .requestPlain
             
         case .uploadAudioContent(let parameters):
@@ -220,10 +253,34 @@ extension ContentApi: TargetType {
             
             return .requestParameters(parameters: parameters, encoding: URLEncoding.queryString)
             
-        case .getContentRanking(let page, let size):
+        case .getContentRanking(let page, let size, let sortType):
             let parameters = [
                 "page": page - 1,
                 "size": size,
+                "sort-type": sortType
+            ] as [String : Any]
+            
+            return .requestParameters(parameters: parameters, encoding: URLEncoding.queryString)
+            
+        case .getContentRankingSortType:
+            return .requestPlain
+            
+        case .getCurationList(let page, let size):
+            let parameters = [
+                "page": page - 1,
+                "size": size
+            ] as [String : Any]
+            
+            return .requestParameters(parameters: parameters, encoding: URLEncoding.queryString)
+            
+        case .pinContent, .unpinContent:
+            return .requestPlain
+            
+        case .getAudioContentByTheme(_, let page, let size, let sort):
+            let parameters = [
+                "page": page - 1,
+                "size": size,
+                "sort-type": sort
             ] as [String : Any]
             
             return .requestParameters(parameters: parameters, encoding: URLEncoding.queryString)

SodaLive/Sources/Content/ContentListItemView.swift

@@ -26,6 +26,15 @@ struct ContentListItemView: View {
                 
                 VStack(alignment: .leading, spacing: 0) {
                     HStack(spacing: 8) {
+                        if item.isScheduledToOpen {
+                            Text("오픈예정")
+                                .font(.custom(Font.medium.rawValue, size: 8))
+                                .foregroundColor(Color(hex: "3bb9f1"))
+                                .padding(2.6)
+                                .background(Color(hex: "003851"))
+                                .cornerRadius(2.6)
+                        }
+                        
                         Text(item.themeStr)
                             .font(.custom(Font.medium.rawValue, size: 8))
                             .foregroundColor(Color(hex: "3bac6a"))
@@ -39,11 +48,18 @@ struct ContentListItemView: View {
                             .padding(2.6)
                             .background(Color(hex: "222222"))
                             .cornerRadius(2.6)
+                        
+                        if item.isPin {
+                            Image("ic_pin")
+                                .resizable()
+                                .frame(width: 13.3, height: 13.3)
+                        }
                     }
                     
                     Text(item.title)
                         .font(.custom(Font.medium.rawValue, size: 12))
                         .foregroundColor(Color(hex: "d2d2d2"))
+                        .multilineTextAlignment(.leading)
                         .padding(.top, 8)
                         .padding(.bottom, 10)
                     
@@ -112,7 +128,9 @@ struct ContentListItemView_Previews: PreviewProvider {
                 duration: "00:04:43",
                 likeCount: 2,
                 commentCount: 0,
-                isAdult: false
+                isPin: true,
+                isAdult: false,
+                isScheduledToOpen: true
             )
         )
     }

SodaLive/Sources/Content/ContentListView.swift

@@ -13,148 +13,158 @@ struct ContentListView: View {
     @StateObject var viewModel = ContentListViewModel()
     
     var body: some View {
-        BaseView(isLoading: $viewModel.isLoading) {
+        NavigationView {
-            VStack(spacing: 0) {
+            BaseView(isLoading: $viewModel.isLoading) {
-                HStack(spacing: 0) {
+                VStack(spacing: 0) {
-                    Button {
+                    HStack(spacing: 0) {
-                        AppState.shared.back()
+                        Button {
-                    } label: {
+                            AppState.shared.back()
-                        Image("ic_back")
+                        } label: {
-                            .resizable()
+                            Image("ic_back")
-                            .frame(width: 20, height: 20)
+                                .resizable()
+                                .frame(width: 20, height: 20)
                             
-                        Text("콘텐츠 전체보기")
+                            Text("콘텐츠 전체보기")
-                            .font(.custom(Font.bold.rawValue, size: 18.3))
+                                .font(.custom(Font.bold.rawValue, size: 18.3))
-                            .foregroundColor(Color(hex: "eeeeee"))
+                                .foregroundColor(Color(hex: "eeeeee"))
+                        }
+                        
+                        Spacer()
                     }
+                    .padding(.horizontal, 13.3)
+                    .frame(height: 50)
+                    .background(Color.black)
                     
-                    Spacer()
+                    if !viewModel.categoryList.isEmpty {
-                }
+                        ContentListCategoryView(
-                .padding(.horizontal, 13.3)
+                            categoryList: viewModel.categoryList,
-                .frame(height: 50)
+                            selectCategory: { viewModel.selectCategory(categoryId: $0) },
-                .background(Color.black)
+                            selectedCategory: $viewModel.selectedCategory
-                
+                        )
-                if userId == UserDefaults.int(forKey: .userId) {
-                    Text("새로운 콘텐츠 등록하기")
-                        .font(.custom(Font.bold.rawValue, size: 15))
-                        .foregroundColor(Color(hex: "eeeeee"))
-                        .padding(.vertical, 17)
-                        .frame(maxWidth: .infinity)
-                        .background(Color(hex: "9970ff"))
-                        .cornerRadius(5.3)
-                        .padding(.top, 13.3)
                         .padding(.horizontal, 13.3)
-                        .onTapGesture { AppState.shared.setAppStep(step: .createContent) }
+                    }
-                }
                     
-                HStack(spacing: 13.3) {
+                    if userId == UserDefaults.int(forKey: .userId) {
-                    Spacer()
+                        Text("새로운 콘텐츠 등록하기")
+                            .font(.custom(Font.bold.rawValue, size: 15))
+                            .foregroundColor(Color(hex: "eeeeee"))
+                            .padding(.vertical, 17)
+                            .frame(maxWidth: .infinity)
+                            .background(Color(hex: "3bb9f1"))
+                            .cornerRadius(5.3)
+                            .padding(.top, 13.3)
+                            .padding(.horizontal, 13.3)
+                            .onTapGesture { AppState.shared.setAppStep(step: .createContent) }
+                    }
                     
-                    Text("최신순")
+                    HStack(spacing: 13.3) {
-                        .font(.custom(Font.medium.rawValue, size: 13.3))
+                        Spacer()
-                        .foregroundColor(
+                        
-                            Color(hex: "e2e2e2")
+                        Text("최신순")
-                                .opacity(viewModel.sort == .NEWEST ? 1 : 0.5)
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
-                        )
+                            .foregroundColor(
-                        .onTapGesture {
+                                Color(hex: "e2e2e2")
-                            if viewModel.sort != .NEWEST {
+                                    .opacity(viewModel.sort == .NEWEST ? 1 : 0.5)
-                                viewModel.sort = .NEWEST
+                            )
+                            .onTapGesture {
+                                if viewModel.sort != .NEWEST {
+                                    viewModel.sort = .NEWEST
+                                }
                             }
-                        }
                         
-                    Text("높은 가격순")
+                        Text("높은 가격순")
-                        .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
-                        .foregroundColor(
+                            .foregroundColor(
-                            Color(hex: "e2e2e2")
+                                Color(hex: "e2e2e2")
-                                .opacity(viewModel.sort == .PRICE_HIGH ? 1 : 0.5)
+                                    .opacity(viewModel.sort == .PRICE_HIGH ? 1 : 0.5)
-                        )
+                            )
-                        .onTapGesture {
+                            .onTapGesture {
-                            if viewModel.sort != .PRICE_HIGH {
+                                if viewModel.sort != .PRICE_HIGH {
-                                viewModel.sort = .PRICE_HIGH
+                                    viewModel.sort = .PRICE_HIGH
+                                }
                             }
-                        }
                         
-                    Text("낮은 가격순")
+                        Text("낮은 가격순")
-                        .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
-                        .foregroundColor(
+                            .foregroundColor(
-                            Color(hex: "e2e2e2")
+                                Color(hex: "e2e2e2")
-                                .opacity(viewModel.sort == .PRICE_LOW ? 1 : 0.5)
+                                    .opacity(viewModel.sort == .PRICE_LOW ? 1 : 0.5)
-                        )
+                            )
-                        .onTapGesture {
+                            .onTapGesture {
-                            if viewModel.sort != .PRICE_LOW {
+                                if viewModel.sort != .PRICE_LOW {
-                                viewModel.sort = .PRICE_LOW
+                                    viewModel.sort = .PRICE_LOW
+                                }
                             }
-                        }
+                    }
-                }
+                    .padding(.vertical, 13.3)
-                .padding(.vertical, 13.3)
+                    .padding(.horizontal, 20)
-                .padding(.horizontal, 20)
+                    .background(Color(hex: "161616"))
-                .background(Color(hex: "161616"))
+                    .padding(.top, 13.3)
-                .padding(.top, 13.3)
                     
-                HStack(spacing: 0) {
+                    HStack(spacing: 0) {
-                    Text("전체")
+                        Text("전체")
-                        .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
-                        .foregroundColor(Color(hex: "e2e2e2"))
+                            .foregroundColor(Color(hex: "e2e2e2"))
                         
-                    Text("\(viewModel.totalCount)")
+                        Text("\(viewModel.totalCount)")
-                        .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
-                        .foregroundColor(Color(hex: "ff5c49"))
+                            .foregroundColor(Color(hex: "ff5c49"))
-                        .padding(.leading, 8)
+                            .padding(.leading, 8)
                         
-                    Text("개")
+                        Text("개")
-                        .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
-                        .foregroundColor(Color(hex: "e2e2e2"))
+                            .foregroundColor(Color(hex: "e2e2e2"))
-                        .padding(.leading, 2)
+                            .padding(.leading, 2)
                         
-                    Spacer()
+                        Spacer()
-                }
+                    }
-                .padding(.vertical, 13.3)
+                    .padding(.vertical, 13.3)
-                .padding(.horizontal, 20)
+                    .padding(.horizontal, 20)
                     
-                ScrollViewReader { reader in
+                    ScrollViewReader { reader in
-                    ScrollView(.vertical, showsIndicators: false) {
+                        ScrollView(.vertical, showsIndicators: false) {
-                        LazyVStack(spacing: 10.7) {
+                            LazyVStack(spacing: 10.7) {
-                            ScrollerToTop(reader: reader, scrollOnChange: $viewModel.scrollToTop)
+                                ScrollerToTop(reader: reader, scrollOnChange: $viewModel.scrollToTop)
                                 
-                            ForEach(0..<viewModel.audioContentList.count, id: \.self) { index in
+                                ForEach(0..<viewModel.audioContentList.count, id: \.self) { index in
-                                let audioContent = viewModel.audioContentList[index]
+                                    let audioContent = viewModel.audioContentList[index]
-                                ContentListItemView(item: audioContent)
+                                    NavigationLink {
-                                    .contentShape(Rectangle())
+                                        ContentDetailView(contentId: audioContent.contentId)
-                                    .onTapGesture {
+                                    } label: {
-                                        AppState
+                                        ContentListItemView(item: audioContent)
-                                            .shared
+                                            .contentShape(Rectangle())
-                                            .setAppStep(
+                                            .onAppear {
-                                                step: .contentDetail(contentId: audioContent.contentId)
+                                                if index == viewModel.audioContentList.count - 1 {
-                                            )
+                                                    viewModel.getAudioContentList()
-                                    }
+                                                }
-                                    .onAppear {
+                                            }
-                                        if index == viewModel.audioContentList.count - 1 {
-                                            viewModel.getAudioContentList()
-                                        }
                                     }
+                                }
                             }
+                            .padding(.horizontal, 13.3)
                         }
                     }
+                    .padding(.top, 13.3)
                 }
-                .padding(.top, 13.3)
+                .onAppear {
-            }
+                    viewModel.userId = userId
-            .onAppear {
+                    viewModel.getCategoryList()
-                viewModel.userId = userId
+                    viewModel.getAudioContentList()
-                viewModel.getAudioContentList()
+                }
-            }
+                .popup(isPresented: $viewModel.isShowPopup, type: .toast, position: .bottom, autohideIn: 2) {
-            .popup(isPresented: $viewModel.isShowPopup, type: .toast, position: .bottom, autohideIn: 2) {
+                    HStack {
-                HStack {
+                        Spacer()
-                    Spacer()
+                        Text(viewModel.errorMessage)
-                    Text(viewModel.errorMessage)
+                            .padding(.vertical, 13.3)
-                        .padding(.vertical, 13.3)
+                            .frame(width: screenSize().width - 66.7, alignment: .center)
-                        .frame(width: screenSize().width - 66.7, alignment: .center)
+                            .font(.custom(Font.medium.rawValue, size: 12))
-                        .font(.custom(Font.medium.rawValue, size: 12))
+                            .background(Color(hex: "3bb9f1"))
-                        .background(Color(hex: "9970ff"))
+                            .foregroundColor(Color.white)
-                        .foregroundColor(Color.white)
+                            .multilineTextAlignment(.leading)
-                        .multilineTextAlignment(.leading)
+                            .cornerRadius(20)
-                        .cornerRadius(20)
+                            .padding(.bottom, 66.7)
-                        .padding(.bottom, 66.7)
+                        Spacer()
-                    Spacer()
+                    }
                 }
             }
         }

SodaLive/Sources/Content/ContentListViewModel.swift

@@ -21,6 +21,7 @@ final class ContentListViewModel: ObservableObject {
     @Published var isShowPopup = false
     @Published var isLoading = false
     
+    @Published var categoryList: [GetCategoryListResponse] = []
     @Published var audioContentList: [GetAudioContentListItem] = []
     @Published var totalCount = 0
     @Published var sort = Sort.NEWEST {
@@ -32,18 +33,20 @@ final class ContentListViewModel: ObservableObject {
     }
     
     @Published var scrollToTop = false
+    @Published var selectedCategory: String = "전체"
     
     var userId = 0
     var page = 1
     var isLast = false
     private let pageSize = 10
+    private var categoryId = 0
     
     func getAudioContentList() {
         if (!isLast && !isLoading) {
             isLoading = true
             
             repository
-                .getAudioContentList(userId: userId, page: page, size: pageSize, sort: sort)
+                .getAudioContentList(userId: userId, categoryId: categoryId, page: page, size: pageSize, sort: sort)
                 .sink { result in
                     switch result {
                     case .finished:
@@ -64,11 +67,11 @@ final class ContentListViewModel: ObservableObject {
                                 self.scrollToTop.toggle()
                             }
                             
-                            if !data.items.isEmpty {
+                            page += 1
-                                page += 1
+                            self.totalCount = data.totalCount
-                                self.totalCount = data.totalCount
+                            self.audioContentList.append(contentsOf: data.items)
-                                self.audioContentList.append(contentsOf: data.items)
+                            
-                            } else {
+                            if data.items.isEmpty {
                                 isLast = true
                             }
                         } else {
@@ -90,4 +93,53 @@ final class ContentListViewModel: ObservableObject {
                 .store(in: &subscription)
         }
     }
+    
+    func getCategoryList() {
+        repository.getCategoryList(creatorId: userId)
+            .sink { result in
+                switch result {
+                case .finished:
+                    DEBUG_LOG("finish")
+                case .failure(let error):
+                    ERROR_LOG(error.localizedDescription)
+                }
+            } receiveValue: { [unowned self] response in
+                let responseData = response.data
+                
+                do {
+                    let jsonDecoder = JSONDecoder()
+                    let decoded = try jsonDecoder.decode(ApiResponse<[GetCategoryListResponse]>.self, from: responseData)
+                    
+                    if let data = decoded.data, decoded.success {
+                        categoryList.removeAll()
+                        
+                        if !data.isEmpty {
+                            categoryList.append(GetCategoryListResponse(categoryId: 0, category: "전체"))
+                            categoryList.append(contentsOf: data)
+                        }
+                    } else {
+                        if let message = decoded.message {
+                            self.errorMessage = message
+                        } else {
+                            self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
+                        }
+                        
+                        self.isShowPopup = true
+                    }
+                }  catch {
+                    print(error)
+                    self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
+                    self.isShowPopup = true
+                }
+            }
+            .store(in: &subscription)
+    }
+    
+    func selectCategory(categoryId: Int) {
+        self.categoryId = categoryId
+        
+        page = 1
+        isLast = false
+        getAudioContentList()
+    }
 }

SodaLive/Sources/Content/ContentRepository.swift

@@ -12,9 +12,10 @@ import Moya
 
 final class ContentRepository {
     private let api = MoyaProvider<ContentApi>()
+    private let categoryApi = MoyaProvider<CategoryApi>()
     
-    func getAudioContentList(userId: Int, page: Int, size: Int, sort: ContentListViewModel.Sort) -> AnyPublisher<Response, MoyaError> {
+    func getAudioContentList(userId: Int, categoryId: Int,  page: Int, size: Int, sort: ContentListViewModel.Sort) -> AnyPublisher<Response, MoyaError> {
-        return api.requestPublisher(.getAudioContentList(userId: userId, page: page, size: size, sort: sort))
+        return api.requestPublisher(.getAudioContentList(userId: userId, categoryId: categoryId, page: page, size: size, sort: sort))
     }
     
     func getAudioContentDetail(audioContentId: Int) -> AnyPublisher<Response, MoyaError> {
@@ -65,14 +66,26 @@ final class ContentRepository {
         return api.requestPublisher(.modifyAudioContent(parameters: parameters))
     }
     
-    func getMain() -> AnyPublisher<Response, MoyaError> {
+    func getNewContentUploadCreatorList() -> AnyPublisher<Response, MoyaError> {
-        return api.requestPublisher(.getMain)
+        return api.requestPublisher(.getNewContentUploadCreatorList)
+    }
+    
+    func getMainBannerList() -> AnyPublisher<Response, MoyaError> {
+        return api.requestPublisher(.getMainBannerList)
+    }
+    
+    func getMainOrderList() -> AnyPublisher<Response, MoyaError> {
+        return api.requestPublisher(.getMainOrderList)
     }
     
     func getNewContentOfTheme(theme: String) -> AnyPublisher<Response, MoyaError> {
         return api.requestPublisher(.getNewContentOfTheme(theme: theme))
     }
     
+    func getCurationList(page: Int, size: Int) -> AnyPublisher<Response, MoyaError> {
+        return api.requestPublisher(.getCurationList(page: page, size: size))
+    }
+    
     func donation(contentId: Int, can: Int, comment: String) -> AnyPublisher<Response, MoyaError> {
         return api.requestPublisher(.donation(request: AudioContentDonationRequest(contentId: contentId, donationCan: can, comment: comment)))
     }
@@ -93,7 +106,27 @@ final class ContentRepository {
         return api.requestPublisher(.getAudioContentListByCurationId(curationId: curationId, page: page, size: size, sort: sort))
     }
     
-    func getContentRanking(page: Int, size: Int) -> AnyPublisher<Response, MoyaError> {
+    func getContentRankingSortType() -> AnyPublisher<Response, MoyaError> {
-        return api.requestPublisher(.getContentRanking(page: page, size: size))
+        return api.requestPublisher(.getContentRankingSortType)
+    }
+    
+    func getContentRanking(page: Int, size: Int, sortType: String = "매출") -> AnyPublisher<Response, MoyaError> {
+        return api.requestPublisher(.getContentRanking(page: page, size: size, sortType: sortType))
+    }
+    
+    func pinContent(contentId: Int) -> AnyPublisher<Response, MoyaError> {
+        return api.requestPublisher(.pinContent(contentId: contentId))
+    }
+    
+    func unpinContent(contentId: Int) -> AnyPublisher<Response, MoyaError> {
+        return api.requestPublisher(.unpinContent(contentId: contentId))
+    }
+    
+    func getCategoryList(creatorId: Int) -> AnyPublisher<Response, MoyaError> {
+        return categoryApi.requestPublisher(.getCategoryList(creatorId: creatorId))
+    }
+    
+    func getAudioContentByTheme(themeId: Int, page: Int, size: Int, sort: ContentAllByThemeViewModel.Sort) -> AnyPublisher<Response, MoyaError> {
+        return api.requestPublisher(.getAudioContentByTheme(themeId: themeId, page: page, size: size, sort: sort))
     }
 }

SodaLive/Sources/Content/Create/ContentCreateView.swift

@@ -16,6 +16,8 @@ struct ContentCreateView: View {
     @State private var isShowPhotoPicker = false
     @State private var isShowSelectAudioView = false
     @State private var isShowSelectThemeView = false
+    @State private var isShowSelectDateView = false
+    @State private var isShowSelectTimeView = false
     
     var body: some View {
         BaseView(isLoading: $viewModel.isLoading) {
@@ -37,7 +39,7 @@ struct ContentCreateView: View {
                                             .resizable()
                                             .scaledToFill()
                                             .frame(width: 107, height: 107)
-                                            .background(Color(hex: "3e3358"))
+                                            .background(Color(hex: "13181b"))
                                             .cornerRadius(8)
                                             .clipped()
                                     } else {
@@ -46,13 +48,13 @@ struct ContentCreateView: View {
                                             .scaledToFit()
                                             .padding(13.3)
                                             .frame(width: 107, height: 107)
-                                            .background(Color(hex: "3e3358"))
+                                            .background(Color(hex: "13181b"))
                                             .cornerRadius(8)
                                     }
                                     
                                     Image("ic_camera")
                                         .padding(10)
-                                        .background(Color(hex: "9970ff"))
+                                        .background(Color(hex: "3bb9f1"))
                                         .cornerRadius(30)
                                         .offset(x: 50, y: 36)
                                 }
@@ -67,15 +69,15 @@ struct ContentCreateView: View {
                                 
                                 Text(viewModel.fileName.trimmingCharacters(in: .whitespacesAndNewlines) == "" ? "파일선택" : viewModel.fileName)
                                     .font(.custom(Font.medium.rawValue, size: 16.7))
-                                    .foregroundColor(Color(hex: "9970ff"))
+                                    .foregroundColor(Color(hex: "3bb9f1"))
                                     .padding(.vertical, 10)
                                     .frame(maxWidth: .infinity)
-                                    .background(Color(hex: "9970ff").opacity(0.2))
+                                    .background(Color(hex: "13181b"))
                                     .cornerRadius(5.3)
                                     .overlay(
                                         RoundedCorner(radius: 8)
                                             .stroke(lineWidth: 2)
-                                            .foregroundColor(Color(hex: "9970ff"))
+                                            .foregroundColor(Color(hex: "3bb9f1"))
                                     )
                                     .padding(.top, 13.3)
                                     .onTapGesture { isShowSelectAudioView = true }
@@ -150,16 +152,16 @@ struct ContentCreateView: View {
                                          viewModel.theme!.theme :
                                             "테마 선택")
                                     .font(.custom(Font.bold.rawValue, size: 16.7))
-                                    .foregroundColor(Color(hex: "9970ff"))
+                                    .foregroundColor(Color(hex: "3bb9f1"))
                                 }
                                 .padding(.vertical, viewModel.theme != nil ? 8 : 13.3)
                                 .frame(maxWidth: .infinity)
-                                .background(Color(hex: "9970ff").opacity(0.2))
+                                .background(Color(hex: "13181b"))
                                 .cornerRadius(24)
                                 .overlay(
                                     RoundedRectangle(cornerRadius: 24)
                                         .stroke(lineWidth: 2)
-                                        .foregroundColor(Color(hex: "9970ff"))
+                                        .foregroundColor(Color(hex: "3bb9f1"))
                                 )
                                 .padding(.top, 13.3)
                                 .onTapGesture {
@@ -194,7 +196,7 @@ struct ContentCreateView: View {
                                 .padding(.top, 26.7)
                             
                             VStack(spacing: 13.3) {
-                                Text("가격설정")
+                                Text("가격 설정")
                                     .font(.custom(Font.bold.rawValue, size: 16.7))
                                     .foregroundColor(Color(hex: "eeeeee"))
                                     .frame(maxWidth: .infinity, alignment: .leading)
@@ -214,8 +216,30 @@ struct ContentCreateView: View {
                                 }
                                 
                                 if !viewModel.isFree {
+                                    VStack(spacing: 13.3) {
+                                        Text("소장 설정")
+                                            .font(.custom(Font.bold.rawValue, size: 16.7))
+                                            .foregroundColor(Color(hex: "eeeeee"))
+                                            .frame(maxWidth: .infinity, alignment: .leading)
+                                        
+                                        HStack(spacing: 13.3) {
+                                            SelectButtonView(title: "소장/대여", isChecked: !viewModel.isOnlyRental) {
+                                                if viewModel.isOnlyRental {
+                                                    viewModel.isOnlyRental = false
+                                                }
+                                            }
+                                            
+                                            SelectButtonView(title: "대여만", isChecked: viewModel.isOnlyRental) {
+                                                if !viewModel.isOnlyRental {
+                                                    viewModel.isOnlyRental = true
+                                                }
+                                            }
+                                        }
+                                    }
+                                    .padding(.top, 13.3)
+                                    
                                     VStack(spacing: 0) {
-                                        Text("소장가격")
+                                        Text(viewModel.isOnlyRental ? "대여 가격" : "소장 가격")
                                             .font(.custom(Font.medium.rawValue, size: 13.3))
                                             .foregroundColor(Color(hex: "d2d2d2"))
                                             .frame(maxWidth: .infinity, alignment: .leading)
@@ -247,7 +271,7 @@ struct ContentCreateView: View {
                                             .frame(height: 1)
                                             .padding(.top, 11)
                                         
-                                        Text("※ 이용기간 대여 (7일) | 소장 (서비스종료시까지)")
+                                        Text("※ 이용기간 대여 (15일) | 소장 (서비스종료시까지)")
                                             .font(.custom(Font.medium.rawValue, size: 13.3))
                                             .foregroundColor(Color(hex: "777777"))
                                             .frame(maxWidth: .infinity, alignment: .leading)
@@ -264,6 +288,84 @@ struct ContentCreateView: View {
                                             .frame(maxWidth: .infinity, alignment: .leading)
                                     }
                                     .padding(.top, 26.7)
+                                    
+                                    VStack(spacing: 13.3) {
+                                        Text("미리듣기")
+                                            .font(.custom(Font.bold.rawValue, size: 16.7))
+                                            .foregroundColor(Color(hex: "eeeeee"))
+                                            .frame(maxWidth: .infinity, alignment: .leading)
+                                        
+                                        HStack(spacing: 13.3) {
+                                            SelectButtonView(title: "생성", isChecked: viewModel.isGeneratePreview) {
+                                                if !viewModel.isGeneratePreview {
+                                                    viewModel.isGeneratePreview = true
+                                                }
+                                            }
+                                            
+                                            SelectButtonView(title: "생성 안 함", isChecked: !viewModel.isGeneratePreview) {
+                                                if viewModel.isGeneratePreview {
+                                                    viewModel.isGeneratePreview = false
+                                                }
+                                            }
+                                        }
+                                    }
+                                    .padding(.top, 26.7)
+                                    
+                                    if viewModel.isGeneratePreview {
+                                        VStack(spacing: 10) {
+                                            Text("미리듣기 시간 설정")
+                                                .font(.custom(Font.bold.rawValue, size: 16.7))
+                                                .foregroundColor(Color(hex: "eeeeee"))
+                                                .frame(maxWidth: .infinity, alignment: .leading)
+                                            
+                                            Text("미리듣기 시간을 직접 설정하지 않으면 콘텐츠 앞부분 30초가 자동으로 설정됩니다. 미리듣기의 시간제한은 없습니다.")
+                                                .font(.custom(Font.medium.rawValue, size: 13.3))
+                                                .foregroundColor(Color(hex: "777777"))
+                                                .frame(maxWidth: .infinity, alignment: .leading)
+                                            
+                                            HStack(spacing: 13.3) {
+                                                VStack(spacing: 5.3) {
+                                                    Text("시작 시간")
+                                                        .font(.custom(Font.medium.rawValue, size: 13.3))
+                                                        .foregroundColor(Color(hex: "d2d2d2"))
+                                                        .frame(maxWidth: .infinity, alignment: .leading)
+                                                    
+                                                    TextField("00:00:00", text: $viewModel.previewStartTime)
+                                                        .autocapitalization(.none)
+                                                        .disableAutocorrection(true)
+                                                        .font(.custom(Font.bold.rawValue, size: 14.6))
+                                                        .foregroundColor(Color(hex: "777777"))
+                                                        .padding(.vertical, 16.7)
+                                                        .padding(.horizontal, 13.3)
+                                                        .background(Color(hex: "222222"))
+                                                        .cornerRadius(6.7)
+                                                        .keyboardType(.default)
+                                                        .multilineTextAlignment(.center)
+                                                }
+                                                
+                                                VStack(spacing: 5.3) {
+                                                    Text("종료 시간")
+                                                        .font(.custom(Font.medium.rawValue, size: 13.3))
+                                                        .foregroundColor(Color(hex: "d2d2d2"))
+                                                        .frame(maxWidth: .infinity, alignment: .leading)
+                                                    
+                                                    TextField("00:00:30", text: $viewModel.previewEndTime)
+                                                        .autocapitalization(.none)
+                                                        .disableAutocorrection(true)
+                                                        .font(.custom(Font.bold.rawValue, size: 14.6))
+                                                        .foregroundColor(Color(hex: "777777"))
+                                                        .padding(.vertical, 16.7)
+                                                        .padding(.horizontal, 13.3)
+                                                        .background(Color(hex: "222222"))
+                                                        .cornerRadius(6.7)
+                                                        .keyboardType(.default)
+                                                        .multilineTextAlignment(.center)
+                                                }
+                                            }
+                                            .padding(.top, 3.3)
+                                        }
+                                        .padding(.top, 26.7)
+                                    }
                                 }
                             }
                             .padding(.top, 26.7)
@@ -321,57 +423,76 @@ struct ContentCreateView: View {
                             .padding(.top, 26.7)
                             .padding(.horizontal, 13.3)
                             
-                            VStack(spacing: 10) {
+                            VStack(spacing: 13.3) {
-                                Text("미리듣기 시간 설정")
+                                Text("예약 공개")
                                     .font(.custom(Font.bold.rawValue, size: 16.7))
                                     .foregroundColor(Color(hex: "eeeeee"))
                                     .frame(maxWidth: .infinity, alignment: .leading)
                                 
-                                Text("미리듣기 시간을 직접 설정하지 않으면 콘텐츠 앞부분 30초가 자동으로 설정됩니다. 미리듣기의 시간제한은 없습니다.")
-                                    .font(.custom(Font.medium.rawValue, size: 13.3))
-                                    .foregroundColor(Color(hex: "777777"))
-                                    .frame(maxWidth: .infinity, alignment: .leading)
-                                
                                 HStack(spacing: 13.3) {
-                                    VStack(spacing: 5.3) {
+                                    SelectButtonView(title: "지금 공개", isChecked: !viewModel.isActiveReservation) {
-                                        Text("시작 시간")
+                                        if viewModel.isActiveReservation {
-                                            .font(.custom(Font.medium.rawValue, size: 13.3))
+                                            viewModel.isActiveReservation = false
-                                            .foregroundColor(Color(hex: "d2d2d2"))
+                                        }
-                                            .frame(maxWidth: .infinity, alignment: .leading)
-                                        
-                                        TextField("00:00:00", text: $viewModel.previewStartTime)
-                                            .autocapitalization(.none)
-                                            .disableAutocorrection(true)
-                                            .font(.custom(Font.bold.rawValue, size: 14.6))
-                                            .foregroundColor(Color(hex: "777777"))
-                                            .padding(.vertical, 16.7)
-                                            .padding(.horizontal, 13.3)
-                                            .background(Color(hex: "222222"))
-                                            .cornerRadius(6.7)
-                                            .keyboardType(.default)
-                                            .multilineTextAlignment(.center)
                                     }
                                     
-                                    VStack(spacing: 5.3) {
+                                    SelectButtonView(title: "예약 공개", isChecked: viewModel.isActiveReservation) {
-                                        Text("종료 시간")
+                                        if !viewModel.isActiveReservation {
-                                            .font(.custom(Font.medium.rawValue, size: 13.3))
+                                            viewModel.isActiveReservation = true
-                                            .foregroundColor(Color(hex: "d2d2d2"))
+                                        }
-                                            .frame(maxWidth: .infinity, alignment: .leading)
-                                        
-                                        TextField("00:00:30", text: $viewModel.previewEndTime)
-                                            .autocapitalization(.none)
-                                            .disableAutocorrection(true)
-                                            .font(.custom(Font.bold.rawValue, size: 14.6))
-                                            .foregroundColor(Color(hex: "777777"))
-                                            .padding(.vertical, 16.7)
-                                            .padding(.horizontal, 13.3)
-                                            .background(Color(hex: "222222"))
-                                            .cornerRadius(6.7)
-                                            .keyboardType(.default)
-                                            .multilineTextAlignment(.center)
                                     }
                                 }
-                                .padding(.top, 3.3)
+                                
+                                if viewModel.isActiveReservation {
+                                    HStack(spacing: 13.3) {
+                                        VStack(alignment: .leading, spacing: 6.7) {
+                                            Text("예약 날짜")
+                                                .font(.custom(Font.medium.rawValue, size: 13.3))
+                                                .foregroundColor(Color(hex: "eeeeee"))
+                                            
+                                            Button(action: {
+                                                hideKeyboard()
+                                                self.isShowSelectDateView = true
+                                            }) {
+                                                Text(viewModel.releaseDateString)
+                                                    .font(.custom(Font.medium.rawValue, size: 14.7))
+                                                    .foregroundColor(Color(hex: "eeeeee"))
+                                                    .frame(maxWidth: .infinity)
+                                                    .frame(height: 48.7)
+                                                    .overlay(
+                                                        RoundedRectangle(cornerRadius: 6.7)
+                                                            .stroke(Color(hex: "3bb9f1"), lineWidth: 1.3)
+                                                    )
+                                            }
+                                        }
+                                        
+                                        VStack(alignment: .leading, spacing: 6.7) {
+                                            Text("예약 시간")
+                                                .font(.custom(Font.medium.rawValue, size: 13.3))
+                                                .foregroundColor(Color(hex: "eeeeee"))
+                                            
+                                            Button(action: {
+                                                hideKeyboard()
+                                                self.isShowSelectTimeView = true
+                                            }) {
+                                                Text(viewModel.releaseTimeString)
+                                                    .font(.custom(Font.medium.rawValue, size: 14.7))
+                                                    .foregroundColor(Color(hex: "eeeeee"))
+                                                    .frame(maxWidth: .infinity)
+                                                    .frame(height: 48.7)
+                                                    .overlay(
+                                                        RoundedRectangle(cornerRadius: 6.7)
+                                                            .stroke(Color(hex: "3bb9f1"), lineWidth: 1.3)
+                                                    )
+                                            }
+                                        }
+                                    }
+                                    .padding(.horizontal, 13.3)
+                                    .padding(.vertical, 14.2)
+                                    .frame(maxWidth: .infinity)
+                                    .background(Color(hex: "222222"))
+                                    .padding(.top, 22.7)
+                                }
                             }
                             .padding(.top, 26.7)
                             .padding(.horizontal, 13.3)
@@ -383,7 +504,7 @@ struct ContentCreateView: View {
                                         .foregroundColor(Color.white)
                                         .frame(height: 50)
                                         .frame(maxWidth: .infinity)
-                                        .background(Color(hex: "9970ff"))
+                                        .background(Color(hex: "3bb9f1"))
                                         .cornerRadius(10)
                                         .padding(13.3)
                                 }
@@ -425,6 +546,14 @@ struct ContentCreateView: View {
                         }
                     }
                     
+                    if isShowSelectDateView {
+                        SelectDatePicker(selectedDate: $viewModel.releaseDate, isShowing: $isShowSelectDateView)
+                    }
+                    
+                    if isShowSelectTimeView {
+                        QuarterTimePickerView(selectedTime: $viewModel.releaseTime, isShowing: $isShowSelectTimeView)
+                    }
+                    
                     if isShowPhotoPicker {
                         ImagePicker(
                             isShowing: $isShowPhotoPicker,
@@ -470,7 +599,7 @@ struct ContentCreateView: View {
                                 .padding(.vertical, 13.3)
                                 .frame(width: screenSize().width - 66.7, alignment: .center)
                                 .font(.custom(Font.medium.rawValue, size: 12))
-                                .background(Color(hex: "9970ff"))
+                                .background(Color(hex: "3bb9f1"))
                                 .foregroundColor(Color.white)
                                 .multilineTextAlignment(.center)
                                 .cornerRadius(20)
@@ -498,11 +627,11 @@ struct SelectButtonView: View {
             
             Text(title)
                 .font(.custom(Font.bold.rawValue, size: 14.7))
-                .foregroundColor(isChecked ? .white : Color(hex: "9970ff"))
+                .foregroundColor(isChecked ? .white : Color(hex: "80D8FF"))
         }
         .frame(height: 48.7)
         .frame(maxWidth: .infinity)
-        .background(isChecked ? Color(hex: "9970ff") : Color(hex: "1f1734"))
+        .background(isChecked ? Color(hex: "3BB9F1") : Color(hex: "13181B"))
         .cornerRadius(6.7)
         .onTapGesture {
             hideKeyboard()

SodaLive/Sources/Content/Create/ContentCreateViewModel.swift

@@ -34,6 +34,7 @@ final class ContentCreateViewModel: ObservableObject {
     }
     
     @Published var isAvailableComment = true
+    @Published var isActiveReservation = false
     @Published var isAdult = false
     @Published var priceString = "0" {
         didSet {
@@ -54,12 +55,31 @@ final class ContentCreateViewModel: ObservableObject {
         didSet {
             if isFree {
                 priceString = "0"
+                isOnlyRental = false
+                isGeneratePreview = true
             }
         }
     }
     
+    @Published var isOnlyRental = false
+    @Published var isGeneratePreview = true
+    
     @Published var previewStartTime: String = ""
     @Published var previewEndTime: String = ""
+    @Published var releaseDateString: String = Date().convertDateFormat(dateFormat: "yyyy.MM.dd")
+    @Published var releaseTimeString: String = Date().convertDateFormat(dateFormat: "a hh:mm")
+    
+    var releaseDate = Date() {
+        willSet {
+            releaseDateString = newValue.convertDateFormat(dateFormat: "yyyy.MM.dd")
+        }
+    }
+    
+    var releaseTime = Date() {
+        willSet {
+            releaseTimeString = newValue.convertDateFormat(dateFormat: "a hh:mm")
+        }
+    }
     
     var placeholder = "내용을 입력하세요"
     
@@ -72,11 +92,15 @@ final class ContentCreateViewModel: ObservableObject {
                 detail: detail,
                 tags: hashtags,
                 price: price,
+                releaseDate: isActiveReservation ? "\(releaseDate.convertDateFormat(dateFormat: "yyyy-MM-dd")) \(releaseTime.convertDateFormat(dateFormat: "HH:mm"))" : nil,
+                timezone: TimeZone.current.identifier,
                 themeId: theme!.id,
                 isAdult: isAdult,
+                isOnlyRental: isOnlyRental, 
+                isGeneratePreview: isGeneratePreview,
                 isCommentAvailable: isAvailableComment,
-                previewStartTime: previewStartTime.trimmingCharacters(in: .whitespacesAndNewlines).count > 0 ? previewStartTime : nil,
+                previewStartTime: isGeneratePreview && previewStartTime.trimmingCharacters(in: .whitespacesAndNewlines).count > 0 ? previewStartTime : nil,
-                previewEndTime: previewEndTime.trimmingCharacters(in: .whitespacesAndNewlines).count > 0 ? previewEndTime : nil
+                previewEndTime: isGeneratePreview && previewEndTime.trimmingCharacters(in: .whitespacesAndNewlines).count > 0 ? previewEndTime : nil
             )
             
             var multipartData = [MultipartFormData]()

SodaLive/Sources/Content/Create/CreateAudioContentRequest.swift

@@ -12,8 +12,12 @@ struct CreateAudioContentRequest: Encodable {
     let detail: String
     let tags: String
     let price: Int
+    let releaseDate: String?
+    let timezone: String
     let themeId: Int
     let isAdult: Bool
+    let isOnlyRental: Bool
+    let isGeneratePreview: Bool
     let isCommentAvailable: Bool
     let previewStartTime: String?
     let previewEndTime: String?

SodaLive/Sources/Content/Create/QuarterTimePickerView.swift

@@ -0,0 +1,63 @@
+//
+//  QuarterTimePickerView.swift
+//  SodaLive
+//
+//  Created by klaus on 2024/01/10.
+//
+
+import SwiftUI
+
+struct QuarterTimePickerView: View {
+    
+    @Binding var selectedTime: Date
+    @Binding var isShowing: Bool
+    
+    var body: some View {
+        GeometryReader { proxy in
+            ZStack {
+                Color
+                    .black
+                    .opacity(0.5)
+                    .edgesIgnoringSafeArea(.all)
+                
+                VStack(spacing: 0) {
+                    DatePicker(
+                        "",
+                        selection: $selectedTime,
+                        displayedComponents: .hourAndMinute
+                    )
+                    .datePickerStyle(WheelDatePickerStyle())
+                    .labelsHidden()
+                    .environment(\.locale, Locale.init(identifier: "ko"))
+                    .frame(width: proxy.size.width - 53.4)
+                    .onAppear {
+                        UIDatePicker.appearance().minuteInterval = 15
+                    }
+                    .onDisappear {
+                        UIDatePicker.appearance().minuteInterval = 1
+                    }
+                    
+                    Button(action: { self.isShowing = false }) {
+                        Text("확인")
+                            .font(.system(size: 16))
+                            .foregroundColor(Color(hex: "eeeeee"))
+                            .padding(.vertical, 10)
+                            .frame(width: proxy.size.width)
+                    }
+                }
+                .background(Color(hex: "222222"))
+                .cornerRadius(6.7)
+            }
+            .frame(width: proxy.size.width)
+        }
+    }
+}
+
+struct QuarterTimePickerView_Previews: PreviewProvider {
+    static var previews: some View {
+        QuarterTimePickerView(
+            selectedTime: .constant(Date()),
+            isShowing: .constant(true)
+        )
+    }
+}

SodaLive/Sources/Content/Create/SelectDatePicker.swift

@@ -0,0 +1,53 @@
+//
+//  SelectDatePicker.swift
+//  SodaLive
+//
+//  Created by klaus on 2024/01/10.
+//
+
+import SwiftUI
+
+struct SelectDatePicker: View {
+    
+    @Binding var selectedDate: Date
+    @Binding var isShowing: Bool
+    
+    var body: some View {
+        GeometryReader { proxy in
+            ZStack {
+                Color
+                    .black
+                    .opacity(0.5)
+                    .edgesIgnoringSafeArea(.all)
+                
+                VStack(spacing: 0) {
+                    DatePicker("", selection: $selectedDate, in: Date()..., displayedComponents: .date)
+                        .datePickerStyle(WheelDatePickerStyle())
+                        .labelsHidden()
+                        .environment(\.locale, Locale.init(identifier: "ko"))
+                        .frame(width: proxy.size.width)
+                    
+                    Button(action: { self.isShowing = false }) {
+                        Text("확인")
+                            .font(.system(size: 16))
+                            .foregroundColor(Color(hex: "eeeeee"))
+                            .padding(.vertical, 10)
+                            .frame(width: proxy.size.width - 53.4)
+                    }
+                }
+                .background(Color(hex: "222222"))
+                .cornerRadius(6.7)
+            }
+            .frame(width: proxy.size.width)
+        }
+    }
+}
+
+struct SelectDatePicker_Previews: PreviewProvider {
+    static var previews: some View {
+        SelectDatePicker(
+            selectedDate: .constant(Date()),
+            isShowing: .constant(true)
+        )
+    }
+}

SodaLive/Sources/Content/Curation/ContentCurationView.swift

@@ -15,95 +15,98 @@ struct ContentCurationView: View {
     let curationId: Int
     
     let columns = [
+        GridItem(.flexible(), alignment: .top),
         GridItem(.flexible(), alignment: .top),
         GridItem(.flexible(), alignment: .top)
     ]
     
     var body: some View {
-        BaseView(isLoading: $viewModel.isLoading) {
+        NavigationView {
-            VStack(spacing: 0) {
+            BaseView(isLoading: $viewModel.isLoading) {
-                DetailNavigationBar(title: title)
+                VStack(spacing: 0) {
+                    DetailNavigationBar(title: title)
                     
-                HStack(spacing: 13.3) {
+                    HStack(spacing: 13.3) {
-                    Spacer()
+                        Spacer()
                         
-                    Text("최신순")
+                        Text("최신순")
-                        .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
-                        .foregroundColor(
+                            .foregroundColor(
-                            Color(hex: "e2e2e2")
+                                Color(hex: "e2e2e2")
-                                .opacity(viewModel.sort == .NEWEST ? 1 : 0.5)
+                                    .opacity(viewModel.sort == .NEWEST ? 1 : 0.5)
-                        )
+                            )
-                        .onTapGesture {
+                            .onTapGesture {
-                            if viewModel.sort != .NEWEST {
+                                if viewModel.sort != .NEWEST {
-                                viewModel.sort = .NEWEST
+                                    viewModel.sort = .NEWEST
-                            }
-                        }
-                    
-                    Text("높은 가격순")
-                        .font(.custom(Font.medium.rawValue, size: 13.3))
-                        .foregroundColor(
-                            Color(hex: "e2e2e2")
-                                .opacity(viewModel.sort == .PRICE_HIGH ? 1 : 0.5)
-                        )
-                        .onTapGesture {
-                            if viewModel.sort != .PRICE_HIGH {
-                                viewModel.sort = .PRICE_HIGH
-                            }
-                        }
-                    
-                    Text("낮은 가격순")
-                        .font(.custom(Font.medium.rawValue, size: 13.3))
-                        .foregroundColor(
-                            Color(hex: "e2e2e2")
-                                .opacity(viewModel.sort == .PRICE_LOW ? 1 : 0.5)
-                        )
-                        .onTapGesture {
-                            if viewModel.sort != .PRICE_LOW {
-                                viewModel.sort = .PRICE_LOW
-                            }
-                        }
-                }
-                .padding(.vertical, 13.3)
-                .padding(.horizontal, 20)
-                .background(Color(hex: "161616"))
-                .padding(.top, 13.3)
-                
-                HStack(spacing: 0) {
-                    Text("전체")
-                        .font(.custom(Font.medium.rawValue, size: 13.3))
-                        .foregroundColor(Color(hex: "e2e2e2"))
-                    
-                    Text("\(viewModel.totalCount)")
-                        .font(.custom(Font.medium.rawValue, size: 13.3))
-                        .foregroundColor(Color(hex: "ff5c49"))
-                        .padding(.leading, 8)
-                    
-                    Text("개")
-                        .font(.custom(Font.medium.rawValue, size: 13.3))
-                        .foregroundColor(Color(hex: "e2e2e2"))
-                        .padding(.leading, 2)
-                    
-                    Spacer()
-                }
-                .padding(.vertical, 13.3)
-                .padding(.horizontal, 20)
-                
-                ScrollView(.vertical, showsIndicators: false) {
-                    LazyVGrid(columns: columns, spacing: 13.3) {
-                        ForEach(0..<viewModel.contentList.count, id: \.self) { index in
-                            ContentNewAllItemView(item: viewModel.contentList[index])
-                                .onAppear {
-                                    if index == viewModel.contentList.count - 1 {
-                                        viewModel.getContentList()
-                                    }
                                 }
+                            }
+                        
+                        Text("높은 가격순")
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .foregroundColor(
+                                Color(hex: "e2e2e2")
+                                    .opacity(viewModel.sort == .PRICE_HIGH ? 1 : 0.5)
+                            )
+                            .onTapGesture {
+                                if viewModel.sort != .PRICE_HIGH {
+                                    viewModel.sort = .PRICE_HIGH
+                                }
+                            }
+                        
+                        Text("낮은 가격순")
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .foregroundColor(
+                                Color(hex: "e2e2e2")
+                                    .opacity(viewModel.sort == .PRICE_LOW ? 1 : 0.5)
+                            )
+                            .onTapGesture {
+                                if viewModel.sort != .PRICE_LOW {
+                                    viewModel.sort = .PRICE_LOW
+                                }
+                            }
+                    }
+                    .padding(.vertical, 13.3)
+                    .padding(.horizontal, 20)
+                    .background(Color(hex: "161616"))
+                    .padding(.top, 13.3)
+                    
+                    HStack(spacing: 0) {
+                        Text("전체")
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .foregroundColor(Color(hex: "e2e2e2"))
+                        
+                        Text("\(viewModel.totalCount)")
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .foregroundColor(Color(hex: "ff5c49"))
+                            .padding(.leading, 8)
+                        
+                        Text("개")
+                            .font(.custom(Font.medium.rawValue, size: 13.3))
+                            .foregroundColor(Color(hex: "e2e2e2"))
+                            .padding(.leading, 2)
+                        
+                        Spacer()
+                    }
+                    .padding(.vertical, 13.3)
+                    .padding(.horizontal, 20)
+                    
+                    ScrollView(.vertical, showsIndicators: false) {
+                        LazyVGrid(columns: columns, spacing: 13.3) {
+                            ForEach(0..<viewModel.contentList.count, id: \.self) { index in
+                                ContentNewAllItemView(item: viewModel.contentList[index])
+                                    .onAppear {
+                                        if index == viewModel.contentList.count - 1 {
+                                            viewModel.getContentList()
+                                        }
+                                    }
+                            }
                         }
                     }
                 }
-            }
+                .onAppear {
-            .onAppear {
+                    viewModel.curationId = curationId
-                viewModel.curationId = curationId
+                    viewModel.getContentList()
-                viewModel.getContentList()
+                }
             }
         }
     }

SodaLive/Sources/Content/Detail/Comment/AudioContentCommentItemView.swift

@@ -63,12 +63,12 @@ struct AudioContentCommentItemView: View {
                     .padding(.horizontal, 6.7)
                     .padding(.vertical, 2.7)
                     .background(
-                        commentItem.donationCan >= 100000 ? Color(hex: "973a3a") :
+                        commentItem.donationCan >= 10000 ? Color(hex: "973a3a") :
-                            commentItem.donationCan >= 50000 ? Color(hex: "d85e37") :
+                            commentItem.donationCan >= 5000 ? Color(hex: "d85e37") :
-                            commentItem.donationCan >= 10000 ? Color(hex: "d38c38") :
+                            commentItem.donationCan >= 1000 ? Color(hex: "d38c38") :
-                            commentItem.donationCan >= 5000 ? Color(hex: "59548f") :
+                            commentItem.donationCan >= 500 ? Color(hex: "59548f") :
-                            commentItem.donationCan >= 1000 ? Color(hex: "4d6aa4") :
+                            commentItem.donationCan >= 100 ? Color(hex: "4d6aa4") :
-                            commentItem.donationCan >= 500 ? Color(hex: "2d7390") :
+                            commentItem.donationCan >= 50 ? Color(hex: "2d7390") :
                             Color(hex: "548f7d")
                     )
                     .cornerRadius(10.7)

SodaLive/Sources/Content/Detail/ContentDetailInfoView.swift

@@ -21,6 +21,16 @@ struct ContentDetailInfoView: View {
         VStack(alignment: .leading, spacing: 0) {
             VStack(alignment: .leading, spacing: 8) {
                 HStack(spacing: 5.3) {
+                    if let _ = audioContent.releaseDate {
+                        Text("오픈예정")
+                            .font(.custom(Font.medium.rawValue, size: 12))
+                            .foregroundColor(Color(hex: "3bb9f1"))
+                            .padding(.horizontal, 5.3)
+                            .padding(.vertical, 3.3)
+                            .background(Color(hex: "003851"))
+                            .cornerRadius(2.6)
+                    }
+                    
                     Text(audioContent.themeStr)
                         .font(.custom(Font.medium.rawValue, size: 12))
                         .foregroundColor(Color(hex: "3bac6a"))

SodaLive/Sources/Content/Detail/ContentDetailMenuView.swift

@@ -11,7 +11,10 @@ struct ContentDetailMenuView: View {
     
     @Binding var isShowing: Bool
     
+    let isPin: Bool
     let isShowCreatorMenu: Bool
+    
+    let pinAction: () -> Void
     let modifyAction: () -> Void
     let deleteAction: () -> Void
     let reportAction: () -> Void
@@ -28,7 +31,26 @@ struct ContentDetailMenuView: View {
                 
                 VStack(spacing: 13.3) {
                     if isShowCreatorMenu {
-                        HStack(spacing: 0) {
+                        HStack(spacing: 13.3) {
+                            Image(isPin ? "ic_pin_cancel" : "ic_pin")
+                            
+                            Text(isPin ? "내 채널에 고정 취소" : "내 채널에 고정")
+                                .font(.custom(Font.medium.rawValue, size: 16.7))
+                                .foregroundColor(.white)
+                            
+                            Spacer()
+                        }
+                        .padding(.vertical, 8)
+                        .padding(.horizontal, 26.7)
+                        .contentShape(Rectangle())
+                        .onTapGesture {
+                            isShowing = false
+                            pinAction()
+                        }
+                        
+                        HStack(spacing: 13.3) {
+                            Image("ic_make_message")
+                            
                             Text("수정")
                                 .font(.custom(Font.medium.rawValue, size: 16.7))
                                 .foregroundColor(.white)
@@ -43,7 +65,9 @@ struct ContentDetailMenuView: View {
                             modifyAction()
                         }
                         
-                        HStack(spacing: 0) {
+                        HStack(spacing: 13.3) {
+                            Image("ic_trash_can")
+                            
                             Text("삭제")
                                 .font(.custom(Font.medium.rawValue, size: 16.7))
                                 .foregroundColor(.white)

SodaLive/Sources/Content/Detail/ContentDetailPlayView.swift

@@ -35,26 +35,35 @@ struct ContentDetailPlayView: View {
                     )
                     .cornerRadius(10.7, corners: [.topLeft, .topRight])
                 
-                Image(isPlaying() ? "btn_audio_content_pause" : isAlertPreview ? "btn_audio_content_preview_play" : "btn_audio_content_play")
+                if audioContent.releaseDate == nil && !isAlertPreview || (isAlertPreview && audioContent.isActivePreview) {
-                    .onTapGesture {
+                    Image(isPlaying() ? "btn_audio_content_pause" : isAlertPreview ? "btn_audio_content_preview_play" : "btn_audio_content_play")
-                        if isPlaying() {
+                        .onTapGesture {
-                            contentPlayManager.pauseAudio()
+                            if isPlaying() {
-                        } else {
+                                contentPlayManager.pauseAudio()
-                            contentPlayManager.startTimer = startTimer
+                            } else {
-                            contentPlayManager.stopTimer = stopTimer
+                                contentPlayManager.startTimer = startTimer
+                                contentPlayManager.stopTimer = stopTimer
                                 
-                            contentPlayManager.playAudio(
+                                contentPlayManager.playAudio(
-                                contentId: audioContent.contentId,
+                                    contentId: audioContent.contentId,
-                                title: audioContent.title,
+                                    title: audioContent.title,
-                                nickname: audioContent.creator.nickname,
+                                    nickname: audioContent.creator.nickname,
-                                coverImage: audioContent.coverImageUrl,
+                                    coverImage: audioContent.coverImageUrl,
-                                contentUrl: audioContent.contentUrl,
+                                    contentUrl: audioContent.contentUrl,
-                                isFree: audioContent.price <= 0,
+                                    isFree: audioContent.price <= 0,
-                                isPreview: !audioContent.existOrdered && audioContent.price > 0
+                                    isPreview: !audioContent.existOrdered && audioContent.price > 0
-                            )
+                                )
-                            isShowPreviewAlert = true
+                                isShowPreviewAlert = true
+                            }
                         }
-                    }
+                } else {
+                    Text("해당 콘텐츠는 크리에이터의 요청으로\n미리듣기를 제공하지 않습니다.")
+                        .font(.custom(Font.medium.rawValue, size: 16.7))
+                        .foregroundColor(Color.grayee)
+                        .padding(13.3)
+                        .background(Color.gray33.opacity(0.5))
+                        .cornerRadius(46.7)
+                }
                 
                 VStack(alignment: .leading, spacing: 13.3) {
                     Spacer()

SodaLive/Sources/Content/Detail/ContentDetailPurchaseButton.swift

@@ -10,6 +10,7 @@ import SwiftUI
 struct ContentDetailPurchaseButton: View {
     
     let price: Int
+    let isOnlyRental: Bool
     
     var body: some View {
         HStack(spacing: 0) {
@@ -26,7 +27,7 @@ struct ContentDetailPurchaseButton: View {
                 .font(.custom(Font.light.rawValue, size: 12))
                 .foregroundColor(.white)
             
-            Text(" 구매하기")
+            Text(isOnlyRental ? " 대여하기" : " 구매하기")
                 .font(.custom(Font.bold.rawValue, size: 14.7))
                 .foregroundColor(.white)
         }

SodaLive/Sources/Content/Detail/ContentDetailView.swift

@@ -12,6 +12,8 @@ import RefreshableScrollView
 struct ContentDetailView: View {
     
     let contentId: Int
+    
+    @Environment(\.presentationMode) var presentationMode: Binding<PresentationMode>
     @StateObject private var viewModel = ContentDetailViewModel()
     
     @State private var isShowOrderView = false
@@ -24,7 +26,11 @@ struct ContentDetailView: View {
                 VStack(spacing: 0) {
                     HStack(spacing: 0) {
                         Button {
-                            AppState.shared.back()
+                            if presentationMode.wrappedValue.isPresented {
+                                presentationMode.wrappedValue.dismiss()
+                            } else {
+                                AppState.shared.back()
+                            }
                         } label: {
                             Image("ic_back")
                                 .resizable()
@@ -87,11 +93,21 @@ struct ContentDetailView: View {
                                         )
                                         .padding(.horizontal, 13.3)
                                         
-                                        if audioContent.price > 0 &&
+                                        if let releaseDate = audioContent.releaseDate {
+                                            Text(releaseDate)
+                                                .font(.custom(Font.bold.rawValue, size: 13.3))
+                                                .foregroundColor(.white)
+                                                .frame(maxWidth: .infinity)
+                                                .frame(height: 48.7)
+                                                .background(Color(hex: "525252"))
+                                                .cornerRadius(5.3)
+                                                .padding(.top, 18.3)
+                                                .padding(.horizontal, 13.3)
+                                        } else if audioContent.price > 0 &&
                                             !audioContent.existOrdered &&
                                             audioContent.orderType == nil &&
                                             audioContent.creator.creatorId != UserDefaults.int(forKey: .userId) {
-                                            ContentDetailPurchaseButton(price: audioContent.price)
+                                            ContentDetailPurchaseButton(price: audioContent.price, isOnlyRental: audioContent.isOnlyRental)
                                                 .contentShape(Rectangle())
                                                 .padding(.horizontal, 13.3)
                                                 .onTapGesture { isShowOrderView = true }
@@ -151,6 +167,8 @@ struct ContentDetailView: View {
                     
                     Spacer()
                 }
+                .navigationTitle("")
+                .navigationBarBackButtonHidden()
                 .onAppear {
                     viewModel.contentId = contentId
                     AppState.shared.pushAudioContentId = 0
@@ -161,6 +179,7 @@ struct ContentDetailView: View {
                         ContentOrderDialogView(
                             isShowing: $isShowOrderView,
                             price: audioContent.price,
+                            isOnlyRental: audioContent.isOnlyRental,
                             onTapPurchase: {
                                 viewModel.orderType = $0
                                 isShowOrderConfirmView = true
@@ -186,6 +205,7 @@ struct ContentDetailView: View {
                             isShowing: $isShowOrderConfirmView,
                             audioContent: audioContent,
                             orderType: orderType,
+                            isOnlyRental: audioContent.isOnlyRental,
                             onClickConfirm: {
                                 viewModel.order(orderType: orderType)
                             }
@@ -199,7 +219,19 @@ struct ContentDetailView: View {
                         VStack(spacing: 0) {
                             ContentDetailMenuView(
                                 isShowing: $viewModel.isShowReportMenu,
+                                isPin: viewModel.audioContent!.isPin,
                                 isShowCreatorMenu: viewModel.audioContent!.creator.creatorId == UserDefaults.int(forKey: .userId),
+                                pinAction: {
+                                    if viewModel.audioContent!.isPin {
+                                        viewModel.unpinContent(contentId: contentId)
+                                    } else {
+                                        if viewModel.audioContent!.isAvailablePin {
+                                            viewModel.pinContent(contentId: contentId)
+                                        } else {
+                                            viewModel.isShowNoticePinContentPopup = true
+                                        }
+                                    }
+                                },
                                 modifyAction: {
                                     if viewModel.audioContent!.creator.creatorId == UserDefaults.int(forKey: .userId) {
                                         AppState
@@ -264,6 +296,24 @@ struct ContentDetailView: View {
                             viewModel.donation(can: can, comment: comment)
                         }
                     }
+                    
+                    if viewModel.isShowNoticePinContentPopup {
+                        SodaDialog(
+                            title: "고정 한도 도달",
+                            desc: "이 콘텐츠를 고정하시겠어요? " +
+                            "채널에 콘텐츠를 최대 3개까지 고정할 수 있습니다." +
+                            "이 콘텐츠를 고정하면 가장 오래된 콘텐츠가 대체됩니다.",
+                            confirmButtonTitle: "확인",
+                            confirmButtonAction: {
+                                viewModel.isShowNoticePinContentPopup = false
+                                viewModel.pinContent(contentId: contentId)
+                            },
+                            cancelButtonTitle: "취소",
+                            cancelButtonAction: {
+                                viewModel.isShowNoticePinContentPopup = false
+                            }
+                        )
+                    }
                 }
             }
             .sheet(

SodaLive/Sources/Content/Detail/ContentDetailViewModel.swift

@@ -34,6 +34,7 @@ final class ContentDetailViewModel: ObservableObject {
     @Published var isShowReportMenu = false
     @Published var isShowReportView = false
     @Published var isShowDeleteConfirm = false
+    @Published var isShowNoticePinContentPopup = false
     
     var contentId: Int = 0 {
         didSet {
@@ -298,13 +299,18 @@ final class ContentDetailViewModel: ObservableObject {
                     
                     if decoded.success {
                         self.orderType = nil
-                        self.errorMessage = "구매가 완료되었습니다."
+                        self.errorMessage = orderType == .RENTAL ? "대여가 완료되었습니다." : "구매가 완료되었습니다."
                         self.isShowPopup = true
                         self.getAudioContentDetail()
                         ContentPlayManager.shared.conditionalStopAudio(contentId: contentId)
                     } else {
                         if let message = decoded.message {
                             self.errorMessage = message
+                            if message.contains("캔이 부족합니다") {
+                                DispatchQueue.main.asyncAfter(deadline: .now() + 2) {
+                                    AppState.shared.setAppStep(step: .canCharge(refresh: {}, afterCompletionToGoBack: true))
+                                }
+                            }
                         } else {
                             self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
                         }
@@ -443,4 +449,84 @@ final class ContentDetailViewModel: ObservableObject {
                 .store(in: &subscription)
         }
     }
+    
+    func pinContent(contentId: Int) {
+        isLoading = true
+        repository.pinContent(contentId: contentId)
+            .sink { result in
+                switch result {
+                case .finished:
+                    DEBUG_LOG("finish")
+                case .failure(let error):
+                    ERROR_LOG(error.localizedDescription)
+                }
+            } receiveValue: { [unowned self] response in
+                self.isLoading = false
+                let responseData = response.data
+                
+                do {
+                    let jsonDecoder = JSONDecoder()
+                    let decoded = try jsonDecoder.decode(ApiResponseWithoutData.self, from: responseData)
+                    
+                    if decoded.success {
+                        self.errorMessage = "고정되었습니다"
+                        self.isShowPopup = true
+                        
+                        self.getAudioContentDetail()
+                    } else {
+                        if let message = decoded.message {
+                            self.errorMessage = message
+                        } else {
+                            self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
+                        }
+                        
+                        self.isShowPopup = true
+                    }
+                } catch {
+                    self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
+                    self.isShowPopup = true
+                }
+            }
+            .store(in: &subscription)
+    }
+    
+    func unpinContent(contentId: Int) {
+        isLoading = true
+        repository.unpinContent(contentId: contentId)
+            .sink { result in
+                switch result {
+                case .finished:
+                    DEBUG_LOG("finish")
+                case .failure(let error):
+                    ERROR_LOG(error.localizedDescription)
+                }
+            } receiveValue: { [unowned self] response in
+                self.isLoading = false
+                let responseData = response.data
+                
+                do {
+                    let jsonDecoder = JSONDecoder()
+                    let decoded = try jsonDecoder.decode(ApiResponseWithoutData.self, from: responseData)
+                    
+                    if decoded.success {
+                        self.errorMessage = "해제되었습니다"
+                        self.isShowPopup = true
+                        
+                        self.getAudioContentDetail()
+                    } else {
+                        if let message = decoded.message {
+                            self.errorMessage = message
+                        } else {
+                            self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
+                        }
+                        
+                        self.isShowPopup = true
+                    }
+                } catch {
+                    self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
+                    self.isShowPopup = true
+                }
+            }
+            .store(in: &subscription)
+    }
 }

SodaLive/Sources/Content/Detail/ContentOrderConfirmDialogView.swift

@@ -14,6 +14,7 @@ struct ContentOrderConfirmDialogView: View {
     
     let audioContent: GetAudioContentDetailResponse
     let orderType: OrderType
+    let isOnlyRental: Bool
     let onClickConfirm: () -> Void
     
     var body: some View {
@@ -90,9 +91,15 @@ struct ContentOrderConfirmDialogView: View {
                         .resizable()
                         .frame(width: 16.7, height: 16.7)
                     
-                    Text("\(orderType == .RENTAL ? Int(ceil(Double(audioContent.price) * 0.6)) : audioContent.price)")
+                    if orderType == .RENTAL {
-                        .font(.custom(Font.bold.rawValue, size: 13.3))
+                        Text("\(isOnlyRental ? audioContent.price : Int(ceil(Double(audioContent.price) * 0.6)))")
-                        .foregroundColor(Color(hex: "eeeeee"))
+                            .font(.custom(Font.bold.rawValue, size: 13.3))
+                            .foregroundColor(Color(hex: "eeeeee"))
+                    } else {
+                        Text("\(audioContent.price)")
+                            .font(.custom(Font.bold.rawValue, size: 13.3))
+                            .foregroundColor(Color(hex: "eeeeee"))
+                    }
                     
                     Spacer()
                 }

SodaLive/Sources/Content/Detail/ContentOrderDialogView.swift

@@ -12,6 +12,7 @@ struct ContentOrderDialogView: View {
     @Binding var isShowing: Bool
     
     let price: Int
+    let isOnlyRental: Bool
     let onTapPurchase: (OrderType) -> Void
     
     var body: some View {
@@ -31,7 +32,7 @@ struct ContentOrderDialogView: View {
                                 .font(.custom(Font.bold.rawValue, size: 13.3))
                                 .foregroundColor(.white)
                             
-                            Text("(이용기간 7일)")
+                            Text("(이용기간 15일)")
                                 .font(.custom(Font.light.rawValue, size: 12))
                                 .foregroundColor(.white)
                         }
@@ -43,7 +44,7 @@ struct ContentOrderDialogView: View {
                                 .resizable()
                                 .frame(width: 16.7, height: 16.7)
                             
-                            Text("\(Int(ceil(Double(price) * 0.6)))")
+                            Text(isOnlyRental ? "\(price)" : "\(Int(ceil(Double(price) * 0.6)))")
                                 .font(.custom(Font.bold.rawValue, size: 13.3))
                                 .foregroundColor(Color(hex: "eeeeee"))
                         }
@@ -57,35 +58,37 @@ struct ContentOrderDialogView: View {
                         }
                     }
                     
-                    HStack(spacing: 0) {
+                    if !isOnlyRental {
-                        VStack(alignment: .leading, spacing: 5.3) {
+                        HStack(spacing: 0) {
-                            Text("소장")
+                            VStack(alignment: .leading, spacing: 5.3) {
-                                .font(.custom(Font.bold.rawValue, size: 13.3))
+                                Text("소장")
-                                .foregroundColor(.white)
+                                    .font(.custom(Font.bold.rawValue, size: 13.3))
+                                    .foregroundColor(.white)
                                 
-                            Text("(서비스 종료시까지)")
+                                Text("(서비스 종료시까지)")
-                                .font(.custom(Font.light.rawValue, size: 12))
+                                    .font(.custom(Font.light.rawValue, size: 12))
-                                .foregroundColor(.white)
+                                    .foregroundColor(.white)
-                        }
+                            }
                             
-                        Spacer()
+                            Spacer()
                             
-                        HStack(spacing: 8) {
+                            HStack(spacing: 8) {
-                            Image("ic_can")
+                                Image("ic_can")
-                                .resizable()
+                                    .resizable()
-                                .frame(width: 16.7, height: 16.7)
+                                    .frame(width: 16.7, height: 16.7)
                                 
-                            Text("\(price)")
+                                Text("\(price)")
-                                .font(.custom(Font.bold.rawValue, size: 13.3))
+                                    .font(.custom(Font.bold.rawValue, size: 13.3))
-                                .foregroundColor(Color(hex: "eeeeee"))
+                                    .foregroundColor(Color(hex: "eeeeee"))
-                        }
+                            }
-                        .padding(.vertical, 8)
+                            .padding(.vertical, 8)
-                        .padding(.horizontal, 13.3)
+                            .padding(.horizontal, 13.3)
-                        .background(Color(hex: "9970ff"))
+                            .background(Color(hex: "9970ff"))
-                        .cornerRadius(5.3)
+                            .cornerRadius(5.3)
-                        .onTapGesture {
+                            .onTapGesture {
-                            onTapPurchase(.KEEP)
+                                onTapPurchase(.KEEP)
-                            isShowing = false
+                                isShowing = false
+                            }
                         }
                     }
                 }

SodaLive/Sources/Content/Detail/GetAudioContentDetailResponse.swift

@@ -17,8 +17,11 @@ struct GetAudioContentDetailResponse: Decodable {
     let tag: String
     let price: Int
     let duration: String
+    let releaseDate: String?
+    let isActivePreview: Bool
     let isAdult: Bool
     let isMosaic: Bool
+    let isOnlyRental: Bool
     let existOrdered: Bool
     let orderType: OrderType?
     let remainingTime: String?
@@ -29,6 +32,8 @@ struct GetAudioContentDetailResponse: Decodable {
     let likeCount: Int
     let commentList: [GetAudioContentCommentListItem]
     let commentCount: Int
+    let isPin: Bool
+    let isAvailablePin: Bool
     let creator: AudioContentCreator
 }
 

SodaLive/Sources/Content/Detail/LiveRoomDonationDialogView.swift

@@ -44,7 +44,7 @@ struct LiveRoomDonationDialogView: View {
                         
                         Text("후원하기")
                             .font(.custom(Font.bold.rawValue, size: 18.3))
-                            .foregroundColor(Color(hex: "eeeeee"))
+                            .foregroundColor(Color.grayee)
                         
                         Spacer()
                         
@@ -55,12 +55,12 @@ struct LiveRoomDonationDialogView: View {
                             
                             Text("\(can)")
                                 .font(.custom(Font.bold.rawValue, size: 18.3))
-                                .foregroundColor(Color(hex: "eeeeee"))
+                                .foregroundColor(Color.grayee)
                             
                             Image("ic_forward")
                         }
                         .onTapGesture {
-                            AppState.shared.setAppStep(step: .canCharge(refresh: {}))
+                            AppState.shared.setAppStep(step: .canCharge(refresh: {}, afterCompletionToGoBack: true))
                             self.isShowing = false
                         }
                     }
@@ -69,15 +69,15 @@ struct LiveRoomDonationDialogView: View {
                     
                     Rectangle()
                         .frame(height: 1)
-                        .foregroundColor(Color(hex: "909090"))
+                        .foregroundColor(Color.gray90)
                         .padding(.top, 16)
                     
                     TextField("몇 캔을 후원할까요?", text: $donationCan)
                         .font(.custom(Font.medium.rawValue, size: 13.3))
-                        .foregroundColor(Color(hex: "eeeeee"))
+                        .foregroundColor(Color.grayee)
                         .padding(13.3)
                         .keyboardType(.numberPad)
-                        .background(Color(hex: "303030"))
+                        .background(Color.gray30)
                         .cornerRadius(6.7)
                         .padding(.horizontal, 20)
                         .padding(.top, 16)
@@ -88,7 +88,7 @@ struct LiveRoomDonationDialogView: View {
                             .foregroundColor(.white)
                             .padding(.vertical, 12.7)
                             .frame(width: 74)
-                            .background(Color(hex: "9970ff"))
+                            .background(Color.button)
                             .cornerRadius(6.7)
                             .onTapGesture {
                                 if !donationCan.trimmingCharacters(in: .whitespaces).isEmpty,
@@ -106,7 +106,7 @@ struct LiveRoomDonationDialogView: View {
                             .foregroundColor(.white)
                             .padding(.vertical, 12.7)
                             .frame(width: 74)
-                            .background(Color(hex: "9970ff"))
+                            .background(Color.button)
                             .cornerRadius(6.7)
                             .onTapGesture {
                                 if !donationCan.trimmingCharacters(in: .whitespaces).isEmpty, let can = Int(donationCan) {
@@ -122,7 +122,7 @@ struct LiveRoomDonationDialogView: View {
                             .foregroundColor(.white)
                             .padding(.vertical, 12.7)
                             .frame(width: 74)
-                            .background(Color(hex: "9970ff"))
+                            .background(Color.button)
                             .cornerRadius(6.7)
                             .onTapGesture {
                                 if !donationCan.trimmingCharacters(in: .whitespaces).isEmpty,
@@ -140,7 +140,7 @@ struct LiveRoomDonationDialogView: View {
                             .foregroundColor(.white)
                             .padding(.vertical, 12.7)
                             .frame(width: 74)
-                            .background(Color(hex: "9970ff"))
+                            .background(Color.button)
                             .cornerRadius(6.7)
                             .onTapGesture {
                                 if !donationCan.trimmingCharacters(in: .whitespaces).isEmpty,
@@ -156,7 +156,7 @@ struct LiveRoomDonationDialogView: View {
                     
                     Rectangle()
                         .frame(height: 1)
-                        .foregroundColor(Color(hex: "909090"))
+                        .foregroundColor(Color.gray90)
                         .padding(.vertical, 18.7)
                         .padding(.horizontal, 20)
                     
@@ -169,14 +169,14 @@ struct LiveRoomDonationDialogView: View {
                             .clipShape(Circle())
                             .overlay(
                                 Circle()
-                                    .stroke(Color(hex: "bbbbbb"), lineWidth: 1)
+                                    .stroke(Color.graybb, lineWidth: 1)
                             )
                         
                         TextField("함께 보낼 메시지 입력(최대 50자)", text: $donationMessage)
                             .font(.custom(Font.medium.rawValue, size: 13.3))
-                            .foregroundColor(Color(hex: "eeeeee"))
+                            .foregroundColor(Color.grayee)
                             .padding(13.3)
-                            .background(Color(hex: "303030"))
+                            .background(Color.gray30)
                             .cornerRadius(6.7)
                             .onReceive(Just(donationMessage)) { _ in
                                 limitText()
@@ -187,15 +187,15 @@ struct LiveRoomDonationDialogView: View {
                     HStack(spacing: 13.3) {
                         Text("취소")
                             .font(.custom(Font.bold.rawValue, size: 15))
-                            .foregroundColor(Color(hex: "9970ff"))
+                            .foregroundColor(Color.button)
                             .padding(.vertical, 16)
                             .frame(width: (screenSize().width - 53.3) / 3)
-                            .background(Color(hex: "9970ff").opacity(0.2))
+                            .background(Color.button.opacity(0.2))
                             .cornerRadius(10)
                             .overlay(
                                 RoundedRectangle(cornerRadius: 10)
                                     .strokeBorder()
-                                    .foregroundColor(Color(hex: "9970ff"))
+                                    .foregroundColor(Color.button)
                             )
                             .onTapGesture {
                                 isShowing = false
@@ -206,7 +206,7 @@ struct LiveRoomDonationDialogView: View {
                             .foregroundColor(.white)
                             .padding(.vertical, 16)
                             .frame(width: (screenSize().width - 53.3) * 2 / 3)
-                            .background(Color(hex: "9970ff"))
+                            .background(Color.button)
                             .cornerRadius(10)
                             .onTapGesture {
                                 if !donationCan.trimmingCharacters(in: .whitespaces).isEmpty,
@@ -224,7 +224,7 @@ struct LiveRoomDonationDialogView: View {
                 }
                 .padding(.top, 21.3)
                 .padding(.bottom, 16)
-                .background(Color(hex: "222222"))
+                .background(Color.gray22)
                 .cornerRadius(20, corners: [.topLeft, .topRight])
             }
             .popup(isPresented: $isShowErrorPopup, type: .toast, position: .bottom, autohideIn: 1.3) {
@@ -234,7 +234,7 @@ struct LiveRoomDonationDialogView: View {
                         .padding(.vertical, 13.3)
                         .frame(width: screenSize().width - 66.7, alignment: .center)
                         .font(.custom(Font.medium.rawValue, size: 12))
-                        .background(Color(hex: "9970ff"))
+                        .background(Color.button)
                         .foregroundColor(Color.white)
                         .multilineTextAlignment(.leading)
                         .cornerRadius(20)

SodaLive/Sources/Content/Main/Banner/ContentMainBannerView.swift

@@ -0,0 +1,122 @@
+//
+//  ContentMainBannerView.swift
+//  SodaLive
+//
+//  Created by klaus on 2023/08/11.
+//
+
+import SwiftUI
+import Kingfisher
+
+struct ContentMainBannerView: View {
+    
+    @StateObject private var viewModel = ContentMainBannerViewModel()
+    
+    var body: some View {
+        ZStack {
+            if !viewModel.bannerList.isEmpty {
+                VStack(spacing: 0) {
+                    TabView(selection: $viewModel.currentIndex) {
+                        ForEach(0..<viewModel.bannerList.count, id: \.self) { index in
+                            let item = viewModel.bannerList[index]
+                            if let url = item.thumbnailImageUrl.addingPercentEncoding(withAllowedCharacters: .urlQueryAllowed) {
+                                KFImage(URL(string: url))
+                                    .resizable()
+                                    .scaledToFill()
+                                    .frame(
+                                        width: screenSize().width - 26.7,
+                                        height: (screenSize().width - 26.7) * 0.53
+                                    )
+                                    .onTapGesture {
+                                        switch item.type {
+                                        case .EVENT:
+                                            AppState.shared.setAppStep(step: .eventDetail(event: item.eventItem!))
+                                        case .CREATOR:
+                                            AppState.shared.setAppStep(step: .creatorDetail(userId: item.creatorId!))
+                                        case .LINK:
+                                            if let link = item.link, link.trimmingCharacters(in: .whitespaces).count > 0, let url = URL(string: link), UIApplication.shared.canOpenURL(url) {
+                                                UIApplication.shared.open(url)
+                                            }
+                                        }
+                                    }
+                                    .cornerRadius(4.7)
+                            } else {
+                                KFImage(URL(string: item.thumbnailImageUrl))
+                                    .resizable()
+                                    .scaledToFill()
+                                    .frame(
+                                        width: screenSize().width - 26.7,
+                                        height: (screenSize().width - 26.7) * 0.53
+                                    )
+                                    .onTapGesture {
+                                        switch item.type {
+                                        case .EVENT:
+                                            AppState.shared.setAppStep(step: .eventDetail(event: item.eventItem!))
+                                        case .CREATOR:
+                                            AppState.shared.setAppStep(step: .creatorDetail(userId: item.creatorId!))
+                                        case .LINK:
+                                            if let link = item.link, link.trimmingCharacters(in: .whitespaces).count > 0, let url = URL(string: link), UIApplication.shared.canOpenURL(url) {
+                                                UIApplication.shared.open(url)
+                                            }
+                                        }
+                                    }
+                                    .cornerRadius(4.7)
+                            }
+                        }
+                    }
+                    .tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
+                    .frame(
+                        width: screenSize().width - 26.7,
+                        height: (screenSize().width - 26.7) * 0.53
+                    )
+                    
+                    HStack(spacing: 4) {
+                        ForEach(0..<viewModel.bannerList.count, id: \.self) { index in
+                            Capsule()
+                                .foregroundColor(index == viewModel.currentIndex ? Color(hex: "3bb9f1") : Color(hex: "909090"))
+                                .frame(
+                                    width: index == viewModel.currentIndex ? 18 : 6,
+                                    height: 6
+                                )
+                                .tag(index)
+                        }
+                    }
+                    .padding(.top, 13.3)
+                }
+                .frame(maxWidth: .infinity)
+                .onAppear {
+                    viewModel.timer = Timer.publish(every: 3, on: .main, in: .common).autoconnect()
+                }
+                .onDisappear {
+                    viewModel.timer.upstream.connect().cancel()
+                }
+                .onReceive(viewModel.timer) { _ in
+                    DispatchQueue.main.async {
+                        withAnimation {
+                            if viewModel.currentIndex == viewModel.bannerList.count - 1 {
+                                viewModel.currentIndex = 0
+                            } else {
+                                viewModel.currentIndex += 1
+                            }
+                        }
+                    }
+                }
+            }
+            
+            if viewModel.isLoading {
+                ActivityIndicatorView()
+                    .frame(width: 100, height: 100)
+            }
+        }
+        .frame(maxWidth: .infinity)
+        .onAppear {
+            viewModel.getBannerList()
+        }
+    }
+}
+
+struct ContentMainBannerView_Previews: PreviewProvider {
+    static var previews: some View {
+        ContentMainBannerView()
+    }
+}

SodaLive/Sources/Content/Main/Banner/ContentMainBannerViewModel.swift

@@ -0,0 +1,65 @@
+//
+//  ContentMainBannerViewModel.swift
+//  SodaLive
+//
+//  Created by klaus on 2023/12/11.
+//
+
+import Foundation
+import Combine
+
+final class ContentMainBannerViewModel: ObservableObject {
+    
+    private let repository = ContentRepository()
+    private var subscription = Set<AnyCancellable>()
+    
+    @Published var errorMessage = ""
+    @Published var isShowPopup = false
+    @Published var isLoading = false
+    
+    @Published var currentIndex = 0
+    @Published var timer = Timer.publish(every: 3, on: .main, in: .common).autoconnect()
+    
+    @Published var bannerList = [GetAudioContentBannerResponse]()
+    
+    func getBannerList() {
+        isLoading = true
+        
+        repository.getMainBannerList()
+            .sink { result in
+                switch result {
+                case .finished:
+                    DEBUG_LOG("finish")
+                case .failure(let error):
+                    ERROR_LOG(error.localizedDescription)
+                }
+            } receiveValue: { [unowned self] response in
+                self.isLoading = false
+                let responseData = response.data
+                
+                do {
+                    let jsonDecoder = JSONDecoder()
+                    let decoded = try jsonDecoder.decode(ApiResponse<[GetAudioContentBannerResponse]>.self, from: responseData)
+                    self.isLoading = false
+                    
+                    if let data = decoded.data, decoded.success {
+                        self.bannerList.removeAll()
+                        self.bannerList.append(contentsOf: data)
+                    } else {
+                        if let message = decoded.message {
+                            self.errorMessage = message
+                        } else {
+                            self.errorMessage = "배너를 불러오지 못했습니다. 다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
+                        }
+                        
+                        self.isShowPopup = true
+                    }
+                } catch {
+                    self.errorMessage = "배너를 불러오지 못했습니다. 다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
+                    self.isShowPopup = true
+                    self.isLoading = false
+                }
+            }
+            .store(in: &subscription)
+    }
+}

SodaLive/Sources/Content/Main/ContentMainBannerView.swift

@@ -1,114 +0,0 @@
-//
-//  ContentMainBannerView.swift
-//  SodaLive
-//
-//  Created by klaus on 2023/08/11.
-//
-
-import SwiftUI
-import Kingfisher
-
-struct ContentMainBannerView: View {
-    
-    let items: [GetAudioContentBannerResponse]
-    @State private var currentIndex = 0
-    @State private var timer = Timer.publish(every: 3, on: .main, in: .common).autoconnect()
-    
-    var body: some View {
-        VStack(spacing: 0) {
-            TabView(selection: $currentIndex) {
-                ForEach(0..<items.count, id: \.self) { index in
-                    let item = items[index]
-                    if let url = item.thumbnailImageUrl.addingPercentEncoding(withAllowedCharacters: .urlQueryAllowed) {
-                        KFImage(URL(string: url))
-                            .resizable()
-                            .scaledToFill()
-                            .frame(
-                                width: screenSize().width - 26.7,
-                                height: (screenSize().width - 26.7) * 0.53
-                            )
-                            .onTapGesture {
-                                switch item.type {
-                                case .EVENT:
-                                    AppState.shared.setAppStep(step: .eventDetail(event: item.eventItem!))
-                                case .CREATOR:
-                                    AppState.shared.setAppStep(step: .creatorDetail(userId: item.creatorId!))
-                                case .LINK:
-                                    if let link = item.link, link.trimmingCharacters(in: .whitespaces).count > 0, let url = URL(string: link), UIApplication.shared.canOpenURL(url) {
-                                        UIApplication.shared.open(url)
-                                    }
-                                }
-                            }
-                            .cornerRadius(4.7)
-                    } else {
-                        KFImage(URL(string: item.thumbnailImageUrl))
-                            .resizable()
-                            .scaledToFill()
-                            .frame(
-                                width: screenSize().width - 26.7,
-                                height: (screenSize().width - 26.7) * 0.53
-                            )
-                            .onTapGesture {
-                                switch item.type {
-                                case .EVENT:
-                                    AppState.shared.setAppStep(step: .eventDetail(event: item.eventItem!))
-                                case .CREATOR:
-                                    AppState.shared.setAppStep(step: .creatorDetail(userId: item.creatorId!))
-                                case .LINK:
-                                    if let link = item.link, link.trimmingCharacters(in: .whitespaces).count > 0, let url = URL(string: link), UIApplication.shared.canOpenURL(url) {
-                                        UIApplication.shared.open(url)
-                                    }
-                                }
-                            }
-                            .cornerRadius(4.7)
-                    }
-                }
-            }
-            .tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
-            .frame(
-                width: screenSize().width - 26.7,
-                height: (screenSize().width - 26.7) * 0.53
-            )
-            
-            HStack(spacing: 4) {
-                ForEach(0..<items.count, id: \.self) { index in
-                    Capsule()
-                        .foregroundColor(index == currentIndex ? Color(hex: "9970ff") : Color(hex: "909090"))
-                        .frame(
-                            width: index == currentIndex ? 18 : 6,
-                            height: 6
-                        )
-                        .tag(index)
-                }
-            }
-            .padding(.top, 13.3)
-        }
-        .frame(width: screenSize().width - 26.7)
-        .onAppear {
-            timer = Timer.publish(every: 3, on: .main, in: .common).autoconnect()
-        }
-        .onDisappear {
-            timer.upstream.connect().cancel()
-        }
-        .onReceive(timer) { _ in
-            DispatchQueue.main.async {
-                withAnimation {
-                    if currentIndex == items.count - 1 {
-                        currentIndex = 0
-                    } else {
-                        currentIndex += 1
-                    }
-                }
-            }
-        }
-    }
-}
-
-struct ContentMainBannerView_Previews: PreviewProvider {
-    static var previews: some View {
-        ContentMainBannerView(
-            items: [
-            ]
-        )
-    }
-}

SodaLive/Sources/Content/Main/ContentMainCurationView.swift

@@ -1,22 +0,0 @@
-//
-//  ContentMainCurationView.swift
-//  SodaLive
-//
-//  Created by klaus on 2023/08/11.
-//
-
-import SwiftUI
-
-struct ContentMainCurationView: View {
-    
-    let items: [GetAudioContentCurationResponse]
-    
-    var body: some View {
-        LazyVStack(spacing: 40) {
-            ForEach(0..<items.count, id: \.self) {
-                ContentMainCurationItemView(item: items[$0])
-                    .padding(.horizontal, 13.3)
-            }
-        }
-    }
-}

SodaLive/Sources/Content/Main/ContentMainItemView.swift

@@ -57,10 +57,11 @@ struct ContentMainItemView_Previews: PreviewProvider {
                 contentId: 2,
                 coverImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png",
                 title: "ㅓ처랴햐햫햐햐",
-                isAdult: true,
                 creatorId: 8,
                 creatorProfileImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png",
-                creatorNickname: "유저2"
+                creatorNickname: "유저2",
+                price: 10,
+                duration: "00:00:30"
             )
         )
     }

SodaLive/Sources/Content/Main/ContentMainMyStashView.swift

@@ -1,59 +0,0 @@
-//
-//  ContentMainMyStashView.swift
-//  SodaLive
-//
-//  Created by klaus on 2023/08/11.
-//
-
-import SwiftUI
-
-struct ContentMainMyStashView: View {
-    
-    let items: [GetAudioContentMainItem]
-    
-    var body: some View {
-        VStack(alignment: .leading, spacing: 13.3) {
-            HStack(spacing: 0) {
-                Text("내 보관함")
-                    .font(.custom(Font.bold.rawValue, size: 18.3))
-                    .foregroundColor(Color(hex: "eeeeee"))
-                
-                Spacer()
-                
-                Text("전체보기")
-                    .font(.custom(Font.light.rawValue, size: 11.3))
-                    .foregroundColor(Color(hex: "bbbbbb"))
-                    .onTapGesture {
-                        AppState.shared.setAppStep(step: .orderListAll)
-                    }
-            }
-            
-            ScrollView(.horizontal, showsIndicators: false) {
-                LazyHStack(alignment: .top, spacing: 13.3) {
-                    ForEach(0..<items.count, id: \.self) { index in
-                        let item = items[index]
-                        ContentMainItemView(item: item)
-                    }
-                }
-            }
-        }
-    }
-}
-
-struct ContentMainMyStashView_Previews: PreviewProvider {
-    static var previews: some View {
-        ContentMainMyStashView(
-            items: [
-                GetAudioContentMainItem(
-                    contentId: 1,
-                    coverImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png",
-                    title: "테스트",
-                    isAdult: false,
-                    creatorId: 7,
-                    creatorProfileImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png",
-                    creatorNickname: "유저1"
-                )
-            ]
-        )
-    }
-}

SodaLive/Sources/Content/Main/ContentMainNewContentCreatorView.swift

@@ -1,48 +0,0 @@
-//
-//  ContentMainNewContentCreatorView.swift
-//  SodaLive
-//
-//  Created by klaus on 2023/08/11.
-//
-
-import SwiftUI
-
-struct ContentMainNewContentCreatorView: View {
-    
-    let items: [GetNewContentUploadCreator]
-    
-    var body: some View {
-        ScrollView(.horizontal, showsIndicators: false) {
-            LazyHStack(spacing: 21.3) {
-                ForEach(0..<items.count, id: \.self) { index in
-                    let item = items[index]
-                    ContentMainNewContentCreatorItemView(item: item)
-                }
-            }
-        }
-    }
-}
-
-struct ContentMainNewContentCreatorView_Previews: PreviewProvider {
-    static var previews: some View {
-        ContentMainNewContentCreatorView(
-            items: [
-                GetNewContentUploadCreator(
-                    creatorId: 1,
-                    creatorNickname: "수다친구1",
-                    creatorProfileImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png"
-                ),
-                GetNewContentUploadCreator(
-                    creatorId: 2,
-                    creatorNickname: "수다친구2",
-                    creatorProfileImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png"
-                ),
-                GetNewContentUploadCreator(
-                    creatorId: 3,
-                    creatorNickname: "수다친구3",
-                    creatorProfileImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png"
-                )
-            ]
-        )
-    }
-}

SodaLive/Sources/Content/Main/ContentMainNewContentView.swift

@@ -1,68 +0,0 @@
-//
-//  ContentMainNewContentView.swift
-//  SodaLive
-//
-//  Created by klaus on 2023/08/11.
-//
-
-import SwiftUI
-
-struct ContentMainNewContentView: View {
-    
-    let themes: [String]
-    let items: [GetAudioContentMainItem]
-    
-    let selectTheme: (String) -> Void
-    @Binding var selectedTheme: String
-    
-    var body: some View {
-        VStack(alignment: .leading, spacing: 0) {
-            HStack(spacing: 0) {
-                Text("새로운 콘텐츠")
-                    .font(.custom(Font.bold.rawValue, size: 18.3))
-                    .foregroundColor(Color(hex: "eeeeee"))
-                
-                Spacer()
-                
-                Image("ic_forward")
-                    .resizable()
-                    .frame(width: 20, height: 20)
-                    .onTapGesture {
-                        AppState.shared.setAppStep(step: .newContentAll)
-                    }
-            }
-            
-            ContentMainNewContentThemeView(themes: themes, selectTheme: selectTheme, selectedTheme: $selectedTheme)
-                .padding(.vertical, 16.7)
-            
-            ScrollView(.horizontal, showsIndicators: false) {
-                HStack(alignment: .top, spacing: 13.3) {
-                    ForEach(0..<items.count, id: \.self) {
-                        ContentMainItemView(item: items[$0])
-                    }
-                }
-            }
-        }
-    }
-}
-
-struct ContentMainNewContentView_Previews: PreviewProvider {
-    static var previews: some View {
-        ContentMainNewContentView(
-            themes: ["전체", "테마1", "테마2"],
-            items: [
-                GetAudioContentMainItem(
-                    contentId: 1,
-                    coverImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png",
-                    title: "테스트",
-                    isAdult: false,
-                    creatorId: 7,
-                    creatorProfileImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png",
-                    creatorNickname: "유저1"
-                )
-            ],
-            selectTheme: { _ in },
-            selectedTheme: .constant("전체")
-        )
-    }
-}

SodaLive/Sources/Content/Main/ContentMainView.swift

@@ -19,50 +19,87 @@ struct ContentMainView: View {
             RefreshableScrollView(
                 refreshing: $viewModel.isLoading,
                 action: {
-                    viewModel.getMain()
+                    viewModel.refresh()
                 }
             ) {
-                LazyVStack(alignment: .leading, spacing: 0) {
+                VStack(alignment: .leading, spacing: 0) {
                     Text("콘텐츠 마켓")
                         .font(.custom(Font.bold.rawValue, size: 21.3))
-                        .foregroundColor(Color(hex: "9970ff"))
+                        .foregroundColor(Color(hex: "3bb9f1"))
                         .padding(.bottom, 26.7)
                         .padding(.horizontal, 13.3)
                     
-                    if viewModel.newContentUploadCreatorList.count > 0 {
+                    if !viewModel.isLoading {
-                        ContentMainNewContentCreatorView(items: viewModel.newContentUploadCreatorList)
+                        ContentMainNewContentCreatorView()
                             .padding(.bottom, 26.7)
                             .padding(.horizontal, 13.3)
-                    }
                         
-                    if viewModel.bannerList.count > 0 {
+                        ContentMainBannerView()
-                        ContentMainBannerView(items: viewModel.bannerList)
+                            .padding(.bottom, 26.7)
-                            .padding(.bottom, 40)
                             .padding(.horizontal, 13.3)
-                    }
                         
-                    if viewModel.orderList.count > 0 {
+                        HStack(spacing: 13.3) {
-                        ContentMainMyStashView(items: viewModel.orderList)
+                            VStack(spacing: 2.7) {
-                            .padding(.bottom, 40)
+                                HStack(spacing: 2.7) {
+                                    Image("ic_short_play")
+                                    
+                                    Text("숏플")
+                                        .font(.custom(Font.bold.rawValue, size: 14.7))
+                                        .foregroundColor(Color(hex: "dd158d"))
+                                }
+                                
+                                Text("짧지만 꼴릿한 이야기")
+                                    .font(.custom(Font.light.rawValue, size: 10))
+                                    .foregroundColor(Color(hex: "dd158d"))
+                            }
+                            .padding(.vertical, 10)
+                            .frame(maxWidth: .infinity)
+                            .background(Color(hex: "ffecf7"))
+                            .cornerRadius(2.6)
+                            .onTapGesture {
+                                AppState.shared.setAppStep(
+                                    step: .contentAllByTheme(themeId: 11)
+                                )
+                            }
+                            
+                            VStack(spacing: 2.7) {
+                                HStack(spacing: 2.7) {
+                                    Image("ic_thumb_play_blue")
+                                    
+                                    Text("라이브 다시듣기")
+                                        .font(.custom(Font.bold.rawValue, size: 14.7))
+                                        .foregroundColor(Color(hex: "0057ff"))
+                                }
+                                
+                                Text("놓쳤던 라이브 다시듣기")
+                                    .font(.custom(Font.light.rawValue, size: 10))
+                                    .foregroundColor(Color(hex: "0057ff"))
+                            }
+                            .padding(.vertical, 10)
+                            .frame(maxWidth: .infinity)
+                            .background(Color(hex: "ecf9ff"))
+                            .cornerRadius(2.6)
+                            .onTapGesture {
+                                AppState.shared.setAppStep(
+                                    step: .contentAllByTheme(themeId: 7)
+                                )
+                            }
+                        }
+                        .padding(.bottom, 40)
+                        .padding(.horizontal, 13.3)
+                        
+                        ContentMainMyStashView()
                             .padding(.horizontal, 13.3)
-                    }
                         
-                    ContentMainNewContentView(
+                        ContentMainNewContentView()
-                        themes: viewModel.themeList,
+                            .padding(.horizontal, 13.3)
-                        items: viewModel.newContentList,
-                        selectTheme: { viewModel.selectedTheme = $0 },
-                        selectedTheme: $viewModel.selectedTheme
-                    )
-                    .padding(.horizontal, 13.3)
                         
-                    if let contentRanking = viewModel.contentRanking {
+                        ContentMainRankingView()
-                        ContentMainRankingView(item: contentRanking)
                             .padding(.top, 40)
                             .padding(.horizontal, 13.3)
-                    }
+                            .animation(nil)
                         
-                    if viewModel.curationList.count > 0 {
+                        ContentMainCurationView()
-                        ContentMainCurationView(items: viewModel.curationList)
                             .padding(.top, 40)
                             .padding(.bottom, 20)
                     }
@@ -81,7 +118,7 @@ struct ContentMainView: View {
                         .foregroundColor(.white)
                 }
                 .padding(13.3)
-                .background(Color(hex: "9970ff"))
+                .background(Color(hex: "3bb9f1"))
                 .cornerRadius(44)
                 .padding(.trailing, 16.7)
                 .padding(.bottom, 16.7)
@@ -94,28 +131,6 @@ struct ContentMainView: View {
                 LoadingView()
             }
         }
-        .popup(isPresented: $viewModel.isShowPopup, type: .toast, position: .top, autohideIn: 2) {
-            GeometryReader { geo in
-                HStack {
-                    Spacer()
-                    Text(viewModel.errorMessage)
-                        .padding(.vertical, 13.3)
-                        .padding(.horizontal, 6.7)
-                        .frame(width: geo.size.width - 66.7, alignment: .center)
-                        .font(.custom(Font.medium.rawValue, size: 12))
-                        .background(Color(hex: "9970ff"))
-                        .foregroundColor(Color.white)
-                        .multilineTextAlignment(.leading)
-                        .fixedSize(horizontal: false, vertical: true)
-                        .cornerRadius(20)
-                        .padding(.top, 66.7)
-                    Spacer()
-                }
-            }
-        }
-        .onAppear {
-            viewModel.getMain()
-        }
     }
 }
 

SodaLive/Sources/Content/Main/ContentMainViewModel.swift

@@ -10,118 +10,13 @@ import Foundation
 import Combine
 
 final class ContentMainViewModel: ObservableObject {
-    
-    private let repository = ContentRepository()
-    private var subscription = Set<AnyCancellable>()
-    
-    @Published var errorMessage = ""
-    @Published var isShowPopup = false
     @Published var isLoading = false
     
-    @Published var newContentUploadCreatorList = [GetNewContentUploadCreator]()
+    func refresh() {
-    @Published var newContentList = [GetAudioContentMainItem]()
-    @Published var bannerList = [GetAudioContentBannerResponse]()
-    @Published var orderList = [GetAudioContentMainItem]()
-    @Published var themeList = [String]()
-    @Published var curationList = [GetAudioContentCurationResponse]()
-    @Published var contentRanking: GetAudioContentRanking? = nil
-    
-    @Published var selectedTheme = "전체" {
-        didSet {
-            getNewContentOfTheme()
-        }
-    }
-    
-    func getMain() {
         isLoading = true
         
-        repository.getMain()
+        DispatchQueue.main.asyncAfter(deadline: .now() + 0.5) { [unowned self] in
-            .sink { result in
+            self.isLoading = false
-                switch result {
+        }
-                case .finished:
-                    DEBUG_LOG("finish")
-                case .failure(let error):
-                    ERROR_LOG(error.localizedDescription)
-                }
-            } receiveValue: { [unowned self] response in
-                self.isLoading = false
-                let responseData = response.data
-                
-                do {
-                    let jsonDecoder = JSONDecoder()
-                    let decoded = try jsonDecoder.decode(ApiResponse<GetAudioContentMainResponse>.self, from: responseData)
-                    self.isLoading = false
-                    
-                    if let data = decoded.data, decoded.success {
-                        self.newContentUploadCreatorList.removeAll()
-                        self.newContentList.removeAll()
-                        self.bannerList.removeAll()
-                        self.orderList.removeAll()
-                        self.curationList.removeAll()
-                        self.themeList.removeAll()
-                        
-                        self.newContentUploadCreatorList.append(contentsOf: data.newContentUploadCreatorList)
-                        self.newContentList.append(contentsOf: data.newContentList)
-                        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)
-                    } else {
-                        if let message = decoded.message {
-                            self.errorMessage = message
-                        } else {
-                            self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
-                        }
-                        
-                        self.isShowPopup = true
-                    }
-                } catch {
-                    print(error)
-                    self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
-                    self.isShowPopup = true
-                    self.isLoading = false
-                }
-            }
-            .store(in: &subscription)
-    }
-    
-    func getNewContentOfTheme() {
-        repository.getNewContentOfTheme(theme: selectedTheme == "전체" ? "" : selectedTheme)
-            .sink { result in
-                switch result {
-                case .finished:
-                    DEBUG_LOG("finish")
-                case .failure(let error):
-                    ERROR_LOG(error.localizedDescription)
-                }
-            } receiveValue: { [unowned self] response in
-                self.isLoading = false
-                let responseData = response.data
-                
-                do {
-                    let jsonDecoder = JSONDecoder()
-                    let decoded = try jsonDecoder.decode(ApiResponse<[GetAudioContentMainItem]>.self, from: responseData)
-                    
-                    if let data = decoded.data, decoded.success {
-                        self.newContentList.removeAll()
-                        self.newContentList.append(contentsOf: data)
-                    } else {
-                        if let message = decoded.message {
-                            self.errorMessage = message
-                        } else {
-                            self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
-                        }
-                        
-                        self.isShowPopup = true
-                    }
-                } catch {
-                    self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
-                    self.isShowPopup = true
-                }
-            }
-            .store(in: &subscription)
     }
 }