Introduce Warpcast support

.github/.k8s/deploy.yaml

@@ -0,0 +1,23 @@
+# Kubernetes Deployment of ghcr.io/v3xlabs/ens-page:sha-422fabf exposing port 3000 over a service
+apiVersion: apps/v1
+kind: Deployment
+metadata:
+  name: ens-page
+  namespace: default
+spec:
+  replicas: 1
+  selector:
+    matchLabels:
+      run: ens-page
+  template:
+    metadata:
+      labels:
+        run: ens-page
+    spec:
+      containers:
+        - name: ens-page
+          image: ghcr.io/v3xlabs/ens-page:latest
+          imagePullPolicy: Always
+          ports:
+            - containerPort: 3000
+          resources: {}

.github/.k8s/ingress.yaml

@@ -0,0 +1,25 @@
+
+apiVersion: networking.k8s.io/v1
+kind: Ingress
+metadata:
+  name: ens-page
+  namespace: default
+  annotations:
+    cert-manager.io/cluster-issuer: le-http
+spec:
+  ingressClassName: traefik
+  rules:
+    - host: ens.page
+      http:
+        paths:
+          - path: /
+            pathType: Prefix
+            backend:
+              service:
+                name: ens-page
+                port:
+                  number: 3000
+  tls:
+    - hosts:
+        - ens.page
+      secretName: tls-ens-page-ingress-http

.github/.k8s/svc.yaml

@@ -0,0 +1,13 @@
+apiVersion: v1
+kind: Service
+metadata:
+  name: ens-page
+  namespace: default
+spec:
+  ports:
+    - port: 3000
+      protocol: TCP
+      targetPort: 3000
+  selector:
+    run: ens-page
+  type: ClusterIP

app/[slug]/page.tsx

@@ -5,6 +5,7 @@ import { FaTelegram } from 'react-icons/fa';
 import { FiGithub, FiLink, FiTwitter } from 'react-icons/fi';
 
 import { useEnstate } from '../../hooks/useEnstate';
+import { useWarpcast } from '../../hooks/useWarpcast';
 
 const Button: FC<PropsWithChildren<{ href: string }>> = ({
     children,
@@ -84,9 +85,10 @@ export default async function ({
         throw new Error('Invalid ENS name');
     }
 
-    // if (!name.match(/^[a-z0-9-.]+$/)) {
-
-    const data = await useEnstate(name);
+    const [enstate, farcaster] = await Promise.all([
+        useEnstate(name),
+        useWarpcast(name),
+    ]);
 
     return (
         <div className="mx-auto w-full max-w-md flex flex-col gap-8 mt-4 lg:mt-10 px-6 py-8">
@@ -102,7 +104,7 @@ export default async function ({
                 <div className="flex items-center relative w-full pt-8">
                     <div className="mx-auto w-40 h-40 aspect-square border bg-white rounded-full overflow-hidden">
                         <img
-                            src={data.avatar}
+                            src={enstate.avatar}
                             alt="profile"
                             className="w-full h-full"
                         />
@@ -117,17 +119,29 @@ export default async function ({
                 </div>
                 <div className="text-center px-2 py-2 space-y-2">
                     <div className="text-3xl font-extrabold text-center">
-                        {data.name}
+                        {enstate.name}
                     </div>
-                    {data.records.description && (
-                        <div>{data.records.description}</div>
+                    {enstate.records.description && (
+                        <div>{enstate.records.description}</div>
                     )}
                 </div>
             </div>
             <div className="flex flex-col gap-4">
-                {Object.keys(data.records)
-                    .map((key) => buttonControls(key, data.records[key]))
+                {Object.keys(enstate.records)
+                    .map((key) => buttonControls(key, enstate.records[key]))
                     .filter(Boolean)}
+                {farcaster && farcaster.result && (
+                    <Button
+                        href={`https://warpcast.com/${farcaster.result.user.username}`}
+                    >
+                        <img
+                            src="/warpcaster.svg"
+                            alt="warpcaster"
+                            style={{ height: '1em', width: '1em' }}
+                        ></img>
+                        Message on Farcaster
+                    </Button>
+                )}
                 <Button href={'https://ens.app/' + name}>
                     <div
                         className="bg-white"

hooks/useWarpcast.ts

@@ -0,0 +1,54 @@
+type WarpcastProfile = {
+    fid: number;
+    username: string;
+    displayName: string;
+    pfp: {
+        url: string;
+        verified: boolean;
+    };
+    profile: {
+        bio: {
+            text: string;
+            mentions: [];
+        };
+        location: {
+            placeId: string;
+            description: string;
+        };
+    };
+    followerCount: number;
+    followingCount: number;
+    activeOnFcNetwork: boolean;
+    referrerUsername: string;
+    viewerContext: {
+        following: boolean;
+        followedBy: boolean;
+        canSendDirectCasts: boolean;
+        hasUploadedInboxKeys: boolean;
+    };
+};
+
+type WarpcastResponse = {
+    result?: {
+        user: WarpcastProfile;
+        inviter: WarpcastProfile;
+        inviterIsReferrer: boolean;
+        collectionsOwned: [];
+    };
+};
+
+export const useWarpcast = async (name: string): Promise<WarpcastResponse> => {
+    try {
+        const request = await fetch(
+            `https://client.warpcast.com/v2/user-by-username?username=${name}`
+        );
+
+        const response: WarpcastResponse = await request.json();
+
+        return response;
+    } catch {
+        //
+    }
+
+    return { result: undefined };
+};