From 389daa554c4e1e5801882d9de5fd6a7f6dcaf6c8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EB=8F=84=ED=98=95?= <108233361+ShapeKim98@users.noreply.github.com> Date: Wed, 27 Nov 2024 19:23:14 +0900 Subject: [PATCH] =?UTF-8?q?[design]=20#157=20=ED=8F=AC=ED=82=B7=20?= =?UTF-8?q?=EB=B1=83=EC=A7=80=20=EB=94=94=EC=9E=90=EC=9D=B8=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD=EC=82=AC=ED=95=AD=20=EB=B0=98=EC=98=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../DSKit/Sources/Components/PokitBadge.swift | 86 +++++++++++++++---- .../Sources/Components/PokitLinkCard.swift | 7 +- .../ContentDetail/ContentDetailView.swift | 2 +- .../Sources/Remind/RemindView.swift | 2 +- 4 files changed, 74 insertions(+), 23 deletions(-) diff --git a/Projects/DSKit/Sources/Components/PokitBadge.swift b/Projects/DSKit/Sources/Components/PokitBadge.swift index 4afa8ab3..a535b046 100644 --- a/Projects/DSKit/Sources/Components/PokitBadge.swift +++ b/Projects/DSKit/Sources/Components/PokitBadge.swift @@ -8,32 +8,21 @@ import SwiftUI public struct PokitBadge: View { - private let labelText: String private let state: PokitBadge.State - public init( - _ labelText: String, - state: PokitBadge.State - ) { - self.labelText = labelText + public init(state: PokitBadge.State) { self.state = state } public var body: some View { - Text(labelText) - .pokitFont(.l4) - .foregroundStyle( - state == .unCategorized ? .pokit(.text(.secondary)) : .pokit(.text(.tertiary)) - ) - .padding(.horizontal, state == .small ? 4 : 8) - .padding(.vertical, state == .small ? 2 : 4) + label .background { RoundedRectangle(cornerRadius: 4, style: .continuous) .fill(backgroundColor) .overlay { if state == .unRead { RoundedRectangle(cornerRadius: 4, style: .continuous) - .stroke(.pokit(.border(.tertiary)), lineWidth: 1) + .stroke(.pokit(.border(.brand)), lineWidth: 1) } } } @@ -41,18 +30,79 @@ public struct PokitBadge: View { private var backgroundColor: Color { switch self.state { - case .default, .small: return .pokit(.bg(.primary)) + case .default, .small, .memo, .member: return .pokit(.bg(.primary)) case .unCategorized: return .pokit(.color(.grayScale(._50))) case .unRead: return .pokit(.bg(.base)) } } + + private var labelColor: Color { + switch self.state { + case .default, .small: return .pokit(.text(.tertiary)) + case .unCategorized: return .pokit(.text(.secondary)) + case .unRead: return .pokit(.text(.brand)) + case .memo, .member: return .pokit(.icon(.secondary)) + } + } + + private var label: some View { + Group { + switch self.state { + case let .default(labelText): + Text(labelText) + .pokitFont(.l4) + .padding(.horizontal, 8) + .padding(.vertical, 4) + case let .small(labelText): + Text(labelText) + .pokitFont(.l4) + .padding(.horizontal, 4) + .padding(.vertical, 2) + case .unCategorized: + Text("미분류") + .pokitFont(.l4) + .padding(.horizontal, 8) + .padding(.vertical, 4) + case .unRead: + Text("안읽음") + .pokitFont(.l4) + .padding(.horizontal, 8) + .padding(.vertical, 4) + case .memo: + Image(.icon(.memo)) + .resizable() + .frame(width: 16, height: 16) + .padding(2) + case .member: + Image(.icon(.member)) + .resizable() + .frame(width: 16, height: 16) + .padding(2) + } + } + .foregroundStyle(labelColor) + } } public extension PokitBadge { - enum State { - case `default` - case small + enum State: Equatable { + case `default`(String) + case small(String) case unCategorized case unRead + case memo + case member } } + +#Preview { + PokitBadge(state: .unRead) + + PokitBadge(state: .default("포킷명")) + + PokitBadge(state: .unCategorized) + + PokitBadge(state: .memo) + + PokitBadge(state: .member) +} diff --git a/Projects/DSKit/Sources/Components/PokitLinkCard.swift b/Projects/DSKit/Sources/Components/PokitLinkCard.swift index a3d5a5be..684fa310 100644 --- a/Projects/DSKit/Sources/Components/PokitLinkCard.swift +++ b/Projects/DSKit/Sources/Components/PokitLinkCard.swift @@ -91,12 +91,13 @@ public struct PokitLinkCard: View { HStack(spacing: 6) { PokitBadge( - link.categoryName, - state: isUnCategorized ? .unCategorized : .default + state: isUnCategorized + ? .unCategorized + : .default(link.categoryName) ) if let isRead = link.isRead, !isRead { - PokitBadge("안읽음", state: .unRead) + PokitBadge(state: .unRead) } } } diff --git a/Projects/Feature/FeatureContentDetail/Sources/ContentDetail/ContentDetailView.swift b/Projects/Feature/FeatureContentDetail/Sources/ContentDetail/ContentDetailView.swift index c049946f..6cbca8ea 100644 --- a/Projects/Feature/FeatureContentDetail/Sources/ContentDetail/ContentDetailView.swift +++ b/Projects/Feature/FeatureContentDetail/Sources/ContentDetail/ContentDetailView.swift @@ -90,7 +90,7 @@ private extension ContentDetailView { } } - PokitBadge(content.category.categoryName, state: .default) + PokitBadge(state: .default(content.category.categoryName)) Spacer() } diff --git a/Projects/Feature/FeatureRemind/Sources/Remind/RemindView.swift b/Projects/Feature/FeatureRemind/Sources/Remind/RemindView.swift index 98cdf65e..724d2f09 100644 --- a/Projects/Feature/FeatureRemind/Sources/Remind/RemindView.swift +++ b/Projects/Feature/FeatureRemind/Sources/Remind/RemindView.swift @@ -156,7 +156,7 @@ extension RemindView { ) VStack(alignment: .leading, spacing: 0) { - PokitBadge(content.categoryName, state: .small) + PokitBadge(state: .small(content.categoryName)) HStack(spacing: 4) { Text(content.title)