Skip to content

Commit a88b5da

Browse files
jvsena42jvsena42
authored
Merge pull request synonymdev#250 from synonymdev/feat/transfer-banner
feat(activity): add transfer banner
2 parents b815ce8 + 5ac3de9 commit a88b5da

File tree

4 files changed

+112
-59
lines changed

4 files changed

+112
-59
lines changed

‎Bitkit/Components/Activity/ActivityBanner.swift‎

Lines changed: 82 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
import BitkitCore
2+
import SwiftUI
3+
4+
enum ActivityBannerType {
5+
case spending
6+
case savings
7+
}
8+
9+
struct ActivityBanner: View {
10+
let type: ActivityBannerType
11+
12+
@State private var innerShadowOpacity: Double = 0.32
13+
@State private var dropShadowOpacity: Double = 1.0
14+
@State private var radialGradientOpacity: Double = 0.4
15+
@State private var borderOpacity: Double = 0.32
16+
17+
private var accentColor: Color {
18+
type == .spending ? .purpleAccent : .brandAccent
19+
}
20+
21+
var body: some View {
22+
HStack(spacing: 8) {
23+
Image("transfer")
24+
.resizable()
25+
.scaledToFit()
26+
.frame(width: 20, height: 20)
27+
.foregroundColor(accentColor)
28+
29+
Text(tTodo("TRANSFER IN PROGRESS"))
30+
.font(Fonts.black(size: 20))
31+
.foregroundColor(.textPrimary)
32+
.kerning(0)
33+
.lineLimit(1)
34+
}
35+
.frame(maxWidth: .infinity, alignment: .center)
36+
.frame(height: 72)
37+
.padding(.horizontal, 16)
38+
.background(
39+
ZStack {
40+
// Inner shadow
41+
RoundedRectangle(cornerRadius: 16)
42+
.fill(.shadow(.inner(color: accentColor.opacity(innerShadowOpacity), radius: 40)))
43+
.foregroundColor(.black)
44+
45+
// Linear gradient background
46+
RoundedRectangle(cornerRadius: 16)
47+
.fill(
48+
LinearGradient(
49+
gradient: Gradient(colors: [accentColor.opacity(0.24), accentColor.opacity(0)]),
50+
startPoint: .top,
51+
endPoint: .bottom
52+
)
53+
)
54+
55+
// Radial gradient in top left corner
56+
RadialGradient(
57+
gradient: Gradient(stops: [
58+
.init(color: accentColor.opacity(radialGradientOpacity), location: 0.0),
59+
.init(color: accentColor.opacity(0.0), location: 1.0),
60+
]),
61+
center: UnitPoint(x: 0, y: 0),
62+
startRadius: 0,
63+
endRadius: 160
64+
)
65+
}
66+
.clipShape(RoundedRectangle(cornerRadius: 16))
67+
)
68+
.overlay(
69+
RoundedRectangle(cornerRadius: 16)
70+
.stroke(accentColor.opacity(borderOpacity), lineWidth: 1)
71+
)
72+
.shadow(color: accentColor.opacity(dropShadowOpacity), radius: 12)
73+
.task {
74+
withAnimation(.easeInOut(duration: 1.2).repeatForever(autoreverses: true)) {
75+
innerShadowOpacity = 0.64
76+
dropShadowOpacity = 0.0
77+
radialGradientOpacity = 0.0
78+
borderOpacity = 1.0
79+
}
80+
}
81+
}
82+
}

‎Bitkit/Components/WalletBalanceView.swift‎

Lines changed: 8 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@ import SwiftUI
33
struct WalletBalanceView: View {
44
let type: WalletType
55
let sats: UInt64
6-
var showTransferIcon: Bool = false
76

87
@EnvironmentObject var currency: CurrencyViewModel
98

@@ -21,13 +20,6 @@ struct WalletBalanceView: View {
2120
.padding(.trailing, 4)
2221

2322
SubtitleText(btcComponents.value)
24-
25-
if showTransferIcon {
26-
Image("transfer")
27-
.resizable()
28-
.frame(width: 16, height: 16)
29-
.foregroundColor(.white64)
30-
}
3123
}
3224
} else {
3325
HStack(spacing: 4) {
@@ -38,13 +30,6 @@ struct WalletBalanceView: View {
3830
SubtitleText(converted.symbol)
3931
.frame(maxWidth: 12)
4032
SubtitleText(converted.formatted)
41-
42-
if showTransferIcon {
43-
Image("transfer")
44-
.resizable()
45-
.frame(width: 16, height: 16)
46-
.foregroundColor(.white64)
47-
}
4833
}
4934
}
5035
}
@@ -82,20 +67,12 @@ struct WalletBalanceView: View {
8267

8368
// Bitcoin display (modern) - with transfer icon
8469
HStack {
85-
WalletBalanceView(
86-
type: .onchain,
87-
sats: 123_456,
88-
showTransferIcon: true
89-
)
70+
WalletBalanceView(type: .onchain, sats: 123_456)
9071

9172
Divider()
9273
.frame(height: 50)
9374

94-
WalletBalanceView(
95-
type: .lightning,
96-
sats: 123_456,
97-
showTransferIcon: true
98-
)
75+
WalletBalanceView(type: .lightning, sats: 123_456)
9976
}
10077
.environmentObject(
10178
{
@@ -110,18 +87,12 @@ struct WalletBalanceView: View {
11087

11188
// USD display
11289
HStack {
113-
WalletBalanceView(
114-
type: .onchain,
115-
sats: 123_456
116-
)
90+
WalletBalanceView(type: .onchain, sats: 123_456)
11791

11892
Divider()
11993
.frame(height: 50)
12094

121-
WalletBalanceView(
122-
type: .lightning,
123-
sats: 123_456
124-
)
95+
WalletBalanceView(type: .lightning, sats: 123_456)
12596
}
12697
.environmentObject(
12798
{
@@ -137,18 +108,12 @@ struct WalletBalanceView: View {
137108

138109
// EUR display
139110
HStack {
140-
WalletBalanceView(
141-
type: .onchain,
142-
sats: 123_456
143-
)
111+
WalletBalanceView(type: .onchain, sats: 123_456)
144112

145113
Divider()
146114
.frame(height: 50)
147115

148-
WalletBalanceView(
149-
type: .lightning,
150-
sats: 123_456
151-
)
116+
WalletBalanceView(type: .lightning, sats: 123_456)
152117
}
153118
.environmentObject(
154119
{
@@ -164,18 +129,12 @@ struct WalletBalanceView: View {
164129

165130
// Bitcoin display with classic unit
166131
HStack {
167-
WalletBalanceView(
168-
type: .onchain,
169-
sats: 123_456
170-
)
132+
WalletBalanceView(type: .onchain, sats: 123_456)
171133

172134
Divider()
173135
.frame(height: 50)
174136

175-
WalletBalanceView(
176-
type: .lightning,
177-
sats: 123_456
178-
)
137+
WalletBalanceView(type: .lightning, sats: 123_456)
179138
}
180139
.environmentObject(
181140
{

‎Bitkit/Views/Wallets/Activity/ActivityLatest.swift‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,32 @@ struct ActivityLatest: View {
44
@EnvironmentObject private var activity: ActivityListViewModel
55
@EnvironmentObject private var navigation: NavigationViewModel
66
@EnvironmentObject private var sheets: SheetViewModel
7+
@EnvironmentObject private var wallet: WalletViewModel
8+
9+
private var shouldShowBanner: Bool {
10+
wallet.balanceInTransferToSavings > 0 || wallet.balanceInTransferToSpending > 0
11+
}
12+
13+
private var bannerType: ActivityBannerType {
14+
if wallet.balanceInTransferToSpending > 0 {
15+
return .spending
16+
} else {
17+
return .savings
18+
}
19+
}
720

821
var body: some View {
922
VStack(spacing: 0) {
1023
CaptionMText(t("wallet__activity"))
1124
.frame(maxWidth: .infinity, alignment: .leading)
1225
.padding(.bottom, 16)
1326

27+
if shouldShowBanner {
28+
ActivityBanner(type: bannerType)
29+
.padding(.bottom, 16)
30+
.transition(.opacity)
31+
}
32+
1433
if let items = activity.latestActivities {
1534
LazyVStack(alignment: .leading, spacing: 16) {
1635
ForEach(Array(zip(items.indices, items)), id: \.1) { index, item in
@@ -40,5 +59,6 @@ struct ActivityLatest: View {
4059
EmptyView()
4160
}
4261
}
62+
.animation(.spring(response: 0.4, dampingFraction: 0.8), value: shouldShowBanner)
4363
}
4464
}

‎Bitkit/Views/Wallets/HomeView.swift‎

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -26,11 +26,7 @@ struct HomeView: View {
2626
VStack(spacing: 0) {
2727
HStack(spacing: 0) {
2828
NavigationLink(value: Route.savingsWallet) {
29-
WalletBalanceView(
30-
type: .onchain,
31-
sats: UInt64(wallet.totalOnchainSats),
32-
showTransferIcon: wallet.balanceInTransferToSavings > 0
33-
)
29+
WalletBalanceView(type: .onchain, sats: UInt64(wallet.totalOnchainSats))
3430
}
3531

3632
Divider()
@@ -40,11 +36,7 @@ struct HomeView: View {
4036
.padding(.leading, 16)
4137

4238
NavigationLink(value: Route.spendingWallet) {
43-
WalletBalanceView(
44-
type: .lightning,
45-
sats: UInt64(wallet.totalLightningSats),
46-
showTransferIcon: wallet.balanceInTransferToSpending > 0
47-
)
39+
WalletBalanceView(type: .lightning, sats: UInt64(wallet.totalLightningSats))
4840
}
4941
}
5042
.frame(maxWidth: .infinity, alignment: .leading)

0 commit comments

Comments
 (0)