Files
overleaf-cep/services/web/app/views/subscriptions/plans.pug
T
Antoine Clausse 7ed5000e29 [web] Use localized number formatting for currencies (#17622)
* Add a unit test on `SubscriptionFormatters.formatPrice`

* Add JSDoc to `formatPrice`

Also: Name the functions before exporting:
This fixes my IDE (WebStorm) navigation

* Make `'USD'` the default param instead of reassigning

* Create `formatCurrency` function

* Use `formatCurrency` in SubscriptionFormatters

* Use an `isNoCentsCurrency` logic for `CLP` `JPY` `KRW` `VND`

And remove custom `CLP` logic and locale

* Add `locale` param to `formatPrice`

* Generate `groups.json` and `localizedPlanPricing.json`

```
bin/exec web node ./scripts/recurly/recurly_prices.js --download -o prices.json
bin/exec web node ./scripts/plan-prices/plans.js -f ../../prices.json -o dir
```

* Update scripts/plan-prices/plans.js to generate numbers instead of localized amounts

* Generate `groups.json` and `localizedPlanPricing.json`

```
bin/exec web node ./scripts/recurly/recurly_prices.js --download -o prices.json
bin/exec web node ./scripts/plan-prices/plans.js -f ../../prices.json -o dir
```

* Remove generation of `plans.json`

As /services/web/frontend/js/main/plans.js was removed in https://github.com/overleaf/internal/pull/12593

* Sort currencies in alphabetical order in scripts/plan-prices/plans.js

* Generate `groups.json` and `localizedPlanPricing.json`

```
bin/exec web node ./scripts/recurly/recurly_prices.js --download -o prices.json
bin/exec web node ./scripts/plan-prices/plans.js -f ../../prices.json -o dir
```

* Use `formatCurrency` in price-summary.tsx

* Use `formatCurrency` in Subscription Pug files

* Fix unit tests SubscriptionHelperTests.js

* Remove unused `currencySymbol`

* Change to `formatCurrency` in other React components

* Add `CurrencyCode` JSDoc types

* Duplicate `formatCurrency` into services/web/app/src/util

* Wrap tests in a top-level describe block

* Use `narrowSymbol`

* Fix tests with `narrowSymbol` expects

* Revert deletion of old `formatPrice` in SubscriptionFormatters.js

* Rename `formatCurrency` -> `formatCurrencyLocalized`

* Revert deletion of `CurrencySymbol`

* Add split-test in SubscriptionController.js

* Add split-test in SubscriptionViewModelBuilder.js

* Add split-test in plans

* Add split-test in subscription-dashboard-context.tsx

* Add split-test in 4 more components

* Update tests

* Show currency and payment methods in interstitial page

* Fix `–` being printed. Use `–` instead

* Fix test with NOK

* Storybook: Fix missing `SplitTestProvider`

* Storybook: Revert "Remove unused `currencySymbol`"

This reverts commit e55387d4753f97bbf8e39e0fdc3ad17312122aaa.

* Replace `getSplitTestVariant` by `useSplitTestContext`

* Use parameterize currencyFormat in `generateInitialLocalizedGroupPrice`

* Fixup import paths of `formatCurrencyLocalized`

* Replace `% 1 === 0` by `Number.isInteger`

* Add comment explaining that any combinations of languages/currencies could happen

* Fixup after rebase: import `useSplitTestContext`

* Revert "Remove SplitTestProvider from subscription root"

This reverts commit be9f378fda715b86589ab0759737581c72321d87.

* Revert "Remove split test provider from some tests"

This reverts commit 985522932b550cfd38fa6a4f4c3d2ebaee6ff7df.

GitOrigin-RevId: 59a83cbbe0f7cc7e45f189c654e23fcf9bfa37af
2024-04-19 08:03:54 +00:00

56 lines
2.0 KiB
Plaintext

extends ../layout-marketing
block vars
- entrypoint = 'pages/user/subscription/plans-v2/plans-v2-main'
block append meta
meta(name="ol-recommendedCurrency" content=recommendedCurrency)
meta(name="ol-groupPlans" data-type="json" content=groupPlans)
meta(name="ol-currencySymbols" data-type="json" content=groupPlanModalOptions.currencySymbols)
meta(name="ol-itm_content" content=itm_content)
meta(name="ol-currentView" content=currentView)
block content
main.content.content-alt#main-content
.content-page
.plans
.container(ng-cloak)
if showInrGeoBanner
div.notification.notification-type-success.text-centered
div.notification-content !{translate("inr_discount_offer_plans_page_banner", {flag: '🇮🇳'})}
if showBrlGeoBanner
div.notification.notification-type-success.text-centered
div.notification-content !{translate("brl_discount_offer_plans_page_banner", {flag: '🇧🇷'})}
if showLATAMBanner
div.notification.notification-type-success.text-centered
div.notification-content !{translate("latam_discount_offer_plans_page_banner", {flag: latamCountryBannerDetails.latamCountryFlag, country: latamCountryBannerDetails.country, discount: latamCountryBannerDetails.discount })}
.row
.col-md-12
.page-header.centered.plans-header.text-centered.top-page-header
h1.text-capitalize(ng-non-bindable) #{translate('choose_your_plan')}
include ./plans/_cards_controls_tables
+currency_and_payment_methods()
include ./plans/_university_info
include ./plans/_quotes
include ./plans/_faq
.row.row-spaced-large
.col-md-12
.plans-header.plans-subheader.text-centered
hr
h2.header-with-btn #{translate('still_have_questions')}
button.btn.plans-v2-btn-header.text-capitalize(
data-ol-open-contact-form-modal="general"
) #{translate('contact_us')}
.row.row-spaced
include ./plans/_group_plan_modal
!= moduleIncludes("contactModalGeneral-marketing", locals)