Trying to fix error on how we call th context.js

webapp/src/App.test.js

@@ -1,16 +1,16 @@
 import { render, screen } from '@testing-library/react';
 import App from './App';
-import { Context } from './components/Context';
+import { ContextFun } from './components/Context';
 import { Router } from 'react-router-dom';
 
 
 test('renders learn react link', () => {
   render(
-  <Context>
+  <ContextFun>
     <Router>
       <App />
     </Router>
-  </Context>
+  </ContextFun>
   );
   const linkElement = screen.getByText(/Welcome to wiq_0/i);
   expect(linkElement).toBeInTheDocument();

webapp/src/components/Context.js

@@ -2,7 +2,7 @@ import React, { createContext, useContext, useState } from 'react';
 
 const Context = createContext();
 
-export function UserProvider({ children }) {
+export function ContextFun({ children }) {
     const [usernameGlobal, setUsernameGlobal] = useState('');
 
     return (

webapp/src/components/Login.test.js

@@ -3,8 +3,8 @@ import { render, fireEvent, screen, waitFor, act } from '@testing-library/react'
 import axios from 'axios';
 import MockAdapter from 'axios-mock-adapter';
 import Login from './Login';
-import { Context } from './Context';
-import { BrowserRouter as Router } from 'react-router-dom'; 
+import { ContextFun } from './Context';
+import { BrowserRouter as Router } from 'react-router-dom';
 
 
 
@@ -17,11 +17,11 @@ describe('Login component', () => {
 
   it('should log in successfully', async () => {
     render(
-      <Context>
-      <Router>
-      <Login />
-      </Router>
-      </Context>);
+      <ContextFun>
+        <Router>
+          <Login />
+        </Router>
+      </ContextFun>);
 
     const usernameInput = screen.getByLabelText(/Username/i);
     const passwordInput = screen.getByLabelText(/Password/i);
@@ -32,23 +32,24 @@ describe('Login component', () => {
 
     // Simulate user input
     await act(async () => {
-        fireEvent.change(usernameInput, { target: { value: 'testUser' } });
-        fireEvent.change(passwordInput, { target: { value: 'testPassword' } });
-        fireEvent.click(loginButton);
-      });
+      fireEvent.change(usernameInput, { target: { value: 'testUser' } });
+      fireEvent.change(passwordInput, { target: { value: 'testPassword' } });
+      fireEvent.click(loginButton);
+    });
 
     // Verify that the user information is displayed
     expect(screen.getByText(/Hello testUser!/i)).toBeInTheDocument();
     expect(screen.getByText(/Your account was created on 1\/1\/2024/i)).toBeInTheDocument();
   });
 
   it('should handle error when logging in', async () => {
-
-    render(<Context>
-      <Router>
-        <Login />
-      </Router>
-      </Context>
+
+    render(
+      <ContextFun>
+        <Router>
+          <Login />
+        </Router>
+      </ContextFun>
     );
 
     const usernameInput = screen.getByLabelText(/Username/i);