Hadi/fix efp poap (#77)

* feat: basic but need to move to js sdk * feat: chat and getting the messages * fix: tabs css * feat: working on chat * feat: finalizing xmtp widget * fix: message textfield fix when replying * fix: xmtp build * fix: efp poap --------- Co-authored-by: anthony2399 <[email protected]>
JustaName-id · Nov 28, 2024 · aa71418 · aa71418
1 parent 519c83b
commit aa71418
Show file tree

Hide file tree

Showing 8 changed files with 55 additions and 24 deletions.
diff --git a/packages/@justaname.id/react/package.json b/packages/@justaname.id/react/package.json
@@ -2,7 +2,7 @@
   "name": "@justaname.id/react",
   "version": "0.3.147",
   "dependencies": {
-    "@ensdomains/ensjs": "4.0.1-alpha.0",
+    "@ensdomains/ensjs": "4.0.2",
     "@justaname.id/sdk": "0.2.144",
     "axios": "^1.6.0",
     "qs": "^6.12.0"

diff --git a/packages/@justaname.id/react/src/lib/hooks/records/useStandardRecordsBatch.ts b/packages/@justaname.id/react/src/lib/hooks/records/useStandardRecordsBatch.ts
@@ -162,7 +162,7 @@ export const useStandardRecordsBatch = (
     ensRecords.forEach((result, index) => {
       if (result) {
         const record = {
-          ens: checkMissing[index],
+          ens: nonJanEns[index],
           isJAN: result.resolverAddress === offchainResolver?.resolverAddress,
           records: {
             ...result,
@@ -177,12 +177,12 @@ export const useStandardRecordsBatch = (
 
         const sanitized = sanitizeRecords(record);
 
-        recordsBatch[checkMissing[index]] = {
+        recordsBatch[nonJanEns[index]] = {
           ...record,
           sanitizedRecords: sanitized,
         };
       } else {
-        recordsBatch[checkMissing[index]] = undefined;
+        recordsBatch[nonJanEns[index]] = undefined;
       }
     });
 

diff --git a/packages/@justweb3/efp-plugin/src/lib/components/EFPTab/index.tsx b/packages/@justweb3/efp-plugin/src/lib/components/EFPTab/index.tsx
@@ -6,15 +6,16 @@ import { FollowersTab } from '../FollowersTab';
 
 export interface EFPTabProps {
   ens: string;
+  address: string;
 }
 
-export const EFPTab: FC<EFPTabProps> = ({ ens }) => {
+export const EFPTab: FC<EFPTabProps> = ({ ens, address }) => {
   const [tab, setTab] = useState<
     'following' | 'followers' | 'none' | 'loading'
   >('loading');
 
   const { stats, isStatsLoading } = useStats({
-    addressOrEns: ens,
+    addressOrEns: address,
   });
 
   useEffect(() => {
@@ -150,9 +151,9 @@ export const EFPTab: FC<EFPTabProps> = ({ ens }) => {
         </button>
       </Flex>
 
-      {tab === 'following' && <FollowingTab ens={ens} />}
+      {tab === 'following' && <FollowingTab ens={ens} address={address} />}
 
-      {tab === 'followers' && <FollowersTab ens={ens} />}
+      {tab === 'followers' && <FollowersTab ens={ens} address={address} />}
 
       {tab === 'none' && (
         <Flex

diff --git a/packages/@justweb3/efp-plugin/src/lib/components/FollowButton/index.tsx b/packages/@justweb3/efp-plugin/src/lib/components/FollowButton/index.tsx
@@ -6,16 +6,17 @@ import { useFollowState } from '../../hooks/useFollowState';
 
 interface FollowButtonProps {
   ens: string;
+  address: string;
 }
 
-export const FollowButton: React.FC<FollowButtonProps> = ({ ens }) => {
-  const { address } = useMountedAccount();
+export const FollowButton: React.FC<FollowButtonProps> = ({ ens, address }) => {
+  const { address: ownAddress } = useMountedAccount();
   const { followState, isFollowStateLoading } = useFollowState({
     addressOrEns1: address,
-    addressOrEns2: ens,
+    addressOrEns2: ownAddress,
   });
 
-  if (!address) {
+  if (!ownAddress) {
     return (
       <a
         href={'https://ethfollow.xyz/' + ens}

diff --git a/packages/@justweb3/efp-plugin/src/lib/components/FollowersTab/index.tsx b/packages/@justweb3/efp-plugin/src/lib/components/FollowersTab/index.tsx
@@ -9,8 +9,9 @@ import {
 
 export interface FollowersTabProps {
   ens: string;
+  address: string;
 }
-export const FollowersTab: React.FC<FollowersTabProps> = ({ ens }) => {
+export const FollowersTab: React.FC<FollowersTabProps> = ({ ens, address }) => {
   const [nbOfCardsPerFollowersRow, setNbOfCardsPerFollowersRow] = useState(0);
   const followingContainerRef = useRef<HTMLDivElement>(null);
   const {
@@ -20,7 +21,7 @@ export const FollowersTab: React.FC<FollowersTabProps> = ({ ens }) => {
     isFollowersFetching,
     hasMoreFollowers,
   } = useFollowers({
-    addressOrEns: ens,
+    addressOrEns: address,
   });
 
   const followingFlat = useMemo(() => {
@@ -95,7 +96,7 @@ export const FollowersTab: React.FC<FollowersTabProps> = ({ ens }) => {
     >
       {followingFlat?.map((follow) => (
         <div
-          key={`display-following-members-${ens}-${follow.address}`}
+          key={`display-following-members-${ens}-${address}-${follow.address}`}
           style={{
             minWidth: '335px',
             flex: 1,
@@ -138,7 +139,7 @@ export const FollowersTab: React.FC<FollowersTabProps> = ({ ens }) => {
           },
           (_, i) => (
             <div
-              key={`display-following-members-${ens}-${i}`}
+              key={`display-following-members-${ens}-${address}-${i}`}
               style={{
                 minWidth: '335px',
                 flex: 1,

diff --git a/packages/@justweb3/efp-plugin/src/lib/components/FollowingTab/index.tsx b/packages/@justweb3/efp-plugin/src/lib/components/FollowingTab/index.tsx
@@ -9,8 +9,9 @@ import {
 
 export interface FollowingTabProps {
   ens: string;
+  address: string;
 }
-export const FollowingTab: React.FC<FollowingTabProps> = ({ ens }) => {
+export const FollowingTab: React.FC<FollowingTabProps> = ({ ens, address }) => {
   const [nbOfCardsPerFollowingRow, setNbOfCardsPerFollowingRow] = useState(0);
   const followingContainerRef = useRef<HTMLDivElement>(null);
   const {
@@ -20,7 +21,7 @@ export const FollowingTab: React.FC<FollowingTabProps> = ({ ens }) => {
     isFollowingFetching,
     hasMoreFollowing,
   } = useFollowing({
-    addressOrEns: ens,
+    addressOrEns: address,
   });
 
   const followingFlat = useMemo(() => {
@@ -95,7 +96,7 @@ export const FollowingTab: React.FC<FollowingTabProps> = ({ ens }) => {
     >
       {followingFlat?.map((follow) => (
         <div
-          key={`display-following-members-${ens}-${follow.data}`}
+          key={`display-following-members-${ens}-${address}-${follow.data}`}
           style={{
             minWidth: '335px',
             flex: 1,
@@ -138,7 +139,7 @@ export const FollowingTab: React.FC<FollowingTabProps> = ({ ens }) => {
           },
           (_, i) => (
             <div
-              key={`display-following-members-${ens}-${i}`}
+              key={`display-following-members-${ens}-${address}-${i}`}
               style={{
                 minWidth: '335px',
                 flex: 1,

diff --git a/packages/@justweb3/efp-plugin/src/lib/plugins/index.tsx b/packages/@justweb3/efp-plugin/src/lib/plugins/index.tsx
@@ -5,22 +5,22 @@ import { EFPTab } from '../components/EFPTab';
 export const EFPPlugin: JustaPlugin = {
   name: 'EFPPlugin',
   components: {
-    ProfileTab: (pluginApi, ens, chainId) => {
+    ProfileTab: (pluginApi, ens, chainId, address) => {
       if (chainId !== 1) {
         return undefined;
       }
 
       return {
         title: 'EFP',
-        content: <EFPTab ens={ens} />,
+        content: <EFPTab ens={ens} address={address} />,
       };
     },
     ProfileHeader: (pluginApi, ens, chainId, address) => {
       if (chainId !== 1) {
         return null;
       }
 
-      return <FollowButton ens={ens} />;
+      return <FollowButton ens={ens} address={address} />;
     },
   },
 };
diff --git a/yarn.lock b/yarn.lock
@@ -2082,6 +2082,26 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@ensdomains/ensjs@npm:4.0.2":
+  version: 4.0.2
+  resolution: "@ensdomains/ensjs@npm:4.0.2"
+  dependencies:
+    "@adraffy/ens-normalize": "npm:1.10.1"
+    "@ensdomains/address-encoder": "npm:1.1.1"
+    "@ensdomains/content-hash": "npm:3.1.0-rc.1"
+    "@ensdomains/dnsprovejs": "npm:^0.5.1"
+    abitype: "npm:^1.0.0"
+    dns-packet: "npm:^5.3.1"
+    graphql: "npm:^16.3.0"
+    graphql-request: "npm:6.1.0"
+    pako: "npm:^2.1.0"
+    ts-pattern: "npm:^5.4.0"
+  peerDependencies:
+    viem: ^2.9.2
+  checksum: 10c0/6c11ed790a482920f229078feeebdde0a96598fe17968660abdc780b8c0f02558ab2feaad784746952383ef9541988b46002c83cfc7e02000e683b2e40cadf65
+  languageName: node
+  linkType: hard
+
 "@esbuild/aix-ppc64@npm:0.19.12":
   version: 0.19.12
   resolution: "@esbuild/aix-ppc64@npm:0.19.12"
@@ -4517,7 +4537,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@justaname.id/react@workspace:packages/@justaname.id/react"
   dependencies:
-    "@ensdomains/ensjs": "npm:4.0.1-alpha.0"
+    "@ensdomains/ensjs": "npm:4.0.2"
     "@justaname.id/sdk": "npm:0.2.144"
     axios: "npm:^1.6.0"
     jest: "npm:^29.4.1"
@@ -37333,6 +37353,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"ts-pattern@npm:^5.4.0":
+  version: 5.5.0
+  resolution: "ts-pattern@npm:5.5.0"
+  checksum: 10c0/4ae1fbeadcf193e72b27419d5fe71f559c100e45710eabf29e2ff3a8fa9ba29adfcd6d5d7d8169b95e2b264683a2eb8d94dbd3c893357b045b52b0c34c2b7c72
+  languageName: node
+  linkType: hard
+
 "tsconfig-paths-webpack-plugin@npm:4.0.0":
   version: 4.0.0
   resolution: "tsconfig-paths-webpack-plugin@npm:4.0.0"