Merge pull request #18 from 1Hive/fix/embed-integration-polish

Fix embed prompt: stop treating an unverified board as nonexistent

Author: pglavin2

frontend/app/api/streaming/leaderboards/route.ts

@@ -81,20 +81,28 @@ export async function GET(request: Request) {
       return results.flat()
     }
 
+    // topMarkee()/topRate() -- the contract's own ENFORCED top, not getTopMarkees(1), which ranks
+    // live by current aggregate rate. Those two diverge whenever ranking has drifted (someone's rate
+    // just increased and outranks the enforced #1, but claimTop() hasn't run yet to promote them --
+    // the streaming-keeper cron heals this periodically, it isn't instantaneous). Using getTopMarkees
+    // here meant this API -- and everything downstream of it (marketplace, hero cards, embeds) --
+    // could report a "top message" that wasn't actually the one being paid, which is what the
+    // contract's own topMarkee/topRate state actually governs.
     const metaCalls = addresses.flatMap(addr => [
       { address: addr, abi: StreamingLeaderboardABI, functionName: 'leaderboardName' as const },
       { address: addr, abi: StreamingLeaderboardABI, functionName: 'totalLeaderboardFunds' as const },
       { address: addr, abi: StreamingLeaderboardABI, functionName: 'markeeCount' as const },
       { address: addr, abi: StreamingLeaderboardABI, functionName: 'beneficiaryAddress' as const },
       { address: addr, abi: StreamingLeaderboardABI, functionName: 'admin' as const },
-      { address: addr, abi: StreamingLeaderboardABI, functionName: 'getTopMarkees' as const, args: [1n] },
+      { address: addr, abi: StreamingLeaderboardABI, functionName: 'topMarkee' as const },
+      { address: addr, abi: StreamingLeaderboardABI, functionName: 'topRate' as const },
     ])
-    const CALLS_PER_BOARD = 6
+    const CALLS_PER_BOARD = 7
     const metaResults = await chunkedMulticall(metaCalls as Parameters<typeof client.multicall>[0]['contracts'])
 
     const topMarkeeAddresses: (`0x${string}` | null)[] = addresses.map((_, i) => {
-      const topResult = metaResults[i * CALLS_PER_BOARD + 5]?.result as [string[], bigint[]] | undefined
-      return (topResult?.[0]?.[0] ?? null) as `0x${string}` | null
+      const addr = metaResults[i * CALLS_PER_BOARD + 5]?.result as `0x${string}` | undefined
+      return addr && addr !== '0x0000000000000000000000000000000000000000' ? addr : null
     })
 
     const markeeCalls = topMarkeeAddresses.flatMap(addr =>
@@ -151,8 +159,8 @@ export async function GET(request: Request) {
       const markeeCount = (metaResults[b + 2]?.result as bigint) ?? 0n
       const beneficiary = (metaResults[b + 3]?.result as string) ?? ''
       const admin       = (metaResults[b + 4]?.result as string) ?? ''
-      const topResult   = metaResults[b + 5]?.result as [string[], bigint[]] | undefined
-      const topRate     = topResult?.[1]?.[0] ?? 0n
+      // b + 5 is topMarkee() (already extracted into topMarkeeAddresses above); b + 6 is topRate().
+      const topRate     = (metaResults[b + 6]?.result as bigint) ?? 0n
 
       let topMessage: string | null = null
       let topMessageOwner: string | null = null

frontend/app/marketplace/page.tsx

@@ -57,7 +57,7 @@ interface Leaderboard {
   isLegacy?: boolean
   // Populated for boards with no inherent platform tag (the shared "For Sale" factory) so Served On
   // can be derived from actual verification instead of a creation-time tag.
-  linkedFiles?: { verified: boolean }[]
+  linkedFiles?: { verified: boolean; repoOwner?: string; repoFullName?: string }[]
 }
 
 // ── Helpers ───────────────────────────────────────────────────────────────────
@@ -71,15 +71,22 @@ function extractDomain(url: string): string {
   try { return new URL(url).hostname.replace(/^www\./, '') } catch { return url }
 }
 
+// GitHub-served boards show the repo org (matching ServedOnCell on /markee/[address]), not a flat
+// "GitHub" label -- falls back to that only if the verified linked file's repoOwner isn't available.
+function verifiedGithubOwner(lb: Leaderboard): string | null {
+  return (lb.linkedFiles ?? []).find(f => f.verified)?.repoOwner ?? null
+}
+
 function servedOnLabel(lb: Leaderboard): string {
-  if (lb.platform === 'github') return 'GitHub'
   if (lb.platform === 'superfluid') return 'Superfluid'
   if (lb.verifiedUrl) {
     const domain = extractDomain(lb.verifiedUrl)
     const extra = (lb.verifiedUrls?.length ?? 1) - 1
     return extra > 0 ? `${domain} +${extra}` : domain
   }
-  if ((lb.linkedFiles ?? []).some(f => f.verified)) return 'GitHub'
+  const githubOwner = verifiedGithubOwner(lb)
+  if (githubOwner) return githubOwner
+  if (lb.platform === 'github' || (lb.linkedFiles ?? []).some(f => f.verified)) return 'GitHub'
   return lb.leaderboardName || lb.address.slice(0, 8) + '...'
 }
 

frontend/components/StreamingBoardDetail.tsx

@@ -147,10 +147,21 @@ export function StreamingBoardDetail({ board }: { board: Address }) {
       .finally(() => setViewsFetching(false))
   }, [markeeAddrKey])
 
+  // The board's ENFORCED top (topMarkee()/topRate(), via useTopSince) can differ from markees[0] --
+  // markees is ordered by getTopMarkees, a LIVE ranking by current rate, while the contract only
+  // actually promotes a new #1 (and starts streaming to them) once claimTop() runs, which the
+  // streaming-keeper cron does periodically, not instantly. Using markees[0] here meant the hero
+  // card (and the row highlighted as "featured" below) could show a message that looked like it was
+  // winning by current rate but wasn't actually the one being paid. Falls back to markees[0] only
+  // while topSince is still loading, so the hero isn't blank on first paint.
+  const enforcedTopMarkee = topSince
+    ? markees.find(m => m.address.toLowerCase() === topSince.address.toLowerCase()) ?? markees[0]
+    : markees[0]
+
   // Track + increment a view for the top message, mirroring the fixed reader. The POST both
   // increments (rate-limited per IP server-side) and returns the current total for display.
-  const topAddress = markees[0]?.address
-  const topMessage = markees[0]?.message
+  const topAddress = enforcedTopMarkee?.address
+  const topMessage = enforcedTopMarkee?.message
   useEffect(() => {
     if (!topAddress || !topMessage) return
     fetch('/api/views', {
@@ -167,11 +178,11 @@ export function StreamingBoardDetail({ board }: { board: Address }) {
       .catch(() => {})
   }, [topAddress, topMessage])
 
-  const topMarkee = markees[0] ?? null
+  const topMarkee = enforcedTopMarkee ?? null
   const topViews = topMarkee ? (viewsMap.get(topMarkee.address.toLowerCase()) ?? 0) : 0
   // "Total views" in the metrics bar is every message on this board, not just the current top one.
   const totalViewsSum = Array.from(viewsMap.values()).reduce((sum, v) => sum + v, 0)
-  const topMonthlyWei = markees[0]?.rate ? ratePerSecToMonthly(markees[0].rate) : undefined
+  const topMonthlyWei = enforcedTopMarkee?.rate ? ratePerSecToMonthly(enforcedTopMarkee.rate) : undefined
 
   const streamedEthLabel = `${streamedEth.toFixed(6)} ETH`
   // Same "digit visibly ticks ~1x/sec" derivation as the claim card, applied to the USD display --
@@ -299,7 +310,11 @@ export function StreamingBoardDetail({ board }: { board: Address }) {
                       key={m.address}
                       markee={m}
                       rank={i + 1}
-                      featured={i === 0}
+                      // Highlight the ENFORCED top (topSince.address, from topMarkee()), not just
+                      // whichever row currently ranks first by live rate -- see enforcedTopMarkee
+                      // above for why those can differ. Falls back to position 0 only while topSince
+                      // is still loading, so some row is highlighted on first paint.
+                      featured={topSince ? topSince.address.toLowerCase() === m.address.toLowerCase() : i === 0}
                       board={board}
                       boardAdmin={meta?.admin}
                       topSince={topSince}

frontend/components/board-detail/shared.tsx

@@ -1515,6 +1515,15 @@ Then fetch /api/markee/leaderboards in the trigger component.
 Find the entry where address matches "${address}" (case-insensitive).
 Fields: topMessage, topMessageOwner, topFundsAddedRaw, minimumPrice, topMarkeeAddress
 
+This is the PUBLIC marketplace listing -- it only includes leaderboards that have completed Markee's
+own "Verify Embed" check, as a spam filter for the public listing, not a directory of every
+leaderboard that exists. A brand-new integration's address will not appear here yet -- that's
+expected, not a sign the address is wrong. Have the trigger component fall back to a "be first!"
+empty state when there's no match, not an error, and build the rest of this flow regardless.
+Verification itself only checks that the data-markee-address attribute is present in your
+server-rendered HTML (see the implementation notes below) -- it doesn't depend on this fetch
+succeeding. Once verified, this same code starts resolving real data automatically.
+
 ### On-chain reads
 Use wagmi useReadContract / useReadContracts for:
 - minimumPrice, maxMessageLength (in both components or passed as props)

frontend/lib/embedPrompt/fragments.ts

@@ -36,14 +36,9 @@ const FRAMEWORK_LABEL: Record<EmbedFramework, string> = {
 }
 
 // ── Core identity ─────────────────────────────────────────────────────────────
-// The canonical-reference line is a deliberate steal from logo.dev's own quickstart prompt: a
-// cheap hedge against exactly the kind of drift that prompted this rewrite in the first place.
 export function coreIdentityFragment({ address, name, buyUrl }: { address: string; name?: string; buyUrl: string }): string {
   const displayName = name || address
-  return `> **Canonical reference:** https://markee.xyz/docs
-> If anything below is outdated or contradicts the live contracts/API, fetch that URL first -- it is the source of truth. Tell me if something looks stale.
-
-# Markee embed setup
+  return `# Markee embed setup
 
 Markee is a protocol where anyone can pay ETH to set the featured message on a leaderboard. The highest total funder holds the top spot; anyone can outbid them to take it.
 
@@ -52,7 +47,18 @@ My leaderboard:
 - Address: ${address}
 - Fallback buy page (works from anywhere, not required for the embedded flow below): ${buyUrl}
 
-Build a fully embedded flow -- visitors buy, edit, and add funds to messages without ever leaving this site. Do not fall back to an iframe.`
+Build a fully embedded flow -- visitors buy, edit, and add funds to messages without ever leaving this site. Do not fall back to an iframe.
+
+**Before you conclude something is wrong, read this:** https://markee.xyz/api/ecosystem/leaderboards is
+the PUBLIC marketplace listing, and it deliberately only includes leaderboards that have completed
+Markee's own "Verify Embed" check -- it's a spam filter for the public listing, not a directory of
+every leaderboard that exists. A brand-new integration's address will not appear there yet, and that
+is expected, not a sign the address is wrong or stale. Build against the address above regardless --
+don't treat its absence from that endpoint as a reason to stop or ask before writing any code. Verification
+itself only checks that \`data-markee-address\` is present in your server-rendered HTML (see the
+implementation notes at the end of this prompt); it does not depend on this fetch succeeding. Once
+verified, the same code you're about to write starts resolving real data automatically -- nothing
+needs to change or redeploy.`
 }
 
 // ── Trigger card & brand watermark ─────────────────────────────────────────────
@@ -276,7 +282,7 @@ export function strategyFragment(strategy: EmbedStrategy, address: string): stri
 const PUBLIC_API_URL = 'https://markee.xyz/api/ecosystem/leaderboards'
 
 export function proxyRouteFragment(framework: EmbedFramework, address: string): string {
-  const commonNote = `Browser fetches to markee.xyz are blocked by CORS on most setups, so this needs a server-side hop. Find your leaderboard by matching \`address\` (case-insensitive) against "${address}" in the response. Useful fields: \`topMessage\`, \`topMessageOwner\`, \`topFundsAddedRaw\`, \`minimumPrice\` (fixed) / \`streamedRateRaw\` (streaming), \`topMarkeeAddress\`.`
+  const commonNote = `Browser fetches to markee.xyz are blocked by CORS on most setups, so this needs a server-side hop. Find your leaderboard by matching \`address\` (case-insensitive) against "${address}" in the response. Useful fields: \`topMessage\`, \`topMessageOwner\`, \`topFundsAddedRaw\`, \`minimumPrice\` (fixed) / \`streamedRateRaw\` (streaming), \`topMarkeeAddress\`. No match yet is expected for a brand-new, not-yet-verified leaderboard (see the note near the top of this prompt) -- have the trigger component fall back to a "be first!" empty state in that case, not an error.`
 
   if (framework === 'nextjs') {
     return `## Data fetching