From 85fc3177202d3eb13657c8399d74fc121d185e67 Mon Sep 17 00:00:00 2001
From: Antoine Jaussoin <antoinejaussoin@users.noreply.github.com>
Date: Sat, 25 Mar 2023 13:54:22 +0000
Subject: [PATCH] Fix demo creation bug (#508)

---
 frontend/src/auth/AccountMenu.tsx            |  2 +-
 frontend/src/translations/locales/ar-SA.json |  3 ++-
 frontend/src/translations/locales/de-DE.json |  3 ++-
 frontend/src/translations/locales/en-GB.json |  3 ++-
 frontend/src/translations/locales/es-ES.json |  3 ++-
 frontend/src/translations/locales/fr-FR.json |  3 ++-
 frontend/src/translations/locales/hu-HU.json |  3 ++-
 frontend/src/translations/locales/it-IT.json |  3 ++-
 frontend/src/translations/locales/ja-JP.json |  3 ++-
 frontend/src/translations/locales/nl-NL.json |  3 ++-
 frontend/src/translations/locales/pl-PL.json |  3 ++-
 frontend/src/translations/locales/pt-BR.json |  3 ++-
 frontend/src/translations/locales/pt-PT.json |  3 ++-
 frontend/src/translations/locales/uk-UA.json |  3 ++-
 frontend/src/translations/locales/zh-CN.json |  3 ++-
 frontend/src/translations/locales/zh-TW.json |  3 ++-
 frontend/src/translations/useLanguage.ts     |  5 +++--
 frontend/src/views/Demo.tsx                  | 17 ++++++++++-----
 integration/cypress/e2e/test.cy.ts           | 23 ++++++++++++++++++++
 19 files changed, 69 insertions(+), 23 deletions(-)

diff --git a/frontend/src/auth/AccountMenu.tsx b/frontend/src/auth/AccountMenu.tsx
index be691e5dc..a679973a4 100644
--- a/frontend/src/auth/AccountMenu.tsx
+++ b/frontend/src/auth/AccountMenu.tsx
@@ -82,7 +82,7 @@ const AccountMenu = () => {
           <DisplayName>{user.name}</DisplayName>
           <ChipContainer>
             {user.accountType === 'anonymous' ? (
-              <Chip color="secondary" label="Anonymous" />
+              <Chip color="secondary" label={t('Header.anonymous')} />
             ) : null}
           </ChipContainer>
           <AccountCircle fontSize={'large'} />
diff --git a/frontend/src/translations/locales/ar-SA.json b/frontend/src/translations/locales/ar-SA.json
index b7d013c9f..7fa7bfb40 100644
--- a/frontend/src/translations/locales/ar-SA.json
+++ b/frontend/src/translations/locales/ar-SA.json
@@ -5,7 +5,8 @@
     "leave": "غادر",
     "summaryMode": "النّمط الملخّص",
     "account": "حسابي",
-    "adminPanel": "لوحة الإدارة"
+    "adminPanel": "لوحة الإدارة",
+    "anonymous": "مجهول"
   },
   "LanguagePicker": {
     "header": "إختيار اللُّغة"
diff --git a/frontend/src/translations/locales/de-DE.json b/frontend/src/translations/locales/de-DE.json
index 618c73f55..16e3e594d 100644
--- a/frontend/src/translations/locales/de-DE.json
+++ b/frontend/src/translations/locales/de-DE.json
@@ -5,7 +5,8 @@
     "leave": "Verlassen",
     "summaryMode": "Zusammenfassungsmodus",
     "account": "Mein Konto",
-    "adminPanel": "Administrationsbereich"
+    "adminPanel": "Administrationsbereich",
+    "anonymous": "Anonym"
   },
   "LanguagePicker": {
     "header": "Sprache auswählen"
diff --git a/frontend/src/translations/locales/en-GB.json b/frontend/src/translations/locales/en-GB.json
index d383068af..6bfcd94a1 100644
--- a/frontend/src/translations/locales/en-GB.json
+++ b/frontend/src/translations/locales/en-GB.json
@@ -5,7 +5,8 @@
     "leave": "Leave",
     "summaryMode": "Summary Mode",
     "account": "My Account",
-    "adminPanel": "Administration Panel"
+    "adminPanel": "Administration Panel",
+    "anonymous": "Anonymous"
   },
   "LanguagePicker": {
     "header": "Choose a language"
diff --git a/frontend/src/translations/locales/es-ES.json b/frontend/src/translations/locales/es-ES.json
index c6506c4c4..057bea2d8 100644
--- a/frontend/src/translations/locales/es-ES.json
+++ b/frontend/src/translations/locales/es-ES.json
@@ -5,7 +5,8 @@
     "leave": "Salir",
     "summaryMode": "Modo resumido",
     "account": "Mi cuenta",
-    "adminPanel": "Panel de administración"
+    "adminPanel": "Panel de administración",
+    "anonymous": "Anónimo"
   },
   "LanguagePicker": {
     "header": "Escoje un idioma"
diff --git a/frontend/src/translations/locales/fr-FR.json b/frontend/src/translations/locales/fr-FR.json
index 2dff2efe5..29e143a4c 100644
--- a/frontend/src/translations/locales/fr-FR.json
+++ b/frontend/src/translations/locales/fr-FR.json
@@ -5,7 +5,8 @@
     "leave": "Sortir",
     "summaryMode": "Mode Résumé",
     "account": "Mon compte",
-    "adminPanel": "Gestion des utilisateurs"
+    "adminPanel": "Gestion des utilisateurs",
+    "anonymous": "Anonyme"
   },
   "LanguagePicker": {
     "header": "Changez de langue"
diff --git a/frontend/src/translations/locales/hu-HU.json b/frontend/src/translations/locales/hu-HU.json
index 471aa7823..0d9a31f33 100644
--- a/frontend/src/translations/locales/hu-HU.json
+++ b/frontend/src/translations/locales/hu-HU.json
@@ -5,7 +5,8 @@
     "leave": "Távozás",
     "summaryMode": "Összesített mód",
     "account": "Fiókom",
-    "adminPanel": "Adminisztrációs panel"
+    "adminPanel": "Adminisztrációs panel",
+    "anonymous": ""
   },
   "LanguagePicker": {
     "header": "Válassz nyelvet"
diff --git a/frontend/src/translations/locales/it-IT.json b/frontend/src/translations/locales/it-IT.json
index b09732371..6c898e762 100644
--- a/frontend/src/translations/locales/it-IT.json
+++ b/frontend/src/translations/locales/it-IT.json
@@ -5,7 +5,8 @@
     "leave": "Abbandona",
     "summaryMode": "Modalità sommario",
     "account": "Il Mio Account",
-    "adminPanel": "Pannello Di Amministrazione"
+    "adminPanel": "Pannello Di Amministrazione",
+    "anonymous": "Anonimo"
   },
   "LanguagePicker": {
     "header": "Scegli una lingua"
diff --git a/frontend/src/translations/locales/ja-JP.json b/frontend/src/translations/locales/ja-JP.json
index 9a10de366..89ae5d74c 100644
--- a/frontend/src/translations/locales/ja-JP.json
+++ b/frontend/src/translations/locales/ja-JP.json
@@ -5,7 +5,8 @@
     "leave": "退室",
     "summaryMode": "要約モード",
     "account": "マイアカウント",
-    "adminPanel": "管理パネル"
+    "adminPanel": "管理パネル",
+    "anonymous": "匿名です"
   },
   "LanguagePicker": {
     "header": "言語を選択"
diff --git a/frontend/src/translations/locales/nl-NL.json b/frontend/src/translations/locales/nl-NL.json
index 208d4185a..c6982f29f 100644
--- a/frontend/src/translations/locales/nl-NL.json
+++ b/frontend/src/translations/locales/nl-NL.json
@@ -5,7 +5,8 @@
     "leave": "Verlaten",
     "summaryMode": "Samenvatting",
     "account": "Mijn account",
-    "adminPanel": "Beheer paneel"
+    "adminPanel": "Beheer paneel",
+    "anonymous": "Anoniem"
   },
   "LanguagePicker": {
     "header": "Kies een taal"
diff --git a/frontend/src/translations/locales/pl-PL.json b/frontend/src/translations/locales/pl-PL.json
index a18d72b8f..d5cf2e406 100644
--- a/frontend/src/translations/locales/pl-PL.json
+++ b/frontend/src/translations/locales/pl-PL.json
@@ -5,7 +5,8 @@
     "leave": "Wyjdź",
     "summaryMode": "Tryb Podsumowania",
     "account": "Moje konto",
-    "adminPanel": "Panel administracyjny"
+    "adminPanel": "Panel administracyjny",
+    "anonymous": "Anonimowe"
   },
   "LanguagePicker": {
     "header": "Wybierz język"
diff --git a/frontend/src/translations/locales/pt-BR.json b/frontend/src/translations/locales/pt-BR.json
index f288e59a7..265b362f8 100644
--- a/frontend/src/translations/locales/pt-BR.json
+++ b/frontend/src/translations/locales/pt-BR.json
@@ -5,7 +5,8 @@
     "leave": "Sair",
     "summaryMode": "Modo Sumário",
     "account": "Minha conta",
-    "adminPanel": "Painel de Administração"
+    "adminPanel": "Painel de Administração",
+    "anonymous": "Anônimo"
   },
   "LanguagePicker": {
     "header": "Escolha uma língua"
diff --git a/frontend/src/translations/locales/pt-PT.json b/frontend/src/translations/locales/pt-PT.json
index 86abd65bc..e03283527 100644
--- a/frontend/src/translations/locales/pt-PT.json
+++ b/frontend/src/translations/locales/pt-PT.json
@@ -5,7 +5,8 @@
     "leave": "Sair",
     "summaryMode": "Modo de Resumo",
     "account": "Minha conta",
-    "adminPanel": "Painel de Administração"
+    "adminPanel": "Painel de Administração",
+    "anonymous": "Anônimo"
   },
   "LanguagePicker": {
     "header": "Escolha um idioma"
diff --git a/frontend/src/translations/locales/uk-UA.json b/frontend/src/translations/locales/uk-UA.json
index 712405324..cd3e83e5b 100644
--- a/frontend/src/translations/locales/uk-UA.json
+++ b/frontend/src/translations/locales/uk-UA.json
@@ -5,7 +5,8 @@
     "leave": "Залишити",
     "summaryMode": "Анонімний режим",
     "account": "Особистий кабінет",
-    "adminPanel": "Панель адміністрування"
+    "adminPanel": "Панель адміністрування",
+    "anonymous": "Анонімний"
   },
   "LanguagePicker": {
     "header": "Виберіть мову"
diff --git a/frontend/src/translations/locales/zh-CN.json b/frontend/src/translations/locales/zh-CN.json
index 40c8e9e43..551f55634 100644
--- a/frontend/src/translations/locales/zh-CN.json
+++ b/frontend/src/translations/locales/zh-CN.json
@@ -5,7 +5,8 @@
     "leave": "离开",
     "summaryMode": "主旨模式",
     "account": "我的帐户",
-    "adminPanel": "管理面板"
+    "adminPanel": "管理面板",
+    "anonymous": "匿名的"
   },
   "LanguagePicker": {
     "header": "切换语言"
diff --git a/frontend/src/translations/locales/zh-TW.json b/frontend/src/translations/locales/zh-TW.json
index 59c536515..d4b487514 100644
--- a/frontend/src/translations/locales/zh-TW.json
+++ b/frontend/src/translations/locales/zh-TW.json
@@ -5,7 +5,8 @@
     "leave": "離開",
     "summaryMode": "主旨模式",
     "account": "我的賬戶",
-    "adminPanel": "管理面板"
+    "adminPanel": "管理面板",
+    "anonymous": ""
   },
   "LanguagePicker": {
     "header": "切換語言"
diff --git a/frontend/src/translations/useLanguage.ts b/frontend/src/translations/useLanguage.ts
index 66e34c3ee..f6450d3f5 100644
--- a/frontend/src/translations/useLanguage.ts
+++ b/frontend/src/translations/useLanguage.ts
@@ -14,6 +14,7 @@ type UseLanguageResult = [
 export default function useLanguage(): UseLanguageResult {
   const { i18n } = useTranslation();
   const { user, setUser } = useContext(UserContext);
+  const hasUser = !!user;
 
   const locale = i18n.language;
   const language = useMemo(() => {
@@ -25,14 +26,14 @@ export default function useLanguage(): UseLanguageResult {
     async (language: string) => {
       trackEvent(`language/change/${language}` as TrackingEvent);
       i18n.changeLanguage(language);
-      if (user) {
+      if (hasUser) {
         const updatedUser = await updateLanguage(language);
         if (updatedUser) {
           setUser(updatedUser);
         }
       }
     },
-    [user, setUser, i18n]
+    [hasUser, setUser, i18n]
   );
 
   return [language, handleChangeLanguage];
diff --git a/frontend/src/views/Demo.tsx b/frontend/src/views/Demo.tsx
index 72d29bda7..425810d82 100644
--- a/frontend/src/views/Demo.tsx
+++ b/frontend/src/views/Demo.tsx
@@ -1,6 +1,6 @@
 import styled from '@emotion/styled';
 import { colors } from '@mui/material';
-import { anonymousLogin, createDemoGame, me, updateLanguage } from 'api';
+import { createDemoGame, me, updateLanguage } from 'api';
 import UserContext from 'auth/Context';
 import { useContext, useEffect } from 'react';
 import { useSearchParams } from 'react-router-dom';
@@ -12,12 +12,17 @@ export default function Demo() {
   const { setUser } = useContext(UserContext);
   let [searchParams] = useSearchParams();
   const twoLetter = searchParams.get('lang');
-  const [, changeLanguage] = useLanguage();
+  const [currentLanguage, changeLanguage] = useLanguage();
   const language = getLanguage(twoLetter || 'en');
 
+  useEffect(() => {
+    if (currentLanguage.locale !== language.locale) {
+      changeLanguage(language.locale);
+    }
+  }, [language.locale, currentLanguage.locale, changeLanguage]);
+
   useEffect(() => {
     async function fetch() {
-      await anonymousLogin('Demo User');
       trackEvent('register/demo');
       let updatedUser = await me();
       if (updatedUser?.language === null) {
@@ -30,8 +35,10 @@ export default function Demo() {
         window.location.href = `/game/${session.id}`;
       }
     }
-    fetch();
-  }, [language.locale, setUser, changeLanguage]);
+    if (language.locale === currentLanguage.locale) {
+      fetch();
+    }
+  }, [language.locale, currentLanguage.locale, setUser, changeLanguage]);
   return (
     <Container>
       <h1>Preparing demo...</h1>
diff --git a/integration/cypress/e2e/test.cy.ts b/integration/cypress/e2e/test.cy.ts
index 433fbe6aa..8caa0838b 100644
--- a/integration/cypress/e2e/test.cy.ts
+++ b/integration/cypress/e2e/test.cy.ts
@@ -108,3 +108,26 @@ describe('Post workflow', () => {
     cy.get('body', { timeout }).get('h1').should('contain', 'Welcome!');
   });
 });
+
+describe('Demo Workflow', () => {
+  beforeEach(() => {
+    cy.setCookie('wpcc', 'dismiss');
+  });
+
+  it('Should create a demo with the right language (French)', () => {
+    // Asking for a FR demo
+    cy.visit('/demo?lang=fr');
+
+    // It should contain the right post (in English)
+    cy.get('#content', { timeout }).should(
+      'contain',
+      "I'm enjoying our new retrospective board!"
+    );
+
+    // But the UI must be in French
+    cy.get('#content', { timeout }).should(
+      'contain',
+      'Bienvenue dans cette démo'
+    );
+  });
+});