Home page transaction entry

ui/cryptomaterial/dropdown.go

@@ -36,6 +36,8 @@ type DropDown struct {
 	linearLayout        *LinearLayout
 	padding             layout.Inset
 	shadow              *Shadow
+
+	noSelectedItemText string
 }
 
 type DropDownItem struct {
@@ -90,6 +92,11 @@ func (d *DropDown) Selected() string {
 	return d.items[d.SelectedIndex()].Text
 }
 
+func (d *DropDown) ClearSelection(text string) {
+	d.selectedIndex = -1
+	d.noSelectedItemText = text
+}
+
 func (d *DropDown) SelectedIndex() int {
 	return d.selectedIndex
 }
@@ -152,16 +159,22 @@ func (d *DropDown) layoutActiveIcon(gtx layout.Context, index int) D {
 }
 
 func (d *DropDown) layoutOption(gtx layout.Context, itemIndex int) D {
-	item := d.items[itemIndex]
-	radius := Radius(0)
-	clickable := item.clickable
-	if !d.isOpen {
-		radius = Radius(8)
-		clickable = d.clickable
+	var item *DropDownItem
+	if itemIndex > -1 {
+		item = &d.items[itemIndex]
+	}
+
+	radius := Radius(8)
+	clickable := d.clickable
+	if d.isOpen {
+		radius = Radius(0)
+		if item != nil {
+			clickable = item.clickable
+		}
 	}
 
 	padding := values.MarginPadding10
-	if item.Icon != nil {
+	if item != nil && item.Icon != nil {
 		padding = values.MarginPadding8
 	}
 
@@ -179,12 +192,12 @@ func (d *DropDown) layoutOption(gtx layout.Context, itemIndex int) D {
 		Border:    Border{Radius: radius},
 	}.Layout(gtx,
 		layout.Rigid(func(gtx C) D {
-			if item.Icon == nil {
+			if item == nil || item.Icon == nil {
 				return layout.Dimensions{}
 			}
 
 			dropdownItemWidth -= gtx.Dp(values.MarginPadding24) // account for the dropdown Icon
-			return item.Icon.Layout24dp(gtx)
+			return item.Icon.Layout20dp(gtx)
 		}),
 		layout.Rigid(func(gtx C) D {
 			gtx.Constraints.Max.X = dropdownItemWidth - gtx.Dp(values.MarginPadding50) // give some space for the dropdown Icon
@@ -193,11 +206,16 @@ func (d *DropDown) layoutOption(gtx layout.Context, itemIndex int) D {
 				Right: unit.Dp(5),
 				Left:  unit.Dp(5),
 			}.Layout(gtx, func(gtx C) D {
-				lbl := d.theme.Body2(item.Text)
-				if !d.isOpen && len(item.Text) > 14 {
-					lbl.Text = item.Text[:14] + "..."
+				var txt string
+				if item == nil {
+					txt = d.noSelectedItemText
+				} else if !d.isOpen && len(txt) > 14 {
+					txt = item.Text[:14] + "..."
+				} else {
+					txt = item.Text
 				}
-				return lbl.Layout(gtx)
+
+				return d.theme.Body2(txt).Layout(gtx)
 			})
 		}),
 		layout.Rigid(func(gtx C) D {

ui/cryptomaterial/segmented_control.go

@@ -42,7 +42,7 @@ func (sc *SegmentedControl) Layout(gtx C) D {
 	return LinearLayout{
 		Width:      WrapContent,
 		Height:     WrapContent,
-		Background: sc.theme.Color.Background,
+		Background: sc.theme.Color.Gray2,
 		Border:     Border{Radius: Radius(8)},
 	}.Layout(gtx,
 		layout.Rigid(func(gtx C) D {

ui/cryptomaterial/theme.go

@@ -14,10 +14,11 @@ import (
 	"gioui.org/text"
 	"gioui.org/unit"
 	"gioui.org/widget"
-
 	"gioui.org/widget/material"
 
+	"github.com/crypto-power/cryptopower/libwallet/utils"
 	"github.com/crypto-power/cryptopower/ui/values"
+
 	"golang.org/x/exp/shiny/materialdesign/icons"
 )
 
@@ -307,3 +308,27 @@ func SwitchEditors(event *key.Event, editors ...*widget.Editor) {
 		}
 	}
 }
+
+func (t *Theme) AssetIcon(asset utils.AssetType) *Image {
+	var icon *Image
+	switch asset {
+	case utils.DCRWalletAsset:
+		icon = t.Icons.DCR
+	case utils.LTCWalletAsset:
+		icon = t.Icons.LTC
+	case utils.BTCWalletAsset:
+		icon = t.Icons.BTC
+	default:
+		icon = nil
+	}
+	return icon
+}
+
+func CentralizeWidget(gtx C, widget layout.Widget) D {
+	return LinearLayout{
+		Width:       MatchParent,
+		Height:      WrapContent,
+		Orientation: layout.Horizontal,
+		Direction:   layout.Center,
+	}.Layout2(gtx, widget)
+}

ui/page/components/asset_selector.go

@@ -179,7 +179,7 @@ func (ats *AssetTypeSelector) Layout(window app.WindowNavigator, gtx C) D {
 			}.Layout(gtx, ats.selectedAssetType.Icon.Layout24dp)
 		}),
 		layout.Rigid(func(gtx C) D {
-			txt := ats.Theme.Label(values.TextSize16, ats.hint)
+			txt := ats.Theme.Label(values.TextSize14, ats.hint)
 			txt.Color = ats.Theme.Color.Gray7
 			if ats.selectedAssetType != nil {
 				txt = ats.Theme.Label(values.TextSize16, ats.selectedAssetType.Type.String())

ui/page/components/components.go

@@ -226,9 +226,12 @@ func TransactionTitleIcon(l *load.Load, wal sharedW.Asset, tx *sharedW.Transacti
 	return &txStatus
 }
 
-// transactionRow is a single transaction row on the transactions and overview page. It lays out a transaction's
-// direction, balance, status. isTxPage determines if the transaction should be drawn using the transactions page layout.
-func LayoutTransactionRow(gtx layout.Context, l *load.Load, wal sharedW.Asset, tx *sharedW.Transaction, isTxPage bool) layout.Dimensions {
+// LayoutTransactionRow is a single transaction row on the transactions and overview
+// page. It lays out a transaction's direction, balance, status. hideTxAssetInfo
+// determines if the transaction should display additional information about the tx
+// such as the wallet the tx belong to etc. This is usefil on pages where
+// the tx is displayed from multi wallets.
+func LayoutTransactionRow(gtx layout.Context, l *load.Load, wal sharedW.Asset, tx *sharedW.Transaction, hideTxAssetInfo bool) layout.Dimensions {
 	gtx.Constraints.Min.X = gtx.Constraints.Max.X
 	if wal == nil {
 		return D{}
@@ -240,7 +243,7 @@ func LayoutTransactionRow(gtx layout.Context, l *load.Load, wal sharedW.Asset, t
 	walName := l.Theme.Label(values.TextSize12, wal.GetWalletName())
 
 	insetLeft := values.MarginPadding16
-	if !isTxPage {
+	if !hideTxAssetInfo {
 		insetLeft = values.MarginPadding8
 	}
 
@@ -281,7 +284,7 @@ func LayoutTransactionRow(gtx layout.Context, l *load.Load, wal sharedW.Asset, t
 					}.Layout(gtx,
 						layout.Rigid(l.Theme.Label(values.TextSize18, txStatus.Title).Layout),
 						layout.Rigid(func(gtx C) D {
-							if isTxPage {
+							if hideTxAssetInfo {
 								return D{}
 							}
 							return layout.E.Layout(gtx, func(gtx C) D {
@@ -298,7 +301,7 @@ func LayoutTransactionRow(gtx layout.Context, l *load.Load, wal sharedW.Asset, t
 					)
 				}),
 				layout.Rigid(func(gtx C) D {
-					if !isTxPage && tx.Type == txhelper.TxTypeRegular {
+					if !hideTxAssetInfo && tx.Type == txhelper.TxTypeRegular {
 						return cryptomaterial.LinearLayout{
 							Width:       cryptomaterial.WrapContent,
 							Height:      cryptomaterial.WrapContent,
@@ -312,23 +315,23 @@ func LayoutTransactionRow(gtx layout.Context, l *load.Load, wal sharedW.Asset, t
 							}),
 						)
 					}
-
 					return cryptomaterial.LinearLayout{
 						Width:       cryptomaterial.WrapContent,
 						Height:      cryptomaterial.WrapContent,
 						Orientation: layout.Horizontal,
 						Alignment:   layout.Middle,
+						Direction:   layout.W,
 					}.Layout(gtx,
 						layout.Rigid(func(gtx C) D {
-							if isTxPage {
+							if hideTxAssetInfo {
 								return D{}
 							}
+
 							if tx.Type == txhelper.TxTypeMixed {
 								return cryptomaterial.LinearLayout{
 									Width:       cryptomaterial.WrapContent,
 									Height:      cryptomaterial.WrapContent,
 									Orientation: layout.Horizontal,
-									Direction:   layout.W,
 									Alignment:   layout.Middle,
 								}.Layout(gtx,
 									layout.Rigid(func(gtx C) D {
@@ -350,16 +353,12 @@ func LayoutTransactionRow(gtx layout.Context, l *load.Load, wal sharedW.Asset, t
 								)
 							}
 
-							if isTxPage {
-								return D{}
-							}
-
 							walBalTxt := l.Theme.Label(values.TextSize12, amount)
 							walBalTxt.Color = l.Theme.Color.GrayText2
 							return walBalTxt.Layout(gtx)
 						}),
 						layout.Rigid(func(gtx C) D {
-							if dcrAsset, ok := wal.(*dcr.Asset); ok && !isTxPage {
+							if dcrAsset, ok := wal.(*dcr.Asset); ok && !hideTxAssetInfo {
 								if ok, _ := dcrAsset.TicketHasVotedOrRevoked(tx.Hash); ok {
 									return layout.Inset{
 										Left: values.MarginPadding4,
@@ -378,7 +377,7 @@ func LayoutTransactionRow(gtx layout.Context, l *load.Load, wal sharedW.Asset, t
 								ticketSpender, _ = dcrAsset.TicketSpender(tx.Hash)
 							}
 
-							if ticketSpender == nil || isTxPage {
+							if ticketSpender == nil || hideTxAssetInfo {
 								return D{}
 							}
 							amnt := wal.ToAmount(ticketSpender.VoteReward).ToCoin()
@@ -394,7 +393,7 @@ func LayoutTransactionRow(gtx layout.Context, l *load.Load, wal sharedW.Asset, t
 		}),
 		layout.Flexed(1, func(gtx C) D {
 			txSize := values.TextSize16
-			if !isTxPage {
+			if !hideTxAssetInfo {
 				txSize = values.TextSize12
 			}
 			status := l.Theme.Label(txSize, values.String(values.StrUnknown))
@@ -417,7 +416,7 @@ func LayoutTransactionRow(gtx layout.Context, l *load.Load, wal sharedW.Asset, t
 				return layout.Flex{Alignment: layout.Baseline}.Layout(gtx,
 					layout.Rigid(func(gtx C) D {
 						voteOrRevocationTx := tx.Type == txhelper.TxTypeVote || tx.Type == txhelper.TxTypeRevocation
-						if isTxPage && voteOrRevocationTx {
+						if hideTxAssetInfo && voteOrRevocationTx {
 							title := values.String(values.StrRevoke)
 							if tx.Type == txhelper.TxTypeVote {
 								title = values.String(values.StrVote)
@@ -445,7 +444,7 @@ func LayoutTransactionRow(gtx layout.Context, l *load.Load, wal sharedW.Asset, t
 						return D{}
 					}),
 					layout.Rigid(func(gtx C) D {
-						if !isTxPage {
+						if !hideTxAssetInfo {
 							return cryptomaterial.LinearLayout{
 								Width:       cryptomaterial.WrapContent,
 								Height:      cryptomaterial.WrapContent,
@@ -483,22 +482,23 @@ func LayoutTransactionRow(gtx layout.Context, l *load.Load, wal sharedW.Asset, t
 						return D{}
 					}),
 					layout.Rigid(func(gtx C) D {
-						if isTxPage {
+						if hideTxAssetInfo {
 							return status.Layout(gtx)
 						}
 						return D{}
 					}),
 					layout.Rigid(func(gtx C) D {
 						isMixedOrRegular := tx.Type == txhelper.TxTypeMixed || tx.Type == txhelper.TxTypeRegular
-						if !isTxPage && !isMixedOrRegular {
+						if !hideTxAssetInfo && !isMixedOrRegular {
 							return D{}
 						}
 						statusIcon := l.Theme.Icons.ConfirmIcon
+
 						if TxConfirmations(wal, tx) < wal.RequiredConfirmations() {
 							statusIcon = l.Theme.Icons.PendingIcon
 						}
 
-						if isTxPage {
+						if hideTxAssetInfo {
 							return layout.Inset{
 								Left: values.MarginPadding15,
 								Top:  values.MarginPadding5,
@@ -628,7 +628,7 @@ func TimeFormat(secs int, long bool) string {
 
 // TxPageDropDownFields returns the fields for the required drop down with the
 // transactions view page. Since maps access of items order is always random
-// an array of keys is provided guarrantee the dropdown order will always be
+// an array of keys is provided to guarantee the dropdown order will always be
 // maintained.
 func TxPageDropDownFields(wType libutils.AssetType, tabIndex int) (mapInfo map[string]int32, keysInfo []string) {
 	switch {

ui/page/info/info_page.go

@@ -357,7 +357,7 @@ func (pg *WalletInfo) HandleUserInteractions() {
 	}
 
 	if pg.viewAllTxButton.Button.Clicked() {
-		pg.ParentNavigator().Display(transaction.NewTransactionsPage(pg.Load))
+		pg.ParentNavigator().Display(transaction.NewTransactionsPage(pg.Load, false))
 	}
 
 	if pg.viewAllStakeButton.Button.Clicked() {

ui/page/root/home_page.go

@@ -19,6 +19,7 @@ import (
 	"github.com/crypto-power/cryptopower/ui/page/governance"
 	"github.com/crypto-power/cryptopower/ui/page/send"
 	"github.com/crypto-power/cryptopower/ui/page/settings"
+	"github.com/crypto-power/cryptopower/ui/page/transaction"
 	"github.com/crypto-power/cryptopower/ui/utils"
 	"github.com/crypto-power/cryptopower/ui/values"
 )
@@ -60,6 +61,7 @@ type HomePage struct {
 
 var navigationTabTitles = []string{
 	values.String(values.StrOverview),
+	values.String(values.StrTransactions),
 	values.String(values.StrWallets),
 	values.String(values.StrTrade),
 	values.String(values.StrGovernance),
@@ -200,6 +202,8 @@ func (hp *HomePage) HandleUserInteractions() {
 		switch hp.navigationTab.SelectedTab() {
 		case values.String(values.StrOverview):
 			pg = NewOverviewPage(hp.Load, hp.showNavigationFunc)
+		case values.String(values.StrTransactions):
+			pg = transaction.NewTransactionsPage(hp.Load, true)
 		case values.String(values.StrWallets):
 			pg = hp.walletSelectorPage
 		case values.String(values.StrTrade):

ui/page/root/main_page.go

@@ -274,7 +274,7 @@ func (mp *MainPage) HandleUserInteractions() {
 		case values.String(values.StrInfo):
 			pg = info.NewInfoPage(mp.Load)
 		case values.String(values.StrTransactions):
-			pg = transaction.NewTransactionsPage(mp.Load)
+			pg = transaction.NewTransactionsPage(mp.Load, false)
 		case values.String(values.StrStakeShuffle):
 			dcrUniqueImpl := mp.selectedWallet.(*dcr.Asset)
 			if dcrUniqueImpl != nil {

ui/page/transaction/transaction_details_page.go

@@ -557,6 +557,7 @@ func (pg *TxDetailsPage) txConfirmations() int32 {
 }
 
 func (pg *TxDetailsPage) txnTypeAndID(gtx C) D {
+	reqConf := pg.wallet.RequiredConfirmations()
 	transaction := pg.transaction
 	return cryptomaterial.LinearLayout{
 		Width:       cryptomaterial.MatchParent,
@@ -692,17 +693,17 @@ func (pg *TxDetailsPage) txnTypeAndID(gtx C) D {
 						if pg.txConfirmations() == 0 {
 							txt.Text = caser.String(values.String(values.StrUnconfirmedTx))
 							txt.Color = pg.Theme.Color.GrayText2
-						} else if pg.txConfirmations() >= pg.wallet.RequiredConfirmations() {
+						} else if pg.txConfirmations() >= reqConf {
 							txt.Text = caser.String(values.String(values.StrConfirmed))
 							txt.Color = pg.Theme.Color.Success
 						} else {
-							txt.Text = caser.String(values.StringF(values.StrTxStatusPending, pg.txConfirmations(), pg.wallet.RequiredConfirmations()))
+							txt.Text = caser.String(values.StringF(values.StrTxStatusPending, pg.txConfirmations(), reqConf))
 							txt.Color = pg.Theme.Color.GrayText2
 						}
 						return txt.Layout(gtx)
 					}),
 					layout.Rigid(func(gtx C) D {
-						if pg.txConfirmations() >= pg.wallet.RequiredConfirmations() {
+						if pg.txConfirmations() >= reqConf {
 							m := values.MarginPadding10
 							return layout.Inset{
 								Left:  m,
@@ -714,7 +715,7 @@ func (pg *TxDetailsPage) txnTypeAndID(gtx C) D {
 						return D{}
 					}),
 					layout.Rigid(func(gtx C) D {
-						if pg.txConfirmations() >= pg.wallet.RequiredConfirmations() {
+						if pg.txConfirmations() >= reqConf {
 							txt := pg.Theme.Body2(values.StringF(values.StrNConfirmations, pg.txConfirmations()))
 							txt.Color = pg.Theme.Color.GrayText2
 							return txt.Layout(gtx)