Right-align compact header menus

internal/appui/app.go

@@ -489,10 +489,10 @@ type ui struct {
 	deleteGroupPath                      []string
 	apiPolicyGroupScope                  bool
 	apiTokenSecret                       string
-	phoneSyncMenuAnchor                  image.Point
-	phoneMainMenuAnchor                  image.Point
 	phoneSyncMenuOrigin                  image.Point
 	phoneMainMenuOrigin                  image.Point
+	phoneSyncMenuSize                    image.Point
+	phoneMainMenuSize                    image.Point
 	phoneSyncMenuCall                    op.CallOp
 	phoneMainMenuCall                    op.CallOp
 	phoneSyncMenuVisible                 bool

internal/appui/frame.go

@@ -593,6 +593,8 @@ func (u *ui) layout(gtx layout.Context) layout.Dimensions {
 	u.phoneMainMenuVisible = false
 	u.phoneSyncMenuOrigin = image.Point{}
 	u.phoneMainMenuOrigin = image.Point{}
+	u.phoneSyncMenuSize = image.Point{}
+	u.phoneMainMenuSize = image.Point{}
 	u.phoneSyncMenuCall = op.CallOp{}
 	u.phoneMainMenuCall = op.CallOp{}
 	u.syncHostedAPI()

internal/appui/header.go

@@ -55,19 +55,19 @@ func (u *ui) headerActions(gtx layout.Context) layout.Dimensions {
 		}
 		if u.syncMenuOpen {
 			u.phoneSyncMenuVisible = true
-			u.phoneSyncMenuAnchor = cluster.Metrics.SyncAnchor().Point()
 			u.maybeLogHeaderMenuToggle("sync-visible", true)
 			placement, menuCall := compactSurface.Place(gtx, cluster.Metrics.SyncAnchor(), u.syncMenu)
 			u.phoneSyncMenuOrigin = placement.Origin
+			u.phoneSyncMenuSize = placement.Size
 			u.phoneSyncMenuCall = menuCall
 			u.maybeLogHeaderMenuPlacement("sync-phone", compactSurface, placement)
 		}
 		if u.mainMenuOpen {
 			u.phoneMainMenuVisible = true
-			u.phoneMainMenuAnchor = cluster.Metrics.MainAnchor().Point()
 			u.maybeLogHeaderMenuToggle("main-visible", true)
 			placement, menuCall := compactSurface.Place(gtx, cluster.Metrics.MainAnchor(), u.mainMenu)
 			u.phoneMainMenuOrigin = placement.Origin
+			u.phoneMainMenuSize = placement.Size
 			u.phoneMainMenuCall = menuCall
 			u.maybeLogHeaderMenuPlacement("main-phone", compactSurface, placement)
 		}
@@ -204,13 +204,25 @@ func (u *ui) phoneHeaderMenus(gtx layout.Context) layout.Dimensions {
 	}
 
 	if u.syncMenuVisibleOnPhone() {
-		stack := op.Offset(u.phoneSyncMenuOrigin).Push(gtx.Ops)
+		stack := op.Offset(image.Pt(u.frameInsetPx, u.phoneSyncMenuOrigin.Y)).Push(gtx.Ops)
-		u.phoneSyncMenuCall.Add(gtx.Ops)
+		menuGTX := gtx
+		menuGTX.Constraints.Min = image.Point{}
+		menuGTX.Constraints.Max.X = max(0, gtx.Constraints.Max.X-(u.frameInsetPx*2))
+		layout.E.Layout(menuGTX, func(gtx layout.Context) layout.Dimensions {
+			u.phoneSyncMenuCall.Add(gtx.Ops)
+			return layout.Dimensions{Size: u.phoneSyncMenuSize}
+		})
 		stack.Pop()
 	}
 	if u.mainMenuVisibleOnPhone() {
-		stack := op.Offset(u.phoneMainMenuOrigin).Push(gtx.Ops)
+		stack := op.Offset(image.Pt(u.frameInsetPx, u.phoneMainMenuOrigin.Y)).Push(gtx.Ops)
-		u.phoneMainMenuCall.Add(gtx.Ops)
+		menuGTX := gtx
+		menuGTX.Constraints.Min = image.Point{}
+		menuGTX.Constraints.Max.X = max(0, gtx.Constraints.Max.X-(u.frameInsetPx*2))
+		layout.E.Layout(menuGTX, func(gtx layout.Context) layout.Dimensions {
+			u.phoneMainMenuCall.Add(gtx.Ops)
+			return layout.Dimensions{Size: u.phoneMainMenuSize}
+		})
 		stack.Pop()
 	}
 	return layout.Dimensions{Size: gtx.Constraints.Max}