Merge pull request #403 from mirumee/ref/use-icu

Use structurized JSON files instead of PO

.tx/config

@@ -1,10 +1,10 @@
 [main]
 host = https://www.transifex.com
 
-[saleor-1.dashboard-20]
+[saleor-1.dashboard-20-json]
-file_filter = locale/<lang>.po
+file_filter = locale/<lang>.json
 minimum_perc = 1
-source_file = locale/messages.pot
+source_file = locale/defaultMessages.json
 source_lang = en
-type = PO
+type = STRUCTURED_JSON
 

CHANGELOG.md

@@ -32,6 +32,7 @@ All notable, unreleased changes to this project will be documented in this file.
 - Improve product update form error handling - #392 by @dominik-zeglen
 - Fix column picker errors - #393 by @dominik-zeglen
 - Improve order filters - #396 by @dominik-zeglen
+- Use structurized JSON files instead of PO - #403 by @dominik-zeglen
 
 ## 2.0.0
 

babel.config.js

@@ -47,8 +47,8 @@ module.exports = api => {
   plugins.push("macros");
 
   return {
-    presets,
+    ignore,
     plugins,
-    ignore
+    presets,
   };
 };

package-lock.json

@@ -12367,15 +12367,6 @@
         "assert-plus": "^1.0.0"
       }
     },
-    "gettext-parser": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/gettext-parser/-/gettext-parser-1.1.0.tgz",
-      "integrity": "sha1-LFpmONiTk0ubVQN9CtgstwBLJnk=",
-      "dev": true,
-      "requires": {
-        "encoding": "^0.1.11"
-      }
-    },
     "git-parse": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/git-parse/-/git-parse-1.0.3.tgz",
@@ -12688,12 +12679,6 @@
         }
       }
     },
-    "has-color": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/has-color/-/has-color-0.1.7.tgz",
-      "integrity": "sha1-ZxRKUmDDT8PMpnfQQdr1L+e3iy8=",
-      "dev": true
-    },
     "has-flag": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
@@ -14721,6 +14706,15 @@
       "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
       "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg=="
     },
+    "json-stable-stringify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz",
+      "integrity": "sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8=",
+      "dev": true,
+      "requires": {
+        "jsonify": "~0.0.0"
+      }
+    },
     "json-stable-stringify-without-jsonify": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz",
@@ -14756,6 +14750,12 @@
         "graceful-fs": "^4.1.6"
       }
     },
+    "jsonify": {
+      "version": "0.0.0",
+      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
+      "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM=",
+      "dev": true
+    },
     "jsprim": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.1.tgz",
@@ -16786,41 +16786,6 @@
       "integrity": "sha512-ma6oU4Sk0qOoKEAymVoTvk8EdXEobdS7m/mAGhDJ8Rouugho48crHBORAmy5BoOcv8wraPM6xumapQp5hl4iIQ==",
       "dev": true
     },
-    "nomnom": {
-      "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/nomnom/-/nomnom-1.8.1.tgz",
-      "integrity": "sha1-IVH3Ikcrp55Qp2/BJbuMjy5Nwqc=",
-      "dev": true,
-      "requires": {
-        "chalk": "~0.4.0",
-        "underscore": "~1.6.0"
-      },
-      "dependencies": {
-        "ansi-styles": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.0.0.tgz",
-          "integrity": "sha1-yxAt8cVvUSPquLZ817mAJ6AnkXg=",
-          "dev": true
-        },
-        "chalk": {
-          "version": "0.4.0",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.4.0.tgz",
-          "integrity": "sha1-UZmj3c0MHv4jvAjBsCewYXbgxk8=",
-          "dev": true,
-          "requires": {
-            "ansi-styles": "~1.0.0",
-            "has-color": "~0.1.0",
-            "strip-ansi": "~0.1.0"
-          }
-        },
-        "strip-ansi": {
-          "version": "0.1.1",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.1.1.tgz",
-          "integrity": "sha1-OeipjQRNFQZgq+SmgIrPcLt7yZE=",
-          "dev": true
-        }
-      }
-    },
     "normalize-package-data": {
       "version": "2.5.0",
       "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.5.0.tgz",
@@ -17808,16 +17773,6 @@
         "ts-pnp": "^1.1.2"
       }
     },
-    "po2json": {
-      "version": "0.4.5",
-      "resolved": "https://registry.npmjs.org/po2json/-/po2json-0.4.5.tgz",
-      "integrity": "sha1-R7spUtoy1Yob4vJWpZjuvAt0URg=",
-      "dev": true,
-      "requires": {
-        "gettext-parser": "1.1.0",
-        "nomnom": "1.8.1"
-      }
-    },
     "polished": {
       "version": "3.4.2",
       "resolved": "https://registry.npmjs.org/polished/-/polished-3.4.2.tgz",
@@ -18730,26 +18685,16 @@
         "shallow-equal": "^1.1.0"
       }
     },
-    "react-intl-po": {
+    "react-intl-translations-manager": {
-      "version": "2.2.2",
+      "version": "5.0.3",
-      "resolved": "https://registry.npmjs.org/react-intl-po/-/react-intl-po-2.2.2.tgz",
+      "resolved": "https://registry.npmjs.org/react-intl-translations-manager/-/react-intl-translations-manager-5.0.3.tgz",
-      "integrity": "sha512-BvW4gyohm4Ac0sSN6dBJB3+PeIjsns+IE9JqT/7NolBRGNc+fCKzWa5e1eZdhu9nY+7W1t0sWqhrt+LXgXb6Iw==",
+      "integrity": "sha512-EfBeugnOGFcdUbQyY9TqBMbuauQ8wm73ZqFr0UqCljhbXl7YDHQcVzclWFRkVmlUffzxitLQFhAZEVVeRNQSwA==",
       "dev": true,
       "requires": {
         "chalk": "^2.3.2",
-        "commander": "^2.15.1",
         "glob": "^7.1.2",
-        "mkdirp": "^0.5.1",
+        "json-stable-stringify": "^1.0.1",
-        "po2json": "^0.4.5",
+        "mkdirp": "^0.5.1"
-        "ramda": "^0.25.0"
-      },
-      "dependencies": {
-        "ramda": {
-          "version": "0.25.0",
-          "resolved": "https://registry.npmjs.org/ramda/-/ramda-0.25.0.tgz",
-          "integrity": "sha512-GXpfrYVPwx3K7RQ6aYT8KPS8XViSXUVJT1ONhoKPE9VAleW42YE+U+8VEyGWt41EnEQW7gwecYJriTI0pKoecQ==",
-          "dev": true
-        }
       }
     },
     "react-is": {
@@ -22244,12 +22189,6 @@
       "integrity": "sha1-5z3T17DXxe2G+6xrCufYxqadUPo=",
       "dev": true
     },
-    "underscore": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.6.0.tgz",
-      "integrity": "sha1-izixDKze9jM3uLJOT/htRa6lKag=",
-      "dev": true
-    },
     "unfetch": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/unfetch/-/unfetch-4.1.0.tgz",

package.json

@@ -130,7 +130,7 @@
     "lint-staged": "^9.4.2",
     "plop": "^2.4.0",
     "prettier": "^1.19.1",
-    "react-intl-po": "^2.2.2",
+    "react-intl-translations-manager": "^5.0.3",
     "react-test-renderer": "^16.12.0",
     "regenerator-runtime": "^0.11.1",
     "require-context.macro": "^1.1.1",
@@ -184,9 +184,8 @@
   "scripts": {
     "build": "webpack -p",
     "extract-json-messages": "rimraf build/locale && cross-env NODE_ENV=extract babel src 'src/**/*.{ts,tsx}' -o build/dashboard.bundle.js",
-    "extract-pot-messages": "rip json2pot \"build/locale/**/*.json\" -c description -o locale/messages.pot",
+    "transpile-messages": "node scripts/transpile-tx.js",
-    "extract-messages": "npm run extract-json-messages && npm run extract-pot-messages",
+    "extract-messages": "npm run extract-json-messages && npm run transpile-messages",
-    "build-messages": "rip po2json 'locale/**/*.po' -m 'build/locale/**/*.json' -o 'locale' -c 'description'",
     "build-types": "apollo client:codegen --target=typescript types --globalTypesFile=src/types/globalTypes.ts",
     "check-types": "tsc --noEmit",
     "generate-component": "plop --plopfile .plop/plopfile.js",

scripts/transpile-tx.js

@@ -0,0 +1,43 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+const {
+  createSingleMessagesFile,
+  default: manageTranslations
+} = require("react-intl-translations-manager");
+
+const dotSeparator = "_dot_";
+const sortKeys = true;
+const translationsDirectory = "locale";
+
+manageTranslations({
+  messagesDirectory: "build/locale/src",
+  overrideCoreMethods: {
+    outputSingleFile: combinedFiles => {
+      const msgDescriptors = combinedFiles.reduce(
+        (acc, messages) => [...acc, ...messages.descriptors],
+        []
+      );
+      const structuredJsonFormat = msgDescriptors.reduce((msgs, msg) => {
+        const key = msg.id.replace(/\./g, dotSeparator);
+        if (msgs[key] && msgs[key].context === undefined) {
+          msgs[key].context = msg.description;
+        } else {
+          msgs[key] = {
+            context: msg.description,
+            string: msg.defaultMessage
+          };
+        }
+
+        return msgs;
+      }, {});
+
+      createSingleMessagesFile({
+        directory: translationsDirectory,
+        messages: structuredJsonFormat,
+        sortKeys
+      });
+    }
+  },
+  singleMessagesFile: true,
+  sortKeys,
+  translationsDirectory
+});

src/attributes/components/AttributeBulkDeleteDialog/AttributeBulkDeleteDialog.tsx

@@ -36,7 +36,7 @@ const AttributeBulkDeleteDialog: React.FC<AttributeBulkDeleteDialogProps> = ({
     >
       <DialogContentText>
         <FormattedMessage
-          defaultMessage="Are you sure you want to delete {counter,plural,one{this attribute} other{{displayQuantity} attributes}}?"
+          defaultMessage="{counter,plural,one{Are you sure you want to delete this attribute?} other{Are you sure you want to delete {displayQuantity} attributes?}}"
           description="dialog content"
           values={{
             counter: quantity,

src/categories/views/CategoryDetails.tsx

@@ -298,7 +298,7 @@ export const CategoryDetails: React.FC<CategoryDetailsProps> = ({
             >
               <DialogContentText>
                 <FormattedMessage
-                  defaultMessage="Are you sure you want to delete {counter,plural,one{this category} other{{displayQuantity} categories}}?"
+                  defaultMessage="{counter,plural,one{Are you sure you want to delete this category?} other{Are you sure you want to delete {displayQuantity} categories?}}"
                   values={{
                     counter: maybe(() => params.ids.length),
                     displayQuantity: (
@@ -328,7 +328,7 @@ export const CategoryDetails: React.FC<CategoryDetailsProps> = ({
             >
               <DialogContentText>
                 <FormattedMessage
-                  defaultMessage="Are you sure you want to delete {counter,plural,one{this product} other{{displayQuantity} products}}?"
+                  defaultMessage="{counter,plural,one{Are you sure you want to delete this product?} other{Are you sure you want to delete {displayQuantity} products?}}"
                   values={{
                     counter: maybe(() => params.ids.length),
                     displayQuantity: (

src/categories/views/CategoryList/CategoryList.tsx

@@ -210,7 +210,7 @@ export const CategoryList: React.FC<CategoryListProps> = ({ params }) => {
       >
         <DialogContentText>
           <FormattedMessage
-            defaultMessage="Are you sure you want to delete {counter,plural,one{this category} other{{displayQuantity} categories}}?"
+            defaultMessage="{counter,plural,one{Are you sure you want to delete this category?} other{Are you sure you want to delete {displayQuantity} categories?}}"
             values={{
               counter: maybe(() => params.ids.length),
               displayQuantity: <strong>{maybe(() => params.ids.length)}</strong>

src/collections/views/CollectionDetails.tsx

@@ -309,7 +309,7 @@ export const CollectionDetails: React.FC<CollectionDetailsProps> = ({
                   >
                     <DialogContentText>
                       <FormattedMessage
-                        defaultMessage="Are you sure you want to unassign {counter,plural,one{this product} other{{displayQuantity} products}}?"
+                        defaultMessage="{counter,plural,one{Are you sure you want to unassign this product?} other{Are you sure you want to unassign {displayQuantity} products?}}"
                         values={{
                           counter: maybe(() => params.ids.length),
                           displayQuantity: (

src/collections/views/CollectionList/CollectionList.tsx

@@ -260,7 +260,7 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
               >
                 <DialogContentText>
                   <FormattedMessage
-                    defaultMessage="Are you sure you want to publish {counter,plural,one{this collection} other{{displayQuantity} collections}}?"
+                    defaultMessage="{counter,plural,one{Are you sure you want to publish this collection?} other{Are you sure you want to publish {displayQuantity} collections?}}"
                     values={{
                       counter: maybe(() => params.ids.length),
                       displayQuantity: (
@@ -293,7 +293,7 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
               >
                 <DialogContentText>
                   <FormattedMessage
-                    defaultMessage="Are you sure you want to unpublish {counter,plural,one{this collection} other{{displayQuantity} collections}}?"
+                    defaultMessage="{counter,plural,one{Are you sure you want to unpublish this collection?} other{Are you sure you want to unpublish {displayQuantity} collections?}}"
                     values={{
                       counter: maybe(() => params.ids.length),
                       displayQuantity: (
@@ -325,7 +325,7 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
               >
                 <DialogContentText>
                   <FormattedMessage
-                    defaultMessage="Are you sure you want to delete {counter,plural,one{this collection} other{{displayQuantity} collections}}?"
+                    defaultMessage="{counter,plural,one{Are you sure you want to delete this collection?} other{Are you sure you want to delete {displayQuantity} collections?}}"
                     values={{
                       counter: maybe(() => params.ids.length),
                       displayQuantity: (

src/components/Locale/Locale.tsx

@@ -89,7 +89,11 @@ export enum Locale {
   ZH_HANT = "zh-hant"
 }
 
-type LocaleMessages = Record<string, string>;
+interface StructuredMessage {
+  context?: string;
+  string: string;
+}
+type LocaleMessages = Record<string, StructuredMessage>;
 const localeData: Record<Locale, LocaleMessages> = {
   [Locale.AR]: locale_AR,
   [Locale.AZ]: locale_AZ,
@@ -181,6 +185,19 @@ export const localeNames: Record<Locale, string> = {
   [Locale.ZH_HANT]: "繁體中文"
 };
 
+const dotSeparator = "_dot_";
+const sepRegExp = new RegExp(dotSeparator, "g");
+
+function getKeyValueJson(messages: LocaleMessages): Record<string, string> {
+  if (messages) {
+    const keyValueMessages: Record<string, string> = {};
+    return Object.entries(messages).reduce((acc, [id, msg]) => {
+      acc[id.replace(sepRegExp, ".")] = msg.string;
+      return acc;
+    }, keyValueMessages);
+  }
+}
+
 export function getMatchingLocale(languages: readonly string[]): Locale {
   const localeEntries = Object.entries(Locale);
 
@@ -218,7 +235,7 @@ const LocaleProvider: React.FC = ({ children }) => {
     <IntlProvider
       defaultLocale={defaultLocale}
       locale={locale}
-      messages={localeData[locale]}
+      messages={getKeyValueJson(localeData[locale])}
       onError={err => {
         if (!err.includes("[React Intl] Missing message: ")) {
           console.error(err);

src/customers/views/CustomerList/CustomerList.tsx

@@ -210,7 +210,7 @@ export const CustomerList: React.FC<CustomerListProps> = ({ params }) => {
           >
             <DialogContentText>
               <FormattedMessage
-                defaultMessage="Are you sure you want to delete {counter,plural,one{this customer} other{{displayQuantity} customers}}?"
+                defaultMessage="{counter,plural,one{Are you sure you want to delete this customer?} other{Are you sure you want to delete {displayQuantity} customers?}}"
                 values={{
                   counter: maybe(() => params.ids.length),
                   displayQuantity: (

src/discounts/views/SaleDetails.tsx

@@ -422,7 +422,7 @@ export const SaleDetails: React.FC<SaleDetailsProps> = ({ id, params }) => {
                               {canOpenBulkActionDialog && (
                                 <DialogContentText>
                                   <FormattedMessage
-                                    defaultMessage="Are you sure you want to unassign {counter,plural,one{this category} other{{displayQuantity} categories}}?"
+                                    defaultMessage="{counter,plural,one{Are you sure you want to unassign this category?} other{Are you sure you want to unassign {displayQuantity} categories?}}"
                                     description="dialog content"
                                     values={{
                                       counter: params.ids.length,
@@ -455,7 +455,7 @@ export const SaleDetails: React.FC<SaleDetailsProps> = ({ id, params }) => {
                               {canOpenBulkActionDialog && (
                                 <DialogContentText>
                                   <FormattedMessage
-                                    defaultMessage="Are you sure you want to unassign {counter,plural,one{this collection} other{{displayQuantity} collections}}?"
+                                    defaultMessage="{counter,plural,one{Are you sure you want to unassign this collection?} other{Are you sure you want to unassign {displayQuantity} collections?}}"
                                     description="dialog content"
                                     values={{
                                       counter: params.ids.length,
@@ -487,7 +487,7 @@ export const SaleDetails: React.FC<SaleDetailsProps> = ({ id, params }) => {
                               {canOpenBulkActionDialog && (
                                 <DialogContentText>
                                   <FormattedMessage
-                                    defaultMessage="Are you sure you want to unassign {counter,plural,one{this product} other{{displayQuantity} products}}?"
+                                    defaultMessage="{counter,plural,one{Are you sure you want to unassign this product?} other{Are you sure you want to unassign {displayQuantity} products?}}"
                                     description="dialog content"
                                     values={{
                                       counter: params.ids.length,

src/discounts/views/SaleList/SaleList.tsx

@@ -216,7 +216,7 @@ export const SaleList: React.FC<SaleListProps> = ({ params }) => {
               {canOpenBulkActionDialog && (
                 <DialogContentText>
                   <FormattedMessage
-                    defaultMessage="Are you sure you want to delete {counter,plural,one{this sale} other{{displayQuantity} sales}}?"
+                    defaultMessage="{counter,plural,one{Are you sure you want to delete this sale?} other{Are you sure you want to delete {displayQuantity} sales?}}"
                     description="dialog content"
                     values={{
                       counter: params.ids.length,

src/discounts/views/VoucherDetails.tsx

@@ -528,7 +528,7 @@ export const VoucherDetails: React.FC<VoucherDetailsProps> = ({
                               {canOpenBulkActionDialog && (
                                 <DialogContentText>
                                   <FormattedMessage
-                                    defaultMessage="Are you sure you want to unassign {counter,plural,one{this category} other{{displayQuantity} categories}}?"
+                                    defaultMessage="{counter,plural,one{Are you sure you want to unassign this category?} other{Are you sure you want to unassign {displayQuantity} categories?}}"
                                     description="dialog content"
                                     values={{
                                       counter: params.ids.length,
@@ -561,7 +561,7 @@ export const VoucherDetails: React.FC<VoucherDetailsProps> = ({
                               {canOpenBulkActionDialog && (
                                 <DialogContentText>
                                   <FormattedMessage
-                                    defaultMessage="Are you sure you want to unassign {counter,plural,one{this collection} other{{displayQuantity} collections}}?"
+                                    defaultMessage="{counter,plural,one{Are you sure you want to unassign this collection?} other{Are you sure you want to unassign {displayQuantity} collections?}}"
                                     description="dialog content"
                                     values={{
                                       counter: params.ids.length,
@@ -594,7 +594,7 @@ export const VoucherDetails: React.FC<VoucherDetailsProps> = ({
                               {canOpenBulkActionDialog && (
                                 <DialogContentText>
                                   <FormattedMessage
-                                    defaultMessage="Are you sure you want to unassign {counter,plural,one{this product} other{{displayQuantity} products}}?"
+                                    defaultMessage="{counter,plural,one{Are you sure you want to unassign this product?} other{Are you sure you want to unassign {displayQuantity} products?}}"
                                     description="dialog content"
                                     values={{
                                       counter: params.ids.length,

src/discounts/views/VoucherList/VoucherList.tsx

@@ -216,7 +216,7 @@ export const VoucherList: React.FC<VoucherListProps> = ({ params }) => {
               {canOpenBulkActionDialog && (
                 <DialogContentText>
                   <FormattedMessage
-                    defaultMessage="Are you sure you want to delete {counter,plural,one{this voucher} other{{displayQuantity} vouchers}}?"
+                    defaultMessage="{counter,plural,one{Are you sure you want to delete this voucher?} other{Are you sure you want to delete {displayQuantity} vouchers?}}"
                     description="dialog content"
                     values={{
                       counter: params.ids.length,

src/home/components/HomeNotificationTable/HomeNotificationTable.tsx

@@ -70,10 +70,7 @@ const HomeNotificationTable: React.FC<HomeNotificationTableProps> = props => {
                 ) : (
                   <Typography>
                     <FormattedMessage
-                      defaultMessage="{amount, plural,
+                      defaultMessage="{amount, plural,one {One order is ready to fulfill} other {{amount} Orders are ready to fulfill}}"
-                  one {One order}
-                  other {{amount} Orders}
-                } are ready to fulfill"
                       id="homeNotificationTableOrders"
                       values={{
                         amount: <strong>{ordersToFulfill}</strong>
@@ -100,10 +97,7 @@ const HomeNotificationTable: React.FC<HomeNotificationTableProps> = props => {
                 ) : (
                   <Typography>
                     <FormattedMessage
-                      defaultMessage="{amount, plural,
+                      defaultMessage="{amount, plural,one {One payment to capture}other {{amount} Payments to capture}}"
-                  one {One payment}
-                  other {{amount} Payments}
-                } to capture"
                       id="homeNotificationTablePayments"
                       values={{
                         amount: <strong>{ordersToCapture}</strong>
@@ -135,10 +129,7 @@ const HomeNotificationTable: React.FC<HomeNotificationTableProps> = props => {
                 ) : (
                   <Typography>
                     <FormattedMessage
-                      defaultMessage="{amount, plural,
+                      defaultMessage="{amount, plural,one {One product out of stock}other {{amount} Products out of stock}}"
-                  one {One product}
-                  other {{amount} Products}
-                } out of stock"
                       id="homeNotificationTableProducts"
                       values={{
                         amount: <strong>{productsOutOfStock}</strong>

src/home/components/HomeProductListCard/HomeProductListCard.tsx

@@ -99,10 +99,7 @@ export const HomeProductList: React.FC<HomeProductListProps> = props => {
                       </Typography>
                       <Typography color={"textSecondary"}>
                         <FormattedMessage
-                          defaultMessage="{amount, plural,
+                          defaultMessage="{amount, plural,one {One ordered}other {{amount} Ordered}}"
-                              one {One ordered}
-                              other {{amount} Ordered}
-                            }"
                           description="number of ordered products"
                           id="homeProductListCardOrders"
                           values={{

src/navigation/views/MenuList/MenuList.tsx

@@ -238,7 +238,7 @@ const MenuList: React.FC<MenuListProps> = ({ params }) => {
                   >
                     <DialogContentText>
                       <FormattedMessage
-                        defaultMessage="Are you sure you want to delete {counter,plural,one{this menu} other{{displayQuantity} menus}}?"
+                        defaultMessage="{counter,plural,one{Are you sure you want to delete this menu?} other{Are you sure you want to delete {displayQuantity} menus?}}"
                         id="menuListDeleteMenusContent"
                         values={{
                           counter: maybe(

src/orders/components/OrderBulkCancelDialog/OrderBulkCancelDialog.tsx

@@ -38,7 +38,7 @@ const OrderBulkCancelDialog: React.FC<OrderBulkCancelDialogProps> = ({
     >
       <DialogContentText>
         <FormattedMessage
-          defaultMessage="Are you sure you want to cancel {counter,plural,one{this order} other{{displayQuantity} orders}}?"
+          defaultMessage="{counter,plural,one{Are you sure you want to cancel this order?} other{Are you sure you want to cancel {displayQuantity} orders?}}"
           values={{
             counter: numberOfOrders,
             displayQuantity: <strong>{numberOfOrders}</strong>

src/orders/views/OrderDraftList/OrderDraftList.tsx

@@ -229,7 +229,7 @@ export const OrderDraftList: React.FC<OrderDraftListProps> = ({ params }) => {
             >
               <DialogContentText>
                 <FormattedMessage
-                  defaultMessage="Are you sure you want to delete {counter,plural,one{this order draft} other{{displayQuantity} orderDrafts}}?"
+                  defaultMessage="{counter,plural,one{Are you sure you want to delete this order draft?} other{Are you sure you want to delete {displayQuantity} order drafts?}}"
                   description="dialog content"
                   values={{
                     counter: maybe(() => params.ids.length),

src/pages/views/PageList/PageList.tsx

@@ -186,7 +186,7 @@ export const PageList: React.FC<PageListProps> = ({ params }) => {
               >
                 <DialogContentText>
                   <FormattedMessage
-                    defaultMessage="Are you sure you want to publish {counter,plural,one{this page} other{{displayQuantity} pages}}?"
+                    defaultMessage="{counter,plural,one{Are you sure you want to publish this page?} other{Are you sure you want to publish {displayQuantity} pages?}}"
                     description="dialog content"
                     values={{
                       counter: maybe(() => params.ids.length),
@@ -215,7 +215,7 @@ export const PageList: React.FC<PageListProps> = ({ params }) => {
                 })}
               >
                 <FormattedMessage
-                  defaultMessage="Are you sure you want to unpublish {counter,plural,one{this page} other{{displayQuantity} pages}}?"
+                  defaultMessage="{counter,plural,one{Are you sure you want to unpublish this page?} other{Are you sure you want to unpublish {displayQuantity} pages?}}"
                   description="dialog content"
                   values={{
                     counter: maybe(() => params.ids.length),
@@ -243,7 +243,7 @@ export const PageList: React.FC<PageListProps> = ({ params }) => {
                 })}
               >
                 <FormattedMessage
-                  defaultMessage="Are you sure you want to delete {counter,plural,one{this page} other{{displayQuantity} pages}}?"
+                  defaultMessage="{counter,plural,one{Are you sure you want to delete this page?} other{Are you sure you want to delete {displayQuantity} pages?}}"
                   description="dialog content"
                   values={{
                     counter: maybe(() => params.ids.length),

src/productTypes/components/ProductTypeBulkAttributeUnassignDialog/ProductTypeBulkAttributeUnassignDialog.tsx

@@ -14,9 +14,7 @@ export interface ProductTypeBulkAttributeUnassignDialogProps {
   onConfirm: () => void;
 }
 
-const ProductTypeBulkAttributeUnassignDialog: React.FC<
+const ProductTypeBulkAttributeUnassignDialog: React.FC<ProductTypeBulkAttributeUnassignDialogProps> = ({
-  ProductTypeBulkAttributeUnassignDialogProps
-> = ({
   attributeQuantity,
   confirmButtonState,
   open,
@@ -39,7 +37,7 @@ const ProductTypeBulkAttributeUnassignDialog: React.FC<
     >
       <DialogContentText>
         <FormattedMessage
-          defaultMessage="Are you sure you want to unassign {counter,plural,one{this attribute} other{{attributeQuantity} attributes}} from {productTypeName}?"
+          defaultMessage="{counter,plural,one{Are you sure you want to unassign this attribute from {productTypeName}?} other{Are you sure you want to unassign {attributeQuantity} attributes from {productTypeName}?}}"
           description="unassign multiple attributes from product type"
           values={{
             attributeQuantity: <strong>{attributeQuantity}</strong>,

src/productTypes/views/ProductTypeList/ProductTypeList.tsx

@@ -218,7 +218,7 @@ export const ProductTypeList: React.FC<ProductTypeListProps> = ({ params }) => {
             >
               <DialogContentText>
                 <FormattedMessage
-                  defaultMessage="Are you sure you want to delete {counter,plural,one{this product type} other{{displayQuantity} product types}}?"
+                  defaultMessage="{counter,plural,one{Are you sure you want to delete this product type?} other{Are you sure you want to delete {displayQuantity} product types?}}"
                   description="dialog content"
                   values={{
                     counter: maybe(() => params.ids.length),

src/products/views/ProductList/ProductList.tsx

@@ -403,7 +403,7 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
                         >
                           <DialogContentText>
                             <FormattedMessage
-                              defaultMessage="Are you sure you want to delete {counter,plural,one{this product} other{{displayQuantity} products}}?"
+                              defaultMessage="{counter,plural,one{Are you sure you want to delete this product?} other{Are you sure you want to delete {displayQuantity} products?}}"
                               description="dialog content"
                               values={{
                                 counter: maybe(() => params.ids.length),
@@ -435,7 +435,7 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
                         >
                           <DialogContentText>
                             <FormattedMessage
-                              defaultMessage="Are you sure you want to publish {counter,plural,one{this product} other{{displayQuantity} products}}?"
+                              defaultMessage="{counter,plural,one{Are you sure you want to publish this product?} other{Are you sure you want to publish {displayQuantity} products?}}"
                               description="dialog content"
                               values={{
                                 counter: maybe(() => params.ids.length),
@@ -467,7 +467,7 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
                         >
                           <DialogContentText>
                             <FormattedMessage
-                              defaultMessage="Are you sure you want to unpublish {counter,plural,one{this product} other{{displayQuantity} products}}?"
+                              defaultMessage="{counter,plural,one{Are you sure you want to unpublish this product?} other{Are you sure you want to unpublish {displayQuantity} products?}}"
                               description="dialog content"
                               values={{
                                 counter: maybe(() => params.ids.length),

src/products/views/ProductUpdate/ProductUpdate.tsx

@@ -322,7 +322,7 @@ export const ProductUpdate: React.FC<ProductUpdateProps> = ({ id, params }) => {
                   >
                     <DialogContentText>
                       <FormattedMessage
-                        defaultMessage="Are you sure you want to delete {counter,plural,one{this variant} other{{displayQuantity} variants}}?"
+                        defaultMessage="{counter,plural,one{Are you sure you want to delete this variant?} other{Are you sure you want to delete {displayQuantity} variants?}}"
                         description="dialog content"
                         values={{
                           counter: maybe(() => params.ids.length),

src/shipping/views/ShippingZonesList.tsx

@@ -233,7 +233,7 @@ export const ShippingZonesList: React.FC<ShippingZonesListProps> = ({
                           >
                             <DialogContentText>
                               <FormattedMessage
-                                defaultMessage="Are you sure you want to delete {counter,plural,one{this shipping zone} other{{displayQuantity} shipping zones}}?"
+                                defaultMessage="{counter,plural,one{Are you sure you want to delete this shipping zone?} other{Are you sure you want to delete {displayQuantity} shipping zones?}}"
                                 description="dialog content"
                                 values={{
                                   counter: maybe(() => params.ids.length),