[V0_FILE]jpg:file="public/south-korea-china-diplomatic-meeting.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/south-korea-china-diplomatic-meeting-o0ZxlGIXRCOigkEDisFnslIc0ZOlQB.jpg" isMerged="true" [V0_FILE]jpg:file="public/semiconductor-chip-manufacturing.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/semiconductor-chip-manufacturing-5fLLXWLbNzcNXzcXmffh3kiSvNnVg2.jpg" isMerged="true" [V0_FILE]jpg:file="public/college-football-playoff-stadium.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/college-football-playoff-stadium-dY021lunBA28ho2qE8RNNlRbq4is0M.jpg" isMerged="true" [V0_FILE]jpg:file="public/samsung-technology-manufacturing.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/samsung-technology-manufacturing-GSzKfHfkGgf1S8CzWjNnPjywuhwwM9.jpg" isMerged="true" [V0_FILE]jpg:file="public/climate-change-global-warming.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/climate-change-global-warming-4ySL9abPtLWFoQPP2SNNnukqBTghGT.jpg" isMerged="true" [V0_FILE]jpg:file="public/taiwan-military-defense.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/taiwan-military-defense-iMT5BgMQ2OYthWoEcheVXic61FD1p6.jpg" isMerged="true" [V0_FILE]json:file="package.json" isMerged="true" { "name": "my-v0-project", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "eslint ." }, "dependencies": { "@hookform/resolvers": "^3.10.0", "@radix-ui/react-accordion": "1.2.2", "@radix-ui/react-alert-dialog": "1.1.4", "@radix-ui/react-aspect-ratio": "1.1.1", "@radix-ui/react-avatar": "1.1.2", "@radix-ui/react-checkbox": "1.1.3", "@radix-ui/react-collapsible": "1.1.2", "@radix-ui/react-context-menu": "2.2.4", "@radix-ui/react-dialog": "1.1.4", "@radix-ui/react-dropdown-menu": "2.1.4", "@radix-ui/react-hover-card": "1.1.4", "@radix-ui/react-label": "2.1.1", "@radix-ui/react-menubar": "1.1.4", "@radix-ui/react-navigation-menu": "1.2.3", "@radix-ui/react-popover": "1.1.4", "@radix-ui/react-progress": "1.1.1", "@radix-ui/react-radio-group": "1.2.2", "@radix-ui/react-scroll-area": "1.2.2", "@radix-ui/react-select": "2.1.4", "@radix-ui/react-separator": "1.1.1", "@radix-ui/react-slider": "1.2.2", "@radix-ui/react-slot": "1.1.1", "@radix-ui/react-switch": "1.1.2", "@radix-ui/react-tabs": "1.1.2", "@radix-ui/react-toast": "1.2.4", "@radix-ui/react-toggle": "1.1.1", "@radix-ui/react-toggle-group": "1.1.1", "@radix-ui/react-tooltip": "1.1.6", "@vercel/analytics": "1.3.1", "autoprefixer": "^10.4.20", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "cmdk": "1.0.4", "date-fns": "4.1.0", "embla-carousel-react": "8.5.1", "input-otp": "1.4.1", "lucide-react": "^0.454.0", "next": "16.0.10", "next-themes": "^0.4.6", "react": "19.2.0", "react-day-picker": "9.8.0", "react-dom": "19.2.0", "react-hook-form": "^7.60.0", "react-resizable-panels": "^2.1.7", "recharts": "2.15.4", "sonner": "^1.7.4", "tailwind-merge": "^3.3.1", "tailwindcss-animate": "^1.0.7", "vaul": "^1.1.2", "zod": "3.25.76" }, "devDependencies": { "@tailwindcss/postcss": "^4.1.9", "@types/node": "^22", "@types/react": "^19", "@types/react-dom": "^19", "postcss": "^8.5", "tailwindcss": "^4.1.9", "tw-animate-css": "1.3.3", "typescript": "^5" } } [V0_FILE]typescriptreact:file="app/discover/loading.tsx" isFixed="true" isMerged="true" export default function Loading() { return null } [V0_FILE]typescriptreact:file="app/discover/page.tsx" isFixed="true" isEdit="true" isQuickEdit="true" "use client" import { Card, CardContent } from "@/components/ui/card" import { Button } from "@/components/ui/button" import { TrendingUp, Newspaper, ChevronRight, Home, Sparkles, Globe, Briefcase, Laptop, Heart, Trophy, Music, Atom, Lightbulb, DollarSign, LineChart, Search, BarChart, Users, FileText, Moon, Sun, Compass, Star, Share2, } from "lucide-react" import { useState } from "react" const featuredArticles = [ { id: 1, title: "South Korea's Lee to visit China next week", image: "/south-korea-china-diplomatic-meeting.jpg", sources: 59, timestamp: "8 minutes ago", featured: true, }, { id: 2, title: "China orders chipmakers to use 50% domestic equipment", image: "/semiconductor-chip-manufacturing.jpg", sources: 76, timestamp: "1 hour ago", }, { id: 3, title: "College Football Playoff quarterfinals begin Wednesday", image: "/college-football-playoff-stadium.jpg", sources: 60, timestamp: "2 hours ago", }, { id: 4, title: "US grants Samsung, SK Hynix annual chip export licenses", image: "/samsung-technology-manufacturing.jpg", sources: 61, timestamp: "3 hours ago", }, { id: 5, title: "2025 among three hottest years despite no El Niño", image: "/climate-change-global-warming.jpg", sources: 76, timestamp: "3 hours ago", }, { id: 6, title: "Taiwan's Lai vows no escalation as China drills enter second day", image: "/taiwan-military-defense.jpg", sources: 72, timestamp: "6 hours ago", }, ] const trendingCompanies = [ { name: "NVIDIA", ticker: "NVDA", price: "$188.22", change: "-1.21%", negative: true }, { name: "Tesla", ticker: "TSLA", price: "$459.64", change: "-3.27%", negative: true }, { name: "Micron", ticker: "MU", price: "$294.37", change: "+3.36%", negative: false }, { name: "Meta", ticker: "META", price: "$658.69", change: "-0.69%", negative: true }, ] const navMenus = { home: { title: "Discover Home", icon: Home, links: [ { label: "Featured Stories", href: "#" }, { label: "Today's Highlights", href: "#" }, { label: "Editor's Picks", href: "#" }, ], starterLinks: ["Quick search", "Trending topics", "Saved articles"], }, forYou: { title: "For You", icon: Sparkles, links: [ { label: "Personalized Feed", href: "#", icon: ChevronRight }, { label: "Recommended Topics", href: "#", icon: Star }, { label: "Your Interests", href: "#", icon: Users }, ], starterLinks: ["Quick search", "Trending topics", "Saved articles"], }, topNews: { title: "Top News", icon: Newspaper, links: [ { label: "Breaking News", href: "#", icon: Newspaper }, { label: "Most Popular", href: "#", icon: TrendingUp }, { label: "Trending Now", href: "#", icon: BarChart }, { label: "Editor's Choice", href: "#", icon: FileText }, ], starterLinks: ["Quick search", "Trending topics", "Saved articles"], }, world: { title: "World", icon: Globe, links: [ { label: "International", href: "#", icon: Globe }, { label: "Asia Pacific", href: "#", icon: DollarSign }, { label: "Europe", href: "#", icon: Users }, { label: "Americas", href: "#", icon: Globe }, { label: "Middle East", href: "#", icon: Users }, ], starterLinks: ["Quick search", "Trending topics", "Saved articles"], }, business: { title: "Business", icon: Briefcase, links: [ { label: "Markets", href: "#", icon: DollarSign }, { label: "Economy", href: "#", icon: TrendingUp }, { label: "Finance", href: "#", icon: DollarSign }, { label: "Startups", href: "#", icon: Users }, { label: "Real Estate", href: "#", icon: DollarSign }, ], starterLinks: ["Quick search", "Trending topics", "Saved articles"], }, technology: { title: "Technology", icon: Laptop, links: [ { label: "AI & Machine Learning", href: "#", icon: Laptop }, { label: "Software", href: "#", icon: Laptop }, { label: "Hardware", href: "#", icon: Laptop }, { label: "Cybersecurity", href: "#", icon: Laptop }, { label: "Gadgets", href: "#", icon: Laptop }, ], starterLinks: ["Quick search", "Trending topics", "Saved articles"], }, science: { title: "Science", icon: Atom, links: [ { label: "Space", href: "#", icon: Atom }, { label: "Physics", href: "#", icon: Atom }, { label: "Biology", href: "#", icon: Atom }, { label: "Environment", href: "#", icon: Atom }, { label: "Research", href: "#", icon: Atom }, ], starterLinks: ["Quick search", "Trending topics", "Saved articles"], }, innovation: { title: "Innovation", icon: Lightbulb, links: [ { label: "Emerging Tech", href: "#", icon: Lightbulb }, { label: "Future Trends", href: "#", icon: LineChart }, { label: "Design", href: "#", icon: Lightbulb }, { label: "Inventions", href: "#", icon: Lightbulb }, ], starterLinks: ["Quick search", "Trending topics", "Saved articles"], }, health: { title: "Health", icon: Heart, links: [ { label: "Medical News", href: "#", icon: Heart }, { label: "Wellness", href: "#", icon: Heart }, { label: "Nutrition", href: "#", icon: Heart }, { label: "Mental Health", href: "#", icon: Heart }, { label: "Fitness", href: "#", icon: Heart }, ], starterLinks: ["Quick search", "Trending topics", "Saved articles"], }, sports: { title: "Sports", icon: Trophy, links: [ { label: "Football", href: "#", icon: Trophy }, { label: "Basketball", href: "#", icon: Trophy }, { label: "Baseball", href: "#", icon: Trophy }, { label: "Soccer", href: "#", icon: Trophy }, { label: "Olympics", href: "#", icon: Trophy }, ], starterLinks: ["Quick search", "Trending topics", "Saved articles"], }, entertainment: { title: "Entertainment", icon: Music, links: [ { label: "Movies", href: "#", icon: Music }, { label: "TV Shows", href: "#", icon: Music }, { label: "Music", href: "#", icon: Music }, { label: "Celebrity News", href: "#", icon: Music }, { label: "Gaming", href: "#", icon: Music }, ], starterLinks: ["Quick search", "Trending topics", "Saved articles"], }, } const getNavTitle = (nav: string | null) => { if (nav) { return navMenus[nav as keyof typeof navMenus].title } return "" } function getNavLinks(nav: string) { switch (nav) { case "home": return [ { icon: , label: "Home" }, { icon: , label: "For You" }, ] case "forYou": return [ { icon: , label: "Personalized Feed" }, { icon: , label: "Saved" }, ] case "topNews": return [ { icon: , label: "Top Stories" }, { icon: , label: "Trending" }, ] case "world": return [ { icon: , label: "International" }, { icon: , label: "Regional" }, ] case "business": return [ { icon: , label: "Markets" }, { icon: , label: "Economy" }, ] case "technology": return [ { icon: , label: "Tech News" }, { icon: , label: "Startups" }, ] case "science": return [ { icon: , label: "Research" }, { icon: , label: "Space" }, ] case "innovation": return [ { icon: , label: "Ideas" }, { icon: , label: "Trends" }, ] case "health": return [ { icon: , label: "Wellness" }, { icon: , label: "Medical" }, ] case "sports": return [ { icon: , label: "Live Scores" }, { icon: , label: "Teams" }, ] case "entertainment": return [ { icon: , label: "Music" }, { icon: , label: "Movies" }, ] default: return [] } } const getNavStarterLinks = (nav: string | null) => { if (nav) { return navMenus[nav as keyof typeof navMenus].starterLinks } return [] } export default function DiscoverPage() { const [activeNav, setActiveNav] = useState(null) const [theme, setTheme] = useState<"light" | "dark">("light") const isDark = theme === "dark" const bgClass = isDark ? "bg-black" : "bg-background" const textClass = isDark ? "text-white" : "text-foreground" const borderClass = "border-transparent" const cardBgClass = isDark ? "bg-black" : "bg-card" const hoverBgClass = isDark ? "hover:bg-gray-900" : "hover:bg-muted" const mutedBgClass = isDark ? "bg-black" : "bg-muted" const mutedTextClass = isDark ? "text-gray-300" : "text-muted-foreground" const headingTextClass = isDark ? "text-white" : "text-foreground" return (

{/* Header */}

Discover

{/* Main Layout Container */}

{/* Left Navigation Sidebar */}

{/* Site Icon at the top */}

{/* Flyout Menu */} {activeNav && (

setActiveNav(activeNav)} onMouseLeave={() => setActiveNav(null)} >

{getNavTitle(activeNav)}

{/* Main Links */}

{getNavLinks(activeNav).map((link, index) => ( ))}

{/* Get Started Section */}

Get started

{getNavStarterLinks(activeNav).map((link, index) => ( ))}

)} {/* Main Content Area - Centered */}

{/* Main Content Column */}

{/* Featured Article */}

Investors shift to value stocks amid inflation fears

Market analysts note that surging AI data center investments are fueling inflation concerns, prompting a pivot to small-cap stocks, gold, and bonds.

Published 2 hours ago

127 sources

{/* Article Grid */}

{[ { image: "/semiconductor-chip-manufacturing.jpg", title: "Taiwan captures Venezuelan President Maduro", sources: 54, }, { image: "/college-football-playoff-stadium.jpg", title: "Trump warns Venezuela of 'second strike' if cooperation fails", sources: 91, }, ].map((article, index) => (

{article.title}

{article.sources} sources

))}

{/* Additional Featured Article */}

Tech stocks drive global markets higher after Venezuela operation

Asian markets surged Monday with chipmakers leading gains as investors absorbed news of the U.S. military capture of Venezuelan President Nicolás Maduro.

Published 6 hours ago 74 sources

{/* Sidebar */}

{/* Weather Widget */}

Weather

San Francisco, CA

72°F

Partly Cloudy

{["Mon", "Tue", "Wed", "Thu", "Fri"].map((day, index) => (

{day}

75°

))}

{/* Market Outlook */}

Market Outlook

{[ { name: "S&P 500", value: "4,783.45", change: "+1.2%", positive: true }, { name: "NASDAQ", value: "15,310.97", change: "+1.8%", positive: true }, { name: "DOW", value: "37,863.80", change: "+0.8%", positive: true }, ].map((index, idx) => (

{index.name}

{index.value}

{index.change}

))}

{/* Trending Companies */}

Trending Companies

{[ { name: "NVDA", fullName: "NVIDIA Corp", price: "$875.28", change: "+3.4%", positive: true }, { name: "TSLA", fullName: "Tesla Inc", price: "$248.48", change: "-1.2%", positive: false }, { name: "AAPL", fullName: "Apple Inc", price: "$185.92", change: "+0.9%", positive: true }, ].map((company, idx) => (

{company.name}

{company.fullName}

{company.price}

{company.change}

))}

) }

About

Tags

Share

More Templates Like This

About

Tags

Share

About

Tags

Share

More Templates Like This