React Test

We have provided a simple React application with 2 pages:

• A “Posts” page that lists the titles of a user’s posts.
• A “User Details” page that displays some information about the active user.

We’ve used a publicly available API.

Please add the following:

1. A dropdown in the top right corner of the application that allows us to select the active user.
2. The ability to click on a post in the “Posts” page and expand it to see the post body.
3. A search bar in the “Posts” page that matches the design specified here.
4. Any single test that checks whether the search bar is working as expected.

We've used Ant Design for some of the components. You can use that or any other libraries you choose to complete the steps above.

To start the application run npm install, and then npm start.

We recommend spending about 2 hours on this task. If there is anything you missed or would have done differently given more time, feel free to comment what you would have done, or bring it up with us in the technical interview.

Features Implemented

• Added dropdown to select users.
• Expanded post to show post details.
• Added search bar to the Posts page.
• Added a sample test for the input.

Improvements Made

• Modularized the app with a proper folder structure.
• Made navigation links active.
• Used Layout from React Router to avoid wrapping each page with a layout component.
• Moved some dependencies to dev dependencies.

Future Improvements

• Use React Query to handle data fetching.
• Switch to (CSS modules/Tailwind/ShadCN/Styled Components) for styling to prevent global CSS from overriding each other.
• Set up path aliases for imports.
• Write more tests.
• Add SVG component support with SVGR.
• Use Zod for runtime data validation.
• Auto-sort imports.
• Implement code-splitting for routes.