From 9bdaaa781e2fa664f303e1aa4453382067b2bb4e Mon Sep 17 00:00:00 2001
From: Dollar Bull <ramadhanakhri@gmail.com>
Date: Mon, 3 Oct 2022 22:48:23 +0700
Subject: [PATCH] update message button in profile

---
 .../Profile/Header/Account.module.css         |  7 +++
 src/components/Profile/Header/Account.tsx     |  2 +-
 src/components/Profile/Header/index.tsx       | 43 ++++++++++++++++++-
 3 files changed, 50 insertions(+), 2 deletions(-)

diff --git a/src/components/Profile/Header/Account.module.css b/src/components/Profile/Header/Account.module.css
index 70bc9ffea..5d2cef418 100644
--- a/src/components/Profile/Header/Account.module.css
+++ b/src/components/Profile/Header/Account.module.css
@@ -2,6 +2,13 @@
   text-align: center;
 }
 
+.sendMessage {
+  display: flex;
+  position: justify-end;
+  background-color: white;
+  cursor: pointer;
+}
+
 .account p {
   margin: 0;
 }
diff --git a/src/components/Profile/Header/Account.tsx b/src/components/Profile/Header/Account.tsx
index bbf2a676b..17bc56f55 100644
--- a/src/components/Profile/Header/Account.tsx
+++ b/src/components/Profile/Header/Account.tsx
@@ -32,7 +32,7 @@ export default function Account({
           <Jellyfish className={styles.image} />
         )}
       </figure>
-
+      {/* <div>aaa</div> */}
       <div>
         <h3 className={styles.name}>{profile?.name}</h3>
         {accountId && (
diff --git a/src/components/Profile/Header/index.tsx b/src/components/Profile/Header/index.tsx
index 15afbe128..b9c7546a4 100644
--- a/src/components/Profile/Header/index.tsx
+++ b/src/components/Profile/Header/index.tsx
@@ -1,10 +1,11 @@
-import React, { ReactElement, useState } from 'react'
+import React, { ReactElement, useEffect, useState } from 'react'
 import PublisherLinks from './PublisherLinks'
 import Markdown from '@shared/Markdown'
 import Stats from './Stats'
 import Account from './Account'
 import styles from './index.module.css'
 import { useProfile } from '@context/Profile'
+import { useOrbis } from '@context/Orbis'
 
 const isDescriptionTextClamped = () => {
   const el = document.getElementById('description')
@@ -25,12 +26,49 @@ export default function AccountHeader({
   accountId: string
 }): ReactElement {
   const { profile } = useProfile()
+  const { orbis, account } = useOrbis()
   const [isShowMore, setIsShowMore] = useState(false)
+  const [userDid, setUserDid] = useState<string>()
 
   const toogleShowMore = () => {
     setIsShowMore(!isShowMore)
   }
 
+  const getDid = async () => {
+    const { data, error } = await orbis.getDids(accountId)
+    if (data) {
+      if (data.length > 0) {
+        setUserDid(data[0])
+      } else {
+        setUserDid('did:pkh:eip155:1:' + accountId.toLocaleLowerCase())
+      }
+    }
+
+    if (error) {
+      console.log(error)
+    }
+  }
+
+  const createConversation = async () => {
+    const res = await orbis.createConversation({
+      recipients: [userDid]
+    })
+    if (res.status === 200) {
+      console.log(res)
+    }
+  }
+
+  useEffect(() => {
+    console.log(userDid)
+  }, [userDid])
+
+  const clickHandler = () => {
+    console.log(accountId)
+    console.log(account)
+    getDid()
+    createConversation()
+  }
+
   return (
     <div className={styles.grid}>
       <div>
@@ -53,6 +91,9 @@ export default function AccountHeader({
         {profile?.links?.length > 0 && (
           <PublisherLinks className={styles.publisherLinks} />
         )}
+        <button className="sendMessage" onClick={clickHandler}>
+          Send Messages
+        </button>
       </div>
       <div className={styles.meta}>
         Profile data from{' '}