aka Error, Loading, Success, error processing, обработка / индикация ошибок и загрузки, Status Indication, Error Detection & Handling Strategy

Тут обдумываются проблемы и решения по стратегии #UXByDefault

См. найденные решения ниже

Проблемы

• human friendly error vs technical exception

  Мы не пишем код без ошибок, поэтому обработка ошибок это гигенический базис любой UX-грамотой системы

  Предусмотренные ошибки — максимально подробно показывать пользователю не в терминах ошибок

  Исключения в коде — просто показывать что произошла ошибка и давать код/ссылку для отслеживания в трекере ошибок

  ✅ felix rb helpers

  у нас очень очень много 422 ошибок без объяснений. При этом в сентри ошибку часто видно, не хватает ее только передать. Для этого у нас есть хелперы:

  render_json_error — будет показано юзеру в UI’е

  render_json_exception — будет показано в консоли, а в UI будет просто написано ошибка

• hb uniqCode

  • [ ] rb helpers

• проброс до пользователя

  • [ ] ‣ HOX вывод ошибки из коробки

  ✅ React helper для управлением стейтом {error, loading} for Hook-components со встроенным фетчером данных с сервера. Реализовано через general purpose promise хелперы в felix: utils/index#go и useLoadable custom hook

  go(Api.get(url), updateLoading, updateError, updateItems);
  

  Как менеджится стейт: 1) ставить loading в начале, 2) снимить в конце (finally), 3) ставить ошибку на .catch, если это не отмена запроса, 4) снимать ошибку на .then.

  • история Loadable React helper для компонентов со встроенным фетчером данных с сервера

• local-status vs page-common-status vs modal-status. локальный, страничный, модальный статусы: ‣

  Предпочтителен super local, когда статус прямо в компоненте, например в кнопке.

  модальный показывается крупно по-центру при начальной загрузке данных

• error string vs Error object. Errors in Redux: { string, Error } — чтобы и объект сохранить и глазами дебажить в devtools. composeWithDevTools({ serialize: true }) ⇒ Отказаться от строк? Могут быть проблемы со случайным рендером в реакт. Но можно проконтролировать, чтобы всё было через AppStatus

  объект нужен:

  • для более тонкой обработки перед выводом и реализации нестандартных форматов возврата ошибок, Например в felix: CardClose объект с ключами для отображения локальных ошибок
  • Для ‣: splash
  • AppStatus more. Для возможности показа подробной технической ошибки пользователю on demand

  todo:

  • [ ] Errors in Redux: { string, Error }

• redux

  • [ ] { string, Error } см выше

  • [ ] Универсальная Отмена

    Для AppStatus onHideError

  • [ ] Множественные типы ошибок

    HOX в Redux без вложенности с объектом с ассоциированными по ключам ошибками. Потому что вложенный стор создаёт много проблем

  • [ ] Множественные типы ошибок, которые показываются в одном месте

• нужны ли собственные типы ошибок?

  — а хз

  • Как создавать custom errors classes

• Всплывание ошибок

  • async/await ломает разницу между exception and error
  • React catchError for exception
  • [ ] Нужны <Try <Catch компоненты-хелперы для всплывания или обработки на месте предусмотренных ошибок (на базе ‣ HOC)

• Звуковое оповещение

  Ошибка / Успех

  В отдельных местах

См так же

• ‣: error processing (проброс human friendly ошибок gapi, gemini)
• ‣: error processing
• ‣: error processing
• ‣: human errors, error logging/reporting
• Books: ‣