> For the complete documentation index, see [llms.txt](https://okelm.gitbook.io/devmeetings-react-ts-fork/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://okelm.gitbook.io/devmeetings-react-ts-fork/side-effects-context/tasks.md).

# Tasks

## 1. Help us out and fill out the [survey](<http://bit.ly/ReactKrk >)

> It's anonymous

## 2. There can be only one expanded contact at a time

> **Hint** the `Context` value can also contain functions.

## 3. Fetch a list of contacts from external source

> **Hint** either use the [randomuser.me](https://github.com/Okelm/devmeetings-react-ts/tree/bcdab375ea22fc1c2193ef4248330146e6860c0c/side-effects-context/randomuser.me) service.
>
> **Hint** use the [`fetch` API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch) to create the HTTP request for contacts.
>
> **Hint** use the `seed` option to get the same response with each request.

## 4. :star: Create a dark theme for your app and a widget to change the theme

> **Hint** the widget can be as simple as a `select` dropdown.

## 5. :fire: Simulate querying and sorting on the server

> **Hint** The API doesn't support querying or sorting, but this can be simulated on client side
>
> **Hint** Create a `requestContacts` function that takes query and sort, and returns a list of contacts
>
> **Hint** remember to cleanup pending requests if user keeps typing

## 6. :fire: When filtering highlight the searched phrase in each contact

## 7. :fire: It was all about Pokemon

> Use the [Pokemon TCG API](https://pokemontcg.io/) and replace contacts with Pokemon