From 10348b45441b389ffcd43758685e6d32ddff8b9f Mon Sep 17 00:00:00 2001
From: Alf Eaton <alf.eaton@overleaf.com>
Date: Fri, 20 Oct 2023 11:16:32 +0100
Subject: [PATCH] Merge pull request #15353 from
 overleaf/ae-upgrade-react-i18next

Upgrade react-i18next to 13.3.1

GitOrigin-RevId: fb2233742a187f1bf39e83f4e9f7ec3fb2a55b8f
---
 package-lock.json                             | 16 +++++------
 services/web/package.json                     |  2 +-
 .../frontend/infrastructure/i18n.spec.tsx     | 27 +++++++++++++++++++
 3 files changed, 36 insertions(+), 9 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 80c39b7bd0..663839c39f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -31540,9 +31540,9 @@
       }
     },
     "node_modules/react-i18next": {
-      "version": "13.3.0",
-      "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-13.3.0.tgz",
-      "integrity": "sha512-FlR9xjYHSPIJfQspEmkN0yOlxgRyNuiJKJ8gCaZH08UJ7SZHG+VrptEPcpEMEchjNoCOZdKcvJ3PnmHEZhkeXg==",
+      "version": "13.3.1",
+      "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-13.3.1.tgz",
+      "integrity": "sha512-JAtYREK879JXaN9GdzfBI4yJeo/XyLeXWUsRABvYXiFUakhZJ40l+kaTo+i+A/3cKIED41kS/HAbZ5BzFtq/Og==",
       "dev": true,
       "dependencies": {
         "@babel/runtime": "^7.22.5",
@@ -39536,7 +39536,7 @@
         "react-dom": "^17.0.2",
         "react-error-boundary": "^2.3.1",
         "react-google-recaptcha": "^3.1.0",
-        "react-i18next": "^13.3.0",
+        "react-i18next": "^13.3.1",
         "react-linkify": "^1.0.0-alpha",
         "react-refresh": "^0.14.0",
         "react-resizable-panels": "^0.0.55",
@@ -47762,7 +47762,7 @@
         "react-dom": "^17.0.2",
         "react-error-boundary": "^2.3.1",
         "react-google-recaptcha": "^3.1.0",
-        "react-i18next": "^13.3.0",
+        "react-i18next": "^13.3.1",
         "react-linkify": "^1.0.0-alpha",
         "react-refresh": "^0.14.0",
         "react-resizable-panels": "^0.0.55",
@@ -66856,9 +66856,9 @@
       }
     },
     "react-i18next": {
-      "version": "13.3.0",
-      "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-13.3.0.tgz",
-      "integrity": "sha512-FlR9xjYHSPIJfQspEmkN0yOlxgRyNuiJKJ8gCaZH08UJ7SZHG+VrptEPcpEMEchjNoCOZdKcvJ3PnmHEZhkeXg==",
+      "version": "13.3.1",
+      "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-13.3.1.tgz",
+      "integrity": "sha512-JAtYREK879JXaN9GdzfBI4yJeo/XyLeXWUsRABvYXiFUakhZJ40l+kaTo+i+A/3cKIED41kS/HAbZ5BzFtq/Og==",
       "dev": true,
       "requires": {
         "@babel/runtime": "^7.22.5",
diff --git a/services/web/package.json b/services/web/package.json
index 1d0719c4a2..20030cd05a 100644
--- a/services/web/package.json
+++ b/services/web/package.json
@@ -317,7 +317,7 @@
     "react-dom": "^17.0.2",
     "react-error-boundary": "^2.3.1",
     "react-google-recaptcha": "^3.1.0",
-    "react-i18next": "^13.3.0",
+    "react-i18next": "^13.3.1",
     "react-linkify": "^1.0.0-alpha",
     "react-refresh": "^0.14.0",
     "react-resizable-panels": "^0.0.55",
diff --git a/services/web/test/frontend/infrastructure/i18n.spec.tsx b/services/web/test/frontend/infrastructure/i18n.spec.tsx
index 6e22bb302e..75e4527dfc 100644
--- a/services/web/test/frontend/infrastructure/i18n.spec.tsx
+++ b/services/web/test/frontend/infrastructure/i18n.spec.tsx
@@ -116,5 +116,32 @@ describe('i18n', function () {
         .should('have.length', 1)
         .should('have.text', "T&e's<code>t</code>ing")
     })
+
+    it('does not convert markup in values to components', function () {
+      const Test = () => {
+        return (
+          <div data-testid="container">
+            <Trans
+              i18nKey="are_you_still_at"
+              components={[<b />]} // eslint-disable-line react/jsx-key
+              values={{
+                institutionName: "<i>T</i>&<b>e</b>'s<code>t</code>ing",
+              }}
+              shouldUnescape
+              tOptions={{ interpolation: { escapeValue: true } }}
+            />
+          </div>
+        )
+      }
+      cy.mount(<Test />)
+      cy.findByTestId('container')
+        .should(
+          'have.text',
+          "Are you still at <i>T</i>&<b>e</b>'s<code>t</code>ing?"
+        )
+        .find('b')
+        .should('have.length', 1)
+        .should('have.text', "<i>T</i>&<b>e</b>'s<code>t</code>ing")
+    })
   })
 })