Skip to content

Commit

Permalink
add card. add transaction view. finish onboarding flow e2e
Browse files Browse the repository at this point in the history
  • Loading branch information
@janndriessen
janndriessen committed Jul 1, 2021
1 parent 5c05f95 commit 2aaa638
Show file tree
Hide file tree
Showing 7 changed files with 152 additions and 48 deletions.
4 changes: 4 additions & 0 deletions app/eazy.xcodeproj/project.pbxproj
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@
6976D2872681D60E00E50002 /* ContentView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 6976D2862681D60E00E50002 /* ContentView.swift */; };
6976D2892681D60F00E50002 /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 6976D2882681D60F00E50002 /* Assets.xcassets */; };
6976D28C2681D60F00E50002 /* Preview Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 6976D28B2681D60F00E50002 /* Preview Assets.xcassets */; };
69823936268DB9C2004138FF /* OnboardingTransactionView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 69823935268DB9C2004138FF /* OnboardingTransactionView.swift */; };
69AEBD4C2689CEE70064CB78 /* LaunchView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 69AEBD4B2689CEE70064CB78 /* LaunchView.swift */; };
69D43A24268C649000401501 /* OnboardingBorrowView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 69D43A23268C649000401501 /* OnboardingBorrowView.swift */; };
69D43A26268C65BA00401501 /* OnboardingCollateralView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 69D43A25268C65BA00401501 /* OnboardingCollateralView.swift */; };
Expand Down Expand Up @@ -50,6 +51,7 @@
6976D2882681D60F00E50002 /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = "<group>"; };
6976D28B2681D60F00E50002 /* Preview Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = "Preview Assets.xcassets"; sourceTree = "<group>"; };
6976D28D2681D60F00E50002 /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
69823935268DB9C2004138FF /* OnboardingTransactionView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = OnboardingTransactionView.swift; sourceTree = "<group>"; };
69AEBD4B2689CEE70064CB78 /* LaunchView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = LaunchView.swift; sourceTree = "<group>"; };
69D43A23268C649000401501 /* OnboardingBorrowView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = OnboardingBorrowView.swift; sourceTree = "<group>"; };
69D43A25268C65BA00401501 /* OnboardingCollateralView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = OnboardingCollateralView.swift; sourceTree = "<group>"; };
Expand Down Expand Up @@ -134,6 +136,7 @@
69D43A2B268D7F4900401501 /* OnboardingContainerView.swift */,
69D43A23268C649000401501 /* OnboardingBorrowView.swift */,
69D43A25268C65BA00401501 /* OnboardingCollateralView.swift */,
69823935268DB9C2004138FF /* OnboardingTransactionView.swift */,
69D43A27268C667100401501 /* AddCardView.swift */,
);
path = ui;
Expand Down Expand Up @@ -226,6 +229,7 @@
69122B4E2689A5C6006C4205 /* PayoutCompletedView.swift in Sources */,
6926D3AB26888F63003A32CF /* config.swift in Sources */,
69D43A2C268D7F4900401501 /* OnboardingContainerView.swift in Sources */,
69823936268DB9C2004138FF /* OnboardingTransactionView.swift in Sources */,
6943C96E2684859C00A120D6 /* EazyColors.swift in Sources */,
6976D2852681D60E00E50002 /* eazyApp.swift in Sources */,
);
Expand Down
19 changes: 11 additions & 8 deletions app/eazy/data/CardsApi.swift
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,15 +40,18 @@ final class CardsApi: ObservableObject {
return
}

guard let httpResponse = response as? HTTPURLResponse,
(200...299).contains(httpResponse.statusCode) else {
print("Error with the response, unexpected status code: \(response)")
return
}
// TODO:
// guard let httpResponse = response as? HTTPURLResponse,
// (200...299).contains(httpResponse.statusCode) else {
// print("Error with the response, unexpected status code")
// return
// }

print("created")
let createdCard = Card(name: "Satoshi Nakamoto", cardType: "Visa", number: "4111111111111", expires: "01/22")
self.cards = [createdCard]
DispatchQueue.main.async {
let createdCard = Card(name: "Satoshi Nakamoto", cardType: "Visa", number: "4200 **** **** 0000", expires: "01/22")
self.cards = [createdCard]
}
// if let data = data {
// let result = try? JSONDecoder().decode(CreateCardResponse.self, from: data)
// }
Expand All @@ -69,7 +72,7 @@ final class CardsApi: ObservableObject {

guard let httpResponse = response as? HTTPURLResponse,
(200...299).contains(httpResponse.statusCode) else {
print("Error with the response, unexpected status code: \(response)")
print("Error with the response, unexpected status code")
return
}

Expand Down
63 changes: 40 additions & 23 deletions app/eazy/ui/AddCardView.swift
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,32 +8,45 @@
import SwiftUI

struct AddCardView: View {
@Environment(\.presentationMode) private var presentationMode
@State private var isLoading = false
@ObservedObject private var cardsApi = CardsApi()

var body: some View {
ZStack(alignment: .topLeading) {
VStack(alignment: .center) {
HStack {
Text("Add Card")
.font(.system(size: 40, design: .rounded))
.foregroundColor(EazyColor.title)
let card = cardsApi.cards.first
return (
ZStack(alignment: .topLeading) {
VStack(alignment: .center) {
HStack {
Text("Add Card")
.font(.system(size: 40, design: .rounded))
.foregroundColor(EazyColor.title)
Spacer()
}
CardView(
cardType: card?.cardType ?? "",
number: card?.number ?? "",
expires: card?.expires ?? "")
Spacer()
EazyDarkButton(title: "Add Credit Card", isLoading: isLoading) {
presentationMode.wrappedValue.dismiss()
}
.padding(.bottom, 8)
.padding(.horizontal, 16)
Text("Cancel")
.foregroundColor(EazyColor.text)
.padding(16)
.padding(.bottom, 0)
}
CardView()
Spacer()
EazyDarkButton(title: "Add Credit Card", isLoading: isLoading) {
print("Send to ETH address")
}
.padding(.bottom, 8)
.padding(.horizontal, 16)
Text("Cancel")
.foregroundColor(EazyColor.text)
.padding(16)
.padding(.bottom, 0)
.padding()
.padding(.bottom, 0)
}
.padding()
.padding(.bottom, 0)
}
.navigationBarHidden(true)
.onAppear {
let payload = CardsApi.CreateCardPayload.sathoshisVisa
cardsApi.createCard(payload: payload)
}
)
}
}

Expand All @@ -44,6 +57,10 @@ struct AddCardView_Previews: PreviewProvider {
}

private struct CardView: View {
var cardType: String
var number: String
var expires: String

var body: some View {
ZStack(alignment: .topLeading) {
RoundedRectangle(cornerRadius: 25.0)
Expand All @@ -54,16 +71,16 @@ private struct CardView: View {
endPoint: .bottom
))
VStack(alignment: .leading) {
Text("VISA")
Text(cardType.uppercased())
.font(.system(.title, design: .rounded))
.foregroundColor(.white)
Spacer()
HStack {
Text("**** **** **** 3375")
Text(number)
.font(.system(.headline, design: .rounded))
.foregroundColor(.white)
Spacer()
Text("01/22")
Text(expires)
.font(.system(.subheadline, design: .rounded))
.foregroundColor(.white)
}
Expand Down
9 changes: 4 additions & 5 deletions app/eazy/ui/OnboardingBorrowView.swift
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ import SwiftUI
struct OnboardingBorrowView: View {
@EnvironmentObject private var stateManager: OnboardingStateManager
@State private var borrowAmount: Int = 0
@State private var collateral = "n/a"
@State private var collateral: Int = -1
@State private var isLoading = false
@State private var isLinkActive = false
private var borrowApi = BorrowApi()
Expand Down Expand Up @@ -44,7 +44,7 @@ struct OnboardingBorrowView: View {
.background(
RoundedRectangle(cornerRadius: 25.0)
.fill(EazyColor.text.opacity(0.6)))
Text("Collateral: \(collateral)")
Text("Collateral: \(collateral == -1 ? "" : formatNumber(amount: collateral))")
.font(.system(size: 22, design: .rounded))
.bold()
.foregroundColor(.white)
Expand Down Expand Up @@ -88,8 +88,7 @@ struct OnboardingBorrowView: View {
.padding(.top, 32)
Spacer()
EazyButton(title: "Supply Collateral") {
print("Send to ETH address")
stateManager.next()
stateManager.showSupply(for: 500, collateral: collateral)
}
.padding(.bottom, 8)
.padding(.horizontal, 16)
Expand All @@ -107,7 +106,7 @@ struct OnboardingBorrowView: View {
borrowApi.getCollateral(for: amount) { result in
switch result {
case .success(let collateralNeeded):
self.collateral = formatNumber(amount: collateralNeeded)
self.collateral = collateralNeeded
case .failure(let error):
print(error.localizedDescription)
}
Expand Down
28 changes: 23 additions & 5 deletions app/eazy/ui/OnboardingCollateralView.swift
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,13 @@
import SwiftUI

struct OnboardingCollateralView: View {
var amount: Int
var collateral: Int

@EnvironmentObject private var stateManager: OnboardingStateManager
@State private var cardAdded = false
@State private var isLoading = false
@State private var isPresenting = false

var body: some View {
ZStack(alignment: .top) {
Expand All @@ -25,13 +30,13 @@ struct OnboardingCollateralView: View {
.foregroundColor(.white)
.multilineTextAlignment(.center)
.padding(.top, 16)
Text("Supply the stated amount via your preferred payment method to borrow $1,000.")
Text("Supply the stated amount via your preferred payment method to borrow $\(amount).")
.font(.system(size: 16, design: .rounded))
.foregroundColor(.white)
.multilineTextAlignment(.center)
.padding()
VStack {
Text("$1,000")
Text("$\(collateral)")
.font(.system(size: 48, design: .rounded))
.foregroundColor(.white)
.multilineTextAlignment(.center)
Expand All @@ -40,15 +45,21 @@ struct OnboardingCollateralView: View {
.background(
RoundedRectangle(cornerRadius: 25.0)
.fill(EazyColor.text.opacity(0.6)))
Text("1,000 USDC")
Text("\(collateral) USDC")
.font(.system(size: 24, design: .rounded))
.foregroundColor(EazyColor.text)
.multilineTextAlignment(.center)
}
.padding(.top, 32)
Spacer()
EazyButton(title: "Add Credit Card") {
EazyButton(title: cardAdded ? "Supply Collateral" : "Add Credit Card") {
print("Send to ETH address")
if cardAdded {
// TODO: payment call
stateManager.next()
} else {
isPresenting.toggle()
}
}
.padding(.bottom, 8)
.padding(.horizontal, 16)
Expand All @@ -58,11 +69,18 @@ struct OnboardingCollateralView: View {
}
.padding()
}
.sheet(isPresented: $isPresenting, onDismiss: {
self.cardAdded = true
}, content: {
NavigationView {
AddCardView()
}
})
}
}

struct OnboardingCollateralView_Previews: PreviewProvider {
static var previews: some View {
OnboardingCollateralView()
OnboardingCollateralView(amount: 500, collateral: 750)
}
}
27 changes: 20 additions & 7 deletions app/eazy/ui/OnboardingContainerView.swift
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,19 +14,21 @@ struct OnboardingContainerView: View {
switch stateManager.onboardingState {
case .start:
StartScreen()
.animation(.easeOut)
.transition(.asymmetric(insertion: .move(edge: .trailing), removal: .move(edge: .leading)))
.environmentObject(stateManager)
case .borrow:
OnboardingBorrowView()
.animation(.easeOut)
.transition(.asymmetric(insertion: .move(edge: .trailing), removal: .move(edge: .leading)))
.environmentObject(stateManager)
case .supply:
OnboardingCollateralView()
OnboardingCollateralView(amount: stateManager.borrowAmount, collateral: stateManager.collateral)
.animation(.easeOut)
.transition(.asymmetric(insertion: .move(edge: .trailing), removal: .move(edge: .leading)))
.environmentObject(stateManager)
case .transaction:
OnboardingTransactionView()
.animation(.easeIn)
.transition(.asymmetric(insertion: .move(edge: .trailing), removal: .opacity))
}
}
}
Expand All @@ -41,23 +43,34 @@ enum OnboardingState {
case start
case borrow
case supply
case transaction
}

final class OnboardingStateManager: ObservableObject {
@Published var onboardingState: OnboardingState = .start
var borrowAmount: Int = 0
var collateral: Int = 0

init() {}

func next() {
switch onboardingState {
case .start:
showBorrow()
case .borrow:
showSupply()
case .supply:
showTransaction()
default:
break
}
}

func showSupply(for borrowAmount: Int, collateral: Int) {
self.borrowAmount = borrowAmount
self.collateral = collateral
withAnimation {
onboardingState = .supply
}
}
}

extension OnboardingStateManager {
Expand All @@ -67,9 +80,9 @@ extension OnboardingStateManager {
}
}

private func showSupply() {
private func showTransaction() {
withAnimation {
onboardingState = .supply
onboardingState = .transaction
}
}
}
50 changes: 50 additions & 0 deletions app/eazy/ui/OnboardingTransactionView.swift
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
//
// OnboardingTransactionView.swift
// eazy
//
// Created by Jann Driessen on 01.07.21.
//

import SwiftUI

struct OnboardingTransactionView: View {
@EnvironmentObject private var appStateManager: AppStateManager

var body: some View {
ZStack(alignment: .top) {
LinearGradient(
gradient: Gradient(colors: [EazyColor.highlight, EazyColor.highlight, EazyColor.title]),
startPoint: .top,
endPoint: .bottom
)
.edgesIgnoringSafeArea(.all)
VStack {
Text("💸")
.font(.system(size: 44, design: .rounded))
.foregroundColor(.white)
.multilineTextAlignment(.center)
.padding(.top, 16)
Text("We're sending a few transactions via the ethereum network to make your borrowed money available to you.\n\nThis might take a few minutes. We'll notify you when your money is ready.")
.font(.system(size: 24, design: .rounded))
.foregroundColor(.white)
.multilineTextAlignment(.leading)
.padding()
Spacer()
EazyButton(title: "Got it!") {
withAnimation {
appStateManager.signedIn()
}
}
.padding(.bottom, 8)
.padding(.horizontal, 16)
}
.padding()
}
}
}

struct OnboardingTransactionView_Previews: PreviewProvider {
static var previews: some View {
OnboardingTransactionView()
}
}

0 comments on commit 2aaa638

Please sign in to comment.