From 7090a9529f57532615f0e9caff269ae9e2a5d95f Mon Sep 17 00:00:00 2001 From: marcoelissa Date: Thu, 10 Nov 2022 02:44:44 +0700 Subject: [PATCH] change Blockie to Avatar component --- package-lock.json | 252 ++++++++++++++++++ src/components/@shared/Orbis/Comment/Post.tsx | 20 +- .../Orbis/DirectMessages/ConversationItem.tsx | 14 +- src/components/Profile/Header/index.tsx | 66 ++--- 4 files changed, 280 insertions(+), 72 deletions(-) diff --git a/package-lock.json b/package-lock.json index eb1782a80..8eff1d338 100644 --- a/package-lock.json +++ b/package-lock.json @@ -39187,6 +39187,186 @@ "type": "github", "url": "https://github.com/sponsors/wooorm" } + }, + "node_modules/@next/swc-android-arm-eabi": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-android-arm-eabi/-/swc-android-arm-eabi-12.3.1.tgz", + "integrity": "sha512-i+BvKA8tB//srVPPQxIQN5lvfROcfv4OB23/L1nXznP+N/TyKL8lql3l7oo2LNhnH66zWhfoemg3Q4VJZSruzQ==", + "cpu": [ + "arm" + ], + "optional": true, + "os": [ + "android" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-android-arm64": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-android-arm64/-/swc-android-arm64-12.3.1.tgz", + "integrity": "sha512-CmgU2ZNyBP0rkugOOqLnjl3+eRpXBzB/I2sjwcGZ7/Z6RcUJXK5Evz+N0ucOxqE4cZ3gkTeXtSzRrMK2mGYV8Q==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "android" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-darwin-arm64": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-12.3.1.tgz", + "integrity": "sha512-hT/EBGNcu0ITiuWDYU9ur57Oa4LybD5DOQp4f22T6zLfpoBMfBibPtR8XktXmOyFHrL/6FC2p9ojdLZhWhvBHg==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-darwin-x64": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-12.3.1.tgz", + "integrity": "sha512-9S6EVueCVCyGf2vuiLiGEHZCJcPAxglyckTZcEwLdJwozLqN0gtS0Eq0bQlGS3dH49Py/rQYpZ3KVWZ9BUf/WA==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-freebsd-x64": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-freebsd-x64/-/swc-freebsd-x64-12.3.1.tgz", + "integrity": "sha512-qcuUQkaBZWqzM0F1N4AkAh88lLzzpfE6ImOcI1P6YeyJSsBmpBIV8o70zV+Wxpc26yV9vpzb+e5gCyxNjKJg5Q==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "freebsd" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-linux-arm-gnueabihf": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-linux-arm-gnueabihf/-/swc-linux-arm-gnueabihf-12.3.1.tgz", + "integrity": "sha512-diL9MSYrEI5nY2wc/h/DBewEDUzr/DqBjIgHJ3RUNtETAOB3spMNHvJk2XKUDjnQuluLmFMloet9tpEqU2TT9w==", + "cpu": [ + "arm" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-linux-arm64-gnu": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-12.3.1.tgz", + "integrity": "sha512-o/xB2nztoaC7jnXU3Q36vGgOolJpsGG8ETNjxM1VAPxRwM7FyGCPHOMk1XavG88QZSQf+1r+POBW0tLxQOJ9DQ==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-linux-arm64-musl": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-12.3.1.tgz", + "integrity": "sha512-2WEasRxJzgAmP43glFNhADpe8zB7kJofhEAVNbDJZANp+H4+wq+/cW1CdDi8DqjkShPEA6/ejJw+xnEyDID2jg==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-linux-x64-gnu": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-12.3.1.tgz", + "integrity": "sha512-JWEaMyvNrXuM3dyy9Pp5cFPuSSvG82+yABqsWugjWlvfmnlnx9HOQZY23bFq3cNghy5V/t0iPb6cffzRWylgsA==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-linux-x64-musl": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-12.3.1.tgz", + "integrity": "sha512-xoEWQQ71waWc4BZcOjmatuvPUXKTv6MbIFzpm4LFeCHsg2iwai0ILmNXf81rJR+L1Wb9ifEke2sQpZSPNz1Iyg==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-win32-arm64-msvc": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-12.3.1.tgz", + "integrity": "sha512-hswVFYQYIeGHE2JYaBVtvqmBQ1CppplQbZJS/JgrVI3x2CurNhEkmds/yqvDONfwfbttTtH4+q9Dzf/WVl3Opw==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-win32-ia32-msvc": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-12.3.1.tgz", + "integrity": "sha512-Kny5JBehkTbKPmqulr5i+iKntO5YMP+bVM8Hf8UAmjSMVo3wehyLVc9IZkNmcbxi+vwETnQvJaT5ynYBkJ9dWA==", + "cpu": [ + "ia32" + ], + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 10" + } } }, "dependencies": { @@ -69741,6 +69921,78 @@ "version": "1.0.5", "resolved": "https://registry.npmjs.org/zwitch/-/zwitch-1.0.5.tgz", "integrity": "sha512-V50KMwwzqJV0NpZIZFwfOD5/lyny3WlSzRiXgA0G7VUnRlqttta1L6UQIHzd6EuBY/cHGfwTIck7w1yH6Q5zUw==" + }, + "@next/swc-android-arm-eabi": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-android-arm-eabi/-/swc-android-arm-eabi-12.3.1.tgz", + "integrity": "sha512-i+BvKA8tB//srVPPQxIQN5lvfROcfv4OB23/L1nXznP+N/TyKL8lql3l7oo2LNhnH66zWhfoemg3Q4VJZSruzQ==", + "optional": true + }, + "@next/swc-android-arm64": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-android-arm64/-/swc-android-arm64-12.3.1.tgz", + "integrity": "sha512-CmgU2ZNyBP0rkugOOqLnjl3+eRpXBzB/I2sjwcGZ7/Z6RcUJXK5Evz+N0ucOxqE4cZ3gkTeXtSzRrMK2mGYV8Q==", + "optional": true + }, + "@next/swc-darwin-arm64": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-12.3.1.tgz", + "integrity": "sha512-hT/EBGNcu0ITiuWDYU9ur57Oa4LybD5DOQp4f22T6zLfpoBMfBibPtR8XktXmOyFHrL/6FC2p9ojdLZhWhvBHg==", + "optional": true + }, + "@next/swc-darwin-x64": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-12.3.1.tgz", + "integrity": "sha512-9S6EVueCVCyGf2vuiLiGEHZCJcPAxglyckTZcEwLdJwozLqN0gtS0Eq0bQlGS3dH49Py/rQYpZ3KVWZ9BUf/WA==", + "optional": true + }, + "@next/swc-freebsd-x64": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-freebsd-x64/-/swc-freebsd-x64-12.3.1.tgz", + "integrity": "sha512-qcuUQkaBZWqzM0F1N4AkAh88lLzzpfE6ImOcI1P6YeyJSsBmpBIV8o70zV+Wxpc26yV9vpzb+e5gCyxNjKJg5Q==", + "optional": true + }, + "@next/swc-linux-arm-gnueabihf": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-linux-arm-gnueabihf/-/swc-linux-arm-gnueabihf-12.3.1.tgz", + "integrity": "sha512-diL9MSYrEI5nY2wc/h/DBewEDUzr/DqBjIgHJ3RUNtETAOB3spMNHvJk2XKUDjnQuluLmFMloet9tpEqU2TT9w==", + "optional": true + }, + "@next/swc-linux-arm64-gnu": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-12.3.1.tgz", + "integrity": "sha512-o/xB2nztoaC7jnXU3Q36vGgOolJpsGG8ETNjxM1VAPxRwM7FyGCPHOMk1XavG88QZSQf+1r+POBW0tLxQOJ9DQ==", + "optional": true + }, + "@next/swc-linux-arm64-musl": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-12.3.1.tgz", + "integrity": "sha512-2WEasRxJzgAmP43glFNhADpe8zB7kJofhEAVNbDJZANp+H4+wq+/cW1CdDi8DqjkShPEA6/ejJw+xnEyDID2jg==", + "optional": true + }, + "@next/swc-linux-x64-gnu": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-12.3.1.tgz", + "integrity": "sha512-JWEaMyvNrXuM3dyy9Pp5cFPuSSvG82+yABqsWugjWlvfmnlnx9HOQZY23bFq3cNghy5V/t0iPb6cffzRWylgsA==", + "optional": true + }, + "@next/swc-linux-x64-musl": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-12.3.1.tgz", + "integrity": "sha512-xoEWQQ71waWc4BZcOjmatuvPUXKTv6MbIFzpm4LFeCHsg2iwai0ILmNXf81rJR+L1Wb9ifEke2sQpZSPNz1Iyg==", + "optional": true + }, + "@next/swc-win32-arm64-msvc": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-12.3.1.tgz", + "integrity": "sha512-hswVFYQYIeGHE2JYaBVtvqmBQ1CppplQbZJS/JgrVI3x2CurNhEkmds/yqvDONfwfbttTtH4+q9Dzf/WVl3Opw==", + "optional": true + }, + "@next/swc-win32-ia32-msvc": { + "version": "12.3.1", + "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-12.3.1.tgz", + "integrity": "sha512-Kny5JBehkTbKPmqulr5i+iKntO5YMP+bVM8Hf8UAmjSMVo3wehyLVc9IZkNmcbxi+vwETnQvJaT5ynYBkJ9dWA==", + "optional": true } } } diff --git a/src/components/@shared/Orbis/Comment/Post.tsx b/src/components/@shared/Orbis/Comment/Post.tsx index ed33c7046..a00311a40 100644 --- a/src/components/@shared/Orbis/Comment/Post.tsx +++ b/src/components/@shared/Orbis/Comment/Post.tsx @@ -2,10 +2,8 @@ import React, { useState, useEffect, ReactNode } from 'react' import Link from 'next/link' import { accountTruncate } from '@utils/web3' import { didToAddress, formatMessage } from '@utils/orbis' -import get3BoxProfile from '@utils/profile' -import Blockies from '@shared/atoms/Blockies' +import Avatar from '@shared/atoms/Avatar' import Time from '@shared/atoms/Time' -import { useCancelToken } from '@hooks/useCancelToken' import { useOrbis } from '@context/Orbis' import styles from './Post.module.css' @@ -24,12 +22,9 @@ export default function Post({ const [address, setAddress] = useState('') const [name, setName] = useState('') - const [profile, setProfile] = useState() const [parsedBody, setParsedBody] = useState() const [reacted, setReacted] = useState('') - const newCancelToken = useCancelToken() - const reactions = [ // { // ctx: 'reply', @@ -103,13 +98,6 @@ export default function Post({ setName(accountTruncate(address)) } - async function getProfileData() { - const profile = await get3BoxProfile(address, newCancelToken()) - if (!profile) return - setProfile(profile) - } - getProfileData() - setParsedBody(formatMessage(post.content)) getUserReaction() @@ -121,11 +109,7 @@ export default function Post({ return (
- +
{showProfile && (
diff --git a/src/components/@shared/Orbis/DirectMessages/ConversationItem.tsx b/src/components/@shared/Orbis/DirectMessages/ConversationItem.tsx index d8f0e526d..8bee1caf1 100644 --- a/src/components/@shared/Orbis/DirectMessages/ConversationItem.tsx +++ b/src/components/@shared/Orbis/DirectMessages/ConversationItem.tsx @@ -2,9 +2,8 @@ import React, { useState, useEffect } from 'react' import { useCancelToken } from '@hooks/useCancelToken' import { useOrbis } from '@context/Orbis' import { accountTruncate } from '@utils/web3' -import get3BoxProfile from '@utils/profile' import { didToAddress } from '@utils/orbis' -import Blockies from '@shared/atoms/Blockies' +import Avatar from '@shared/atoms/Avatar' import Time from '@shared/atoms/Time' import styles from './ConversationItem.module.css' @@ -23,7 +22,6 @@ export default function ConversationItem({ const [name, setName] = useState(null) const [address, setAddress] = useState(null) - const [image, setImage] = useState(null) useEffect(() => { const getProfile = async () => { @@ -41,10 +39,6 @@ export default function ConversationItem({ } else { setName(accountTruncate(_address)) } - - const profile = await get3BoxProfile(_address, newCancelToken()) - - setImage(profile?.image) } if (conversation && account) { @@ -58,11 +52,7 @@ export default function ConversationItem({ onClick={() => setConversationId(conversation.stream_id)} >
- + {unreads > 0 && (
{unreads}
)} diff --git a/src/components/Profile/Header/index.tsx b/src/components/Profile/Header/index.tsx index ce55ab895..64c085a50 100644 --- a/src/components/Profile/Header/index.tsx +++ b/src/components/Profile/Header/index.tsx @@ -7,8 +7,6 @@ import Account from './Account' import styles from './index.module.css' import { useProfile } from '@context/Profile' import { useOrbis } from '@context/Orbis' -import { Context } from 'urql' -import { filter } from 'lodash' import { sleep } from '@utils/index' const isDescriptionTextClamped = () => { @@ -30,15 +28,7 @@ export default function AccountHeader({ accountId: string }): ReactElement { const { profile } = useProfile() - const { - orbis, - account, - convOpen, - setConvOpen, - conversationId, - setConversationId, - conversations - } = useOrbis() + const { orbis, setConvOpen, setConversationId, conversations } = useOrbis() const [isShowMore, setIsShowMore] = useState(false) const [userDid, setUserDid] = useState() @@ -46,28 +36,6 @@ export default function AccountHeader({ setIsShowMore(!isShowMore) } - const getDid = async () => { - const { data, error } = await orbis.getDids(accountId) - console.log(data) - if (data) { - if (data.length > 0) { - console.log(data[0].did) - setUserDid(data[0].did) - } else if (accountId) { - console.log(accountId) - setUserDid('did:pkh:eip155:1:' + accountId?.toLocaleLowerCase()) - } else { - console.log('try again') - await sleep(1000) - getDid() - } - } - - if (error) { - console.log(error) - } - } - const createConversation = async () => { const res = await orbis.createConversation({ recipients: [userDid], @@ -84,18 +52,32 @@ export default function AccountHeader({ } useEffect(() => { + const getDid = async () => { + const { data, error } = await orbis.getDids(accountId) + console.log(data) + if (data) { + if (data.length > 0) { + console.log(data[0].did) + setUserDid(data[0].did) + } else if (accountId) { + console.log(accountId) + setUserDid('did:pkh:eip155:1:' + accountId?.toLocaleLowerCase()) + } else { + console.log('try again') + await sleep(1000) + getDid() + } + } + + if (error) { + console.log(error) + } + } + if (orbis && accountId) { getDid() - // console.log(userDid) } - }, [accountId]) - - const clickHandler = () => { - console.log(accountId) - console.log(account) - getDid() - createConversation() - } + }, [orbis, accountId]) const checkConversation = () => { const filtered = conversations.filter(