From b895315a835f8c5333626469adbf6a0ab2af7d27 Mon Sep 17 00:00:00 2001
From: sergiorodriguezgarcia
 <113514397+sergiorodriguezgarcia@users.noreply.github.com>
Date: Fri, 26 Apr 2024 11:42:02 +0200
Subject: [PATCH 1/2] feat: Adding menu option in the results page

---
 webapp/src/pages/Results.jsx | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/webapp/src/pages/Results.jsx b/webapp/src/pages/Results.jsx
index 6ab60e96..3d8b1267 100644
--- a/webapp/src/pages/Results.jsx
+++ b/webapp/src/pages/Results.jsx
@@ -1,17 +1,27 @@
-import React from "react";
+import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Button, Flex, Box, Heading, Center } from "@chakra-ui/react";
 import { useNavigate, useLocation } from "react-router-dom";
 import UserStatistics from "../components/statistics/UserStatistics";
+import LateralMenu from '../components/menu/LateralMenu';
+import MenuButton from '../components/menu/MenuButton';
 
 export default function Results() {
-    const { t } = useTranslation();
+    const { t, i18n } = useTranslation();
     const location = useLocation();
     const navigate = useNavigate();
     const correctAnswers = location.state?.correctAnswers || 0;
+    const [isMenuOpen, setIsMenuOpen] = useState(false);
+
+    const changeLanguage = async (selectedLanguage) => {
+        await i18n.changeLanguage(selectedLanguage);
+    };
 
     return (
         <Center display="flex" flexDirection="column" w="100wh" h="100vh" justifyContent="center" alignItems="center" bgImage={'/background.svg'}>
+            <MenuButton onClick={() => setIsMenuOpen(true)} />
+            <LateralMenu isOpen={isMenuOpen} onClose={() => setIsMenuOpen(false)} changeLanguage={changeLanguage} isDashboard={false}/>
+            
             <Heading as="h2">{t("common.results")}</Heading>
             <Box bg="white" p={4} borderRadius="md" boxShadow="md" mt={4} mb={4} w="fit-content" shadow="2xl" rounded="1rem">
                 <Heading textAlign={"center"} as="h3" color="green.400" fontSize="xl">{`Correct answers: ${correctAnswers}`}</Heading>

From 7af12ddc33106f2888b558a2d65c428e6b4f8d57 Mon Sep 17 00:00:00 2001
From: sergiorodriguezgarcia
 <113514397+sergiorodriguezgarcia@users.noreply.github.com>
Date: Fri, 26 Apr 2024 12:26:46 +0200
Subject: [PATCH 2/2] feat: Changing goBack button to follow conventions

---
 webapp/src/components/GoBack.jsx | 4 ++--
 webapp/src/pages/Statistics.jsx  | 8 +++-----
 2 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/webapp/src/components/GoBack.jsx b/webapp/src/components/GoBack.jsx
index bd90ef0f..856368a5 100644
--- a/webapp/src/components/GoBack.jsx
+++ b/webapp/src/components/GoBack.jsx
@@ -6,8 +6,8 @@ import { useNavigate } from "react-router";
 export default function GoBack() {
     const {t} = useTranslation();
     const navigate = useNavigate();
-    return <Flex direction="row" justifyContent="center" alignItems="center">
-        <Button data-testid={"GoBack"} type="submit" colorScheme="pigment_green" margin={"10px"} className={"custom-button effect1"} onClick={() => navigate("/dashboard")} w="100%">
+    return <Flex justify={"center"}>
+        <Button size={"lg"} fontSize={"2xl"} flex={1} data-testid={"GoBack"} type="submit" colorScheme="pigment_green" margin={"0.5rem"} className={"custom-button effect1"} onClick={() => navigate("/dashboard")}>
             {t("common.goBack")}
         </Button>
     </Flex>
diff --git a/webapp/src/pages/Statistics.jsx b/webapp/src/pages/Statistics.jsx
index 7d20002e..92ace61f 100644
--- a/webapp/src/pages/Statistics.jsx
+++ b/webapp/src/pages/Statistics.jsx
@@ -1,4 +1,4 @@
-import { Box,  Center, Heading, Stack, StackDivider, Table, Tbody, Text,
+import { Box,  Center, Heading, Stack, Table, Tbody, Text,
         Td, Th, Thead, Tr, CircularProgress} from "@chakra-ui/react";
 import React, {useEffect, useState} from "react";
 import { useTranslation } from "react-i18next";
@@ -80,9 +80,7 @@ export default function Statistics() {
                     t={t} errorWhere={"error.statistics.top"}/> 
                 <FaChartBar style={{ fontSize: '2.5rem', color: 'green' }} /> 
                 <Heading as="h1">{t("common.statistics.title")}</Heading>
-                <Stack spacing={4} divider={<StackDivider />} minH="50vh" 
-                    p="1rem" backgroundColor="whiteAlpha.900" shadow="1.25em"
-                    boxShadow="md" rounded="1rem" alignItems={"center"} data-testid={"leaderboard-component"}>
+                <Stack spacing={4} p="1rem" backgroundColor="whiteAlpha.900" boxShadow="md" rounded="1rem" data-testid={"leaderboard-component"}>
                         {retrievedData ? 
                             <Box display={"flex"} flexDirection={"column"} justifyContent={"center"} alignItems={"center"}>
                             <Heading as="h2" fontSize={"1.75em"}>
@@ -111,8 +109,8 @@ export default function Statistics() {
                         : <CircularProgress data-testid="leaderboard-spinner" isIndeterminate color={"green"} />
                         }
                     <UserStatistics />
+                    <GoBack />
                 </Stack>
-                <GoBack />
             </Stack>
         </Center>
     );