Цель проекта - создать веб-версию приложения Chat для оператора. Операторы в приложении отвечают на обращения пользователей.
Свои обращения пользователи создают в мобильной версии приложения Chat (в разработке).
https://chat-mariazayashnikova.vercel.app/
Чтобы посмотреть проект, не указывая своих данных, Вы можете воспользоваться тестовым пользователем.
Пароль: TestUser1
У тестового пользователя нет прав на внесение каких-либо изменений. Тестовый пользователь предназначен только для просмотра проекта.
Задачи проекта:
1. Страница авторизации. Авторизация осуществляется через Firebase.
1.1 Авторизация через почту.
Валидация:
Адреса электронной почты (адрес эл.почты должен иметь общепринятый вид) и поле не должно быть пустым;
Пароля - поле не должно быть пустым, пароль должен содержать цифру, буквы в нижнем и верхнем регистре и иметь длину не менее 8 знаков.
Если данные не проходят валидацию, пользователю выводится подсказка об несоответствии.
1.2 Авторизация через Google. Кнопка "Войти через Google" перенаправляет пользователя на страницу ввода данных Google. Если пользователя в системе нет, то он автоматически регистрируется.
Если в момент авторизации возникают ошибки: нет такого пользователя в системе, или пользователь не прошел до конца авторизацию через Google, пользователю выводится сообщение об ошибке.
2. Страница регистрации. Регистрация осуществляется через Firebase.
На странице регистрации пользователя нужно ввести данные электронного почтового адреса, пароль и подтверждение пароля.
Валидация:
Адреса электронной почты (адрес эл.почты должен иметь общепринятый вид) и поле не должно быть пустым;
Пароля - поле не должно быть пустым, пароль должен содержать цифру, буквы в нижнем и верхнем регистре и иметь длину не менее 8 знаков;
Подтверждение пароля - поле не должно быть пустым и введенные значения должны соответствовать значением из поля "Пароль".
Если данные не проходят валидацию, пользователю выводится подсказка об несоответствии.
После регистрации пользователя в системе его перенаправляет на стартовую страницу оператора.
3. Страница восстановления пароля. Восстановление пароля осуществляется через Firebase.
Пользователю нужно ввести валидный адрес электронной почты.
Если такой пользователь есть в системе, на почту приходит письмо о восстановлении пароля. После создания нового пароля, пользователя перенаправляет на страницу авторизации.
Если такого пользователя нет в системе - выдается сообщение об ошибке.
4. Страница оператора.
4.1 Стартовая страница. На стартовой странице нет детальной информации, можно перейти к настройкам пользователя, выйти из системы и перейти на страницы "Активные" обращения, "В работе", "Завершённые" и "Сохранённые". Доступ к этим страницам и настройкам есть из любой страницы приложения авторизованного пользователя.
4.2 Страница "Активные" обращения.
Активные обращения - обращения, которые ни один оператор еще не взял в работу.
На странице есть поле для поиска обращений. Поиск осуществляется только по активным обращениям. Искать можно как по тексту обращения, так и по имени пользователя.
На странице выводится информация о количестве необработанных обращений и сами обращения.
У каждого обращения есть кнопка "Войти в диалог", при нажатии на которую оператор берёт в работу данное обращение. Такое обращение изменяет свой статус в базе данных Firebase с "активного" на "в работе", и данное обращение закрепляется за оператором. Оператора переводят на страницу Диалога с пользователем.
4.3 Страница "В работе".
На странице выводятся только те обращения, в которых оператор вошел в диалог с пользователем и не завершил его.
На странице есть поиск по обращениям "в работе", поиск осуществляется как по тексту обращения, так и по имени пользователя.
Чтобы перейти к диалогу, нужно нажать на кнопку "Войти в диалог".
4.4 Страница "Завершенные".
На странице отображаются те обращения, которые закреплены за оператором и находятся в статусе "Завершено".
Статус "Завершено" присваивается обращению, когда пользователь завершает его. (мобильное приложение, в разработке)
На странице есть поле для поиска обращений. Поиск осуществляется только по завершённым обращениям оператора. Искать можно как по тексту обращения, так и по имени пользователя.
4.5 Страница "Сохранённые".
На странице отображаются обращения, которое оператор пометил как "Сохранить диалог". Сохранить обращения можно со страницы Диалога с пользователем по кнопке "Сохранить диалог".
На странице есть поле для поиска обращений. Поиск осуществляется только по сохранённым обращениям оператора. Искать можно как по тексту обращения, так и по имени пользователя.
4.6 Настройки профиля оператора.
Переход на страницу осуществляется по нажатию на иконку шестерёнок рядом с именем оператора.
Страница делится на две части:
4.6.1 Настройки профиля оператора. Можно установить/изменить имя оператора, аватар. Так же есть возможность обновления пароля.
4.6.2 Настройки диалогов оператора. Здесь можно добавить/удалить Готовые фразы оператора (есть готовые фразы по умолчанию), установить автоматическое приветствие (фраза, которая будет автоматически отправлена пользователю, когда оператор берет в работу обращение).
Так же в этих настройках есть Список тем обращений, и подтем.
5. Страница "Диалога" с пользователем.
На странице отображается диалог с пользователем: Имя пользователя, сами сообщения (с текстом и датой, временем).
Есть поле для ответа оператора. При вводе сообщения оператором, если текст похож на одну из готовых фраз оператора, ему выводиться подсказка о выборе готовой фразы.
Так же можно сразу выбрать готовую фразу. Есть возможность отправлять смайлы. (реализовано при помощи emoji-picker-react).
Если в диалоге есть картинка, то по нажатию на нее она открывается в модульном окне.
Когда пользователь набирается сообщение, оператору выводиться в диалоге "пользователь набирает сообщение". (реализовано через pubnub).