Correctly handle button disabled states in all pages

ui/decredmaterial/button.go

@@ -108,18 +108,18 @@ func (b Button) Click() {
 }
 
 func (b *Button) Layout(gtx layout.Context) layout.Dimensions {
-	if !b.Enabled() {
-		b.Background, b.Color = b.disabledBackground, b.disabledTextColor
-	}
-
 	wdg := func(gtx layout.Context) layout.Dimensions {
 		return b.Inset.Layout(gtx, func(gtx layout.Context) layout.Dimensions {
-			paint.ColorOp{Color: b.Color}.Add(gtx.Ops)
+			textColor := b.Color
+			if !b.Enabled() {
+				textColor = b.disabledTextColor
+			}
+
 			b.label.Text = b.Text
 			b.label.Font = b.Font
 			b.label.Alignment = text.Middle
 			b.label.TextSize = b.TextSize
-			b.label.Color = b.Color
+			b.label.Color = textColor
 			return b.label.Layout(gtx)
 		})
 	}
@@ -140,7 +140,9 @@ func (b Button) buttonStyleLayout(gtx layout.Context, w layout.Widget) layout.Di
 			}}, rr).Add(gtx.Ops)
 
 			background := b.Background
-			if b.clickable.Hovered() {
+			if !b.Enabled() {
+				background = b.disabledBackground
+			} else if b.clickable.Hovered() {
 				background = Hovered(b.Background)
 			}
 
@@ -156,7 +158,7 @@ func (b Button) buttonStyleLayout(gtx layout.Context, w layout.Widget) layout.Di
 			return layout.Center.Layout(gtx, w)
 		}),
 		layout.Expanded(func(gtx C) D {
-			if !b.isEnabled {
+			if !b.Enabled() {
 				return D{}
 			}
 

ui/modal/create_password_modal.go

@@ -120,21 +120,26 @@ func (cm *CreatePasswordModal) SetError(err string) {
 
 }
 
+func (cm *CreatePasswordModal) validToCreate() bool {
+	nameValid := true
+	if cm.walletNameEnabled {
+		nameValid = editorsNotEmpty(cm.walletName.Editor)
+	}
+
+	return nameValid && editorsNotEmpty(cm.passwordEditor.Editor, cm.confirmPasswordEditor.Editor) &&
+		cm.passwordsMatch(cm.passwordEditor.Editor, cm.confirmPasswordEditor.Editor)
+}
+
 func (cm *CreatePasswordModal) Handle() {
 	if cm.passwordEditor.Editor.Text() == cm.confirmPasswordEditor.Editor.Text() {
 		// reset error label when password and matching password fields match
 		cm.confirmPasswordEditor.SetError("")
 	}
 
+	cm.btnPositve.SetEnabled(cm.validToCreate())
 	if cm.btnPositve.Clicked() || handleSubmitEvent(cm.walletName.Editor, cm.passwordEditor.Editor, cm.confirmPasswordEditor.Editor) {
 
-		nameValid := true
-		if cm.walletNameEnabled {
-			nameValid = editorsNotEmpty(cm.walletName.Editor)
-		}
-
-		if nameValid && editorsNotEmpty(cm.passwordEditor.Editor, cm.confirmPasswordEditor.Editor) &&
-			cm.passwordsMatch(cm.passwordEditor.Editor, cm.confirmPasswordEditor.Editor) {
+		if cm.validToCreate() {
 
 			cm.SetLoading(true)
 			if cm.callback(cm.walletName.Editor.Text(), cm.passwordEditor.Editor.Text(), cm) {
@@ -144,6 +149,7 @@ func (cm *CreatePasswordModal) Handle() {
 
 	}
 
+	cm.btnNegative.SetEnabled(!cm.isLoading)
 	if cm.btnNegative.Clicked() {
 		if !cm.isLoading {
 			cm.Dismiss()

ui/modal/create_watch_only_modal.go

@@ -43,6 +43,7 @@ func NewCreateWatchOnlyModal(l *load.Load) *CreateWatchOnlyModal {
 	}
 
 	cm.btnPositve.Font.Weight = text.Medium
+	cm.btnPositve.SetEnabled(false)
 
 	cm.btnNegative.Font.Weight = text.Medium
 	cm.btnNegative.Margin = layout.Inset{Right: values.MarginPadding8}
@@ -97,6 +98,7 @@ func (cm *CreateWatchOnlyModal) WatchOnlyCreated(callback func(walletName, extPu
 
 func (cm *CreateWatchOnlyModal) Handle() {
 
+	cm.btnPositve.SetEnabled(editorsNotEmpty(cm.walletName.Editor, cm.extendedPubKey.Editor))
 	if editorsNotEmpty(cm.walletName.Editor, cm.extendedPubKey.Editor) ||
 		handleSubmitEvent(cm.walletName.Editor, cm.extendedPubKey.Editor) {
 		for cm.btnPositve.Clicked() {
@@ -107,6 +109,7 @@ func (cm *CreateWatchOnlyModal) Handle() {
 		}
 	}
 
+	cm.btnNegative.SetEnabled(!cm.isLoading)
 	if cm.btnNegative.Clicked() {
 		if !cm.isLoading {
 			cm.Dismiss()

ui/modal/password_modal.go

@@ -120,6 +120,7 @@ func (pm *PasswordModal) SetError(err string) {
 
 func (pm *PasswordModal) Handle() {
 
+	pm.btnPositve.SetEnabled(editorsNotEmpty(pm.password.Editor))
 	for pm.btnPositve.Clicked() {
 
 		if pm.isLoading || !editorsNotEmpty(pm.password.Editor) {
@@ -133,6 +134,7 @@ func (pm *PasswordModal) Handle() {
 		}
 	}
 
+	pm.btnNegative.SetEnabled(!pm.isLoading)
 	for pm.btnNegative.Clicked() {
 		if !pm.isLoading {
 			pm.DismissModal(pm)

ui/page/seedbackup/backup_instructions.go

@@ -105,13 +105,7 @@ func (pg *BackupInstructionsPage) Layout(gtx layout.Context) layout.Dimensions {
 		},
 	}
 
-	if pg.verifyCheckBoxes() {
-		pg.viewSeedBtn.Background = pg.Theme.Color.Primary
-		pg.viewSeedBtn.Color = pg.Theme.Color.InvText
-	} else {
-		pg.viewSeedBtn.Background = pg.Theme.Color.InactiveGray
-		pg.viewSeedBtn.Color = pg.Theme.Color.Text
-	}
+	pg.viewSeedBtn.SetEnabled(pg.verifyCheckBoxes())
 
 	return container(gtx, *pg.Theme, sp.Layout, "", pg.viewSeedBtn)
 }

ui/page/seedbackup/verify_seed.go

@@ -222,14 +222,7 @@ func (pg *VerifySeedPage) Layout(gtx C) D {
 		},
 	}
 
-	if pg.allSeedsSelected() {
-		pg.actionButton.Background = pg.Theme.Color.Primary
-		pg.actionButton.Color = pg.Theme.Color.InvText
-	} else {
-		pg.actionButton.Background = pg.Theme.Color.InactiveGray
-		pg.actionButton.Color = pg.Theme.Color.Text
-	}
-
+	pg.actionButton.SetEnabled(pg.allSeedsSelected())
 	return container(gtx, *pg.Theme, sp.Layout, "", pg.actionButton)
 }
 

ui/page/send/layout.go

@@ -26,7 +26,9 @@ func (pg *Page) initLayoutWidgets() {
 	pg.txFeeCollapsible = pg.Theme.Collapsible()
 
 	pg.nextButton = pg.Theme.Button(new(widget.Clickable), "Next")
-	pg.nextButton.Background = pg.Theme.Color.InactiveGray
+	pg.nextButton.TextSize = values.TextSize18
+	pg.nextButton.Inset = layout.Inset{Top: values.MarginPadding15, Bottom: values.MarginPadding15}
+	pg.nextButton.SetEnabled(false)
 
 	pg.backButton, pg.infoButton = components.SubpageHeaderButtons(pg.Load)
 	pg.backButton.Icon = pg.Icons.ContentClear
@@ -368,7 +370,6 @@ func (pg *Page) balanceSection(gtx layout.Context) layout.Dimensions {
 					})
 				}),
 				layout.Flexed(0.3, func(gtx C) D {
-					pg.nextButton.Inset = layout.Inset{Top: values.MarginPadding15, Bottom: values.MarginPadding15}
 					return pg.nextButton.Layout(gtx)
 				}),
 			)

ui/page/send/page.go

@@ -183,11 +183,7 @@ func (pg *Page) validate() bool {
 	addressIsValid := pg.sendDestination.validate()
 
 	validForSending := amountIsValid && addressIsValid
-	if validForSending {
-		pg.nextButton.Background = pg.Theme.Color.Primary
-	} else {
-		pg.nextButton.Background = pg.Theme.Color.Hint
-	}
+	pg.nextButton.SetEnabled(validForSending)
 
 	return validForSending
 }

ui/page/send/send_confirm_modal.go

@@ -45,7 +45,7 @@ func newSendConfirmModal(l *load.Load, data *authoredTxData) *sendConfirmModal {
 
 	scm.confirmButton = l.Theme.Button(new(widget.Clickable), "")
 	scm.confirmButton.Font.Weight = text.Medium
-	scm.confirmButton.Background = scm.Theme.Color.InactiveGray
+	scm.confirmButton.SetEnabled(false)
 
 	scm.passwordEditor = l.Theme.EditorPassword(new(widget.Editor), "Spending password")
 	scm.passwordEditor.Editor.SetText("")
@@ -101,11 +101,7 @@ func (scm *sendConfirmModal) Handle() {
 		if scm.passwordEditor.Editor.Focused() {
 			switch evt.(type) {
 			case widget.ChangeEvent:
-				if scm.passwordEditor.Editor.Text() == "" {
-					scm.confirmButton.Background = scm.Theme.Color.InactiveGray
-				} else {
-					scm.confirmButton.Background = scm.Theme.Color.Primary
-				}
+				scm.confirmButton.SetEnabled(scm.passwordEditor.Editor.Text() != "")
 			case widget.SubmitEvent:
 				scm.broadcastTransaction()
 			}

ui/page/sign_message_page.go

@@ -43,8 +43,9 @@ func NewSignMessagePage(l *load.Load, wallet *dcrlibwallet.Wallet) *SignMessageP
 
 	clearButton := l.Theme.OutlineButton(new(widget.Clickable), "Clear all")
 	signButton := l.Theme.Button(new(widget.Clickable), "Sign message")
-	signButton.Background = l.Theme.Color.Hint
 	clearButton.Font.Weight, signButton.Font.Weight = text.Medium, text.Medium
+	signButton.SetEnabled(false)
+	clearButton.SetEnabled(false)
 
 	errorLabel := l.Theme.Caption("")
 	errorLabel.Color = l.Theme.Color.Danger
@@ -204,20 +205,24 @@ func (pg *SignMessagePage) drawResult() layout.Widget {
 	}
 }
 
-func (pg *SignMessagePage) updateButtonColors() {
-	pg.clearButton.Color, pg.signButton.Background = pg.Theme.Color.Hint, pg.Theme.Color.Hint
+func (pg *SignMessagePage) updateButtonState() {
 	if components.StringNotEmpty(pg.addressEditor.Editor.Text()) ||
 		components.StringNotEmpty(pg.messageEditor.Editor.Text()) {
-		pg.clearButton.Color = pg.Theme.Color.Primary
+		pg.clearButton.SetEnabled(true)
+	} else {
+		pg.clearButton.SetEnabled(false)
 	}
+
 	if !pg.isSigningMessage && pg.messageIsValid && pg.addressIsValid {
-		pg.signButton.Background = pg.Theme.Color.Primary
+		pg.signButton.SetEnabled(true)
+	} else {
+		pg.signButton.SetEnabled(false)
 	}
 }
 
 func (pg *SignMessagePage) Handle() {
 	gtx := pg.gtx
-	pg.updateButtonColors()
+	pg.updateButtonState()
 
 	for _, evt := range pg.addressEditor.Editor.Events() {
 		if pg.addressEditor.Editor.Focused() {

ui/page/tickets/purchase_modal.go

@@ -51,6 +51,8 @@ func newTicketPurchaseModal(l *load.Load) *ticketPurchaseModal {
 		modal:          *l.Theme.ModalFloatTitle(),
 	}
 
+	tp.reviewPurchase.SetEnabled(false)
+
 	tp.vspIsFetched = len((*l.WL.VspInfo).List) > 0
 
 	tp.tickets.Editor.SetText("1")
@@ -117,11 +119,6 @@ func (tp *ticketPurchaseModal) Layout(gtx layout.Context) layout.Dimensions {
 						return layout.Inset{Right: values.MarginPadding4}.Layout(gtx, tp.cancelPurchase.Layout)
 					}),
 					layout.Rigid(func(gtx layout.Context) layout.Dimensions {
-						if tp.canPurchase() {
-							tp.reviewPurchase.Background = tp.Theme.Color.Primary
-						} else {
-							tp.reviewPurchase.Background = tp.Theme.Color.Hint
-						}
 						return tp.reviewPurchase.Layout(gtx)
 					}),
 				)
@@ -243,6 +240,8 @@ func (tp *ticketPurchaseModal) purchaseTickets(password []byte) {
 }
 
 func (tp *ticketPurchaseModal) Handle() {
+	tp.reviewPurchase.SetEnabled(tp.canPurchase())
+
 	// reselect vsp if there's a delay in fetching the VSP List
 	if !tp.vspIsFetched && len((*tp.WL.VspInfo).List) > 0 {
 		if tp.WL.GetRememberVSP() != "" {
@@ -274,16 +273,3 @@ func (tp *ticketPurchaseModal) Handle() {
 			Show()
 	}
 }
-
-func (tp *ticketPurchaseModal) editorsNotEmpty(btn *decredmaterial.Button, editors ...*widget.Editor) bool {
-	btn.Color = tp.Theme.Color.Surface
-	for _, e := range editors {
-		if e.Text() == "" {
-			btn.Background = tp.Theme.Color.Hint
-			return false
-		}
-	}
-
-	btn.Background = tp.Theme.Color.Primary
-	return true
-}

ui/page/tickets/vsp_selector.go

@@ -151,6 +151,8 @@ func newVSPSelectorModal(l *load.Load) *vspSelectorModal {
 		modal:    *l.Theme.ModalFloatTitle(),
 	}
 
+	v.addVSP.SetEnabled(false)
+
 	return v
 }
 
@@ -171,7 +173,8 @@ func (v *vspSelectorModal) Dismiss() {
 }
 
 func (v *vspSelectorModal) Handle() {
-	if v.editorsNotEmpty(&v.addVSP, v.inputVSP.Editor) && v.addVSP.Clicked() {
+	v.addVSP.SetEnabled(v.editorsNotEmpty(v.inputVSP.Editor))
+	if v.addVSP.Clicked() {
 		go func() {
 			err := v.WL.AddVSP(v.inputVSP.Editor.Text())
 			if err != nil {
@@ -267,15 +270,12 @@ func (v *vspSelectorModal) handlerSelectVSP(events []gesture.ClickEvent, info wa
 	}
 }
 
-func (v *vspSelectorModal) editorsNotEmpty(btn *decredmaterial.Button, editors ...*widget.Editor) bool {
-	btn.Color = v.Theme.Color.Surface
+func (v *vspSelectorModal) editorsNotEmpty(editors ...*widget.Editor) bool {
 	for _, e := range editors {
 		if e.Text() == "" {
-			btn.Background = v.Theme.Color.Hint
 			return false
 		}
 	}
 
-	btn.Background = v.Theme.Color.Primary
 	return true
 }

ui/page/validate_address.go

@@ -43,11 +43,12 @@ func NewValidateAddressPage(l *load.Load) *ValidateAddressPage {
 	pg.addressEditor.Editor.Submit = true
 
 	pg.validateBtn = l.Theme.Button(new(widget.Clickable), "Validate")
-	pg.validateBtn.Background = pg.Theme.Color.Hint
 	pg.validateBtn.Font.Weight = text.Medium
+	pg.validateBtn.SetEnabled(false)
 
 	pg.clearBtn = l.Theme.OutlineButton(new(widget.Clickable), "Clear")
 	pg.clearBtn.Font.Weight = text.Medium
+	pg.clearBtn.SetEnabled(false)
 
 	pg.stateValidate = none
 
@@ -218,7 +219,7 @@ func (pg *ValidateAddressPage) pageSections(gtx layout.Context, body layout.Widg
 }
 
 func (pg *ValidateAddressPage) Handle() {
-	pg.updateButtonColors()
+	pg.updateButtonState()
 
 	for _, evt := range pg.addressEditor.Editor.Events() {
 		if pg.addressEditor.Editor.Focused() {
@@ -267,19 +268,10 @@ func (pg *ValidateAddressPage) validateAddress() {
 	pg.walletName = walletName
 }
 
-func (pg *ValidateAddressPage) updateButtonColors() {
-	if !components.StringNotEmpty(pg.addressEditor.Editor.Text()) {
-		pg.validateBtn.Background = pg.Theme.Color.Hint
-		pg.clearBtn.Color = pg.Theme.Color.Hint
-	} else {
-		pg.validateBtn.Background = pg.Theme.Color.Primary
-		pg.clearBtn.Color = pg.Theme.Color.Primary
-	}
-}
-
-func (pg *ValidateAddressPage) clearInputs() {
-	pg.validateBtn.Background = pg.Theme.Color.Hint
-	pg.addressEditor.Editor.SetText("")
+func (pg *ValidateAddressPage) updateButtonState() {
+	enabled := components.StringNotEmpty(pg.addressEditor.Editor.Text())
+	pg.validateBtn.SetEnabled(enabled)
+	pg.clearBtn.SetEnabled(enabled)
 }
 
 func (pg *ValidateAddressPage) OnClose() {}