stormBMO/task-keys

Keys

Установите зависимости:

npm install

В файле src/Keys.tsx вам нужно будет создать список из редактируемых элементов:

1. На вход в компонент Keys будет приходить 2 пропа: sorting: 'ASC' | 'DESC' и initialData: IItem[], где IItem это:

interface IItem {
    id: number;
    name: string;
}

2. Нужно вывести поле name каждого элемента.
3. При клике на имя оно должно превращаться в <input>. С помощью этого поля ввода имя можно редактировать, сохранение должно происходить по нажатию Enter, отмена изменений по нажатию Escape.
4. Вверху страницы есть кнопка Change sorting. При клике на неё меняется направление сортировки по полю id. Если эта кнопка нажимается во время редактирования, то текущее состояние должно сохраняться. Т.е. редактируемый элемент должен остаться редактируемым, если пользователь что-то ввёл – его изменения не должны исчезнуть.

Используйте команду npm run start, чтобы в вашем браузере открылась страница, на которой можно проверить работу вашего компонента.

Тажке, проверить себя можно запустив команду npm run test.

После выполнения задания создайте pull request с решением.