diff --git a/apps/web/src/locales/en/messages.json b/apps/web/src/locales/en/messages.json index ccb9e6b3520..14fc9fa29e8 100644 --- a/apps/web/src/locales/en/messages.json +++ b/apps/web/src/locales/en/messages.json @@ -11341,5 +11341,26 @@ }, "verifyNow": { "message": "Verify now." + }, + "additionalStorageGB": { + "message": "Additional storage GB" + }, + "additionalServiceAccountsV2": { + "message": "Additional machine accounts" + }, + "secretsManagerSeats": { + "message": "Secrets Manager seats" + }, + "additionalStorage": { + "message": "Additional Storage" + }, + "expandPurchaseDetails": { + "message": "Expand purchase details" + }, + "collapsePurchaseDetails": { + "message": "Collapse purchase details" + }, + "familiesMembership": { + "message": "Families membership" } } diff --git a/libs/pricing/src/components/cart-summary/cart-summary.component.html b/libs/pricing/src/components/cart-summary/cart-summary.component.html index 5b315871f6d..dfa3a797eb3 100644 --- a/libs/pricing/src/components/cart-summary/cart-summary.component.html +++ b/libs/pricing/src/components/cart-summary/cart-summary.component.html @@ -6,8 +6,13 @@
-

- {{ "Total" | i18n }}: {{ total() | currency: "USD" : "symbol" }} USD +

+ {{ "total" | i18n }}: {{ total() | currency: "USD" : "symbol" }} USD

  / {{ passwordManager.cadence | i18n }} @@ -17,9 +22,12 @@ size="small" (click)="toggleExpanded()" [bitIconButton]="isExpanded() ? 'bwi-angle-up' : 'bwi-angle-down'" - [label]="isExpanded() ? 'Collapse purchase details' : 'Expand purchase details'" + [label]=" + isExpanded() ? ('Collapse purchase details' | i18n) : ('Expand purchase details' | i18n) + " [attr.aria-expanded]="isExpanded()" [attr.aria-controls]="'purchase-summary-details'" + data-testid="toggle-purchase-summary-details" >
@@ -28,7 +36,7 @@
-

{{ "Password Manager" | i18n }}

+

{{ "passwordManager" | i18n }}

@@ -41,7 +49,7 @@ {{ passwordManager.cadence | i18n }}
-
+
{{ passwordManagerTotal() | currency: "USD" : "symbol" }}
@@ -56,7 +64,7 @@ {{ additionalStorage.cadence | i18n }}
-
+
{{ additionalStorageTotal() | currency: "USD" : "symbol" }}
@@ -67,7 +75,7 @@ @if (secretsManager) {
-

{{ "Secrets Manager" | i18n }}

+

{{ "secretsManager" | i18n }}

@@ -77,7 +85,11 @@ {{ secretsManager.seats.cost | currency: "USD" : "symbol" }} / {{ secretsManager.seats.cadence | i18n }}
-
+
{{ secretsManagerSeatsTotal() | currency: "USD" : "symbol" }}
@@ -92,7 +104,11 @@ / {{ additionalServiceAccounts.cadence | i18n }} -
+
{{ additionalServiceAccountsTotal() | currency: "USD" : "symbol" }}
@@ -102,16 +118,16 @@
-

{{ "Estimated tax" | i18n }}

-
+

{{ "estimatedTax" | i18n }}

+
{{ estimatedTax() | currency: "USD" : "symbol" }}
-

{{ "Total" | i18n }}

-
+

{{ "total" | i18n }}

+
{{ total() | currency: "USD" : "symbol" }} / {{ passwordManager.cadence | i18n }}
diff --git a/libs/pricing/src/components/cart-summary/cart-summary.component.mdx b/libs/pricing/src/components/cart-summary/cart-summary.component.mdx index 451d733b385..79f36bb2523 100644 --- a/libs/pricing/src/components/cart-summary/cart-summary.component.mdx +++ b/libs/pricing/src/components/cart-summary/cart-summary.component.mdx @@ -88,7 +88,7 @@ The cart summary component provides flexibility through its structured input pro key }, + useValue: { + t: (key: string) => { + switch (key) { + case "month": + return "month"; + case "year": + return "year"; + case "members": + return "Members"; + case "additionalStorageGB": + return "Additional storage GB"; + case "additionalServiceAccountsV2": + return "Additional machine accounts"; + case "secretsManagerSeats": + return "Secrets Manager seats"; + case "passwordManager": + return "Password Manager"; + case "secretsManager": + return "Secrets Manager"; + case "additionalStorage": + return "Additional Storage"; + case "estimatedTax": + return "Estimated tax"; + case "total": + return "Total"; + case "expandPurchaseDetails": + return "Expand purchase details"; + case "collapsePurchaseDetails": + return "Collapse purchase details"; + case "familiesMembership": + return "Families membership"; + case "premiumMembership": + return "Premium membership"; + default: + return key; + } + }, + }, }, ], }), @@ -24,7 +61,7 @@ export default { args: { passwordManager: { quantity: 5, - name: "Members", + name: "members", cost: 50.0, cadence: "month", }, @@ -46,7 +83,7 @@ export const WithAdditionalStorage: Story = { ...Default.args, additionalStorage: { quantity: 2, - name: "Additional storage GB", + name: "additionalStorageGB", cost: 10.0, cadence: "month", }, @@ -58,7 +95,7 @@ export const PasswordManagerYearlyCadence: Story = { args: { passwordManager: { quantity: 5, - name: "Members", + name: "members", cost: 500.0, cadence: "year", }, @@ -72,7 +109,7 @@ export const SecretsManagerSeatsOnly: Story = { secretsManager: { seats: { quantity: 3, - name: "Members", + name: "members", cost: 30.0, cadence: "month", }, @@ -87,13 +124,13 @@ export const SecretsManagerSeatsAndServiceAccounts: Story = { secretsManager: { seats: { quantity: 3, - name: "Members", + name: "members", cost: 30.0, cadence: "month", }, additionalServiceAccounts: { quantity: 2, - name: "Additional machine accounts", + name: "additionalServiceAccountsV2", cost: 6.0, cadence: "month", }, @@ -107,20 +144,20 @@ export const AllProducts: Story = { ...Default.args, additionalStorage: { quantity: 2, - name: "Additional storage GB", + name: "additionalStorageGB", cost: 10.0, cadence: "month", }, secretsManager: { seats: { quantity: 3, - name: "Members", + name: "members", cost: 30.0, cadence: "month", }, additionalServiceAccounts: { quantity: 2, - name: "Additional machine accounts", + name: "additionalServiceAccountsV2", cost: 6.0, cadence: "month", }, @@ -133,7 +170,7 @@ export const FamiliesPlan: Story = { args: { passwordManager: { quantity: 1, - name: "Families membership", + name: "familiesMembership", cost: 40.0, cadence: "year", }, @@ -145,7 +182,7 @@ export const PremiumPlan: Story = { args: { passwordManager: { quantity: 1, - name: "Premium membership", + name: "premiumMembership", cost: 10.0, cadence: "year", },