feat(chat-character): 신규 캐릭터 전체보기 화면 및 API 연동 추가

This commit is contained in:
Yu Sung
2025-09-12 22:28:53 +09:00
parent 49e014878d
commit ed3f3f796a
11 changed files with 365 additions and 25 deletions

View File

@@ -14,6 +14,7 @@ enum CharacterApi {
case getCharacterImageList(characterId: Int, page: Int, size: Int)
case getMyCharacterImageList(characterId: Int64, page: Int, size: Int)
case purchaseCharacterImage(imageId: Int)
case getRecentCharacters(page: Int, size: Int)
}
extension CharacterApi: TargetType {
@@ -35,6 +36,9 @@ extension CharacterApi: TargetType {
case .purchaseCharacterImage:
return "/api/chat/character/image/purchase"
case .getRecentCharacters:
return "/api/chat/character/recent"
}
}
@@ -53,6 +57,15 @@ extension CharacterApi: TargetType {
case .getCharacterHome, .getCharacterDetail:
return .requestPlain
case .getRecentCharacters(let page, let size):
return .requestParameters(
parameters: [
"page": page,
"size": size
],
encoding: URLEncoding.queryString
)
case .getCharacterImageList(let characterId, let page, let size):
return .requestParameters(
parameters: [

View File

@@ -11,14 +11,25 @@ struct CharacterSectionView: View {
let title: String
let items: [Character]
let isShowRank: Bool
var trailingTitle: String? = nil
var onTapTrailing: (() -> Void)? = nil
var onTap: (Character) -> Void = { _ in }
var body: some View {
VStack(alignment: .leading, spacing: 16) {
Text(title)
.font(.custom(Font.preBold.rawValue, size: 20))
.foregroundColor(.white)
.padding(.horizontal, 24)
HStack(spacing: 0) {
Text(title)
.font(.custom(Font.preBold.rawValue, size: 20))
.foregroundColor(.white)
Spacer()
if let trailingTitle = trailingTitle {
Text(trailingTitle)
.font(.custom(Font.preRegular.rawValue, size: 14))
.foregroundColor(Color(hex: "90A4AE"))
.onTapGesture { onTapTrailing?() }
}
}
.padding(.horizontal, 24)
ScrollView(.horizontal, showsIndicators: false) {
HStack(spacing: 16) {

View File

@@ -40,10 +40,11 @@ struct CharacterView: View {
CharacterSectionView(
title: "인기 캐릭터",
items: viewModel.popularCharacters,
isShowRank: true
) { ch in
onSelectCharacter(ch.characterId)
}
isShowRank: true,
onTap: { ch in
onSelectCharacter(ch.characterId)
}
)
}
//
@@ -51,10 +52,16 @@ struct CharacterView: View {
CharacterSectionView(
title: "신규 캐릭터",
items: viewModel.newCharacters,
isShowRank: false
) { ch in
onSelectCharacter(ch.characterId)
}
isShowRank: false,
trailingTitle: "전체보기",
onTapTrailing: {
AppState.shared
.setAppStep(step: .newCharacterAll)
},
onTap: { ch in
onSelectCharacter(ch.characterId)
}
)
}
// ( )
@@ -65,10 +72,11 @@ struct CharacterView: View {
CharacterSectionView(
title: section.title,
items: section.characters,
isShowRank: false
) { ch in
onSelectCharacter(ch.characterId)
}
isShowRank: false,
onTap: { ch in
onSelectCharacter(ch.characterId)
}
)
}
}
}

View File

@@ -17,6 +17,8 @@ struct CharacterDetailView: View {
@State private var showMoreWorldView = false
@State private var showMorePersonality = false
@Environment(\.presentationMode) var presentationMode: Binding<PresentationMode>
private enum InnerTab: Int, CaseIterable {
case detail = 0
case gallery = 1
@@ -32,7 +34,13 @@ struct CharacterDetailView: View {
var body: some View {
BaseView(isLoading: $viewModel.isLoading) {
VStack(spacing: 0) {
DetailNavigationBar(title: "캐릭터 정보")
DetailNavigationBar(title: "캐릭터 정보") {
if presentationMode.wrappedValue.isPresented {
presentationMode.wrappedValue.dismiss()
} else {
AppState.shared.back()
}
}
tabBar
@@ -121,6 +129,8 @@ struct CharacterDetailView: View {
}
}
}
.navigationTitle("")
.navigationBarBackButtonHidden()
.popup(isPresented: $viewModel.isShowPopup, type: .toast, position: .top, autohideIn: 2) {
GeometryReader { geo in
HStack {
@@ -368,7 +378,7 @@ extension CharacterDetailView {
}
Text("""
보이스온의 오픈월드 캐릭터톡으로 대화의 자유도가 높아 대화에 참여하는 당신은 누구든 될 수 있습니다. 세계관 속 연관 캐릭터가 되어 대화를 하거나 완전히 새로운 인물이 되어 캐릭터와 당신만의 스토리를 만들어 갈 수 있습니다.
보이스온의 오픈월드 캐릭터톡 대화의 자유도가 높아 대화에 참여하는 당신은 누구든 될 수 있습니다. 세계관 속 연관 캐릭터가 되어 대화를 하거나 완전히 새로운 인물이 되어 캐릭터와 당신만의 스토리를 만들어 갈 수 있습니다.
""")
.font(.custom(Font.preRegular.rawValue, size: 16))
.foregroundColor(Color(hex: "AEAEB2"))

View File

@@ -0,0 +1,15 @@
//
// RecentCharactersResponse.swift
// SodaLive
//
// Created by klaus on 9/12/25.
//
import Foundation
///
/// : totalCount(Long), content(List<Character>)
struct RecentCharactersResponse: Decodable {
let totalCount: Int
let content: [Character]
}

View File

@@ -0,0 +1,19 @@
//
// NewCharacterRepository.swift
// SodaLive
//
// Created by klaus on 9/12/25.
//
import Foundation
import Combine
import CombineMoya
import Moya
final class NewCharacterRepository {
private let api = MoyaProvider<CharacterApi>()
func getRecentCharacters(page: Int, size: Int) -> AnyPublisher<Response, MoyaError> {
return api.requestPublisher(.getRecentCharacters(page: page, size: size))
}
}

View File

@@ -0,0 +1,117 @@
//
// NewCharacterListViewModel.swift
// SodaLive
//
// Created by klaus on 9/12/25.
//
import Foundation
import Combine
import Moya
final class NewCharacterListViewModel: ObservableObject {
// MARK: - Outputs
@Published private(set) var totalCount: Int = 0
@Published private(set) var items: [Character] = []
@Published var isLoading: Bool = false
@Published var isLoadingMore: Bool = false
@Published var errorMessage: String = ""
@Published var isShowPopup: Bool = false
// MARK: - Private
private let repository = NewCharacterRepository()
private var subscription = Set<AnyCancellable>()
private var currentPage: Int = 0
private let pageSize: Int = 20
private var hasMorePages: Bool = true
// MARK: - API
func fetch() {
//
currentPage = 0
hasMorePages = true
items.removeAll()
request(page: currentPage)
}
func loadMoreIfNeeded(currentIndex: Int) {
guard hasMorePages,
!isLoading,
!isLoadingMore,
currentIndex >= items.count - 1 else { return }
loadMore()
}
// MARK: - Private
private func loadMore() {
guard hasMorePages, !isLoadingMore else { return }
isLoadingMore = true
currentPage += 1
request(page: currentPage, isLoadMore: true)
}
private func request(page: Int, isLoadMore: Bool = false) {
if !isLoadMore {
isLoading = true
}
repository.getRecentCharacters(page: page, size: pageSize)
.receive(on: DispatchQueue.main)
.sink { [weak self] completion in
switch completion {
case .finished:
DEBUG_LOG("finish")
case .failure(let error):
ERROR_LOG(error.localizedDescription)
if isLoadMore {
self?.isLoadingMore = false
} else {
self?.isLoading = false
}
self?.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
self?.isShowPopup = true
}
} receiveValue: { [weak self] response in
guard let self = self else { return }
do {
let jsonDecoder = JSONDecoder()
let decoded = try jsonDecoder.decode(ApiResponse<RecentCharactersResponse>.self, from: response.data)
if let data = decoded.data, decoded.success {
self.totalCount = data.totalCount
if isLoadMore {
self.items.append(contentsOf: data.content)
self.isLoadingMore = false
} else {
self.items = data.content
self.isLoading = false
}
// hasMore ( )
if self.items.count >= self.totalCount || data.content.isEmpty {
self.hasMorePages = false
}
} else {
if let message = decoded.message {
self.errorMessage = message
} else {
self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
}
self.isShowPopup = true
if isLoadMore {
self.isLoadingMore = false
} else {
self.isLoading = false
}
}
} catch {
if isLoadMore {
self.isLoadingMore = false
} else {
self.isLoading = false
}
self.errorMessage = "다시 시도해 주세요.\n계속 같은 문제가 발생할 경우 고객센터로 문의 주시기 바랍니다."
self.isShowPopup = true
}
}
.store(in: &subscription)
}
}

View File

@@ -0,0 +1,123 @@
//
// NewCharacterListView.swift
// SodaLive
//
// Created by klaus on 9/12/25.
//
import SwiftUI
struct NewCharacterListView: View {
@StateObject private var viewModel = NewCharacterListViewModel()
private let horizontalPadding: CGFloat = 12
private let gridSpacing: CGFloat = 12
var body: some View {
NavigationStack {
BaseView(isLoading: $viewModel.isLoading) {
VStack(spacing: 8) {
// Toolbar
DetailNavigationBar(title: "신규 캐릭터 전체보기")
VStack(alignment: .leading, spacing: 12) {
// n
HStack(spacing: 0) {
Text("전체 ")
.font(.custom(Font.preRegular.rawValue, size: 12))
.foregroundColor(Color(hex: "e2e2e2"))
Text("\(viewModel.totalCount)")
.font(.custom(Font.preRegular.rawValue, size: 12))
.foregroundColor(Color(hex: "ff5c49"))
Text("")
.font(.custom(Font.preRegular.rawValue, size: 12))
.foregroundColor(Color(hex: "e2e2e2"))
Spacer()
}
.padding(.horizontal, 24)
// Grid 3
GeometryReader { geo in
let totalSpacing: CGFloat = gridSpacing * 2
let width = (geo.size.width - (horizontalPadding * 2) - totalSpacing) / 3
ScrollView(.vertical, showsIndicators: false) {
LazyVGrid(
columns: Array(
repeating: GridItem(
.flexible(),
spacing: gridSpacing,
alignment: .topLeading
),
count: 3
),
alignment: .leading,
spacing: gridSpacing
) {
ForEach(viewModel.items.indices, id: \.self) { idx in
let item = viewModel.items[idx]
NavigationLink(value: item.characterId) {
CharacterItemView(
character: item,
size: width,
rank: 0,
isShowRank: false
)
.onAppear { viewModel.loadMoreIfNeeded(currentIndex: idx) }
}
}
}
.padding(.horizontal, horizontalPadding)
if viewModel.isLoadingMore {
HStack {
Spacer()
ProgressView()
.progressViewStyle(CircularProgressViewStyle(tint: .white))
.padding(.vertical, 16)
Spacer()
}
}
}
}
.frame(minHeight: 0, maxHeight: .infinity)
}
.padding(.vertical, 12)
.onAppear {
// 1
if viewModel.items.isEmpty {
viewModel.fetch()
}
}
}
.background(Color.black)
}
.popup(isPresented: $viewModel.isShowPopup, type: .toast, position: .top, autohideIn: 2) {
GeometryReader { geo in
HStack {
Spacer()
Text(viewModel.errorMessage)
.padding(.vertical, 13.3)
.frame(width: geo.size.width - 66.7, alignment: .center)
.font(.custom(Font.medium.rawValue, size: 12))
.background(Color.button)
.foregroundColor(Color.white)
.multilineTextAlignment(.center)
.cornerRadius(20)
.padding(.top, 66.7)
Spacer()
}
}
}
.navigationDestination(for: Int.self) { characterId in
CharacterDetailView(characterId: characterId)
}
}
}
}
#Preview {
NewCharacterListView()
.background(Color.black)
}

View File

@@ -29,7 +29,7 @@ struct ChatTabView: View {
@State private var selectedTab: InnerTab = .character
@State private var isShowAuthView: Bool = false
@State private var isShowAuthConfirmView: Bool = false
@State private var pendingCharacterId: Int? = nil
@State private var pendingAction: (() -> Void)? = nil
@State private var payload = Payload()
// CharacterView
@@ -40,14 +40,33 @@ struct ChatTabView: View {
return
}
if auth == false {
//
pendingCharacterId = characterId
pendingAction = {
AppState.shared
.setAppStep(step: .characterDetail(characterId: characterId))
}
isShowAuthConfirmView = true
return
}
AppState.shared.setAppStep(step: .characterDetail(characterId: characterId))
}
private func handleCharacterSelection() {
let trimmed = token.trimmingCharacters(in: .whitespacesAndNewlines)
guard !trimmed.isEmpty else {
AppState.shared.setAppStep(step: .login)
return
}
if auth == false {
pendingAction = {
AppState.shared
.setAppStep(step: .newCharacterAll)
}
isShowAuthConfirmView = true
return
}
AppState.shared.setAppStep(step: .newCharacterAll)
}
var body: some View {
ZStack {
VStack(alignment: .leading, spacing: 0) {
@@ -126,9 +145,9 @@ struct ChatTabView: View {
.onDone { _ in
auth = true
isShowAuthView = false
if let chId = pendingCharacterId {
pendingCharacterId = nil
AppState.shared.setAppStep(step: .characterDetail(characterId: chId))
if let action = pendingAction {
pendingAction = nil
action()
}
}
.onClose {
@@ -149,7 +168,7 @@ struct ChatTabView: View {
cancelButtonTitle: "취소",
cancelButtonAction: {
isShowAuthConfirmView = false
pendingCharacterId = nil
pendingAction = nil
},
textAlignment: .center
)