diff --git a/SodaLive.xcodeproj/project.pbxproj b/SodaLive.xcodeproj/project.pbxproj index e183abd4..62851302 100644 --- a/SodaLive.xcodeproj/project.pbxproj +++ b/SodaLive.xcodeproj/project.pbxproj @@ -25,6 +25,9 @@ CC0101082FF0100000A5BBA3 /* CreatorChannelView.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100082FF0100000A5BBA3 /* CreatorChannelView.swift */; }; CC0102082FF0100000A5BBA3 /* CreatorChannelView.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100082FF0100000A5BBA3 /* CreatorChannelView.swift */; }; CC0103082FF0100000A5BBA3 /* CreatorChannelView.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100082FF0100000A5BBA3 /* CreatorChannelView.swift */; }; + CC0101112FF0100000A5BBA3 /* CreatorChannelTitleBar.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100112FF0100000A5BBA3 /* CreatorChannelTitleBar.swift */; }; + CC0102112FF0100000A5BBA3 /* CreatorChannelTitleBar.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100112FF0100000A5BBA3 /* CreatorChannelTitleBar.swift */; }; + CC0103112FF0100000A5BBA3 /* CreatorChannelTitleBar.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100112FF0100000A5BBA3 /* CreatorChannelTitleBar.swift */; }; CC0101092FF0100000A5BBA3 /* CreatorChannelViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100092FF0100000A5BBA3 /* CreatorChannelViewModel.swift */; }; CC0102092FF0100000A5BBA3 /* CreatorChannelViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100092FF0100000A5BBA3 /* CreatorChannelViewModel.swift */; }; CC0103092FF0100000A5BBA3 /* CreatorChannelViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = CC0100092FF0100000A5BBA3 /* CreatorChannelViewModel.swift */; }; @@ -1734,6 +1737,7 @@ CC0100082FF0100000A5BBA3 /* CreatorChannelView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CreatorChannelView.swift; sourceTree = ""; }; CC0100092FF0100000A5BBA3 /* CreatorChannelViewModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CreatorChannelViewModel.swift; sourceTree = ""; }; CC0100102FF0100000A5BBA3 /* CreatorChannelTab.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CreatorChannelTab.swift; sourceTree = ""; }; + CC0100112FF0100000A5BBA3 /* CreatorChannelTitleBar.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CreatorChannelTitleBar.swift; sourceTree = ""; }; 0BBDC3ECBBE049EAA4057D3A /* PostChannelDonationRequest.swift */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = sourcecode.swift; path = PostChannelDonationRequest.swift; sourceTree = ""; }; 0EC05859619BDC03056911E7 /* MainTab.swift */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = sourcecode.swift; path = MainTab.swift; sourceTree = ""; }; 189350EA101CF12EEBA6EC1D /* MainTabBarView.swift */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = sourcecode.swift; path = MainTabBarView.swift; sourceTree = ""; }; @@ -2672,6 +2676,7 @@ isa = PBXGroup; children = ( CC0100252FF0100000A5BBA3 /* Models */, + CC0100262FF0100000A5BBA3 /* Components */, CC0100232FF0100000A5BBA3 /* Home */, CC0100082FF0100000A5BBA3 /* CreatorChannelView.swift */, CC0100092FF0100000A5BBA3 /* CreatorChannelViewModel.swift */, @@ -2687,6 +2692,14 @@ path = Models; sourceTree = ""; }; + CC0100262FF0100000A5BBA3 /* Components */ = { + isa = PBXGroup; + children = ( + CC0100112FF0100000A5BBA3 /* CreatorChannelTitleBar.swift */, + ); + path = Components; + sourceTree = ""; + }; 038B15E425DE0639156ADBA9 /* Repository */ = { isa = PBXGroup; children = ( @@ -5577,6 +5590,7 @@ CC0101062FF0100000A5BBA3 /* CreatorChannelHomeView.swift in Sources */, CC0101072FF0100000A5BBA3 /* CreatorChannelPlaceholderTabView.swift in Sources */, CC0101082FF0100000A5BBA3 /* CreatorChannelView.swift in Sources */, + CC0101112FF0100000A5BBA3 /* CreatorChannelTitleBar.swift in Sources */, CC0101092FF0100000A5BBA3 /* CreatorChannelViewModel.swift in Sources */, CC0101102FF0100000A5BBA3 /* CreatorChannelTab.swift in Sources */, 409E35082B0759DE00CCB985 /* MoyaProviderExtension.swift in Sources */, @@ -6371,6 +6385,7 @@ CC0102062FF0100000A5BBA3 /* CreatorChannelHomeView.swift in Sources */, CC0102072FF0100000A5BBA3 /* CreatorChannelPlaceholderTabView.swift in Sources */, CC0102082FF0100000A5BBA3 /* CreatorChannelView.swift in Sources */, + CC0102112FF0100000A5BBA3 /* CreatorChannelTitleBar.swift in Sources */, CC0102092FF0100000A5BBA3 /* CreatorChannelViewModel.swift in Sources */, CC0102102FF0100000A5BBA3 /* CreatorChannelTab.swift in Sources */, 401B3F092FEEF10000A5BBA3 /* MainHomeRankingViewModel.swift in Sources */, @@ -7181,6 +7196,7 @@ CC0103062FF0100000A5BBA3 /* CreatorChannelHomeView.swift in Sources */, CC0103072FF0100000A5BBA3 /* CreatorChannelPlaceholderTabView.swift in Sources */, CC0103082FF0100000A5BBA3 /* CreatorChannelView.swift in Sources */, + CC0103112FF0100000A5BBA3 /* CreatorChannelTitleBar.swift in Sources */, CC0103092FF0100000A5BBA3 /* CreatorChannelViewModel.swift in Sources */, CC0103102FF0100000A5BBA3 /* CreatorChannelTab.swift in Sources */, 401B3F082FEEF10000A5BBA3 /* MainHomeRankingViewModel.swift in Sources */, diff --git a/SodaLive/Sources/V2/CreatorChannel/Components/CreatorChannelTitleBar.swift b/SodaLive/Sources/V2/CreatorChannel/Components/CreatorChannelTitleBar.swift new file mode 100644 index 00000000..0694560f --- /dev/null +++ b/SodaLive/Sources/V2/CreatorChannel/Components/CreatorChannelTitleBar.swift @@ -0,0 +1,120 @@ +import SwiftUI + +struct CreatorChannelTitleBar: View { + let isFollow: Bool + let isNotify: Bool + let backgroundProgress: CGFloat + let onTapBack: () -> Void + let onTapFollow: () -> Void + let onTapUnfollow: () -> Void + let onTapNotify: () -> Void + let onTapUnnotify: () -> Void + let onTapMore: () -> Void + + var body: some View { + HStack(spacing: 0) { + Button(action: onTapBack) { + Image("ic_new_bar_back") + .resizable() + .frame(width: 24, height: 24) + } + .buttonStyle(.plain) + + Spacer(minLength: 0) + + HStack(spacing: SodaSpacing.s14) { + followButton + + if isFollow { + notifyButton + } + + Button(action: onTapMore) { + Image("ic_new_more") + .resizable() + .frame(width: 24, height: 24) + } + .buttonStyle(.plain) + } + } + .padding(.horizontal, SodaSpacing.s14) + .frame(height: 56) + .background(Color.black.opacity(max(0, min(backgroundProgress, 1)))) + } + + private var followButton: some View { + Button(action: isFollow ? onTapUnfollow : onTapFollow) { + HStack(spacing: SodaSpacing.s6) { + Image(isFollow ? "ic_new_following" : "ic_new_follow") + .resizable() + .renderingMode(.template) + .foregroundColor(isFollow ? Color.black : Color.white) + .frame(width: 20, height: 20) + + if isFollow == false { + Text(I18n.CreatorChannelHome.follow) + .appFont(size: 16, weight: .medium) + .foregroundColor(Color.white) + } + } + .padding(SodaSpacing.s8) + .background(isFollow ? Color.white : Color.clear) + .clipShape(Capsule()) + } + .accessibilityLabel(isFollow ? I18n.CreatorChannelHome.following : "팔로우") + .buttonStyle(.plain) + } + + private var notifyButton: some View { + Button(action: isNotify ? onTapUnnotify : onTapNotify) { + Image(isNotify ? "ic_bar_bell_fill" : "ic_bar_bell") + .resizable() + .frame(width: 24, height: 24) + } + .buttonStyle(.plain) + } +} + +struct CreatorChannelTitleBar_Previews: PreviewProvider { + static var previews: some View { + VStack(spacing: SodaSpacing.s16) { + CreatorChannelTitleBar( + isFollow: false, + isNotify: false, + backgroundProgress: 0, + onTapBack: {}, + onTapFollow: {}, + onTapUnfollow: {}, + onTapNotify: {}, + onTapUnnotify: {}, + onTapMore: {} + ) + + CreatorChannelTitleBar( + isFollow: true, + isNotify: true, + backgroundProgress: 1, + onTapBack: {}, + onTapFollow: {}, + onTapUnfollow: {}, + onTapNotify: {}, + onTapUnnotify: {}, + onTapMore: {} + ) + + CreatorChannelTitleBar( + isFollow: true, + isNotify: false, + backgroundProgress: 1, + onTapBack: {}, + onTapFollow: {}, + onTapUnfollow: {}, + onTapNotify: {}, + onTapUnnotify: {}, + onTapMore: {} + ) + } + .background(Color.gray) + .previewLayout(.sizeThatFits) + } +} diff --git a/SodaLive/Sources/V2/CreatorChannel/CreatorChannelView.swift b/SodaLive/Sources/V2/CreatorChannel/CreatorChannelView.swift index 7ffc5582..1d4dc23a 100644 --- a/SodaLive/Sources/V2/CreatorChannel/CreatorChannelView.swift +++ b/SodaLive/Sources/V2/CreatorChannel/CreatorChannelView.swift @@ -30,52 +30,27 @@ struct CreatorChannelView: View { } private var titleBar: some View { - HStack(spacing: 12) { - Button { + CreatorChannelTitleBar( + isFollow: viewModel.response?.creator.isFollow ?? false, + isNotify: viewModel.response?.creator.isNotify ?? false, + backgroundProgress: 1, + onTapBack: { dismiss() - } label: { - Image(systemName: "chevron.left") - .foregroundColor(.white) - .frame(width: 44, height: 44) - } - - Spacer() - - if let creator = viewModel.response?.creator { - Button { - if creator.isFollow { - viewModel.creatorFollow(follow: false, notify: false) - } else { - viewModel.creatorFollow(follow: true, notify: true) - } - } label: { - Text(creator.isFollow ? I18n.CreatorChannelHome.following : I18n.CreatorChannelHome.follow) - .font(.system(size: 13, weight: .semibold)) - .foregroundColor(creator.isFollow ? .white : .black) - .padding(.horizontal, 12) - .frame(height: 30) - .background(creator.isFollow ? Color.gray33 : Color.soda400) - .clipShape(Capsule()) - } - - if creator.isFollow { - Button { - if creator.isNotify { - viewModel.creatorFollow(follow: true, notify: false) - } else { - viewModel.creatorFollow(follow: true, notify: true) - } - } label: { - Image(systemName: creator.isNotify ? "bell.fill" : "bell") - .foregroundColor(.white) - .frame(width: 44, height: 44) - } - } - } - } - .frame(height: 56) - .padding(.horizontal, 8) - .background(Color.black) + }, + onTapFollow: { + viewModel.creatorFollow(follow: true, notify: true) + }, + onTapUnfollow: { + viewModel.creatorFollow(follow: false, notify: false) + }, + onTapNotify: { + viewModel.creatorFollow(follow: true, notify: true) + }, + onTapUnnotify: { + viewModel.creatorFollow(follow: true, notify: false) + }, + onTapMore: {} + ) } private var tabBar: some View { diff --git a/docs/20260701_크리에이터_채널_홈/plan-task.md b/docs/20260701_크리에이터_채널_홈/plan-task.md index c465792e..5db0e95a 100644 --- a/docs/20260701_크리에이터_채널_홈/plan-task.md +++ b/docs/20260701_크리에이터_채널_홈/plan-task.md @@ -232,7 +232,7 @@ ### Phase 3: Header / Title Bar / Tab Bar / Sticky -- [ ] **Task 3.1: title bar 컴포넌트 생성** +- [x] **Task 3.1: title bar 컴포넌트 생성** - 대상 파일: - 생성: `SodaLive/Sources/V2/CreatorChannel/Components/CreatorChannelTitleBar.swift` - 확인: `SodaLive/Sources/Common/FollowButtonImageAsset.swift` @@ -617,4 +617,5 @@ - 2026-07-02: 이미 완료된 Phase 1~2 기록은 보존하고, 후속 구조 정리를 위해 Task 2.4 `공통 CreatorChannel shell로 구조 정리`를 추가했다. - 2026-07-02: 사용자 확인 사항을 반영해 title bar Figma URL 3종과 사용할 아이콘 asset(`ic_new_bar_back`, `ic_new_follow`, `ic_new_following`, `ic_new_more`, `ic_bar_bell`, `ic_bar_bell_fill`)을 Task 3.1 및 최종 회귀 검색 기준에 추가했다. - 2026-07-02: 기존 `UserProfile` 구현을 확인해 title bar 팔로우/팔로우 취소/알림 설정/알림 설정 취소를 `UserRepository.creatorFollow(creatorId:follow:notify:)`로 처리하고, `ic_bar_bell`/`ic_bar_bell_fill` 터치 시 각각 `notify: true`/`notify: false` 호출이 일어나도록 계획에 반영했다. +- 2026-07-02: Task 3.1 title bar 컴포넌트를 `SodaLive/Sources/V2/CreatorChannel/Components/CreatorChannelTitleBar.swift`로 생성하고 `CreatorChannelView`의 inline title bar를 교체했다. `rg "struct CreatorChannelTitleBar|isFollow|isNotify|backgroundProgress|onTapBack|onTapFollow|onTapUnfollow|onTapNotify|onTapUnnotify|onTapMore|ic_new_bar_back|ic_new_follow|ic_new_following|ic_new_more|ic_bar_bell|ic_bar_bell_fill|팔로우" SodaLive/Sources/V2/CreatorChannel/Components/CreatorChannelTitleBar.swift`와 `xcodebuild -workspace "SodaLive.xcworkspace" -scheme "SodaLive-dev" -configuration Debug build` 성공으로 검증했다. - 2026-07-02: 사용자 확인 사항을 반영해 HeaderView는 `CreatorChannelHomeResponse.creator` 데이터로 채우고, 별도 프로필 이미지 없이 큰 배경 이미지만 표시하며, title bar는 기본 투명 배경으로 header 위에 overlay되도록 Task 3.2/3.4/3.5와 최종 검증 기준을 갱신했다.