mirror of
https://github.com/oceanprotocol/market.git
synced 2024-06-17 01:43:23 +02:00
8fd3eaf8de
* add orbis context * new changes * Add orbis floating chat * adding orbis function * load orbis conversations * update message button in profile * minor fix conversation styles * update orbis version * adding details conditional * updating post comment function * Update send message button style * Fix send message button css * udpate orbis * update posts and floating function * Add chatbox emoji * Add Emoji Picker Theme * useDarkMode emoji fix * remove next dynamic on emoji picker * show conversation title from participant * update callbackMessage. * Update Emoji Picker * Add Emoji Picker to Postbox * rename FloatingChat to DirectMessages * create some global orbis components * update package-lock.json * change any type * change Blockie to Avatar component * fix type errors * fix infinite loop when no comment found * Hide send message button on ownAccount profile * Delete unused component * minor changes * update orbis comment and DM components * fix load older messages on DM scroll * fixed orbis createPost * update optional wallet signs * add return value on connect * add padding bottom to compensate DM component * add conditional connect and sign button * update direct message component * update get notifications logic * rerun npm install * rerun npm install * temporary push * rerun npm install * add new custom hooks * run npm install * update flow on address changed * update custom DID string * remove lit auth signatures on resetStates() * add hasLit condition on getMessages * add removeCeramicSession function * useLocalStorage to store notifications * minor bug fix * update styles for conversation details * use getEnsName util * update create conversation flow * rerun npm install * update typescript * update orbis sdk version * temporary push * revisions * update orbis version * update notifs count and conversation creation flow * update orbis types * add toast after copy address * add message decryption refresh button * rerun npm install * remove comment from asset page * test push * remove lit-auth-signature on wallet changed * update orbis SDK to v0.4.14 * update copy * update Orbis SDK to v0.4.17 * update copy * create new DM button component and add to asset * add send button and remove emojiPicker * Revert "Merge branch 'main' into orbis" This reverts commit3cdaf54827
, reversing changes made to02f2acb774
. * Revert "Revert "Merge branch 'main' into orbis"" This reverts commita5a32b1534
. * update new conversation flow * update intro message * minor fix typo * remove unused package and fixed outdated versions * remove comment component and restructured folders * update orbis-sdk * small cleanup * direct message button style updates --------- Co-authored-by: Nuary Pradipta <nuary.pradipta@gmail.com> Co-authored-by: Dollar Bull <ramadhanakhri@gmail.com> Co-authored-by: Bogdan Fazakas <bogdan.fazakas@gmail.com>
122 lines
3.3 KiB
TypeScript
122 lines
3.3 KiB
TypeScript
import React, { useRef } from 'react'
|
|
import styles from './Postbox.module.css'
|
|
import { useOrbis } from '@context/DirectMessages'
|
|
import SendIcon from '@images/send.svg'
|
|
import { accountTruncate } from '@utils/web3'
|
|
import { didToAddress } from './_utils'
|
|
import {
|
|
IOrbisMessage,
|
|
IOrbisMessageContent
|
|
} from '@context/DirectMessages/_types'
|
|
|
|
export default function Postbox({
|
|
replyTo = null,
|
|
cancelReplyTo,
|
|
callback
|
|
}: {
|
|
replyTo?: IOrbisMessage
|
|
cancelReplyTo?: () => void
|
|
callback: (value: IOrbisMessage) => void
|
|
}) {
|
|
const postBoxArea = useRef(null)
|
|
const {
|
|
orbis,
|
|
account,
|
|
conversationId,
|
|
updateConversationEmptyMessageStatus
|
|
} = useOrbis()
|
|
|
|
const share = async () => {
|
|
if (!account || postBoxArea.current.innerText.trim() === '') return false
|
|
|
|
const body = postBoxArea.current.innerText.trim()
|
|
postBoxArea.current.innerText = ''
|
|
|
|
const content: IOrbisMessageContent & { decryptedMessage?: string } = {
|
|
encryptedMessage: null,
|
|
decryptedMessage: body,
|
|
master: replyTo ? replyTo.master || replyTo.stream_id : undefined,
|
|
reply_to: replyTo ? replyTo.stream_id : undefined
|
|
}
|
|
|
|
const timestamp = Math.floor(Date.now() / 1000)
|
|
|
|
const _callbackContent: IOrbisMessage = {
|
|
conversation_id: conversationId,
|
|
content,
|
|
creator: account.did,
|
|
creator_details: {
|
|
did: account.did,
|
|
profile: account.details?.profile,
|
|
metadata: account.details?.metadata
|
|
},
|
|
master: replyTo ? replyTo.master || replyTo.stream_id : null,
|
|
reply_to: replyTo ? replyTo.stream_id : null,
|
|
reply_to_creator_details: replyTo ? replyTo.creator_details : null,
|
|
reply_to_details: replyTo ? replyTo.content : null,
|
|
stream_id: 'new_post--' + timestamp,
|
|
timestamp
|
|
}
|
|
|
|
if (callback) callback(_callbackContent)
|
|
|
|
const res = await orbis.sendMessage({
|
|
conversation_id: conversationId,
|
|
body
|
|
})
|
|
|
|
if (res.status === 200) {
|
|
_callbackContent.stream_id = res.doc
|
|
if (callback) callback(_callbackContent)
|
|
updateConversationEmptyMessageStatus(conversationId, false)
|
|
}
|
|
}
|
|
|
|
const handleKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {
|
|
if (!e.key) return
|
|
|
|
if (e.key === 'Enter' && !e.shiftKey) {
|
|
// Don't generate a new line
|
|
e.preventDefault()
|
|
share()
|
|
}
|
|
}
|
|
|
|
return (
|
|
<div className={styles.postbox}>
|
|
{replyTo && (
|
|
<div className={styles.replyto}>
|
|
<div className={styles.replytoDetails}>
|
|
Replying to{' '}
|
|
<strong>
|
|
{replyTo?.creator_details?.metadata?.ensName ||
|
|
accountTruncate(didToAddress(replyTo?.creator_details?.did))}
|
|
</strong>
|
|
</div>
|
|
<button className={styles.replytoCancel} onClick={cancelReplyTo}>
|
|
×
|
|
</button>
|
|
</div>
|
|
)}
|
|
<div className={styles.postboxInput}>
|
|
<div
|
|
id="postbox-area"
|
|
ref={postBoxArea}
|
|
className={styles.editable}
|
|
contentEditable={true}
|
|
data-placeholder="Type your message here..."
|
|
onKeyDown={handleKeyDown}
|
|
/>
|
|
<button
|
|
type="button"
|
|
className={styles.sendButton}
|
|
onClick={share}
|
|
disabled={!conversationId}
|
|
>
|
|
<SendIcon className={styles.icon} />
|
|
</button>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|