From 79a520dd1c56146c2b14bd0abb2b12b6149ba7f7 Mon Sep 17 00:00:00 2001
From: Alf Eaton <75253002+aeaton-overleaf@users.noreply.github.com>
Date: Thu, 25 Mar 2021 10:11:31 +0000
Subject: [PATCH] Use defaultVariables to define variables for all translations
 (#3815)

GitOrigin-RevId: d7b30f523edba7c384d5207a44643acdbbedc74c
---
 services/web/.storybook/preview.js                 |  6 ++++--
 .../components/share-project-modal-content.js      |  7 +------
 services/web/frontend/js/i18n.js                   |  6 +++++-
 services/web/test/frontend/bootstrap.js            | 14 +++++++-------
 4 files changed, 17 insertions(+), 16 deletions(-)

diff --git a/services/web/.storybook/preview.js b/services/web/.storybook/preview.js
index de015ceb95..0e6541e379 100644
--- a/services/web/.storybook/preview.js
+++ b/services/web/.storybook/preview.js
@@ -25,7 +25,10 @@ i18n.use(initReactI18next).init({
     prefix: '__',
     suffix: '__',
     unescapeSuffix: 'HTML',
-    skipOnVariables: true
+    skipOnVariables: true,
+    defaultVariables: {
+      appName: 'Overleaf'
+    }
   }
 })
 
@@ -84,7 +87,6 @@ const withTheme = (Story, context) => {
 export const decorators = [withTheme]
 
 window.ExposedSettings = {
-  appName: 'Overleaf',
   maxEntitiesPerProject: 10,
   maxUploadSize: 5 * 1024 * 1024
 }
diff --git a/services/web/frontend/js/features/share-project-modal/components/share-project-modal-content.js b/services/web/frontend/js/features/share-project-modal/components/share-project-modal-content.js
index 3acc2c5797..2059741cec 100644
--- a/services/web/frontend/js/features/share-project-modal/components/share-project-modal-content.js
+++ b/services/web/frontend/js/features/share-project-modal/components/share-project-modal-content.js
@@ -67,12 +67,7 @@ ShareProjectModalContent.propTypes = {
 function ErrorMessage({ error }) {
   switch (error) {
     case 'cannot_invite_non_user':
-      return (
-        <Trans
-          i18nKey="cannot_invite_non_user"
-          values={{ appName: window.ExposedSettings.appName }}
-        />
-      )
+      return <Trans i18nKey="cannot_invite_non_user" />
 
     case 'cannot_verify_user_not_robot':
       return <Trans i18nKey="cannot_verify_user_not_robot" />
diff --git a/services/web/frontend/js/i18n.js b/services/web/frontend/js/i18n.js
index 9e89578f97..15f719fe9c 100644
--- a/services/web/frontend/js/i18n.js
+++ b/services/web/frontend/js/i18n.js
@@ -31,7 +31,11 @@ i18n.use(initReactI18next).init({
 
     // Disable nesting in interpolated values, preventing user input
     // injection via another nested value
-    skipOnVariables: true
+    skipOnVariables: true,
+
+    defaultVariables: {
+      appName: window.ExposedSettings.appName
+    }
   }
 })
 
diff --git a/services/web/test/frontend/bootstrap.js b/services/web/test/frontend/bootstrap.js
index 6080ecdbcd..0568d854b3 100644
--- a/services/web/test/frontend/bootstrap.js
+++ b/services/web/test/frontend/bootstrap.js
@@ -17,6 +17,13 @@ const chai = require('chai')
 chai.use(require('sinon-chai'))
 chai.use(require('chai-as-promised'))
 
+// Mock global settings
+window.ExposedSettings = {
+  appName: 'Overleaf',
+  maxEntitiesPerProject: 10,
+  maxUploadSize: 5 * 1024 * 1024
+}
+
 window.i18n = { currentLangCode: 'en' }
 require('../../frontend/js/i18n')
 
@@ -51,13 +58,6 @@ Object.defineProperty(global, 'localStorage', {
 const fetch = require('node-fetch')
 global.fetch = (url, ...options) => fetch('http://localhost' + url, ...options)
 
-// Mock global settings
-window.ExposedSettings = {
-  appName: 'Overleaf',
-  maxEntitiesPerProject: 10,
-  maxUploadSize: 5 * 1024 * 1024
-}
-
 // ignore CSS files
 const { addHook } = require('pirates')
 addHook(() => '', { exts: ['.css'], ignoreNodeModules: false })