100 JS Functions

Beginner

1. CurrentYear

2. SimpleCounter

3. DoubleNumber

4. CreateColor

5. DynamicGrid

6. DynamicPictureSize

7. RandomButton

8. TabbedNavigation

9. MathOperator

10. GuessTheNumber

11. BetweenDates

12. Reactions

13. FeedTheBunny

14. Countdown

15. ClickFast

16. SkillsForJobs

17. UsersTabel

18. TodoList

19. UserSearch

20. SpendingInfo

17.UsersTabel

Write a React component named UsersTable that accepts a list of users as a prop. Each user has the following type:

type User = {
  id: string;
  name: string;
  age: number;
  job: string;
};

The component should render:

  • A <select> dropdown with three options: Sort by name, Sort by age, and Sort by job, all of them descending.
  • A table displaying all users, with each user in its own row.

By default, the table is sorted in ascending order by age. When the user changes the dropdown selection, the table should re-render with users sorted by the chosen field.

Example 1

Input

No input props

Demo

Open demo in new window

You'll see test results here!