97 lines
2.4 KiB
TypeScript
97 lines
2.4 KiB
TypeScript
import { useWallet } from '@solana/wallet-adapter-react'
|
|
import { useCallback, useState } from 'react'
|
|
import { LinkButton } from '../shared/Button'
|
|
import ChatForm from './ChatForm'
|
|
import Messages, { MessageProps } from './Messages'
|
|
// import { handleWalletConnect } from 'components/ConnectWalletButton'
|
|
|
|
const messages: MessageProps[] = [
|
|
{
|
|
text: 'hi',
|
|
timestamp: 1657000692,
|
|
user: 'sir huge kent',
|
|
walletPk: '',
|
|
},
|
|
{
|
|
text: 'yo',
|
|
timestamp: 1657010592,
|
|
user: 'lord ripe keitt',
|
|
walletPk: 'E8fEXpzHwgYRgzeRnEw71HKNih7YKK19MJYKvCAHf5AU',
|
|
},
|
|
{
|
|
text: 'GM',
|
|
timestamp: 1657020492,
|
|
user: 'sir huge kent',
|
|
walletPk: 'E8fEXpzHwgYRgzeRnEw71HKNih7YKK19MJYKvCAHf5AU',
|
|
},
|
|
{
|
|
text: 'gm',
|
|
timestamp: 1657030392,
|
|
user: 'lord ripe keitt',
|
|
walletPk: 'E8fEXpzHwgYRgzeRnEw71HKNih7YKK19MJYKvCAHf5AU',
|
|
},
|
|
{
|
|
text: 'hi',
|
|
timestamp: 1657400692,
|
|
user: 'sir huge kent',
|
|
walletPk: 'E8fEXpzHwgYRgzeRnEw71HKNih7YKK19MJYKvCAHf5AU',
|
|
},
|
|
{
|
|
text: 'yo',
|
|
timestamp: 1657500592,
|
|
user: 'lord ripe keitt',
|
|
walletPk: 'E8fEXpzHwgYRgzeRnEw71HKNih7YKK19MJYKvCAHf5AU',
|
|
},
|
|
{
|
|
text: 'GM',
|
|
timestamp: 1657600492,
|
|
user: 'sir huge kent',
|
|
walletPk: 'E8fEXpzHwgYRgzeRnEw71HKNih7YKK19MJYKvCAHf5AU',
|
|
},
|
|
{
|
|
text: 'gm',
|
|
timestamp: 1657070392,
|
|
user: 'lord ripe keitt',
|
|
walletPk: 'E8fEXpzHwgYRgzeRnEw71HKNih7YKK19MJYKvCAHf5AU',
|
|
},
|
|
]
|
|
|
|
const Chat = () => {
|
|
const [latestMessages, setLatestMessages] = useState(messages)
|
|
const { publicKey, wallet } = useWallet()
|
|
|
|
const handleConnect = useCallback(() => {
|
|
if (wallet) {
|
|
// handleWalletConnect(wallet)
|
|
}
|
|
}, [wallet])
|
|
|
|
return (
|
|
<div>
|
|
<div className="thin-scroll mb-4 flex max-h-56 flex-col-reverse overflow-y-auto px-2">
|
|
<Messages messages={latestMessages} />
|
|
</div>
|
|
{publicKey ? (
|
|
<ChatForm
|
|
messages={latestMessages}
|
|
setLatestMessages={setLatestMessages}
|
|
/>
|
|
) : (
|
|
<LinkButton
|
|
className="flex h-[45px] w-full items-center justify-center rounded-none border-t border-th-bkg-3"
|
|
onClick={handleConnect}
|
|
>
|
|
Connect to Chat
|
|
</LinkButton>
|
|
)}
|
|
<div className="bg-th-bkg-2 px-3 py-0.5">
|
|
<LinkButton className="mb-0 text-xxs font-normal">
|
|
<span className="text-th-fgd-4">Content Policy</span>
|
|
</LinkButton>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Chat
|