re-enable Proofmode tag parsing and "Human Made" badge and filtering

Author: n8fr8

src/components/ProofModeBadge.tsx

@@ -1,4 +1,4 @@
-// ABOUTME: Badge component for displaying ProofMode verification status
+// ABOUTME: Badge component for displaying Proofmode verification status
 // ABOUTME: Shows different icons and colors based on verification level with detailed tooltip
 
 import { useState } from 'react';
@@ -153,17 +153,17 @@ function getProofModeConfig(level: ProofModeLevel) {
         label: 'Human Made',
         className: 'border-brand-green text-brand-dark-green dark:text-brand-green bg-brand-light-green dark:bg-brand-dark-green',
         iconColor: 'text-brand-dark-green dark:text-brand-green',
-        tooltip: 'Human made - captured on secure mobile device with ProofMode',
-        description: 'This video was captured by a human on a mobile device with hardware-backed security attestation. ProofMode provides cryptographic proof that the content is authentic and has not been tampered with.'
+        tooltip: 'Human made - captured on secure mobile device with Proofmode',
+        description: 'This video was captured by a human on a mobile device with hardware-backed security attestation. Proofmode provides cryptographic proof that the content is authentic and has not been tampered with.'
       };
     case 'verified_web':
       return {
         icon: HumanMadeIcon,
         label: 'Human Made',
         className: 'border-brand-blue text-brand-blue-dark dark:text-brand-blue bg-brand-blue-light dark:bg-brand-blue-dark',
         iconColor: 'text-brand-blue-dark dark:text-brand-blue',
-        tooltip: 'Human made - valid ProofMode signature',
-        description: 'This video was created by a human and has been cryptographically signed with ProofMode. The signature confirms the content has not been altered since creation.'
+        tooltip: 'Human made - valid Proofmode signature',
+        description: 'This video was created by a human and has been cryptographically signed with Proofmode. The signature confirms the content has not been altered since creation.'
       };
     case 'basic_proof':
       return {

src/components/VideoFeed.tsx

@@ -10,6 +10,7 @@ import { AddToListDialog } from '@/components/AddToListDialog';
 import { useVideoProvider } from '@/hooks/useVideoProvider';
 import { useBatchedAuthors } from '@/hooks/useBatchedAuthors';
 import { useContentModeration } from '@/hooks/useModeration';
+import { useProofModeEnrichment } from '@/hooks/useProofModeEnrichment';
 import { Card, CardContent } from '@/components/ui/card';
 import { Loader2 } from 'lucide-react';
 import InfiniteScroll from 'react-infinite-scroll-component';
@@ -83,7 +84,7 @@ export function VideoFeed({
 
   // Flatten all pages into single array, deduplicating by pubkey:kind:d-tag
   // (addressable event key per NIP-33, not just event ID)
-  const allVideos = useMemo(() => {
+  const dedupedVideos = useMemo(() => {
     const videos = data?.pages.flatMap(page => page.videos) ?? [];
     const seen = new Set<string>();
     return videos.filter(video => {
@@ -94,6 +95,10 @@ export function VideoFeed({
     });
   }, [data]);
 
+  // Enrich Funnelcake feed videos with ProofMode data via WebSocket
+  // Feed videos from REST API don't have event tags, so proofMode is always undefined
+  const allVideos = useProofModeEnrichment(dedupedVideos);
+
   // Filter videos based on mute list and verification status
   const filteredVideos = useMemo(() => {
     if (!allVideos || allVideos.length === 0) return [];

src/hooks/useProofModeEnrichment.ts

@@ -0,0 +1,80 @@
+// ABOUTME: Enriches Funnelcake feed videos with ProofMode data via WebSocket
+// ABOUTME: Queries relay for full events to extract verification tags missing from REST API
+
+import { useMemo } from 'react';
+import { useNostr } from '@nostrify/react';
+import { useQuery } from '@tanstack/react-query';
+import type { ParsedVideoData } from '@/types/video';
+import type { ProofModeData } from '@/types/video';
+import { getProofModeData } from '@/lib/videoParser';
+import { debugLog } from '@/lib/debug';
+
+const BATCH_SIZE = 20;
+const STALE_TIME = 5 * 60 * 1000; // 5 minutes
+
+/**
+ * Hook that enriches videos with ProofMode data from WebSocket queries
+ *
+ * Feed videos from Funnelcake REST API don't include event tags,
+ * so ProofMode data is always undefined. This hook fetches the full
+ * events via WebSocket to extract verification tags.
+ *
+ * Returns the same videos array with proofMode populated where available.
+ */
+export function useProofModeEnrichment(videos: ParsedVideoData[]): ParsedVideoData[] {
+  const { nostr } = useNostr();
+
+  // Find videos that need enrichment (no proofMode and have an ID)
+  const videosNeedingEnrichment = useMemo(
+    () => videos.filter(v => !v.proofMode && v.id).slice(0, BATCH_SIZE),
+    [videos]
+  );
+
+  const videoIds = useMemo(
+    () => videosNeedingEnrichment.map(v => v.id),
+    [videosNeedingEnrichment]
+  );
+
+  // Query relay for full events by ID
+  const { data: proofModeMap } = useQuery<Map<string, ProofModeData>>({
+    queryKey: ['proofmode-enrichment', ...videoIds],
+    queryFn: async ({ signal }) => {
+      if (videoIds.length === 0) return new Map();
+
+      debugLog(`[ProofModeEnrichment] Fetching ${videoIds.length} events for ProofMode data`);
+
+      const events = await nostr.query(
+        [{ ids: videoIds, limit: BATCH_SIZE }],
+        { signal: AbortSignal.any([signal, AbortSignal.timeout(10000)]) },
+      );
+
+      debugLog(`[ProofModeEnrichment] Got ${events.length} events`);
+
+      const map = new Map<string, ProofModeData>();
+      for (const event of events) {
+        const proofMode = getProofModeData(event);
+        if (proofMode) {
+          map.set(event.id, proofMode);
+        }
+      }
+
+      debugLog(`[ProofModeEnrichment] Found ${map.size} videos with ProofMode data`);
+      return map;
+    },
+    enabled: videoIds.length > 0,
+    staleTime: STALE_TIME,
+    gcTime: STALE_TIME * 2,
+  });
+
+  // Merge ProofMode data into videos
+  return useMemo(() => {
+    if (!proofModeMap || proofModeMap.size === 0) return videos;
+
+    return videos.map(video => {
+      if (video.proofMode) return video; // Already has data
+      const proofMode = proofModeMap.get(video.id);
+      if (!proofMode) return video;
+      return { ...video, proofMode };
+    });
+  }, [videos, proofModeMap]);
+}

src/lib/funnelcakeClient.ts

@@ -614,6 +614,7 @@ export async function fetchVideoById(
           engagement_score: stats.engagement_score,
           trending_score: stats.trending_score,
           loops: stats.embedded_loops || parseInt(getTag('loops') || '0') || null,
+          tags: event.tags,
         };
       }
     } catch {

src/lib/funnelcakeTransform.ts

@@ -5,6 +5,8 @@ import { parseByteArrayId } from './funnelcakeClient';
 import { SHORT_VIDEO_KIND, type ParsedVideoData } from '@/types/video';
 import type { FunnelcakeVideoRaw, FunnelcakeResponse } from '@/types/funnelcake';
 import { debugLog } from './debug';
+import { getProofModeData } from './videoParser';
+import type { NostrEvent } from '@nostrify/nostrify';
 
 /**
  * Parse loop count from video content text
@@ -79,6 +81,17 @@ export function transformFunnelcakeVideo(raw: FunnelcakeVideoRaw): ParsedVideoDa
       externalId: raw.d_tag || '',
     } : undefined,
 
+    // ProofMode data - extract from tags when available (single video endpoint)
+    proofMode: raw.tags ? getProofModeData({
+      id: id,
+      pubkey: pubkey,
+      created_at: raw.created_at,
+      kind: raw.kind,
+      tags: raw.tags,
+      content: raw.content || '',
+      sig: '',
+    } as NostrEvent) : undefined,
+
     // Empty reposts array (Funnelcake doesn't return individual reposts)
     reposts: [],
 

src/lib/videoParser.ts

@@ -522,10 +522,13 @@ export function getOriginalCommentCount(event: NostrEvent): number | undefined {
  * - pgp_fingerprint: PGP public key fingerprint
  */
 export function getProofModeData(event: NostrEvent): ProofModeData | undefined {
+  console.log('[ProofMode] Event tags:', JSON.stringify(event.tags, null, 2));
+
   const levelTag = event.tags.find(tag => tag[0] === 'verification');
 
   // If no verification level tag found, return undefined
   if (!levelTag?.[1]) {
+    console.log('[ProofMode] No verification tag found');
     return undefined;
   }
 
@@ -542,23 +545,29 @@ export function getProofModeData(event: NostrEvent): ProofModeData | undefined {
   const attestationTag = event.tags.find(tag => tag[0] === 'device_attestation');
   const fingerprintTag = event.tags.find(tag => tag[0] === 'pgp_fingerprint');
 
+  if (attestationTag != null)
+	level = "verified_mobile";
+
   // Parse manifest JSON if present
   let manifestData: Record<string, unknown> | undefined;
   if (manifestTag?.[1]) {
     try {
       manifestData = JSON.parse(manifestTag[1]);
+      level = "verified_web";
     } catch {
       // Invalid JSON, ignore
     }
   }
 
-  return {
+  const result = {
     level,
     manifest: manifestTag?.[1],
     manifestData,
     deviceAttestation: attestationTag?.[1],
     pgpFingerprint: fingerprintTag?.[1],
   };
+  console.log('[ProofMode] Result:', result);
+  return result;
 }
 
 /**

src/types/funnelcake.ts

@@ -39,6 +39,9 @@ export interface FunnelcakeVideoRaw {
   // Platform origin (for filtering classic vines)
   platform?: string;      // 'vine', 'tiktok', etc.
   classic?: boolean;      // Whether this is a classic/archived vine
+
+  // Full event tags (only present from /api/videos/{id} endpoint)
+  tags?: string[][];      // Nostr event tags for ProofMode extraction
 }
 
 /**