Skip to content

Commit

Permalink
update layout ticket list for staking page
Browse files Browse the repository at this point in the history
  • Loading branch information
@JustinBeBoy
JustinBeBoy committed Dec 18, 2023
1 parent 7ed802a commit 38fb254
Show file tree
Hide file tree
Showing 4 changed files with 76 additions and 70 deletions.
113 changes: 62 additions & 51 deletions ui/page/staking/stake_list.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import (

"github.com/crypto-power/cryptopower/libwallet/assets/dcr"
sharedW "github.com/crypto-power/cryptopower/libwallet/assets/wallet"
"github.com/crypto-power/cryptopower/ui/page/components"
"github.com/crypto-power/cryptopower/ui/values"
)

Expand Down Expand Up @@ -47,62 +48,72 @@ func (pg *Page) fetchTickets(offset, pageSize int32) ([]*transactionItem, int, b
}

func (pg *Page) ticketListLayout(gtx C) D {
if pg.showMaterialLoader {
gtx.Constraints.Min.X = gtx.Constraints.Max.X
return layout.Center.Layout(gtx, pg.materialLoader.Layout)
}
isMobile := pg.IsMobileView()
margin24 := values.MarginPaddingTransform(pg.IsMobileView(), values.MarginPadding24)
return layout.Inset{
Bottom: values.MarginPadding8,
}.Layout(gtx, func(gtx C) D {
gtx.Constraints.Min.X = gtx.Constraints.Max.X
return pg.Theme.Card().Layout(gtx, func(gtx C) D {
return layout.UniformInset(margin24).Layout(gtx, func(gtx C) D {
return layout.Flex{Axis: layout.Vertical}.Layout(gtx,
layout.Rigid(func(gtx C) D {
txt := pg.Theme.Label(values.TextSizeTransform(isMobile, values.TextSize20), values.String(values.StrTickets))
txt.Font.Weight = font.SemiBold
return txt.Layout(gtx)
}),
layout.Rigid(layout.Spacer{Height: margin24}.Layout),
layout.Rigid(func(gtx C) D {
if pg.scroll.ItemsCount() <= 0 {
gtx.Constraints.Min.X = gtx.Constraints.Max.X
textSize16 := values.TextSizeTransform(isMobile, values.TextSize16)
return pg.Theme.Card().Layout(gtx, func(gtx C) D {
return pg.scroll.List().Layout(gtx, 1, func(gtx C, i int) D {
gtx.Constraints.Max.Y = ticketHeight
return layout.Inset{
Bottom: values.MarginPadding8,
}.Layout(gtx, func(gtx C) D {
gtx.Constraints.Min.X = gtx.Constraints.Max.X
return layout.UniformInset(margin24).Layout(gtx, func(gtx C) D {
return layout.Flex{Axis: layout.Vertical}.Layout(gtx,
layout.Rigid(func(gtx C) D {
txt := pg.Theme.Label(values.TextSizeTransform(isMobile, values.TextSize20), values.String(values.StrTickets))
txt.Font.Weight = font.SemiBold
return txt.Layout(gtx)
}),
layout.Rigid(layout.Spacer{Height: margin24}.Layout),
layout.Rigid(func(gtx C) D {
if pg.scroll.ItemsCount() <= 0 {
gtx.Constraints.Min.X = gtx.Constraints.Max.X

txt := pg.Theme.Body1(values.String(values.StrNoTickets))
txt.Color = pg.Theme.Color.GrayText3
txt.Alignment = text.Middle
return layout.Inset{Top: values.MarginPadding15, Bottom: values.MarginPadding16}.Layout(gtx, txt.Layout)
}
txt := pg.Theme.Body1(values.String(values.StrNoTickets))
txt.Color = pg.Theme.Color.GrayText3
txt.TextSize = textSize16
txt.Alignment = text.Middle
return layout.Inset{Top: values.MarginPadding15, Bottom: values.MarginPadding16}.Layout(gtx, txt.Layout)
}

tickets := pg.scroll.FetchedData()
return pg.ticketsList.Layout(gtx, len(tickets), func(gtx C, index int) D {
ticket := tickets[index]
return layout.Flex{Axis: layout.Vertical}.Layout(gtx,
// gray separator line
layout.Rigid(func(gtx C) D {
if index == 0 {
return D{}
}
gtx.Constraints.Min.X = gtx.Constraints.Max.X
separator := pg.Theme.Separator()
separator.Width = gtx.Constraints.Max.X
return layout.Inset{
Bottom: values.MarginPadding5,
Left: values.MarginPadding40,
}.Layout(gtx, func(gtx C) D {
return layout.E.Layout(gtx, separator.Layout)
})
}),
layout.Rigid(func(gtx C) D {
return layout.Inset{
Bottom: values.MarginPadding5,
}.Layout(gtx, func(gtx C) D {
return ticketListLayout(gtx, pg.Load, pg.dcrWallet, ticket)
})
}),
)
})
}),
)
tickets := pg.scroll.FetchedData()
return pg.ticketsList.Layout(gtx, len(tickets), func(gtx C, index int) D {
ticket := tickets[index]
return layout.Flex{Axis: layout.Vertical}.Layout(gtx,
// gray separator line
layout.Rigid(func(gtx C) D {
if index == 0 {
return D{}
}
gtx.Constraints.Min.X = gtx.Constraints.Max.X
separator := pg.Theme.Separator()
separator.Width = gtx.Constraints.Max.X
return layout.Inset{
Bottom: values.MarginPadding5,
Left: values.MarginPadding40,
}.Layout(gtx, func(gtx C) D {
return layout.E.Layout(gtx, separator.Layout)
})
}),
layout.Rigid(func(gtx C) D {
return layout.Inset{
Bottom: values.MarginPadding5,
}.Layout(gtx, func(gtx C) D {
return components.LayoutTransactionRow(gtx, pg.Load, pg.dcrWallet, ticket.transaction, true)
})
}),
)
})
}),
)
})
})
})
})

}
11 changes: 1 addition & 10 deletions ui/page/staking/stake_overview.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -193,16 +193,7 @@ func (pg *Page) Layout(gtx C) D {
return layout.Flex{Axis: layout.Vertical}.Layout(gtx,
layout.Rigid(pg.stakePriceSection),
layout.Rigid(pg.stakeStatisticsSection),
layout.Rigid(func(gtx C) D {
if pg.showMaterialLoader {
gtx.Constraints.Min.X = gtx.Constraints.Max.X
return layout.Center.Layout(gtx, pg.materialLoader.Layout)
}
return pg.scroll.List().Layout(gtx, 1, func(gtx C, i int) D {
gtx.Constraints.Max.Y = ticketHeight
return pg.ticketListLayout(gtx)
})
}),
layout.Rigid(pg.ticketListLayout),
)
})
})
Expand Down
20 changes: 12 additions & 8 deletions ui/page/staking/utils.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -143,10 +143,11 @@ func TicketStatusDetails(gtx C, l *load.Load, dcrWallet *dcr.Asset, tx *transact
dateTime := fmt.Sprintf("%v at %v", date, timeSplit)
bestBlock := dcrWallet.GetBestBlock()
col := l.Theme.Color.GrayText3
textSize16 := values.TextSizeTransform(l.IsMobileView(), values.TextSize16)

switch tx.status.TicketStatus {
case dcr.TicketStatusUnmined:
lbl := l.Theme.Label(values.TextSize16, values.StringF(values.StrUnminedInfo, components.TimeAgo(tx.transaction.Timestamp)))
lbl := l.Theme.Label(textSize16, values.StringF(values.StrUnminedInfo, components.TimeAgo(tx.transaction.Timestamp)))
lbl.Color = col
return lbl.Layout(gtx)
case dcr.TicketStatusImmature:
Expand All @@ -157,7 +158,7 @@ func TicketStatusDetails(gtx C, l *load.Load, dcrWallet *dcr.Asset, tx *transact

return layout.Flex{Axis: layout.Horizontal}.Layout(gtx,
layout.Rigid(func(gtx C) D {
lbl := l.Theme.Label(values.TextSize16, values.StringF(values.StrImmatureInfo, blockRemaining, maturity,
lbl := l.Theme.Label(textSize16, values.StringF(values.StrImmatureInfo, blockRemaining, maturity,
maturityDuration.String()))
lbl.Color = col
return lbl.Layout(gtx)
Expand All @@ -175,14 +176,14 @@ func TicketStatusDetails(gtx C, l *load.Load, dcrWallet *dcr.Asset, tx *transact
)
case dcr.TicketStatusLive:
expiry := dcrWallet.TicketExpiry()
lbl := l.Theme.Label(values.TextSize16, values.StringF(values.StrLiveInfoDisc, expiry, getTimeToMatureOrExpire(dcrWallet, tx), expiry))
lbl := l.Theme.Label(textSize16, values.StringF(values.StrLiveInfoDisc, expiry, getTimeToMatureOrExpire(dcrWallet, tx), expiry))
lbl.Color = col
return lbl.Layout(gtx)
case dcr.TicketStatusVotedOrRevoked:
if tx.ticketSpender.Type == dcr.TxTypeVote {
return multiContent(gtx, l, dateTime, fmt.Sprintf("%s %v", values.String(values.StrVoted), components.TimeAgo(tx.transaction.Timestamp)))
}
lbl := l.Theme.Label(values.TextSize16, dateTime)
lbl := l.Theme.Label(textSize16, dateTime)
lbl.Color = col
return lbl.Layout(gtx)
case dcr.TicketStatusExpired:
Expand All @@ -193,10 +194,11 @@ func TicketStatusDetails(gtx C, l *load.Load, dcrWallet *dcr.Asset, tx *transact
}

func multiContent(gtx C, l *load.Load, leftText, rightText string) D {
textSize16 := values.TextSizeTransform(l.IsMobileView(), values.TextSize16)
col := l.Theme.Color.GrayText3
return layout.Flex{Alignment: layout.Middle}.Layout(gtx,
layout.Rigid(func(gtx C) D {
lbl := l.Theme.Label(values.TextSize16, leftText)
lbl := l.Theme.Label(textSize16, leftText)
lbl.Color = col
return lbl.Layout(gtx)
}),
Expand All @@ -211,7 +213,7 @@ func multiContent(gtx C, l *load.Load, leftText, rightText string) D {
})
}),
layout.Rigid(func(gtx C) D {
lbl := l.Theme.Label(values.TextSize16, rightText)
lbl := l.Theme.Label(textSize16, rightText)
lbl.Color = col
return lbl.Layout(gtx)
}),
Expand All @@ -230,7 +232,9 @@ func ticketListLayout(gtx C, l *load.Load, wallet *dcr.Asset, ticket *transactio
wrapIcon.Color = ticket.status.Background
wrapIcon.Radius = cryptomaterial.Radius(8)
dims := wrapIcon.Layout(gtx, func(gtx C) D {
return layout.UniformInset(values.MarginPadding10).Layout(gtx, ticket.status.Icon.Layout24dp)
return layout.UniformInset(values.MarginPadding10).Layout(gtx, func(gtx C) D {
return ticket.status.Icon.LayoutTransform(gtx, l.IsMobileView(), values.MarginPadding24)
})
})

return layout.Inset{
Expand All @@ -239,7 +243,7 @@ func ticketListLayout(gtx C, l *load.Load, wallet *dcr.Asset, ticket *transactio
return dims
})
}),
layout.Rigid(l.Theme.Label(values.TextSize18, ticket.status.Title).Layout),
layout.Rigid(l.Theme.Label(values.TextSizeTransform(l.IsMobileView(), values.TextSize18), ticket.status.Title).Layout),
)
},
func(gtx C) D {
Expand Down
2 changes: 1 addition & 1 deletion ui/window.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ func CreateWindow(mw *libwallet.AssetsManager, version string, buildDate time.Ti
// appSize overwrites gioui's default app size of 'Size(800, 600)'
appSize := giouiApp.Size(values.AppWidth, values.AppHeight)
// appMinSize is the minimum size the app.
appMinSize := giouiApp.MinSize(values.AppWidth, values.AppHeight)
appMinSize := giouiApp.MinSize(values.MobileAppWidth, values.MobileAppHeight)
// Display network on the app title if its not on mainnet.
if net := mw.NetType(); net != libutils.Mainnet {
appTitle = giouiApp.Title(values.StringF(values.StrAppTitle, net.Display()))
Expand Down

0 comments on commit 38fb254

Please sign in to comment.