Feat: Add Price with taxes feature #2311

ArthurTriis1 · 2024-05-10T19:06:10Z

What's the purpose of this pull request?

This PR aims to add the functionality of Price with Taxes, the new feature introduced as part of the Faststore B2B initiative. This feature allows the store shows the product price with taxes included. To learn more about the Price with Taxes and the Faststore B2B initiative, please refer to the RFCs and Product Vision documentation.

B2B Faststore Product Vision
B2B Faststore RFC
Price With Taxes RFC

How it works?

PriceWithTaxes API fields

This pull request (PR) introduces new fields to the Queries StoreOffer (priceWithTaxes and listPriceWithTaxes) and StoreAggregateOffer (lowPriceWithTaxes). These fields return various price types with taxes included.

These fields will only be displayed if configured for each component in the Headless CMS.

Headless CMS Configuration

To ensure granularity and easy customization of the "price with taxes" feature, fields have been added to the configuration of each section in the Headless CMS. These fields determine whether a particular section should directly use price data with taxes included and specify the label text indicating that the price already includes taxes (the default value for the label is "Tax Included").

The sections that received this configuration in the CMS are: ProductDetails, CartSidebar, ProductTiles, ProductShelf, CrossSellingProductShelf, and ProductGallery.

Taxes Configuration in CMS example

Taxes Label

Based on the Figma prototype, labels were added to components that display prices, indicating that those prices include taxes. Labels were added to the ProductCard and OrderForm components, as well as to the ProductDetails section.

Packing experience adjusts

During the development of the Price With Taxes feature, some improvements were identified for the Packing feature. These improvements are described throughout the PR.

How to test it?

Starters Deploy Preview

The Price with Taxes feature is being used in this preview on b2bfaststoredev preview linked to this PR. In this preview, a 30% tax has been applied to all products. This tax should be applied across the entire store. For comparison, you can use the current b2bfaststoredev link.

References

B2B Faststore Product Vision
B2B Faststore RFC
Price With Taxes RFC
Preview
PR b2bfaststoredev

Related Tasks

B2BTEAM-1643
B2BTEAM-1647

vercel · 2024-05-10T19:06:14Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
faststore-site	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 5, 2024 6:29pm

codesandbox-ci · 2024-05-14T18:06:06Z

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

ArthurTriis1 · 2024-05-17T18:45:06Z

packages/api/src/platforms/vtex/resolvers/offer.ts

+    }
+
+    if (isOrderFormItem(root)) {
+      return withTax(root.sellingPrice  / 1e2 / root.unitMultiplier, root.tax / 1e2, root.unitMultiplier)


The sellingPrice is the only price that is returned already multiplied by the unitMultiplier. To ensure consistency, this value is being divided by the unitMultiplier to return the unit price, like the others prices.

lucasfp13

LGTM, I just left some suggestions

packages/api/src/platforms/vtex/resolvers/aggregateOffer.ts

packages/api/src/platforms/vtex/utils/withTaxes.ts

packages/components/src/molecules/OrderSummary/OrderSummary.tsx

packages/components/src/molecules/ProductCard/ProductCardContent.tsx

packages/core/src/components/cart/OrderSummary/OrderSummary.tsx

packages/core/src/components/ui/ProductShelf/ProductShelf.tsx

packages/core/src/components/product/ProductCard/ProductCard.tsx

lariciamota · 2024-06-05T12:37:11Z

packages/api/src/typeDefs/aggregateOffer.graphql

@@ -11,6 +11,10 @@ type StoreAggregateOffer {
  """
  lowPrice: Float!
  """
+  Lowest price among all sellers with current Taxes.


suggestion (nit): just to match the descriptions you added on other files.

Suggested change

Lowest price among all sellers with current Taxes.

Lowest price among all sellers with current taxes.

packages/components/src/molecules/OrderSummary/OrderSummary.tsx

lariciamota · 2024-06-05T12:49:10Z

packages/components/src/molecules/ProductCard/ProductCardContent.tsx

+   */
+  includeTaxes?: boolean
+  /**
+   * Label for determine if the price are with taxes included.


Suggested change

* Label for determine if the price are with taxes included.

* Label to determine if the price is with taxes included.

packages/core/src/components/ui/ProductShelf/ProductShelf.tsx

lariciamota · 2024-06-05T13:20:47Z

packages/api/src/platforms/vtex/resolvers/offer.ts

@@ -105,6 +117,17 @@ export const StoreOffer: Record<string, Resolver<Root>> = {

    return null
  },
+  listPriceWithTaxes: (root) => {
+    if (isSearchItem(root)) {
+      return withTax(root.ListPrice, root.Tax, root.product.unitMultiplier)


question: on listPrice it's used root.ListPrice ?? 0, isn't the ?? 0 necessary here?

To be honest, I just reproduced the current listPrice implementation. It looks like the search API could return undefined if the listPrice does not exist, but the order form always returns a value, even if it is 0.

ArthurTriis1

Last Preview Link

https://sfj-a93bddf--b2bfaststoredev.preview.vtex.app/

eduardoformiga · 2024-06-05T20:07:24Z

packages/api/src/platforms/vtex/resolvers/aggregateOffer.ts

-  },
+  highPrice: (offers) => getHighPrice(offers),
+  lowPrice: (offers) => getLowPrice(offers),
+  lowPriceWithTaxes: (offers) => getLowPrice(offers, { includeTaxes: true }),


As we discussed, this field doesn't exist in the https://schema.org/AggregateOffer, and it is passing the includeTaxes: true fixed. Is this the case for getting this value from the catalog instead of fixing it and calculating the value in the lowPrice field directly? Also, I think there is a field to recognize taxes AggregateOffer > priceSpecification > https://schema.org/valueAddedTaxIncluded.

This { includeTaxes: true } is used only inside the getLowPrice function. It's a way to reuse the function to calculate prices with and without taxes. The tax value comes from the Catalog, but whether the store will use taxes and in which section the taxes will be applied is defined in the hCMS. Because of this, both values are returned, and the front end chooses, based on the hCMS, which value should be used.

eduardoformiga · 2024-06-05T20:40:27Z

packages/api/src/platforms/vtex/resolvers/offer.ts

@@ -78,7 +79,18 @@ export const StoreOffer: Record<string, Resolver<Root>> = {
    }

    if (isOrderFormItem(root)) {
-      return root.sellingPrice / 1e2
+      return root.sellingPrice / 1e2 / root.unitMultiplier


Question: why are we changing the current price logic? Would this affect the current stores using the price field? c.c. @lariciamota

This is a modification in the Packing feature. I discovered during this task that the sellingPrice is the only price that is already multiplied by the unitMultiplier. Because of this, some inconsistencies are happening, like a spotPrice being greater than the listPrice due to the multiplication.

This modification should only affect stores that utilize the unitMultiplier, which, at this time, is not being used by any stores.

eduardoformiga · 2024-06-05T21:01:11Z

packages/core/src/components/ui/ProductDetails/ProductDetailsSettings.tsx

-            formatter={useFormattedPrice}
-            {...ProductPrice.props}
-          />
+          <div data-fs-product-details-values-wrapper>


This can change the CSS cascade and affect styles from existing stores; nothing critical, but it could happen 👀 . @renatamottam WDYT?

How are you tracking this kind of modifications side effects?

eduardoformiga · 2024-06-05T21:02:31Z

packages/core/src/components/ui/ProductDetails/ProductDetailsSettings.tsx

+              {...ProductPrice.props}
+            />
+            {taxesConfiguration?.usePriceWithTaxes && (
+              <UILabel data-fs-product-details-taxes-label>


should this be overridable using section override v2 feature? maybe in the future?

Yes, We can do this. Is there documentation on how to create a new section override?

eduardoformiga · 2024-06-05T21:03:52Z

packages/ui/src/components/molecules/OrderSummary/styles.scss

+  --fs-order-summary-taxes-label-color        : var(--fs-color-info-text);
+  --fs-order-summary-taxes-text-size          : var(--fs-text-size-tiny);
+  --fs-order-summary-taxes-text-weight        : var(--fs-text-weight-regular);


should we add the new tokens in the docs?

Yes, I discussed this with @renatamottam. There is a task to create the documentation after the feature is merged.

eduardoformiga · 2024-06-05T21:04:05Z

packages/ui/src/components/molecules/ProductCard/styles.scss

+  --fs-product-card-taxes-label-color        : var(--fs-color-info-text);
+  --fs-product-card-taxes-text-size          : var(--fs-text-size-tiny);
+  --fs-product-card-taxes-text-weight        : var(--fs-text-weight-regular);


should we add the new tokens in the docs?

vercel bot deployed to Preview May 10, 2024 19:10 View deployment

ArthurTriis1 force-pushed the feat/add-price-with-taxes-B2BTEAM-1643 branch from 821f70c to 43c1248 Compare May 14, 2024 18:03

vercel bot deployed to Preview May 14, 2024 21:09 View deployment

vercel bot deployed to Preview May 14, 2024 21:40 View deployment

ArthurTriis1 force-pushed the feat/add-price-with-taxes-B2BTEAM-1643 branch from 420c0bb to 71b9a5f Compare May 15, 2024 18:48

vercel bot deployed to Preview May 15, 2024 18:49 View deployment

ArthurTriis1 force-pushed the feat/add-price-with-taxes-B2BTEAM-1643 branch from 71b9a5f to 3984dfb Compare May 15, 2024 19:35

vercel bot deployed to Preview May 15, 2024 19:35 View deployment

ArthurTriis1 force-pushed the feat/add-price-with-taxes-B2BTEAM-1643 branch from f6098c5 to ff213f0 Compare May 16, 2024 13:10

vercel bot deployed to Preview May 16, 2024 18:56 View deployment

ArthurTriis1 force-pushed the feat/add-price-with-taxes-B2BTEAM-1643 branch from a2fc06b to 486400d Compare May 17, 2024 16:44

vercel bot had a problem deploying to Preview May 17, 2024 16:46 Failure

vercel bot deployed to Preview May 17, 2024 16:56 View deployment

ArthurTriis1 commented May 17, 2024

View reviewed changes

ArthurTriis1 changed the title ~~Feat/add price with taxes b2 bteam 1643~~ Feat: Add Price with taxes feature May 17, 2024

ArthurTriis1 marked this pull request as ready for review May 17, 2024 18:54

ArthurTriis1 requested a review from a team as a code owner May 17, 2024 18:54

ArthurTriis1 requested review from eduardoformiga, lariciamota and ataideverton and removed request for a team May 17, 2024 18:54

ArthurTriis1 self-assigned this May 29, 2024

ArthurTriis1 requested a review from lucasfp13 May 29, 2024 18:09

lucasfp13 reviewed May 31, 2024

View reviewed changes

vercel bot deployed to Preview June 3, 2024 18:14 View deployment

ArthurTriis1 force-pushed the feat/add-price-with-taxes-B2BTEAM-1643 branch from 4c80c48 to 1587ae5 Compare June 3, 2024 18:21

ArthurTriis1 requested a review from lucasfp13 June 3, 2024 18:22

vercel bot had a problem deploying to Preview June 3, 2024 18:23 Failure

Arthur Andrade added 12 commits June 4, 2024 09:24

feat: Adjust cms configuration to taxes

e94d34b

feat: Fix prices with unitMultiplier

ac7d7fa

empty

d7c99cb

empty

28c1185

empty

d77f018

empty

fc3f995

empty

d083e74

reafactor: Apply some adjusts in price with taxes

f5c3b73

feat: update schema

d17e856

feat: update core version

1008749

feat: update core version

f085b42

feat: update core version and fiz the schema

5996035

ArthurTriis1 force-pushed the feat/add-price-with-taxes-B2BTEAM-1643 branch from 6c85e7f to 5996035 Compare June 4, 2024 13:59

vercel bot deployed to Preview June 4, 2024 14:04 View deployment

lariciamota reviewed Jun 5, 2024

View reviewed changes

refactor: correct some comments

a6c399f

vercel bot deployed to Preview June 5, 2024 17:44 View deployment

fix: Adjust ListPrice with 0 backup

9c7d204

vercel bot deployed to Preview June 5, 2024 18:03 View deployment

empty

dba0844

vercel bot deployed to Preview June 5, 2024 18:07 View deployment

Arthur Andrade added 2 commits June 5, 2024 15:11

feat: update core version

6fe5f9a

feat: update packages version

5b90528

vercel bot deployed to Preview June 5, 2024 18:17 View deployment

feat: adjust lackage versions

d5ca5c4

vercel bot deployed to Preview June 5, 2024 18:29 View deployment

ArthurTriis1 commented Jun 5, 2024

View reviewed changes

eduardoformiga reviewed Jun 5, 2024

View reviewed changes

ArthurTriis1 requested review from lariciamota and eduardoformiga June 6, 2024 16:54

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Feat: Add Price with taxes feature #2311

Feat: Add Price with taxes feature #2311

ArthurTriis1 commented May 10, 2024 •

edited

vercel bot commented May 10, 2024 •

edited

codesandbox-ci bot commented May 14, 2024 •

edited

ArthurTriis1 May 17, 2024 •

edited

lucasfp13 left a comment

lariciamota Jun 5, 2024

lariciamota Jun 5, 2024

lariciamota Jun 5, 2024

ArthurTriis1 Jun 5, 2024

ArthurTriis1 left a comment

eduardoformiga Jun 5, 2024

ArthurTriis1 Jun 6, 2024

eduardoformiga Jun 5, 2024

ArthurTriis1 Jun 6, 2024

eduardoformiga Jun 5, 2024

ArthurTriis1 Jun 6, 2024

eduardoformiga Jun 5, 2024

ArthurTriis1 Jun 6, 2024

eduardoformiga Jun 5, 2024

ArthurTriis1 Jun 6, 2024

eduardoformiga Jun 5, 2024

ArthurTriis1 Jun 6, 2024

	Lowest price among all sellers with current Taxes.
	Lowest price among all sellers with current taxes.

	* Label for determine if the price are with taxes included.
	* Label to determine if the price is with taxes included.

Feat: Add Price with taxes feature #2311

Are you sure you want to change the base?

Feat: Add Price with taxes feature #2311

Conversation

ArthurTriis1 commented May 10, 2024 • edited

What's the purpose of this pull request?

How it works?

PriceWithTaxes API fields

Headless CMS Configuration

Taxes Label

Packing experience adjusts

How to test it?

Starters Deploy Preview

References

Related Tasks

vercel bot commented May 10, 2024 • edited

codesandbox-ci bot commented May 14, 2024 • edited

ArthurTriis1 May 17, 2024 • edited

Choose a reason for hiding this comment

lucasfp13 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ArthurTriis1 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ArthurTriis1 commented May 10, 2024 •

edited

vercel bot commented May 10, 2024 •

edited

codesandbox-ci bot commented May 14, 2024 •

edited

ArthurTriis1 May 17, 2024 •

edited