Тестовое задание Green-Api

Список используемых технологий:
- JS;
- Scss, Bootstrap, BEM;
- React, hooks, React-router-dom, React-responsive;
- Redux, Redux-toolkit, React-Redux, Redux-saga;
- Formik, Yup;
- Axios;
- Google-libphonenumber.

Ожидаемый результат:

• Пользователь переходит на сайт чата и вводит свои учетные данные из

системы GREEN-API (idInstance, apiTokenInstance)

• Пользователь вводит номер телефона получателя и создает новый чат

• Пользователь пишет текстовое сообщение и отправляет его получателю в

WhatsApp

• Получатель отвечает на сообщение в мессенджере WhatsApp

• Пользователь видит ответ получателя в чате

Итоговый результат

Авторизация

Комментарии:

• Помимо валидации формы идет запрос на API. Проверяется существует ли аккаунт. Используется метод GetStateInstance.

• Если запрос возвращается с ошибкой, авторизация не проходит.

• Если аккаунт не авторизирован, в режиме перезапуска, забанен, в спящем режиме или в процессе запуска, авторизация также не проходит и сообщение о состоянии аккаунта видно пользователю.

Ввод номера телефона и создание нового чата

Комментарии:

• Вводить можно любые международные номера.

• Помимо валидации формы, используется библиотека Google-libphonenumber. Она проверяет, может ли потенциально существовать номер телефона.

Ввод номера телефона и создание нескольких чатов

Отправка и получение сообщений

Комментарии:

• После успешной авторизации используется метод SetSettings.

Поля запроса:

{
  webhookUrl: "",
  markIncomingMessagesReadedOnReply: "yes",
  outgoingWebhook: "yes",
  incomingWebhook: "yes",
  stateWebhook: "yes",
}

• После установок настроек аккаунта, идут постоянные запросы на API (используется метод ReceiveNotifications + Redux Saga EventProvider).

• Обрабатываются только текстовые сообщения, однако сервис получает и удаляет (метод DeleteNotifications) все входящие уведомления, так как настроить получение только текстовых сообщений невозможно. Вероятно, и не нужно.

Если во время пользования сервисом пользователь получает текстовое сообщение из чата, которого нет в списке контактов, уведомление не обрабатывается и просто удаляется.

• Отправка производится методом SendMessage.

• В сообщениях видно время отправки/получения. В исходящих сообщениях также отображается статус.

*Настроена также обработка статуса "noAccount", но не тестировалось на практике. К сожалению, ограничения бесплатного api не дают это сделать...

Большой чат

Комментарии:

• При добавлении нового сообщения скролл смещается к концу.

• Можно сместить скролл самостоятельно с помощью соответствующей кнопки.

Обработка изменения статуса инстанса

• Если статус инстанса изменился после успешной авторизации, пользователь увидит оповещение о смене инстанса.

• Все чаты и сообщения сохраняются.