Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ejercicio SignUpView #74

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file not shown.
5 changes: 4 additions & 1 deletion SwiftUIBasics/Views/Components/FormTextField.swift
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,14 @@
// Created by Diplomado on 09/12/23.
//


import SwiftUI

struct FormTextField: View {
var name = ""
@Binding var value: String
var isSecure = false
var fieldType: UIKeyboardType = .default

var body: some View {
VStack {
Expand All @@ -20,6 +22,7 @@ struct FormTextField: View {
.padding(.horizontal)
} else {
TextField(name, text: $value)
.keyboardType(fieldType)
.font(.system(size: 20, weight: .semibold, design: .rounded))
.padding(.horizontal)
}
Expand All @@ -33,7 +36,7 @@ struct FormTextField: View {

#Preview {
VStack(spacing: 20) {
FormTextField(name: "Email", value: .constant(""), isSecure: false)
FormTextField(name: "Email", value: .constant(""), isSecure: false, fieldType: .emailAddress)
FormTextField(name: "Password", value: .constant(""), isSecure: true)
}
}
91 changes: 74 additions & 17 deletions SwiftUIBasics/Views/SignUpView.swift
Original file line number Diff line number Diff line change
Expand Up @@ -2,34 +2,41 @@
// SignUpView.swift
// SwiftUIBasics
//
// Created by Diplomado on 09/12/23.
// Created by Tere Durán on 09/12/23.
//

import SwiftUI
import Combine

class SignUpViewModel: ObservableObject {
// inputs
@Published var username: String = ""
// Inputs
@Published var email: String = ""
@Published var password: String = ""
@Published var passwordConfirm: String = ""

// outputs
@Published var isValidUsernameLength: Bool = false

// Outputs
@Published var isValidEmail: Bool = false
@Published var isValidPassword: Bool = false
@Published var isValidPasswordLength: Bool = false
@Published var isValidPasswordUpperCase: Bool = false
@Published var isValidPasswordLowerCase: Bool = false
@Published var isValidPasswordCase: Bool = false
@Published var passwordContainsSymbol: Bool = false
@Published var passwordContainsNumber: Bool = false
@Published var isValidPasswordMatch: Bool = false
@Published var isValid: Bool = false

private var cancelableSet: Set<AnyCancellable> = []

init() {
$username
$email
.receive(on: RunLoop.main)
.map { username in
return username.count >= 4
.map { email in
let pattern = "[A-Z0-9a-z._%+-]+@[A-Za-z0-9.-]+\\.[A-Za-z]{2,64}"
let emailFormat = NSPredicate(format:"SELF MATCHES %@", pattern)
return emailFormat.evaluate(with: email)
}
.assign(to: \.isValidUsernameLength, on: self)
.assign(to: \.isValidEmail, on: self)
.store(in: &cancelableSet)

$password
Expand All @@ -52,6 +59,46 @@ class SignUpViewModel: ObservableObject {
}
.assign(to: \.isValidPasswordUpperCase, on: self)
.store(in: &cancelableSet)

$password
.receive(on: RunLoop.main)
.map { password in
let pattern = "[a-z]"
if let _ = password.range(of: pattern, options: .regularExpression) {
return true
} else {
return false
}
}
.assign(to: \.isValidPasswordLowerCase, on: self)
.store(in: &cancelableSet)

$password
.receive(on: RunLoop.main)
.map { password in
let pattern = /\W+/
let symbols = Regex(pattern)
if password.contains(symbols) {
return true
} else {
return false
}
}
.assign(to: \.passwordContainsSymbol, on: self)
.store(in: &cancelableSet)

$password
.receive(on: RunLoop.main)
.map { password in
let pattern = "[0-9]"
if let _ = password.range(of: pattern, options: .regularExpression) {
return true
} else {
return false
}
}
.assign(to: \.passwordContainsNumber, on: self)
.store(in: &cancelableSet)

Publishers.CombineLatest($password, $passwordConfirm)
.receive(on: RunLoop.main)
Expand All @@ -60,8 +107,16 @@ class SignUpViewModel: ObservableObject {
}
.assign(to: \.isValidPasswordMatch, on: self)
.store(in: &cancelableSet)

Publishers.CombineLatest4($isValidPasswordUpperCase, $isValidPasswordLowerCase, $passwordContainsSymbol, $passwordContainsNumber)
.receive(on: RunLoop.main)
.map { (uppercase, lowercase, symbol, number) in
return uppercase && lowercase && symbol && number
}
.assign(to: \.isValidPasswordCase, on: self)
.store(in: &cancelableSet)

Publishers.CombineLatest4($isValidUsernameLength, $isValidPasswordLength, $isValidPasswordUpperCase, $isValidPasswordMatch)
Publishers.CombineLatest4($isValidEmail, $isValidPasswordLength, $isValidPasswordCase, $isValidPasswordMatch)
.map { (a, b, c, d) in
return a && b && c && d
}
Expand All @@ -80,13 +135,16 @@ struct SignUpView: View {
.bold()
.foregroundStyle(.maryBlue)
.padding(.bottom, 30)
FormTextField(name: "Username", value: $vm.username)
RequirementText(text: "A minimum of 4 characters", isValid: vm.isValidUsernameLength)
FormTextField(name: "Email", value: $vm.email, fieldType: .emailAddress)
RequirementText(text: "A valid email format", isValid: vm.isValidEmail)
.padding()
FormTextField(name: "Password", value: $vm.password, isSecure: true)
VStack {
RequirementText(text: "A minimum of 8 characters", isValid: vm.isValidPasswordLength)
RequirementText(text: "One uppercase letter", isValid: vm.isValidPasswordUpperCase)
RequirementText(text: "At least one uppercase letter", isValid: vm.isValidPasswordUpperCase)
RequirementText(text: "At lest one lowercase letter", isValid: vm.isValidPasswordLowerCase)
RequirementText(text: "At least one symbol", isValid: vm.passwordContainsSymbol)
RequirementText(text: "At least one digit", isValid: vm.passwordContainsNumber)
}
.padding()
FormTextField(name: "Confirm Password", value: $vm.passwordConfirm, isSecure: true)
Expand All @@ -95,7 +153,6 @@ struct SignUpView: View {
.padding(.bottom, 50)
Button(action: {
print("Doing")
// Proceed to the next screen
}) {
Text("Sign Up")
.font(.system(.body, design: .rounded))
Expand All @@ -104,7 +161,6 @@ struct SignUpView: View {
.padding()
.frame(minWidth: 0, maxWidth: .infinity)
.background(vm.isValid ? .maryBlue :.turquoise)
// .background(LinearGradient(gradient: Gradient(colors: [.turquoise, .maryBlue]), startPoint: .leading, endPoint: .trailing))
.cornerRadius(10)
.padding(.horizontal)
}
Expand All @@ -115,7 +171,6 @@ struct SignUpView: View {
.font(.system(.body, design: .rounded))
.bold()
Button(action: {
// Proceed to Sign in screen
}) {
Text("Sign in")
.font(.system(.body, design: .rounded))
Expand All @@ -132,3 +187,5 @@ struct SignUpView: View {
#Preview {
SignUpView()
}