From a7e214ee0f5ca10aa40e14fb0c31b780193e336e Mon Sep 17 00:00:00 2001 From: Elliot Braem <16282460+elliotBraem@users.noreply.github.com> Date: Sat, 5 Oct 2024 21:08:29 -0400 Subject: [PATCH] integrates near-social-js --- package.json | 1 + pnpm-lock.yaml | 17 +++++++ src/components/shared/user-nav.tsx | 75 +++++++++++++++++++++--------- src/lib/social.ts | 37 +++++++++++++++ 4 files changed, 107 insertions(+), 23 deletions(-) create mode 100644 src/lib/social.ts diff --git a/package.json b/package.json index 7806ea2..78b20ab 100644 --- a/package.json +++ b/package.json @@ -32,6 +32,7 @@ ] }, "dependencies": { + "@builddao/near-social-js": "^1.1.0", "@hookform/resolvers": "^3.3.4", "@near-js/providers": "^1.0.0", "@near-wallet-selector/core": "^8.9.7", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 1ab9c27..cb146d3 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -7,6 +7,9 @@ settings: importers: .: dependencies: + '@builddao/near-social-js': + specifier: ^1.1.0 + version: 1.1.0 '@hookform/resolvers': specifier: ^3.3.4 version: 3.9.0(react-hook-form@7.53.0(react@18.3.1)) @@ -1355,6 +1358,13 @@ packages: } engines: { node: '>=6.9.0' } + '@builddao/near-social-js@1.1.0': + resolution: + { + integrity: sha512-HWdzpb30hfHhGSwBwt6h//skrIL7MFcFuIviN8iL90DuH00tkrRRhDidVRkNu2mJ5WU5bOsBPdEd424omvpZkA== + } + engines: { node: '>=18.20.2' } + '@coinbase/wallet-sdk@3.9.3': resolution: { @@ -11790,6 +11800,13 @@ snapshots: '@babel/helper-validator-identifier': 7.25.7 to-fast-properties: 2.0.0 + '@builddao/near-social-js@1.1.0': + dependencies: + bignumber.js: 9.1.2 + near-api-js: 4.0.3 + transitivePeerDependencies: + - encoding + '@coinbase/wallet-sdk@3.9.3': dependencies: bn.js: 5.2.1 diff --git a/src/components/shared/user-nav.tsx b/src/components/shared/user-nav.tsx index 6fe0f83..0269265 100644 --- a/src/components/shared/user-nav.tsx +++ b/src/components/shared/user-nav.tsx @@ -11,29 +11,63 @@ import { DropdownMenuTrigger } from '@/components/ui/dropdown-menu'; import { useWallet } from '@/hooks/use-wallet'; +import { getProfile } from '@/lib/social'; +import { useQuery } from '@tanstack/react-query'; +import { AlertCircle, Loader } from 'lucide-react'; +import { Link } from 'react-router-dom'; export default function UserNav() { const { wallet, signedAccountId } = useWallet(); + const { data, isLoading, isError } = useQuery({ + queryKey: ['profile', signedAccountId], + queryFn: async () => getProfile(signedAccountId), + retry: 3 + }); + + const renderAvatarContent = () => { + if (isLoading) { + return ( +
+ +
+ ); + } + if (isError) { + return ( +
+ +
+ ); + } + return ( + <> + + + {data?.name?.[0] || signedAccountId?.[0] || 'U'} + + + ); + }; return (
-

{'Admin'}

+

+ {`${data?.name}` || 'User'} +

{signedAccountId}

@@ -41,19 +75,14 @@ export default function UserNav() { - - Profile - ⇧⌘P - - - Billing - ⌘B - - - Settings - ⌘S - - New Team + + + Profile + ⇧⌘P + + wallet?.signOut()}> diff --git a/src/lib/social.ts b/src/lib/social.ts new file mode 100644 index 0000000..e80b9f8 --- /dev/null +++ b/src/lib/social.ts @@ -0,0 +1,37 @@ +import { Social } from '@builddao/near-social-js'; +import { NETWORK_ID } from './near'; + +export type Profile = { + name: string; + description: string; + image: { + ipfs_cid: string; + }; + backgroundImage: { + ipfs_cid: string; + }; +}; + +const SOCIAL_CONTRACT = { + mainnet: 'social.near', + testnet: 'v1.social08.testnet' +}; + +const social = new Social({ + contractId: SOCIAL_CONTRACT[NETWORK_ID], + network: NETWORK_ID +}); + +export async function getProfile(username: string): Promise { + const response = await social.get({ + keys: [`${username}/profile/**`] + }); + if (!response) { + return null; + } + const { profile } = (response as Record)[ + username + ]; + + return profile; +}