9 |
13 | );
14 | }
15 |
16 | export default HashtagDiscoveryPage;
--------------------------------------------------------------------------------
/tsconfig.node.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "ES2022",
4 | "lib": ["ES2023"],
5 | "module": "ESNext",
6 | "skipLibCheck": true,
7 |
8 | /* Bundler mode */
9 | "moduleResolution": "bundler",
10 | "allowImportingTsExtensions": true,
11 | "isolatedModules": true,
12 | "moduleDetection": "force",
13 | "noEmit": true,
14 |
15 | /* Linting */
16 | "strict": true,
17 | "noUnusedLocals": false,
18 | "noUnusedParameters": false,
19 | "noFallthroughCasesInSwitch": true
20 | },
21 | "include": ["vite.config.ts"]
22 | }
23 |
--------------------------------------------------------------------------------
/public/.well-known/assetlinks.json:
--------------------------------------------------------------------------------
1 | [
2 | {
3 | "relation": ["delegate_permission/common.handle_all_urls"],
4 | "target": {
5 | "namespace": "android_app",
6 | "package_name": "co.openvine.app",
7 | "sha256_cert_fingerprints": [
8 | "6F:36:C3:68:74:18:5E:03:B4:79:3D:82:EF:54:CE:34:26:ED:6E:C8:12:B7:CD:E2:F4:FA:9C:81:2F:C7:14:F4",
9 | "ED:9D:A6:BF:1A:D1:5B:D1:02:AF:0C:DB:4E:90:F0:3C:1B:8C:7F:EB:AA:9C:C8:F1:15:97:EB:9C:2C:41:B1:75",
10 | "10:B8:04:F9:48:FC:91:EC:28:27:B9:67:15:C3:21:2E:AB:1A:0B:46:AF:52:1B:3A:31:6C:9D:78:BF:A4:39:6E"
11 | ]
12 | }
13 | }
14 | ]
15 |
--------------------------------------------------------------------------------
/public/sw.js:
--------------------------------------------------------------------------------
1 | // diVine Web Service Worker
2 | // Minimal service worker for PWA installation - no offline caching
3 |
4 | // Install event - skip waiting immediately
5 | self.addEventListener('install', (event) => {
6 | event.waitUntil(self.skipWaiting());
7 | });
8 |
9 | // Activate event - claim clients immediately
10 | self.addEventListener('activate', (event) => {
11 | event.waitUntil(self.clients.claim());
12 | });
13 |
14 | // Fetch event - always use network, no caching
15 | self.addEventListener('fetch', (event) => {
16 | // Just pass through to network, no caching
17 | event.respondWith(fetch(event.request));
18 | });
19 |
--------------------------------------------------------------------------------
/src/hooks/useIsMobile.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react"
2 |
3 | const MOBILE_BREAKPOINT = 768
4 |
5 | export function useIsMobile() {
6 | const [isMobile, setIsMobile] = React.useState
10 |
12 |
14 |
20 | );
21 | }
22 |
--------------------------------------------------------------------------------
/public/_redirects:
--------------------------------------------------------------------------------
1 | # WordPress migration redirects
2 | /press https://about.divine.video/press/ 301
3 | /news https://about.divine.video/news/ 301
4 | /media-resources https://about.divine.video/media-resources/ 301
5 | /news/vine-revisited https://about.divine.video/vine-revisited-a-return-to-the-halcyon-days-of-the-internet/ 301
6 |
7 | /discord https://discord.gg/sHb4HMSF 302
8 |
9 | # Deep link verification files - must be served as-is (before catch-all)
10 | /.well-known/apple-app-site-association /.well-known/apple-app-site-association 200
11 | /.well-known/assetlinks.json /.well-known/assetlinks.json 200
12 |
13 | # SPA catch-all - serves index.html for all other routes
14 | /* /index.html 200
15 |
--------------------------------------------------------------------------------
/src/hooks/useHashtagThumbnail.ts:
--------------------------------------------------------------------------------
1 | import { useQuery } from '@tanstack/react-query';
2 | import { useNostr } from '@nostrify/react';
3 | import { resolveHashtagThumbnail, type NostrClientLike } from '@/lib/hashtagThumbnail';
4 |
5 | export function useHashtagThumbnail(hashtag: string) {
6 | const { nostr } = useNostr();
7 |
8 | return useQuery({
9 | queryKey: ['hashtag-thumbnail', hashtag],
10 | queryFn: async (context) => {
11 | const signal = AbortSignal.any([
12 | context.signal,
13 | AbortSignal.timeout(8000),
14 | ]);
15 |
16 | return resolveHashtagThumbnail(nostr as NostrClientLike, hashtag, signal);
17 | },
18 | staleTime: Infinity,
19 | gcTime: Infinity,
20 | });
21 | }
22 |
--------------------------------------------------------------------------------
/src/hooks/useUploadFile.ts:
--------------------------------------------------------------------------------
1 | import { useMutation } from "@tanstack/react-query";
2 | import { BlossomUploader } from '@nostrify/nostrify/uploaders';
3 |
4 | import { useCurrentUser } from "./useCurrentUser";
5 |
6 | export function useUploadFile() {
7 | const { user } = useCurrentUser();
8 |
9 | return useMutation({
10 | mutationFn: async (file: File) => {
11 | if (!user) {
12 | throw new Error('Must be logged in to upload files');
13 | }
14 |
15 | const uploader = new BlossomUploader({
16 | servers: [
17 | 'https://blossom.divine.video/',
18 | ],
19 | signer: user.signer,
20 | });
21 |
22 | const tags = await uploader.upload(file);
23 | return tags;
24 | },
25 | });
26 | }
--------------------------------------------------------------------------------
/src/components/ui/toggle.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react"
2 | import * as TogglePrimitive from "@radix-ui/react-toggle"
3 | import { type VariantProps } from "class-variance-authority"
4 |
5 | import { cn } from "@/lib/utils"
6 | import { toggleVariants } from "./toggle-variants"
7 |
8 | const Toggle = React.forwardRef<
9 | React.ElementRef
16 | {children}
17 |
18 |
20 | {title && {title} }
21 | {description && (
22 | {description}
23 | )}
24 |
25 | {action}
26 |
22 | {!isLandingPage &&
30 | );
31 | }
32 |
33 | export default AppLayout;
34 |
35 |
--------------------------------------------------------------------------------
/.private-journal/2025-11-13/00-37-10-342883.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: "12:37:10 AM - November 13, 2025"
3 | date: 2025-11-13T00:37:10.342Z
4 | timestamp: 1762994230342
5 | ---
6 |
7 | ## Project Notes
8 |
9 | Modified Divine Web's logged-out landing page:
10 |
11 | 1. **Header Removal**: Updated AppLayout component to conditionally hide AppHeader when user is logged out on the root path. Used useLocation() and login state check to determine when to hide the header.
12 |
13 | 2. **Elevator Pitch**: Added a new section before the carousel in LandingPage.tsx with:
14 | - Large "Divine" title using font-logo class
15 | - Tagline: "Short-form looping videos. Authentic moments. Human creativity."
16 | - Description focusing on 6-second loops, decentralization, and genuine content
17 | - Avoids directly mentioning Vine as requested
18 |
19 | 3. **Key Implementation Details**:
20 | - AppLayout now checks both Nostrify logins and Keycast JWT token for login state
21 | - isLandingPage = location.pathname === '/' && !isLoggedIn
22 | - Conditionally renders header: {!isLandingPage &&
24 |
26 |
17 |
37 | );
38 | }
39 |
--------------------------------------------------------------------------------
/src/lib/formatUtils.ts:
--------------------------------------------------------------------------------
1 | // ABOUTME: Utility functions for formatting numbers, durations, and counts
2 | // ABOUTME: Provides consistent formatting across the application for social metrics
3 |
4 | /**
5 | * Format view counts and social interaction counts with K/M notation
6 | */
7 | export function formatCount(count: number): string {
8 | if (count >= 1000000) {
9 | return (count / 1000000).toFixed(1).replace(/\.0$/, '') + 'M';
10 | }
11 | if (count >= 1000) {
12 | return (count / 1000).toFixed(1).replace(/\.0$/, '') + 'K';
13 | }
14 | return count.toString();
15 | }
16 |
17 | /**
18 | * Format video duration from seconds to HH:MM:SS or MM:SS format
19 | */
20 | export function formatDuration(seconds: number): string {
21 | const hours = Math.floor(seconds / 3600);
22 | const minutes = Math.floor((seconds % 3600) / 60);
23 | const remainingSeconds = Math.floor(seconds % 60);
24 |
25 | if (hours > 0) {
26 | return `${hours}:${minutes.toString().padStart(2, '0')}:${remainingSeconds.toString().padStart(2, '0')}`;
27 | }
28 |
29 | return `${minutes}:${remainingSeconds.toString().padStart(2, '0')}`;
30 | }
31 |
32 | /**
33 | * Format view count with proper pluralization
34 | */
35 | export function formatViewCount(count: number): string {
36 | const formatted = formatCount(count);
37 | return count === 1 ? `${formatted} view` : `${formatted} views`;
38 | }
--------------------------------------------------------------------------------
/functions/[[path]].ts:
--------------------------------------------------------------------------------
1 | // ABOUTME: Cloudflare Pages Function to handle SPA routing
2 | // ABOUTME: Returns index.html with 200 status for all routes to enable SEO
3 |
4 | export async function onRequest(context: {
5 | request: Request;
6 | next: () => Promise
18 |
31 | {enabled && (
32 | 33 | Showing only videos with ProofMode verification 34 |
35 | )} 36 |Note placeholder
;
36 |
37 | case 'nevent':
38 | // AI agent should implement event view here
39 | return Event placeholder
;
40 |
41 | case 'naddr':
42 | // AI agent should implement addressable event view here
43 | return Addressable event placeholder
;
44 |
45 | default:
46 | return
37 |
39 | )}
40 | Service Worker Cleanup
8 |Checking...
9 |
10 |
11 |
62 |
63 |
64 |
--------------------------------------------------------------------------------
/src/components/ZapButton.tsx:
--------------------------------------------------------------------------------
1 | import { ZapDialog } from '@/components/ZapDialog';
2 | import { useZaps } from '@/hooks/useZaps';
3 | import { useWallet } from '@/hooks/useWallet';
4 | import { useCurrentUser } from '@/hooks/useCurrentUser';
5 | import { useAuthor } from '@/hooks/useAuthor';
6 | import { Zap } from 'lucide-react';
7 | import type { Event } from 'nostr-tools';
8 |
9 | interface ZapButtonProps {
10 | target: Event;
11 | className?: string;
12 | showCount?: boolean;
13 | zapData?: { count: number; totalSats: number; isLoading?: boolean };
14 | }
15 |
16 | export function ZapButton({
17 | target,
18 | className = "text-xs ml-1",
19 | showCount = true,
20 | zapData: externalZapData
21 | }: ZapButtonProps) {
22 | const { user } = useCurrentUser();
23 | const { data: author } = useAuthor(target?.pubkey || '');
24 | const { webln, activeNWC } = useWallet();
25 |
26 | // Only fetch data if not provided externally
27 | const { totalSats: fetchedTotalSats, isLoading } = useZaps(
28 | externalZapData ? [] : target ?? [], // Empty array prevents fetching if external data provided
29 | webln,
30 | activeNWC
31 | );
32 |
33 | // Don't show zap button if user is not logged in, is the author, or author has no lightning address
34 | if (!user || !target || user.pubkey === target.pubkey || (!author?.metadata?.lud16 && !author?.metadata?.lud06)) {
35 | return null;
36 | }
37 |
38 | // Use external data if provided, otherwise use fetched data
39 | const totalSats = externalZapData?.totalSats ?? fetchedTotalSats;
40 | const showLoading = externalZapData?.isLoading || isLoading;
41 |
42 | return (
43 |
45 |
56 |
20 |
27 | );
28 | }
29 |
30 | return (
31 |
21 |
26 | Tag not found
22 |23 | The requested tag could not be found. 24 |
25 |
32 | {/* Header */}
33 |
63 | );
64 | }
65 |
--------------------------------------------------------------------------------
/DEPLOYMENT.md:
--------------------------------------------------------------------------------
1 | # Divine Web Deployment Guide
2 |
3 | ## Cloudflare Pages Deployment
4 |
5 | ### Prerequisites
6 | - Cloudflare account
7 | - Wrangler CLI installed (`npm install -D wrangler`)
8 |
9 | ### Deployment URLs
10 | - **Production**: https://divine-web.pages.dev
11 | - **Preview deployments**: https://[deployment-id].divine-web.pages.dev
12 |
13 | ### Manual Deployment
14 |
15 | 1. Build the production version:
16 | ```bash
17 | npm run build
18 | ```
19 |
20 | 2. Deploy to production:
21 | ```bash
22 | CLOUDFLARE_ACCOUNT_ID=ea14882f4b5d0270ffc376ca39229a84 npm run deploy:cloudflare
23 | ```
24 |
25 | 3. Deploy to preview branch:
26 | ```bash
27 | CLOUDFLARE_ACCOUNT_ID=ea14882f4b5d0270ffc376ca39229a84 npm run deploy:cloudflare:preview
28 | ```
29 |
30 | ### Automatic Deployment (GitHub)
31 |
32 | When connected to GitHub, Cloudflare Pages will automatically deploy:
33 | - **Main branch** → Production (divine-web.pages.dev)
34 | - **Pull requests** → Preview deployments
35 |
36 | ### Configuration
37 |
38 | The deployment is configured in `wrangler.toml`:
39 | - Build output directory: `dist`
40 | - Build command: `npm run build`
41 | - Redirects: Configured in `public/_redirects` for SPA routing
42 |
43 | ### Environment Variables
44 |
45 | Environment variables can be set in the Cloudflare dashboard:
46 | 1. Go to Pages project settings
47 | 2. Navigate to Environment variables
48 | 3. Add variables for production/preview environments
49 |
50 | ### Custom Domain
51 |
52 | To add a custom domain:
53 | 1. Go to the Cloudflare Pages dashboard
54 | 2. Select the divine-web project
55 | 3. Go to Custom domains
56 | 4. Add your domain and follow DNS configuration steps
57 |
58 | ### Troubleshooting
59 |
60 | - **Build failures**: Check that all dependencies are installed and the build runs locally
61 | - **Routing issues**: Ensure `_redirects` file is in the `public` folder
62 | - **404 on refresh**: The `_redirects` file should contain `/* /index.html 200`
63 |
64 | ### Dashboard
65 |
66 | View and manage deployments at:
67 | https://dash.cloudflare.com/ea14882f4b5d0270ffc376ca39229a84/pages/view/divine-web
--------------------------------------------------------------------------------
/src/hooks/useRelayCapabilities.ts:
--------------------------------------------------------------------------------
1 | // ABOUTME: React hook for detecting and using relay capabilities
2 | // ABOUTME: Provides graceful fallback when relays don't support NIP-50
3 |
4 | import { useQuery } from '@tanstack/react-query';
5 | import { useAppContext } from '@/hooks/useAppContext';
6 | import { detectRelayCapabilities, shouldUseNIP50, getEffectiveSortMode, type RelayCapabilities } from '@/lib/relayCapabilities';
7 | import type { SortMode } from '@/types/nostr';
8 |
9 | /**
10 | * Hook to detect relay capabilities
11 | */
12 | export function useRelayCapabilities(relayUrl?: string) {
13 | const { config } = useAppContext();
14 | const effectiveRelayUrl = relayUrl || config.relayUrl;
15 |
16 | return useQuery
34 |
43 |
44 |
55 |
56 | {/* Video Feed */}
57 |
45 |
54 | #{tag}
46 | {isLoading ? ( 47 |50 | {videos?.length || 0} videos 51 |
52 | )} 53 |
12 |
41 | Verified
14 | 15 |
16 | {/* Stock image with verification badge */}
17 |
40 |
18 | 
23 | {/* Verification badge overlay */}
24 |
36 |
23 | {/* Verification badge overlay */}
24 |
25 |
29 | {/* ProofMode indicator */}
30 |
26 |
28 |
31 |
35 |
32 | ProofMode Certified
33 |
34 | 37 | Cryptographically proven authenticity 38 |
39 |{children}
51 |
12 |
43 | Decentralized
14 | 15 |
16 | {/* Stock image with network overlay */}
17 |
42 |
18 | 
23 | {/* Network indicator */}
24 |
38 |
23 | {/* Network indicator */}
24 |
25 |
29 | {/* Network nodes overlay */}
30 |
26 |
28 |
31 |
37 |
32 |
36 |
33 | Nostr Network
34 |
35 | 39 | Built on Nostr. Your content, your control 40 |
41 |