[IAP] M2 Full Feature List screen

[iamgabrielma]

Closes: #10190

Description

This PR adds the View Full Feature List button in the M2 plan selection view, as well as opens a modal displaying a full feature list per plan.

Original Figma design:

Known differences:

There's two known differences that we haven't tackled, mainly because increments complexity. We'll loop with design and update these if are worth the change on a different PR. These are:

• The navigation bar has a different color (white vs grey): There are no built-in methods to change the color of a SwiftUI NavigationView. A possible alternative is to create some sort of NavigationConfigurator struct that conforms to UIViewControllerRepresentable, this can take a closure that accepts a UINavigationController and modifies its appearance.
• Some line items are ordered differently: All essential features appear first within a group, while "performance features only" appear latter. As an example:

Design Proposal	Implementation

Testing instructions

On a Free Trial site, eligible for IAP (a new site can be created in Menu > Switch Sites > Add New Site) tap on Purchase Now and observe that:

• Scrolling below the Performance plan, there's a View Full Feature List.
• Tapping on the button shows the new "Full Feature List screen" in a modal view. Confirm some details:
  • Each group has a title
  • Each group has a list of features
  • Some of these features are marked with a star icon that represents "performance plan only"
  • Some of these features are marked with a 1 or 2 subscript, for example Print Shipping Labels
  • There are line separators between groups
  • The 1 and 2 subscripts appear at the bottom of the view, explaining more details about these features.

-	-

Screenshots

[wpmobilebot]

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 pr10251-a09d032 on your iPhone

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

[toupper]

LGTM! 🚢 I just added a comment to the code. Regarding the design, I have a couple of observations you can consider:

• The 1 subscripts look too small to me.

• We could make the space between the section and the footer bigger:

[toupper]

As all these comments are basically the same, we could create a helper function to avoid duplication.

[iamgabrielma]

Sounds good! Changed

[iamgabrielma]

Thanks for the review!

The 1 subscripts look too small to me.

I agree 🤔 Since these are the same size as the design specs and changing them would require some sort of switching to use AttributedStrings or Markdown I'll leave it for the backlog for the moment. We may want to change these for * or different symbols

We could make the space between the section and the footer bigger:

Good eye! Addressed here: 6dbb5b0