added sharing on farcaster

Author: bzzzzzzzzzzzzz

packages/nextjs/app/api/opengraph-image/route.tsx

@@ -16,7 +16,7 @@ export async function GET() {
           </div>
         )} */}
         <h1 tw="text-8xl text-white">THE RANKR APP!</h1>
-        <p tw="text-5xl mt-4 text-white opacity-80">(by Romi, Noad & Diana)</p>
+        <p tw="text-5xl mt-4 text-white opacity-80">(by Romi & Noad)</p>
       </div>
     ),
     {

packages/nextjs/app/page.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { useCallback, useEffect, useMemo, useState } from "react";
+import { sdk } from "@farcaster/miniapp-sdk";
 import type { NextPage } from "next";
 import { formatEther, parseEther } from "viem";
 import { useAccount } from "wagmi";
@@ -185,6 +186,11 @@ const Home: NextPage = () => {
     [writeRank5],
   );
 
+  // After your app is fully loaded and ready to display
+  useEffect(() => {
+    sdk.actions.ready();
+  }, []);
+
   // All hooks above this point; render based on connection state below
 
   if (!connectedAddress) {

packages/nextjs/app/share/[fid]/page.tsx

@@ -13,7 +13,7 @@ export async function generateMetadata({ params }: { params: Promise<{ fid: stri
   const imageUrl = `${APP_URL}/api/opengraph-image?fid=${fid}`;
 
   return {
-    title: `${APP_NAME} - Share`,
+    title: `${APP_NAME} - Rank Your Songs!`,
     openGraph: {
       title: APP_NAME,
       description: APP_DESCRIPTION,

packages/nextjs/components/ui/ShareButton.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { useCallback, useMemo, useState } from "react";
+import sdk from "@farcaster/miniapp-sdk";
 import { buildShareUrl } from "~~/lib/share";
 
 type ShareIntent = {
@@ -27,21 +28,10 @@ const ShareButton: React.FC<ShareButtonProps> = ({ label = "Share", className =
   const handleShare = useCallback(async () => {
     try {
       setIsSharing(true);
-      const text = intent.text;
-      const url = targetEmbed;
-
-      // Prefer Web Share API if available (nice UX on mobile)
-      if (typeof window !== "undefined" && (navigator as any).share) {
-        await (navigator as any).share({ text, url });
-        return;
-      }
-
-      // Fallback: open Warpcast composer with prefilled text
-      const params = new URLSearchParams();
-      params.set("text", text);
-      if (url) params.set("embeds[]", url);
-      const warpUrl = `https://warpcast.com/~/compose?${params.toString()}`;
-      window.open(warpUrl, "_blank", "noopener,noreferrer");
+      await sdk.actions.composeCast({
+        text: "Rank these songs! 🚀",
+        embeds: [`https://blockboom-nextjs.vercel.app/share/dummy_fid`],
+      });
     } catch (err) {
       console.error("Share failed", err);
     } finally {