Skip to content

Conversation

@ealeksandrov
Copy link
Contributor

@ealeksandrov ealeksandrov commented Jan 12, 2023

Closes: #8517

Description

This PR adds bottom toolbar with bulk edit button on Products List.
It replaces tabbar. Action button is enabled conditionally when items are selected.

Note: toolbar is custom and embedded in the stackview, so in landscape mode it doesn't fill full width and doesn't have compact height. It's same as top existing toolbar, but may feel different from system toolbars. We can update the layout later if needed.

Testing

  1. Build and run the app in debug/alpha mode.
  2. On the products list tap the "Bulk Edit" button in the navbar.
  3. Confirm tabbar is replaced with toolbar.
  4. Confirm "Bulk update" button is disabled.
  5. Select a few products from the list.
  6. Confirm "Bulk update" button is enabled.
  7. Tap "Bulk update" in the toolbar.
  8. Confirm action sheet with 2 options appears.
  9. Try rotating in landscape orientation and switching bulk edit state on/off.

Screenshots


  • I have considered if this change warrants user-facing release notes and have added them to RELEASE-NOTES.txt if necessary.

@ealeksandrov ealeksandrov added feature: product list Related to the product list. status: feature-flagged Behind a feature flag. Milestone is not strongly held. labels Jan 12, 2023
@ealeksandrov ealeksandrov added this to the 11.9 milestone Jan 12, 2023
@peril-woocommerce
Copy link

Warnings
⚠️ This PR is assigned to a milestone which is closing in less than 2 days Please, make sure to get it merged by then or assign it to a later expiring milestone

Generated by 🚫 dangerJS

@wpmobilebot
Copy link
Collaborator

wpmobilebot commented Jan 12, 2023

You can test the changes from this Pull Request by:
  • Clicking here or scanning the QR code below to access App Center
  • Then installing the build number pr8617-3ea8bc2 on your iPhone

If you need access to App Center, please ask a maintainer to add you.

Copy link
Contributor

@Ecarrion Ecarrion left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good!

Maybe it's worth adding an issue about the bar in landscape as it feels weird the transition between the tab bar and the bottom toolbar.

Simulator Screen Shot - iPhone 14 Pro - 2023-01-12 at 16 53 55

Comment on lines +562 to +567
// trigger safe area update
if let tabBarController {
let currentFrame = tabBarController.view.frame
tabBarController.view.frame = currentFrame.insetBy(dx: 0, dy: 1)
tabBarController.view.frame = currentFrame
}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice trick, maybe we can wrap this in a small extension helper!

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'll keep it inline for now and hope safe areas will "just work" going forward 🙂
But feel free to convert it to extension if you spot similar issue in other views.

@ealeksandrov
Copy link
Contributor Author

Thanks for review!

Maybe it's worth adding an issue about the bar in landscape

You mean transition between full-screen width and table/stack width, right? Created #8625 for that.

@ealeksandrov ealeksandrov merged commit 80bd8a6 into trunk Jan 13, 2023
@ealeksandrov ealeksandrov deleted the issue/8517-toolbar branch January 13, 2023 12:11
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

feature: product list Related to the product list. status: feature-flagged Behind a feature flag. Milestone is not strongly held.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Bulk Editing: Implement "selection state" of the products list

4 participants