diff --git a/src/stores/Conversations/ConversationActions.js b/src/actions/ConversationActions.js similarity index 100% rename from src/stores/Conversations/ConversationActions.js rename to src/actions/ConversationActions.js diff --git a/src/stores/Conversations/initialState.js b/src/records/ConversationState.js similarity index 100% rename from src/stores/Conversations/initialState.js rename to src/records/ConversationState.js diff --git a/src/stores/Conversations/ConversationReducer.js b/src/reducers/ConversationReducer.js similarity index 95% rename from src/stores/Conversations/ConversationReducer.js rename to src/reducers/ConversationReducer.js index 83c9f4b..f4cbc7c 100644 --- a/src/stores/Conversations/ConversationReducer.js +++ b/src/reducers/ConversationReducer.js @@ -1,4 +1,4 @@ -import initialState from '@/stores/Conversations/initialState'; +import initialState from '@/records/ConversationState'; const NAME_SPACE = 'CONVERSATION/'; diff --git a/src/stores/Conversations/ConversationContext.js b/src/stores/ConversationContext.js similarity index 100% rename from src/stores/Conversations/ConversationContext.js rename to src/stores/ConversationContext.js diff --git a/src/views/Conversations/ChatWindow.jsx b/src/views/Conversations/ChatWindow.jsx index ac0fb13..0aed9ef 100644 --- a/src/views/Conversations/ChatWindow.jsx +++ b/src/views/Conversations/ChatWindow.jsx @@ -1,14 +1,13 @@ import { useEffect } from 'react'; -import { useParams } from 'react-router-dom'; -import { Layout, Avatar, Flex, Typography, Spin } from 'antd'; +import { Layout, Spin } from 'antd'; +import MessagesHeader from './Components/MessagesHeader'; import Messages from './Components/Messages'; import InputBox from './Components/InputBox'; import ConversationsList from './Components/ConversationsList'; import CustomerProfile from './Components/CustomerProfile'; -import LocalTimeClock from './Components/LocalTimeClock'; -import { useConversationContext } from '@/stores/Conversations/ConversationContext'; -import { sentNewMessage } from '@/stores/Conversations/ConversationActions'; +import { useConversationState, useConversationDispatch } from '@/stores/ConversationContext'; +import { sentNewMessage } from '@/actions/ConversationActions'; import { sentMsgTypeMapped } from '@/lib/msgUtils'; import './Conversations.css'; @@ -22,7 +21,8 @@ const { Sider, Content, Header, Footer } = Layout; const ChatWindow = () => { const { loginUser } = useAuthContext(); const { userId } = loginUser; - const { dispatch, websocket, errors, currentConversation } = useConversationContext(); + const { websocket, errors } = useConversationState(); + const dispatch = useConversationDispatch(); console.log(errors, 'errors;;;;;;;;;;;;;;;;;;;;;;;;'); useEffect(() => { @@ -50,19 +50,7 @@ const ChatWindow = () => {
- - {currentConversation.customer_name && } - - - {currentConversation.customer_name} - {currentConversation.whatsapp_phone_number} - - - {/* {order?.location} */} - {/* {customerDateTime} */} - - - +
diff --git a/src/views/Conversations/Components/ConversationsList.jsx b/src/views/Conversations/Components/ConversationsList.jsx index e8a03ca..c445bd9 100644 --- a/src/views/Conversations/Components/ConversationsList.jsx +++ b/src/views/Conversations/Components/ConversationsList.jsx @@ -1,8 +1,8 @@ import { useRef, useEffect, useState } from 'react'; import { useParams, useNavigate } from "react-router-dom"; import { List, Avatar, Flex } from 'antd'; -import { useConversationContext } from '@/stores/Conversations/ConversationContext'; -import { fetchCustomerProfile, receivedCustomerProfile, setCurrentConversation, addConversationList, setActiveConversations } from '@/stores/Conversations/ConversationActions' +import { useConversationState, useConversationDispatch } from '@/stores/ConversationContext'; +import { fetchCustomerProfile, receivedCustomerProfile, setCurrentConversation, addConversationList, setActiveConversations } from '@/actions/ConversationActions' import { ChatList } from 'react-chat-elements'; import { isEmpty, pick } from '@/utils/utils'; import { v4 as uuid } from 'uuid'; @@ -12,7 +12,8 @@ import { v4 as uuid } from 'uuid'; const Conversations = (() => { const { order_sn } = useParams(); const navigate = useNavigate(); - const { dispatch, conversationsList, } = useConversationContext(); + const {conversationsList} = useConversationState(); + const dispatch = useConversationDispatch(); const [chatlist, setChatlist] = useState([]); useEffect(() => { setChatlist( diff --git a/src/views/Conversations/Components/CustomerProfile.jsx b/src/views/Conversations/Components/CustomerProfile.jsx index 0105d4f..f24ff70 100644 --- a/src/views/Conversations/Components/CustomerProfile.jsx +++ b/src/views/Conversations/Components/CustomerProfile.jsx @@ -1,6 +1,6 @@ import { Card, Flex, Avatar, Typography, Radio, Button, Table } from 'antd'; import { useAuthContext } from '@/stores/AuthContext.js'; -import { useConversationContext } from '@/stores/Conversations/ConversationContext'; +import { useConversationState } from '@/stores/ConversationContext'; import { HomeOutlined, LoadingOutlined, SettingFilled, SmileOutlined, SyncOutlined, PhoneOutlined, MailOutlined, WhatsAppOutlined, SmileTwoTone } from '@ant-design/icons'; import CreatePayment from './CreatePayment'; @@ -22,7 +22,7 @@ const orderStatus = [ const { Meta } = Card; const CustomerProfile = (() => { - const { errors, customerOrderProfile: orderInfo } = useConversationContext(); + const { customerOrderProfile: orderInfo } = useConversationState(); const { loginUser: currentUser } = useAuthContext(); const { quotes, contact, last_contact, ...order } = orderInfo; diff --git a/src/views/Conversations/Components/InputBox.jsx b/src/views/Conversations/Components/InputBox.jsx index d463e2c..3928ef1 100644 --- a/src/views/Conversations/Components/InputBox.jsx +++ b/src/views/Conversations/Components/InputBox.jsx @@ -1,14 +1,14 @@ import React, { useEffect, useState } from 'react'; import { Input, Button, Tabs, List, Space, Popover, Flex } from 'antd'; // import { Input } from 'react-chat-elements'; -import { useConversationContext } from '@/stores/Conversations/ConversationContext'; +import { useConversationState } from '@/stores/ConversationContext'; import { LikeOutlined, MessageOutlined, StarOutlined, SendOutlined, PlusOutlined, PlusCircleOutlined } from '@ant-design/icons'; import { cloneDeep, getNestedValue, isEmpty } from '@/utils/utils'; import { v4 as uuid } from 'uuid'; import { whatsappTemplatesParamMapped } from '@/lib/msgUtils'; const InputBox = ({ onSend }) => { - const { dispatch, currentConversation, templates } = useConversationContext(); + const { currentConversation, templates } = useConversationState(); const [textContent, setTextContent] = useState(''); const talkabled = !isEmpty(currentConversation.sn); diff --git a/src/views/Conversations/Components/LocalTimeClock.jsx b/src/views/Conversations/Components/LocalTimeClock.jsx index 0228803..3eb17e6 100644 --- a/src/views/Conversations/Components/LocalTimeClock.jsx +++ b/src/views/Conversations/Components/LocalTimeClock.jsx @@ -1,6 +1,6 @@ import { useEffect, useState } from 'react'; import { Typography } from 'antd'; -import { useConversationContext } from '@/stores/Conversations/ConversationContext'; +import { useConversationState } from '@/stores/ConversationContext'; import dayjs from 'dayjs'; import utc from 'dayjs/plugin/utc'; import timezone from 'dayjs/plugin/timezone'; @@ -9,7 +9,7 @@ dayjs.extend(utc); dayjs.extend(timezone); const LocalTimeClock = ((props) => { - const { customerOrderProfile: orderInfo } = useConversationContext(); + const { customerOrderProfile: orderInfo } = useConversationState(); const [customerDateTime, setCustomerDateTime] = useState(); diff --git a/src/views/Conversations/Components/Messages.jsx b/src/views/Conversations/Components/Messages.jsx index 3dd870b..17309aa 100644 --- a/src/views/Conversations/Components/Messages.jsx +++ b/src/views/Conversations/Components/Messages.jsx @@ -1,10 +1,10 @@ import { useEffect, useState, useRef } from 'react'; import { List, Avatar, Timeline, Image } from 'antd'; import { MessageBox } from 'react-chat-elements'; -import { useConversationContext } from '@/stores/Conversations/ConversationContext'; +import { useConversationState } from '@/stores/ConversationContext'; const Messages = (() => { - const { activeConversations, currentConversation } = useConversationContext(); + const { activeConversations, currentConversation } = useConversationState(); const messagesList = activeConversations[currentConversation.sn] || []; console.log('messagesList----------------------------------------------------', messagesList); diff --git a/src/views/Conversations/Components/MessagesHeader.jsx b/src/views/Conversations/Components/MessagesHeader.jsx new file mode 100644 index 0000000..4eeccf7 --- /dev/null +++ b/src/views/Conversations/Components/MessagesHeader.jsx @@ -0,0 +1,27 @@ +import { createContext, useContext, useEffect, useState } from 'react'; +import { useConversationState } from '@/stores/ConversationContext'; + +import { Flex, Typography, Avatar } from 'antd'; +import LocalTimeClock from './LocalTimeClock'; + +const MessagesHeader = () => { + const { currentConversation } = useConversationState(); + return ( + <> + + {currentConversation.customer_name && } + + + {currentConversation.customer_name} + {currentConversation.whatsapp_phone_number} + + + {/* {order?.location} */} + {/* {customerDateTime} */} + + + + + ); +}; +export default MessagesHeader; diff --git a/src/views/Conversations/Components/QuotesHistory.jsx b/src/views/Conversations/Components/QuotesHistory.jsx index 2a1f029..8b547ae 100644 --- a/src/views/Conversations/Components/QuotesHistory.jsx +++ b/src/views/Conversations/Components/QuotesHistory.jsx @@ -1,9 +1,9 @@ import { createContext, useContext, useEffect, useState } from 'react'; import { Popover, Flex, Button, List, Popconfirm } from 'antd'; -import { useConversationContext } from '@/stores/Conversations/ConversationContext'; +import { useConversationState } from '@/stores/ConversationContext'; const QuotesHistory = ((props) => { - const { customerOrderProfile: orderInfo } = useConversationContext(); + const { customerOrderProfile: orderInfo } = useConversationState(); const { quotes, ...order } = orderInfo; const [open, setOpen] = useState(false); diff --git a/src/views/Conversations/ConversationProvider.jsx b/src/views/Conversations/ConversationProvider.jsx index 092aae6..a6d6bd7 100644 --- a/src/views/Conversations/ConversationProvider.jsx +++ b/src/views/Conversations/ConversationProvider.jsx @@ -1,6 +1,6 @@ import { useContext, useReducer, useEffect } from 'react'; -import { ConversationContext, ConversationStateContext, ConversationDispatchContext } from '@/stores/Conversations/ConversationContext'; -import ConversationReducer from '@/stores/Conversations/ConversationReducer'; +import { ConversationStateContext, ConversationDispatchContext } from '@/stores/ConversationContext'; +import ConversationReducer from '@/reducers/ConversationReducer'; import { initWebsocket, addError, @@ -11,8 +11,8 @@ import { setActiveConversations, updateMessageItem, receivedNewMessage, -} from '@/stores/Conversations/ConversationActions'; -import initialState from '@/stores/Conversations/initialState'; +} from '@/actions/ConversationActions'; +import initialState from '@/records/ConversationState'; import { AuthContext } from '@/stores/AuthContext'; @@ -86,12 +86,12 @@ const ConversationProvider = ({ children }) => { } console.log('handleMessage*******************'); }; - return {children}; - // return ( - // - // {children} - // - // ); + // return {children}; + return ( + + {children} + + ); }; export default ConversationProvider;