O2 Coding Challenge

Build a simple React application to display a list of users fetched from a public API. The application should include the following features:

1. Fetch and Display Data

Use the JSONPlaceholder API to fetch user data:
https://jsonplaceholder.typicode.com/users
Display the users' names, emails, and addresses in a list format.

2. User Details View

Allow users to click on a name to view more details about the selected user.
Display the selected user's name, email, phone, website, and company details.

3. Search Functionality

Implement a search bar to filter the users by name.

4. Styling

Apply basic styling to make the application visually appealing.

Requirements

Do not use any AI tools (Googling is allowed)
Use functional components and hooks.
Ensure the code is well-structured and follows best practices.

Evaluation Criteria

Code Quality: Clean code
Functionality: Meeting all specified requirements.
Problem-Solving: Approach to handling the challenge.
Efficiency: Optimal use of resources and state management.
User Interface: Usability and visual appeal.

Bonus Points

Use React Context API or Tanstack Query
Use O2 Design colors
Use react-router-dom routing