polish text input error showing

pull/891/head
Ryan Zhao 2 years ago
parent 2910dad390
commit 0045100200

@ -6,8 +6,17 @@ import Combine
public struct SessionTextField: View { public struct SessionTextField: View {
@Binding var text: String @Binding var text: String
@Binding var error: String? @Binding var error: String?
@State var previousError: String = ""
let placeholder: String let placeholder: String
var textThemeColor: ThemeValue {
(error?.isEmpty == false) ? .danger : .textPrimary
}
var isErrorMode: Bool {
guard previousError.isEmpty else { return true }
if error?.isEmpty == false { return true }
return false
}
static let height: CGFloat = isIPhone5OrSmaller ? CGFloat(48) : CGFloat(80) static let height: CGFloat = isIPhone5OrSmaller ? CGFloat(48) : CGFloat(80)
static let cornerRadius: CGFloat = 13 static let cornerRadius: CGFloat = 13
@ -27,19 +36,20 @@ public struct SessionTextField: View {
if text.isEmpty { if text.isEmpty {
Text(placeholder) Text(placeholder)
.font(.system(size: Values.smallFontSize)) .font(.system(size: Values.smallFontSize))
.foregroundColor(themeColor: (error?.isEmpty == false) ? .danger : .textSecondary) .foregroundColor(themeColor: isErrorMode ? .danger : .textSecondary)
} }
SwiftUI.TextField( SwiftUI.TextField(
"", "",
text: $text.onChange{ value in text: $text.onChange{ value in
if error?.isEmpty == false && text != value { if error?.isEmpty == false && text != value {
previousError = error!
error = nil error = nil
} }
} }
) )
.font(.system(size: Values.smallFontSize)) .font(.system(size: Values.smallFontSize))
.foregroundColor(themeColor: (error?.isEmpty == false) ? .danger : .textPrimary) .foregroundColor(themeColor: textThemeColor)
} }
.padding(.horizontal, Values.largeSpacing) .padding(.horizontal, Values.largeSpacing)
.frame(maxWidth: .infinity) .frame(maxWidth: .infinity)
@ -51,11 +61,11 @@ public struct SessionTextField: View {
height: Self.cornerRadius height: Self.cornerRadius
) )
) )
.stroke(themeColor: (error?.isEmpty == false) ? .danger : .borderSeparator) .stroke(themeColor: isErrorMode ? .danger : .borderSeparator)
) )
ZStack { ZStack {
Text(error ?? "") Text(error ?? previousError)
.bold() .bold()
.font(.system(size: Values.smallFontSize)) .font(.system(size: Values.smallFontSize))
.foregroundColor(themeColor: .danger) .foregroundColor(themeColor: .danger)

Loading…
Cancel
Save