feat: update twitter verifier params

Author: royweb

UI/layouts/Header/Actions/NFT3Register/form/useForm.ts

@@ -1,7 +1,7 @@
 import { useEffect, useState } from 'react'
 import { useFormik } from 'formik'
 import * as yup from 'yup'
-// import type { ENSTextRecord } from '@nft3sdk/client'
+// import type { ENSTextRecord } from '@rootlabs/client'
 interface ENSTextRecord {
   snapshot: string
   email: string

UI/layouts/Header/Actions/WalletSelect/index.tsx

@@ -4,9 +4,9 @@ import List from '@mui/material/List'
 import ListItem from '@mui/material/ListItem'
 import ListItemText from '@mui/material/ListItemText'
 import ListItemIcon from '@mui/material/ListItemIcon'
-import type { WalletType } from '@nft3sdk/did-manager'
+import type { WalletType } from '@rootlabs/did-manager'
 import { useTheme } from '@mui/material/styles'
-import { useNFT3 } from '@nft3sdk/did-manager'
+import { useROOT } from '@rootlabs/did-manager'
 
 import { useUser } from 'domains/data'
 import { createToastifyPromise } from 'app/utils/promise/toastify'
@@ -57,7 +57,7 @@ const wallets: IWalletItem[] = [
 
 const WalletSelect: FC = () => {
   const theme = useTheme()
-  const { client } = useNFT3()
+  const { client } = useROOT()
   const { selectDialog, selectWallet, login, registerDialog, logout, disconnect } = useUser()
   const onLogout = useCallback(() => {
     logout()

UI/layouts/Header/Search/index.tsx

@@ -8,7 +8,7 @@ import ListItemText from '@mui/material/ListItemText'
 import { TransitionGroup } from 'react-transition-group'
 import Collapse from '@mui/material/Collapse'
 import debounce from '@mui/utils/debounce'
-import { useNFT3 } from '@nft3sdk/did-manager'
+import { useROOT } from '@rootlabs/did-manager'
 
 import { useDialog } from 'app/hooks/useDialog'
 import SearchInput from 'components/input-fields/SearchInput'
@@ -27,7 +27,7 @@ const ROOT = styled('div')`
 
 const Search = () => {
   const router = useRouter()
-  const { client } = useNFT3()
+  const { client } = useROOT()
   const [value, setValue] = useState('')
   const [loading, setLoading] = useState(false)
   const { visible, open, close } = useDialog({

UI/profile-board/Timeline/Actions/index.tsx

@@ -4,7 +4,7 @@ import IconButton from '@mui/material/IconButton'
 import MenuItem from '@mui/material/MenuItem'
 import ListItemText from '@mui/material/ListItemText'
 import MoreVertRoundedIcon from '@mui/icons-material/MoreVertRounded'
-import type { TimelineRecord } from '@nft3sdk/client'
+import type { TimelineRecord } from '@rootlabs/client'
 
 import { safeGet } from 'app/utils/get'
 import { useAnchorMenu } from 'app/hooks/useAnchor'

UI/profile-board/Timeline/Chip.tsx

@@ -3,7 +3,7 @@ import type { StackTypeMap } from '@mui/material/Stack'
 import Stack from '@mui/material/Stack'
 import Chip from '@mui/material/Chip'
 import Box from '@mui/material/Box'
-import type { TimelineRecord } from '@nft3sdk/client'
+import type { TimelineRecord } from '@rootlabs/client'
 import { NETWORK_MAP } from './netwrok'
 
 export const ChipStack: FC<StackTypeMap<{}, 'div'>['props']> = (props) => (

UI/profile-board/Timeline/TimelineCard.tsx

@@ -11,7 +11,7 @@ import { Paragraph, H4, Tiny } from 'components/Typography'
 import { useNFT3Profile, useNFT3, useNFT3Wallet } from 'domains/data'
 import { format as formatData } from 'date-fns'
 import { safeGet } from 'app/utils/get'
-import type { TimelineRecord, TxRecord, POAPRecord } from '@nft3sdk/client'
+import type { TimelineRecord, TxRecord, POAPRecord } from '@rootlabs/client'
 import TokenIcon from '@mui/icons-material/Token'
 import GroupsRoundedIcon from '@mui/icons-material/GroupsRounded'
 import { DisplayNumber } from 'components/Number'

UI/profile/useForm.ts

@@ -3,7 +3,7 @@ import { useCallback, useEffect } from 'react'
 
 import { useFormik } from 'formik'
 import * as yup from 'yup'
-import type { ProfileModel, WithMeta } from '@nft3sdk/client'
+import type { ProfileModel, WithMeta } from '@rootlabs/client'
 
 import { createToastifyPromise } from 'app/utils/promise/toastify'
 import { useNFT3, useNFT3Profile } from 'domains/data'

UI/referral-program/Invitees/Invitee.tsx

@@ -6,7 +6,7 @@ import Stack from '@mui/material/Stack'
 import { useNFT3Social, useUser, useNFT3 } from 'domains/data'
 import { useMount } from 'app/hooks/useMount'
 import { useCallback, useState } from 'react'
-import type { ProfileModel, DIDInfo, WithMeta } from '@nft3sdk/client'
+import type { ProfileModel, WithMeta } from '@rootlabs/client'
 import { getProfile } from 'domains/data/nft3/profile/adapter'
 import Avatar from '@mui/material/Avatar'
 
@@ -26,7 +26,6 @@ const Invitee: FC<{ inviter: ReferrerModel }> = ({ inviter: { createdAt, __owner
   const identifier = __owner
   const [twitter, setTwitter] = useState<any>()
   const [profile, setProfile] = useState<WithMeta<ProfileModel>>({} as any)
-  const [didinfo, setDidinfo] = useState<DIDInfo>()
 
   const updateProfile = useCallback(() => {
     if (!identifier) return
@@ -38,10 +37,7 @@ const Invitee: FC<{ inviter: ReferrerModel }> = ({ inviter: { createdAt, __owner
 
   const updateDidInfo = useCallback(() => {
     if (!identifier) return
-    return client.did.info(identifier).then((didinfo) => {
-      setDidinfo(didinfo)
-    })
-  }, [client.did, identifier])
+  }, [identifier])
 
   const updateTwitter = useCallback(async () => {
     const items = await client.socialAccount.list(identifier)

components/Twitter/BindTwitter/VerifyTwitter/index.tsx

@@ -1,31 +1,35 @@
 import { useState } from 'react'
 import Button from '@mui/material/Button'
+import Input from '@mui/material/Input'
 import FlexBetween from 'components/flexbox/FlexBetween'
 
 import type { StepProps } from '../type'
 
 type VerifyTwitterProps = StepProps & {
-  verify: () => any
+  verify: (link: string) => any
   reset: () => any
 }
 const VerifyTwitter: FC<VerifyTwitterProps> = (props) => {
   const { activeStep, value, verify, reset } = props
   const [loading, setLoading] = useState(false)
+  const [link, setLink] = useState('')
   if (activeStep !== value) return null
+
   return (
-    <FlexBetween>
+    <FlexBetween gap={4}>
       <Button color="inherit" onClick={reset} sx={{ mr: 1 }}>
         Reset
       </Button>
+      <Input placeholder="Tweet link" fullWidth value={link} onChange={(e) => setLink(e.target.value)} />
       <Button
         variant="contained"
         onClick={() => {
           setLoading(true)
-          verify().finally(() => {
+          verify(link).finally(() => {
             setLoading(false)
           })
         }}
-        disabled={loading}
+        disabled={!link || loading}
       >
         Verify
       </Button>

components/Twitter/BindTwitter/index.tsx

@@ -36,18 +36,18 @@ const BindTwitter: FC<BindTwitterProps> = ({ visible, close }) => {
     setActiveStep(0)
   }
 
-  const verify = () => {
-    close()
+  const verify = (link: string) => {
     return createToastifyPromise(
-      twitter.verify(account!, info!.msghash).then((verify) => {
-        if (!verify.result) return Promise.reject()
+      twitter.verify(account!, info!.msghash, link).then((verify) => {
+        close()
+        if (!verify.result) return Promise.reject('Twitter verify failed')
         return twitter
           .add({
             account: account!,
             type: 'twitter',
             proof: verify.proof,
             verifier_key: verify.verifier_key,
-            msghash: info!.msghash,
+            msghash: info!.msghash
           })
           .then(() => {
             setInfo(undefined)

domains/data/nft3/assets/index.ts

@@ -1,7 +1,7 @@
 import { createContext } from 'app/utils/createContext'
 import { useNFT3, useNFT3Profile } from 'domains/data'
 import { useState, useCallback, useEffect } from 'react'
-import type { TokenRecord, OpenseaAssetsRecord, ENSRecord, TimelineRecord, POAPRecord } from '@nft3sdk/client'
+import type { TokenRecord, OpenseaAssetsRecord, ENSRecord, TimelineRecord, POAPRecord } from '@rootlabs/client'
 import { useTimeline } from './timeline'
 
 const useAssetsService = () => {

domains/data/nft3/assets/timeline/index.ts

@@ -1,9 +1,9 @@
 import { useCallback, useEffect, useMemo, useState } from 'react'
-import type { NFT3Queryer, TimelineRecord } from '@nft3sdk/client'
+import type { ROOTQueryer, TimelineRecord } from '@rootlabs/client'
 
 const REQUEST_LIMIT = 10
 type TimelineProps = {
-  queryer: NFT3Queryer
+  queryer: ROOTQueryer
   baseData: TimelineRecord[]
   baseLoading: boolean
   identifier: any

domains/data/nft3/featuredPeoples/index.ts

@@ -24,12 +24,12 @@ const useFeaturedPeoplesService = () => {
             limit,
           },
         })
-        .then((data) => {
+        .then((data: any) => {
           setFeaturedPeoples((featuredPeoples) => {
             return featuredPeoples.concat(
               data.nft3Featured
-                .filter((item) => item && item.profile)
-                .map((item, index) => {
+                .filter((item: any) => item && item.profile)
+                .map((item: any, index: number) => {
                   return {
                     identifier: item.did,
                     name: item.profile.name,

domains/data/nft3/follow/hooks/index.ts

@@ -1,10 +1,10 @@
 import { useCallback, useState } from 'react'
-import { useNFT3 } from '@nft3sdk/did-manager'
+import { useROOT } from '@rootlabs/did-manager'
 import type { FollowMember } from 'components/Follow/types'
 import { useDebounceMemo } from 'app/hooks/useDebounceMemo'
 
 export const useFollow = (identifier: string) => {
-  const { client } = useNFT3()
+  const { client } = useROOT()
   const [count, setCount] = useState({
     following: 0,
     followers: 0,

domains/data/nft3/index.tsx

@@ -1,5 +1,5 @@
 import { useMemo } from 'react'
-import { NFT3Queryer } from '@nft3sdk/client'
+import { ROOTQueryer } from '@rootlabs/client'
 import { createContext } from 'app/utils/createContext'
 
 import useIpfs from './hooks/useIpfs'
@@ -17,7 +17,7 @@ const useNFT3Service = () => {
   const { format, upload } = useIpfs()
 
   const queryer = useMemo(() => {
-    return new NFT3Queryer('https://t0.onebitdev.com/nft3-queryer/')
+    return new ROOTQueryer('https://t0.onebitdev.com/nft3-queryer/')
   }, [])
 
   return {

domains/data/nft3/profile/adapter/index.ts

@@ -1,4 +1,4 @@
-import type { ProfileModel, WithMeta } from '@nft3sdk/client'
+import type { ProfileModel, WithMeta } from '@rootlabs/client'
 
 import { getDefaultProfileAvatar } from './profileAvatar'
 

domains/data/nft3/profile/index.ts

@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useMemo, useState } from 'react'
-import type { ProfileModel, DIDInfo, WithMeta } from '@nft3sdk/client'
+import type { ProfileModel, DIDInfo, WithMeta } from '@rootlabs/client'
 import { createContext } from 'app/utils/createContext'
 import { merge } from 'lodash'
 
@@ -21,14 +21,14 @@ const useProfileService = () => {
   const [profile, setProfileInternal] = useState<WithMeta<ProfileModel>>({} as any)
 
   const updateProfile = useCallback(() => {
-    return client.profile.info(did).then((profile) => {
+    return client.profile.info(did).then((profile: any) => {
       if (!profile) return
       setProfileInternal(getProfile(profile) as any)
     })
   }, [client.profile, did])
 
   const updateDidInfo = useCallback(() => {
-    return client.did.info(did).then((didinfo) => {
+    return client.did.info(did).then((didinfo: any) => {
       setDidinfo(didinfo)
     })
   }, [client.did, did])

domains/data/nft3/referrerStats/index.ts

@@ -25,7 +25,7 @@ const useReferrerStatsService = () => {
             did: identifier,
           },
         })
-        .then((data) => {
+        .then((data: any) => {
           setReferrerStats(data.nft3ReferrerStats)
         })
         .finally(() => {

domains/data/nft3/social/hooks/index.ts

@@ -1,24 +1,28 @@
 import { useCallback, useMemo } from 'react'
-import { useNFT3 } from '@nft3sdk/did-manager'
-import type { NFT3Verifier, SocialAccountModel } from '@nft3sdk/client'
+import { useROOT } from '@rootlabs/did-manager'
+import type { ROOTVerifier, SocialAccountModel } from '@rootlabs/client'
 import type { SocialRecord } from '../types'
 
 type TwitterProps = {
-  verifier: NFT3Verifier
+  verifier: ROOTVerifier
   socials: SocialRecord[]
 }
 
 export const useTwitter = (props: TwitterProps) => {
   const { verifier, socials } = props
-  const { client } = useNFT3()
+  const { client } = useROOT()
   const request = useCallback(() => {
     const info = verifier.requestTwitter()
     return info
   }, [verifier])
 
   const verify = useCallback(
-    async (account: string, msghash: string) => {
-      const result = await verifier.verifyTwitter(account, msghash)
+    async (account: string, msghash: string, link: string) => {
+      const regex = /^https?:\/\/(twitter\.com|x\.com)\/(?:#!\/)?(\w+)\/status(es)?\/(\d+)$/
+      if (regex.test(link) !== true) {
+        throw new Error('Invalid tweet link')
+      }
+      const result = await verifier.verifyTwitter(account, msghash, link)
       return result
     },
     [verifier]

domains/data/nft3/social/hooks/useSocial.ts

@@ -1,15 +1,15 @@
-import { useNFT3 } from '@nft3sdk/did-manager'
-import { NFT3Verifier } from '@nft3sdk/client'
+import { useROOT } from '@rootlabs/did-manager'
+import { ROOTVerifier } from '@rootlabs/client'
 import { useState, useMemo, useCallback, useEffect } from 'react'
 import { useTwitter } from '.'
 import type { SocialRecord } from '../types'
 
 export const useSocial = (did: string) => {
-  const { client } = useNFT3()
+  const { client } = useROOT()
   const [socials, setSocials] = useState<SocialRecord[]>([])
 
   const verifier = useMemo(() => {
-    return new NFT3Verifier(client, 'https://t0.onebitdev.com/nft3-verifier/')
+    return new ROOTVerifier(client, 'https://t0.onebitdev.com/nft3-verifier/')
   }, [client])
 
   const update = useCallback(

domains/data/nft3/social/types/index.ts

@@ -1,4 +1,4 @@
-import type { SocialAccountModel, WithMeta } from '@nft3sdk/client'
+import type { SocialAccountModel, WithMeta } from '@rootlabs/client'
 export interface SocialRecord extends WithMeta<SocialAccountModel> {
   verified: boolean
 }

domains/data/nft3/stats/index.ts

@@ -1,13 +1,13 @@
 import { useCallback, useEffect, useState } from 'react'
-import type { NFT3Stats } from '@nft3sdk/client'
+import type { ROOTStats } from '@rootlabs/client'
 import { createContext } from 'app/utils/createContext'
 import { useNFT3 } from 'domains/data'
 
 const useStatsService = () => {
   const { queryer } = useNFT3()
 
   const [loading, setLoading] = useState(false)
-  const [stats, setStats] = useState<NFT3Stats>({} as any)
+  const [stats, setStats] = useState<ROOTStats>({} as any)
 
   const request = useCallback(
     () => {
@@ -17,8 +17,8 @@ const useStatsService = () => {
         .query({
           nft3Stats: {},
         })
-        .then((data) => {
-          setStats(data.nft3Stats)
+        .then((data: any) => {
+          setStats(data.ROOTStats)
         })
         .finally(() => {
           setLoading(false)

domains/data/nft3/wallet/index.ts

@@ -1,7 +1,7 @@
 import { createContext } from 'app/utils/createContext'
 import { useState, useEffect, useCallback, useMemo } from 'react'
 import { useNFT3Profile, useUser } from 'domains/data'
-import { useNFT3 } from '@nft3sdk/did-manager'
+import { useROOT } from '@rootlabs/did-manager'
 import { safeGet } from 'app/utils/get'
 import ETHImg from 'public/eth.svg'
 import SolanaImg from 'public/solana.svg'
@@ -14,7 +14,7 @@ import AptosImg from 'public/aptos.svg'
 import type { AccountRecord } from './types'
 
 const useWalletService = () => {
-  const { client } = useNFT3()
+  const { client } = useROOT()
   const { account } = useUser()
   const { isUser, didinfo, didname, updateDidInfo } = useNFT3Profile()
   const [value, setValue] = useState('')