renamed operator, added subtitle with working hours, added greeting message to the chat, fixted scroll

This commit is contained in:
aleksandr-raw 2024-04-22 16:08:29 +04:00
parent 681969d9fc
commit c8882ef5bd

@ -12,43 +12,47 @@ import {
} from "@mui/material";
import makeRequest from "@api/makeRequest"
import {
TicketMessage,
useTicketsFetcher,
useTicketMessages,
getMessageFromFetchError,
useSSESubscription,
createTicket,
getMessageFromFetchError,
throttle,
TicketMessage,
useSSESubscription,
useTicketMessages,
useTicketsFetcher,
} from "@frontend/kitui";
import { enqueueSnackbar } from "notistack";
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
import {enqueueSnackbar} from "notistack";
import type {TouchEvent, WheelEvent} from "react";
import {useCallback, useEffect, useMemo, useRef, useState} from "react";
import ChatMessage from "../ChatMessage";
import SendIcon from "../icons/SendIcon";
import ArrowLeft from "@root/assets/Icons/arrowLeft";
import UserCircleIcon from "./UserCircleIcon";
import { throttle } from "@frontend/kitui";
import { sendTicketMessage, shownMessage } from "@root/api/ticket";
import { useSSETab } from "@root/utils/hooks/useSSETab";
import {sendTicketMessage, shownMessage} from "@root/api/ticket";
import {useSSETab} from "@root/utils/hooks/useSSETab";
import {
ACCEPT_SEND_MEDIA_TYPES_MAP,
checkAcceptableMediaType,
MAX_FILE_SIZE,
ACCEPT_SEND_MEDIA_TYPES_MAP,
} from "@utils/checkAcceptableMediaType";
import {
useTicketStore,
setTicketData,
addOrUpdateUnauthMessages,
setUnauthTicketMessageFetchState,
setUnauthIsPreventAutoscroll,
incrementUnauthMessage,
setIsMessageSending,
setTicketData,
setUnauthIsPreventAutoscroll,
setUnauthTicketMessageFetchState,
useTicketStore,
} from "@root/stores/tickets";
import { useUserStore } from "@root/stores/user";
import {useUserStore} from "@root/stores/user";
import AttachFileIcon from "@mui/icons-material/AttachFile";
import ChatDocument from "./ChatDocument";
import ChatImage from "./ChatImage";
import ChatVideo from "./ChatVideo";
import type { WheelEvent, TouchEvent } from "react";
const workingHoursMessage =
"Здравствуйте, задайте ваш вопрос и наш оператор вам ответит в течение 10 минут";
const offHoursMessage =
"Здравствуйте, к сожалению, сейчас операторы не работают. Задайте ваш вопрос, и вам ответят в 10:00 по московскому времени";
type ModalWarningType =
| "errorType"
@ -178,6 +182,35 @@ export default function Chat({ open = false, onclickArrow, sx }: Props) {
[fetchState]
);
useEffect(() => {
const date = new Date();
const currentHourUTC = date.getUTCHours();
const MscTime = 3; // Москва UTC+3;
const moscowHour = (currentHourUTC + MscTime) % 24;
const greetingMessage =
moscowHour >= 10 && moscowHour < 15
? workingHoursMessage
: offHoursMessage;
const greetingMessageObj = {
created_at: new Date().toISOString(),
files: [],
id: "111ck2tepkvc9g6irk3fugg",
message: greetingMessage,
request_screenshot: "",
session_id: "111",
shown: { me: 1 },
ticket_id: "111",
user_id: "111",
};
addOrUpdateUnauthMessages([greetingMessageObj]);
if (open) {
scrollToBottom();
}
}, [open]);
useEffect(
function scrollOnNewMessage() {
if (!chatBoxRef.current) return;
@ -369,7 +402,7 @@ export default function Chat({ open = false, onclickArrow, sx }: Props) {
gap: "3px",
}}
>
<Typography>Мария</Typography>
<Typography>Данила</Typography>
<Typography
sx={{
fontSize: "16px",
@ -378,6 +411,14 @@ export default function Chat({ open = false, onclickArrow, sx }: Props) {
>
онлайн-консультант
</Typography>
<Typography
sx={{
fontSize: "16px",
lineHeight: "19px",
}}
>
время работы 10:00-3:00 по мск
</Typography>
</Box>
</Box>
<Box