Merge pull request #2 from mykcryptodev/myk/farcaster

Add farcaster text record
fakepixels · Oct 6, 2024 · bdb2317 · bdb2317
2 parents 3e9243c + 02fb2e4
commit bdb2317
Show file tree

Hide file tree

Showing 3 changed files with 47 additions and 0 deletions.
diff --git a/bun.lockb b/bun.lockb
diff --git a/src/components/FarcasterIcon.tsx b/src/components/FarcasterIcon.tsx
@@ -0,0 +1,28 @@
+type Props = {
+  className?: string;
+};
+
+export const FarcasterSocialIcon: React.FC<Props> = ({ className }) => {
+  return (
+    <svg
+      className={className}
+      width="16"
+      height="16"
+      viewBox="0 0 16 16"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="1"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M2.74556 0.5H13.0651V15.5H11.5503V8.67097H11.5354C11.368 6.64539 9.80669 5.05806 7.90533 5.05806C6.00396 5.05806 4.44263 6.64539 4.27521 8.67097H4.26036V15.5H2.74556V0.5Z"
+      />
+      <path
+        d="M0.5 2.27097L1.11539 4.54194H1.63609V13.729C1.37466 13.729 1.16272 13.9601 1.16272 14.2452V14.8645H1.06805C0.806611 14.8645 0.594675 15.0956 0.594675 15.3806V15.5H4.89645V15.3806C4.89645 15.0956 4.68451 14.8645 4.42308 14.8645H4.3284V14.2452C4.3284 13.9601 4.11647 13.729 3.85503 13.729H3.28698V2.27097H0.5Z"
+      />
+      <path
+        d="M12.145 13.729C11.8835 13.729 11.6716 13.9601 11.6716 14.2452V14.8645H11.5769C11.3155 14.8645 11.1036 15.0956 11.1036 15.3806V15.5H15.4053V15.3806C15.4053 15.0956 15.1934 14.8645 14.932 14.8645H14.8373V14.2452C14.8373 13.9601 14.6253 13.729 14.3639 13.729V4.54194H14.8846L15.5 2.27097H12.713V13.729H12.145Z"
+      />
+    </svg>
+  );
+};
diff --git a/src/components/IdentityWrapper.tsx b/src/components/IdentityWrapper.tsx
@@ -9,12 +9,14 @@ import { normalize } from 'viem/ens';
 import { useAccount } from 'wagmi';
 import { publicClient } from '../client';
 import { motion } from 'framer-motion'; // Import framer-motion
+import { FarcasterSocialIcon } from './FarcasterIcon';
 
 export default function IdentityWrapper() {
   const { address } = useAccount();
   const [ensText, setEnsText] = useState<{
     twitter: string | null;
     github: string | null;
+    farcaster: string | null;
     url: string | null;
   } | null>(null);
   const [isOpen, setIsOpen] = useState(false); // State to manage dropdown visibility
@@ -42,6 +44,10 @@ export default function IdentityWrapper() {
             name: normalizedAddress,
             key: 'com.github',
           });
+          const farcasterText = await publicClient.getEnsText({
+            name: normalizedAddress,
+            key: 'xyz.farcaster',
+          });
           const urlText = await publicClient.getEnsText({
             name: normalizedAddress,
             key: 'url',
@@ -54,6 +60,7 @@ export default function IdentityWrapper() {
           const fetchedData = {
             twitter: twitterText,
             github: githubText,
+            farcaster: farcasterText,
             url: urlText,
           };
           setEnsText(fetchedData);
@@ -103,6 +110,18 @@ export default function IdentityWrapper() {
                   {ensText.twitter}
                 </a>
               </div>
+              <div className="mt-2 flex items-center space-x-2">
+                <FarcasterSocialIcon className="h-4 w-4" />
+                <span>Farcaster:</span>
+                <a
+                  href={`https://warpcast.com/${ensText.farcaster}`}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="hover:underline"
+                >
+                  {ensText.farcaster}
+                </a>
+              </div>
               <div className='mt-2 flex items-center space-x-2'>
                 <Github className='h-4 w-4' />
                 <span>Github:</span>