Remove wonder-blocks-i18n (#2386)

## Summary: Now that we have adopted Lingui, we no longer need our custom i18n solution. This PR removes the wonder-blocks-i18n package. Issue: XXX-XXXX ## Test plan: Verify that all checks pass Author: jandrade Reviewers: jeresig, somewhatabstract Required Reviewers: Approved By: jeresig, somewhatabstract Checks: ✅ Chromatic - Get results on regular PRs (ubuntu-latest, 20.x), ✅ Test / Test (ubuntu-latest, 20.x, 2/2), ✅ Test / Test (ubuntu-latest, 20.x, 1/2), ✅ Lint / Lint (ubuntu-latest, 20.x), ✅ Check build sizes (ubuntu-latest, 20.x), ✅ Chromatic - Build on regular PRs / chromatic (ubuntu-latest, 20.x), ✅ Publish npm snapshot (ubuntu-latest, 20.x), ⏭️ Chromatic - Skip on Release PR (changesets), ✅ Prime node_modules cache for primary configuration (ubuntu-latest, 20.x), ✅ Check for .changeset entries for all changed files (ubuntu-latest, 20.x), ✅ gerald, ⏭️ dependabot Pull Request URL: #2386
Khan · Dec 12, 2024 · 2a9c2fa · 2a9c2fa
1 parent 73c49d6
commit 2a9c2fa
Show file tree

Hide file tree

Showing 37 changed files with 20 additions and 3,913 deletions.
diff --git a/.changeset/calm-forks-deliver.md b/.changeset/calm-forks-deliver.md
@@ -0,0 +1,6 @@
+---
+"@khanacademy/wonder-blocks-dropdown": patch
+"@khanacademy/wonder-blocks-form": patch
+---
+
+Remove i18n reference from unit tests
diff --git a/.changeset/eleven-vans-chew.md b/.changeset/eleven-vans-chew.md
@@ -0,0 +1,2 @@
+---
+---
diff --git a/__docs__/wonder-blocks-i18n/i18n-inline-markup.stories.tsx b/__docs__/wonder-blocks-i18n/i18n-inline-markup.stories.tsx
diff --git a/consistency-tests/tsconfig.json b/consistency-tests/tsconfig.json
@@ -12,7 +12,6 @@
         {"path": "../packages/wonder-blocks-core/tsconfig-build.json"},
         {"path": "../packages/wonder-blocks-dropdown/tsconfig-build.json"},
         {"path": "../packages/wonder-blocks-form/tsconfig-build.json"},
-        {"path": "../packages/wonder-blocks-i18n/tsconfig-build.json"},
         {"path": "../packages/wonder-blocks-icon/tsconfig-build.json"},
         {"path": "../packages/wonder-blocks-icon-button/tsconfig-build.json"},
         {"path": "../packages/wonder-blocks-layout/tsconfig-build.json"},

diff --git a/packages/wonder-blocks-dropdown/src/components/__tests__/multi-select.test.tsx b/packages/wonder-blocks-dropdown/src/components/__tests__/multi-select.test.tsx
@@ -14,8 +14,6 @@ import {
     UserEvent,
 } from "@testing-library/user-event";
 
-import {ngettext} from "@khanacademy/wonder-blocks-i18n";
-
 import {PropsFor} from "@khanacademy/wonder-blocks-core";
 import OptionItem from "../option-item";
 import MultiSelect from "../multi-select";
@@ -868,7 +866,9 @@ describe("MultiSelect", () => {
             const labels: Labels = {
                 ...builtinLabels,
                 someSelected: (numOptions: number): string =>
-                    ngettext("%(num)s planet", "%(num)s planets", numOptions),
+                    numOptions <= 1
+                        ? `${numOptions} planet`
+                        : `${numOptions} planets`,
             };
 
             const {userEvent} = doRender(
@@ -900,7 +900,9 @@ describe("MultiSelect", () => {
             const labels: Labels = {
                 ...builtinLabels,
                 someSelected: (numOptions: number): string =>
-                    ngettext("%(num)s planet", "%(num)s planets", numOptions),
+                    numOptions <= 1
+                        ? `${numOptions} planet`
+                        : `${numOptions} planets`,
             };
 
             const {userEvent} = doRender(
@@ -1512,7 +1514,9 @@ describe("MultiSelect", () => {
             const labels: Labels = {
                 ...builtinLabels,
                 someSelected: (numOptions: number): string =>
-                    ngettext("%(num)s school", "%(num)s schools", numOptions),
+                    numOptions <= 1
+                        ? `${numOptions} school`
+                        : `${numOptions} schools`,
             };
 
             // Act
@@ -1540,7 +1544,9 @@ describe("MultiSelect", () => {
             const labels: Labels = {
                 ...builtinLabels,
                 someSelected: (numOptions: number): string =>
-                    ngettext("%(num)s planet", "%(num)s planets", numOptions),
+                    numOptions <= 1
+                        ? `${numOptions} planet`
+                        : `${numOptions} planets`,
             };
 
             const {container, userEvent} = doRender(

diff --git a/packages/wonder-blocks-dropdown/tsconfig-build.json b/packages/wonder-blocks-dropdown/tsconfig-build.json
@@ -9,7 +9,6 @@
         {"path": "../wonder-blocks-cell/tsconfig-build.json"},
         {"path": "../wonder-blocks-clickable/tsconfig-build.json"},
         {"path": "../wonder-blocks-core/tsconfig-build.json"},
-        {"path": "../wonder-blocks-i18n/tsconfig-build.json"},
         {"path": "../wonder-blocks-icon/tsconfig-build.json"},
         {"path": "../wonder-blocks-layout/tsconfig-build.json"},
         {"path": "../wonder-blocks-modal/tsconfig-build.json"},

diff --git a/packages/wonder-blocks-form/src/components/__tests__/field-heading.test.tsx b/packages/wonder-blocks-form/src/components/__tests__/field-heading.test.tsx
@@ -2,9 +2,6 @@ import * as React from "react";
 import {render, screen} from "@testing-library/react";
 import {StyleSheet} from "aphrodite";
 
-import {I18nInlineMarkup} from "@khanacademy/wonder-blocks-i18n";
-import {Body} from "@khanacademy/wonder-blocks-typography";
-
 import FieldHeading from "../field-heading";
 import TextField from "../text-field";
 
@@ -179,47 +176,4 @@ describe("FieldHeading", () => {
         const fieldHeading = container.childNodes[0];
         expect(fieldHeading).toHaveStyle("background: blue");
     });
-
-    it("should render a LabelMedium when the 'label' prop is a I18nInlineMarkup", () => {
-        // Arrange
-
-        // Act
-        render(
-            <FieldHeading
-                field={<TextField id="tf-1" value="" onChange={() => {}} />}
-                label={
-                    <I18nInlineMarkup b={(s: string) => <b>{s}</b>}>
-                        {"<b>Test</b> Hello, world!"}
-                    </I18nInlineMarkup>
-                }
-            />,
-        );
-
-        // Assert
-        const label = screen.getByText("Hello, world!");
-        // LabelMedium has a font-size of 16px
-        expect(label).toHaveStyle("font-size: 16px");
-    });
-
-    it("should render a LabelSmall when the 'description' prop is a I18nInlineMarkup", () => {
-        // Arrange
-
-        // Act
-        render(
-            <FieldHeading
-                field={<TextField id="tf-1" value="" onChange={() => {}} />}
-                label={<Body>Hello, world</Body>}
-                description={
-                    <I18nInlineMarkup b={(s: string) => <b>{s}</b>}>
-                        {"<b>Test</b> description"}
-                    </I18nInlineMarkup>
-                }
-            />,
-        );
-
-        // Assert
-        const description = screen.getByText("description");
-        // LabelSmall has a font-size of 16px
-        expect(description).toHaveStyle("font-size: 14px");
-    });
 });
diff --git a/packages/wonder-blocks-form/tsconfig-build.json b/packages/wonder-blocks-form/tsconfig-build.json
@@ -9,7 +9,6 @@
         {"path": "../wonder-blocks-button/tsconfig-build.json"},
         {"path": "../wonder-blocks-clickable/tsconfig-build.json"},
         {"path": "../wonder-blocks-core/tsconfig-build.json"},
-        {"path": "../wonder-blocks-i18n/tsconfig-build.json"},
         {"path": "../wonder-blocks-icon/tsconfig-build.json"},
         {"path": "../wonder-blocks-layout/tsconfig-build.json"},
         {"path": "../wonder-blocks-link/tsconfig-build.json"},

diff --git a/packages/wonder-blocks-i18n/.npmignore b/packages/wonder-blocks-i18n/.npmignore