83 lines
2.7 KiB
TypeScript
83 lines
2.7 KiB
TypeScript
import { Fragment, useEffect, useState } from 'react'
|
|
import { Row, Text } from '@nextui-org/react'
|
|
import { useRouter } from 'next/router'
|
|
import { FiPlus } from 'react-icons/fi'
|
|
import { useSnapshot } from 'valtio'
|
|
|
|
import ChatSummaryCard from '@/components/ChatSummaryCard'
|
|
import PageHeader from '@/components/PageHeader'
|
|
import ChatRequestsButton from '@/components/ChatRequestsButton'
|
|
import { chatClient } from '@/utils/WalletConnectUtil'
|
|
import ChatPrimaryCTAButton from '@/components/ChatPrimaryCTAButton'
|
|
import SettingsStore from '@/store/SettingsStore'
|
|
|
|
export default function ChatsPage() {
|
|
const router = useRouter()
|
|
const [isLoading, setIsLoading] = useState(true)
|
|
|
|
const [chatThreads, setChatThreads] = useState<
|
|
{ topic: string; selfAccount: string; peerAccount: string }[]
|
|
>([])
|
|
|
|
const [chatInvites, setChatInvites] = useState<any[]>([])
|
|
|
|
const { eip155Address } = useSnapshot(SettingsStore.state)
|
|
|
|
const initChatClient = async () => {
|
|
console.log(chatClient)
|
|
await chatClient.register({ account: `eip155:1:${eip155Address}` })
|
|
|
|
console.log('chatInvites on load:', chatClient.chatInvites.getAll())
|
|
console.log('chatThreads on load:', chatClient.chatThreads.getAll())
|
|
console.log('chatMessages on load:', chatClient.chatMessages.getAll())
|
|
setChatThreads(chatClient.chatThreads.getAll())
|
|
setChatInvites(chatClient.chatInvites.getAll())
|
|
|
|
chatClient.on('chat_invite', async args => {
|
|
console.log('chat_invite:', args)
|
|
console.log(chatClient.chatInvites.getAll())
|
|
setChatInvites(chatClient.chatInvites.getAll())
|
|
})
|
|
|
|
chatClient.on('chat_joined', async args => {
|
|
console.log('chat_joined:', args)
|
|
console.log(chatClient.chatThreads.getAll())
|
|
setChatThreads(chatClient.chatThreads.getAll())
|
|
})
|
|
|
|
setIsLoading(false)
|
|
}
|
|
|
|
useEffect(() => {
|
|
initChatClient()
|
|
}, [])
|
|
|
|
return (
|
|
<Fragment>
|
|
<PageHeader
|
|
title="Chat"
|
|
ctaButton={
|
|
<ChatPrimaryCTAButton icon={<FiPlus />} onClick={() => router.push('/newChat')} />
|
|
}
|
|
/>
|
|
|
|
<Row justify="center" align="center" css={{ paddingBottom: '$5' }}>
|
|
{chatInvites.length ? <ChatRequestsButton requestCount={chatInvites.length} /> : null}
|
|
{/* <ChatRequestsButton requestCount={chatInvites.length} /> */}
|
|
</Row>
|
|
|
|
{isLoading ? (
|
|
<Text css={{ opacity: '0.5', textAlign: 'center', marginTop: '$20' }}>
|
|
Fetching chats...
|
|
</Text>
|
|
) : chatThreads.length ? (
|
|
chatThreads.map(props => {
|
|
return <ChatSummaryCard key={props.topic} {...props} />
|
|
})
|
|
) : (
|
|
<Text css={{ opacity: '0.5', textAlign: 'center', marginTop: '$20' }}>No chats</Text>
|
|
)}
|
|
</Fragment>
|
|
)
|
|
}
|