diff --git a/webapp/public/img/kiwi-2.gif b/webapp/public/img/kiwi-2.gif new file mode 100644 index 00000000..19590de3 Binary files /dev/null and b/webapp/public/img/kiwi-2.gif differ diff --git a/webapp/public/img/kiwi-3.gif b/webapp/public/img/kiwi-3.gif new file mode 100644 index 00000000..e005034e Binary files /dev/null and b/webapp/public/img/kiwi-3.gif differ diff --git a/webapp/public/img/kiwi.gif b/webapp/public/img/kiwi.gif new file mode 100644 index 00000000..a5205b74 Binary files /dev/null and b/webapp/public/img/kiwi.gif differ diff --git a/webapp/public/img/kiwi.png b/webapp/public/img/kiwi.png new file mode 100644 index 00000000..dbdac5df Binary files /dev/null and b/webapp/public/img/kiwi.png differ diff --git a/webapp/public/locales/en/translation.json b/webapp/public/locales/en/translation.json index 3bd09ec6..bcc4745e 100644 --- a/webapp/public/locales/en/translation.json +++ b/webapp/public/locales/en/translation.json @@ -98,5 +98,9 @@ "title": "About", "description1": "We are the WIQ_EN2B group and we are delighted that you like 🥝KIWIQ🥝. Enjoy your meal!!!", "tableheader": "Developers" + }, + "page404": { + "title": "404 - Page not found", + "text": "Woops! You seem lost! Click on go back to find your way." } } \ No newline at end of file diff --git a/webapp/public/locales/es/translation.json b/webapp/public/locales/es/translation.json index 0b17fb8b..8571b983 100644 --- a/webapp/public/locales/es/translation.json +++ b/webapp/public/locales/es/translation.json @@ -97,5 +97,9 @@ "title": "Sobre nosotros", "description1": "Somos el grupo WIQ_EN2B y estamos encantados de que te guste 🥝KIWIQ🥝. Que aproveche!!!", "tableheader": "Desarrolladores" + }, + "page404": { + "title": "404 - Página no encontrada", + "text": "Qué liaste ho? Haz click en volver para regresar pa casina." } } \ No newline at end of file diff --git a/webapp/src/components/Router.jsx b/webapp/src/components/Router.jsx index 3ef7bd6d..d3fa1261 100644 --- a/webapp/src/components/Router.jsx +++ b/webapp/src/components/Router.jsx @@ -12,6 +12,7 @@ import Statistics from "pages/Statistics"; import ProtectedRoute from "./utils/ProtectedRoute"; import Logout from "pages/Logout"; import About from "pages/About"; +import NotFound from "pages/NotFound"; export default createRoutesFromElements( @@ -27,5 +28,6 @@ export default createRoutesFromElements( } /> } /> + } /> ) diff --git a/webapp/src/components/menu/LateralMenu.jsx b/webapp/src/components/menu/LateralMenu.jsx index f51a592b..fa964b03 100644 --- a/webapp/src/components/menu/LateralMenu.jsx +++ b/webapp/src/components/menu/LateralMenu.jsx @@ -100,6 +100,7 @@ const LateralMenu = ({ isOpen, onClose, changeLanguage, isDashboard }) => { + 404Kiwi {isLoggedIn && ( diff --git a/webapp/src/pages/NotFound.jsx b/webapp/src/pages/NotFound.jsx new file mode 100644 index 00000000..d9ace535 --- /dev/null +++ b/webapp/src/pages/NotFound.jsx @@ -0,0 +1,36 @@ +import React, { useState } from "react"; +import { useTranslation } from 'react-i18next'; +import { Center, Heading, Stack, Box, Text, Image, Container} from '@chakra-ui/react'; +import { InfoIcon } from '@chakra-ui/icons'; + +import LateralMenu from '../components/menu/LateralMenu'; +import MenuButton from '../components/menu/MenuButton'; +import GoBack from "components/GoBack"; +import "../styles/animations.css"; +export default function About() { + const { t, i18n } = useTranslation(); + const [isMenuOpen, setIsMenuOpen] = useState(false); + + const changeLanguage = (selectedLanguage) => { + i18n.changeLanguage(selectedLanguage); + }; + + return ( +
+ setIsMenuOpen(true)} /> + setIsMenuOpen(false)} changeLanguage={changeLanguage} isDashboard={false}/> + + + + {t('page404.title')} + + + 404Kiwi + {t("page404.text")} + + + +
+ ); +} \ No newline at end of file diff --git a/webapp/src/tests/PageNotFound404.js b/webapp/src/tests/PageNotFound404.js new file mode 100644 index 00000000..02fe0f55 --- /dev/null +++ b/webapp/src/tests/PageNotFound404.js @@ -0,0 +1,25 @@ +import React from 'react'; +import { render, fireEvent, waitFor } from '@testing-library/react'; +import '@testing-library/jest-dom/extend-expect'; +import { MemoryRouter } from 'react-router-dom'; +import PageNotFound from '../pages/NotFound'; +import theme from '../styles/theme'; +import { ChakraProvider } from '@chakra-ui/react'; + +jest.mock('react-i18next', () => ({ + useTranslation: () => ({ + t: key => key, + i18n: { + changeLanguage: () => new Promise(() => {}), + }, + }), +})); + +describe('404 page', () => { + it('renders title and description correctly', () => { + const { getByText } = render(); + + expect(getByText('page404.title')).toBeInTheDocument(); + expect(getByText('page404.text')).toBeInTheDocument(); + }); +});