diff --git a/package-lock.json b/package-lock.json index 0123c86..93a8981 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,6 +10,7 @@ "dependencies": { "@ai-sdk/anthropic": "^1.2.12", "@ai-sdk/openai": "^1.3.23", + "@clerk/nextjs": "^6.28.1", "@hookform/resolvers": "^5.2.0", "@octokit/rest": "^21.1.1", "@radix-ui/react-accordion": "^1.2.11", @@ -283,6 +284,104 @@ "integrity": "sha512-YslZMgtJUyuMbZ+aKvfF3x1f5liK4mWNxghFRv7jqRR9C3R3fAOGTTKvxXDa2Y1s9zSbcpuO0cAxDYsc9SrXoQ==", "license": "Apache-2.0" }, + "node_modules/@clerk/backend": { + "version": "2.6.2", + "resolved": "https://registry.npmjs.org/@clerk/backend/-/backend-2.6.2.tgz", + "integrity": "sha512-IUTjLmA1QkqoJnB97S8Ay/oeFR1QtBxxzi9V2J8zncGdUUpAHRp9PfbUwe203VEZuoDD8n6PGfK4oiiq5CoKhQ==", + "license": "MIT", + "dependencies": { + "@clerk/shared": "^3.17.0", + "@clerk/types": "^4.72.0", + "cookie": "1.0.2", + "standardwebhooks": "^1.0.0", + "tslib": "2.8.1" + }, + "engines": { + "node": ">=18.17.0" + } + }, + "node_modules/@clerk/clerk-react": { + "version": "5.38.1", + "resolved": "https://registry.npmjs.org/@clerk/clerk-react/-/clerk-react-5.38.1.tgz", + "integrity": "sha512-IOn/Raet3jwkug8P/gLMe2nsw2wKllWGOGPFOAaaYxbXfIZ8MPngNv2/MMgVRF7cAX1UwrmU1PzrLNtBJ/EHPQ==", + "license": "MIT", + "dependencies": { + "@clerk/shared": "^3.17.0", + "@clerk/types": "^4.72.0", + "tslib": "2.8.1" + }, + "engines": { + "node": ">=18.17.0" + }, + "peerDependencies": { + "react": "^18.0.0 || ^19.0.0 || ^19.0.0-0", + "react-dom": "^18.0.0 || ^19.0.0 || ^19.0.0-0" + } + }, + "node_modules/@clerk/nextjs": { + "version": "6.28.1", + "resolved": "https://registry.npmjs.org/@clerk/nextjs/-/nextjs-6.28.1.tgz", + "integrity": "sha512-1R+kK5lSwY4RCwEMUgNcryR588af59LPw25rO/DzBn9EAsIcLgRP8Tu8tKWvnBoXaSzIUYVZUQa7/bAAjoMnXA==", + "license": "MIT", + "dependencies": { + "@clerk/backend": "^2.6.2", + "@clerk/clerk-react": "^5.38.1", + "@clerk/shared": "^3.17.0", + "@clerk/types": "^4.72.0", + "server-only": "0.0.1", + "tslib": "2.8.1" + }, + "engines": { + "node": ">=18.17.0" + }, + "peerDependencies": { + "next": "^13.5.7 || ^14.2.25 || ^15.2.3", + "react": "^18.0.0 || ^19.0.0 || ^19.0.0-0", + "react-dom": "^18.0.0 || ^19.0.0 || ^19.0.0-0" + } + }, + "node_modules/@clerk/shared": { + "version": "3.17.0", + "resolved": "https://registry.npmjs.org/@clerk/shared/-/shared-3.17.0.tgz", + "integrity": "sha512-eYbA0xmKG1DluFmdVykXiElgZGTpCruEyXmIBAwokpxypd5nOpDsS1xvEKwYvZieLTZkFz21Z3Y6HdDI5cPxBQ==", + "hasInstallScript": true, + "license": "MIT", + "dependencies": { + "@clerk/types": "^4.72.0", + "dequal": "2.0.3", + "glob-to-regexp": "0.4.1", + "js-cookie": "3.0.5", + "std-env": "^3.9.0", + "swr": "2.3.4" + }, + "engines": { + "node": ">=18.17.0" + }, + "peerDependencies": { + "react": "^18.0.0 || ^19.0.0 || ^19.0.0-0", + "react-dom": "^18.0.0 || ^19.0.0 || ^19.0.0-0" + }, + "peerDependenciesMeta": { + "react": { + "optional": true + }, + "react-dom": { + "optional": true + } + } + }, + "node_modules/@clerk/types": { + "version": "4.72.0", + "resolved": "https://registry.npmjs.org/@clerk/types/-/types-4.72.0.tgz", + "integrity": "sha512-SEkgiQNeTstC0/mQjHCGBEyX0/ALyWAa5QZBBvVOok204r48MLipfIKsXQhyWE2Hk6FIo5WT6YyqD36jaxUEIw==", + "license": "MIT", + "dependencies": { + "csstype": "3.1.3" + }, + "engines": { + "node": ">=18.17.0" + } + }, "node_modules/@date-fns/tz": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/@date-fns/tz/-/tz-1.2.0.tgz", @@ -4785,6 +4884,15 @@ "integrity": "sha512-1NB+BKqhtNipMsov4xI/NnhCKp9XG9NamYp5PVm9klAT0fsrNPjaFICsCFhNhwZJKNh7zB/3q8qXz0E9oaMNtQ==", "license": "MIT" }, + "node_modules/cookie": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/cookie/-/cookie-1.0.2.tgz", + "integrity": "sha512-9Kr/j4O16ISv8zBBhJoi4bXOYNTkFLOqSL3UDB0njXxCXNezjeyVrJyGOWtgfs/q2km1gwBcfH8q1yEGoMYunA==", + "license": "MIT", + "engines": { + "node": ">=18" + } + }, "node_modules/cose-base": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/cose-base/-/cose-base-1.0.3.tgz", @@ -6575,6 +6683,12 @@ "node": ">=10.13.0" } }, + "node_modules/glob-to-regexp": { + "version": "0.4.1", + "resolved": "https://registry.npmjs.org/glob-to-regexp/-/glob-to-regexp-0.4.1.tgz", + "integrity": "sha512-lkX1HJXwyMcprw/5YUZc2s7DrpAiHB21/V+E1rHUrVNokkvB6bqMzT0VfV6/86ZNabt1k14YOIaT7nDvOX3Iiw==", + "license": "BSD-2-Clause" + }, "node_modules/globals": { "version": "14.0.0", "resolved": "https://registry.npmjs.org/globals/-/globals-14.0.0.tgz", @@ -7276,6 +7390,15 @@ "jiti": "lib/jiti-cli.mjs" } }, + "node_modules/js-cookie": { + "version": "3.0.5", + "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-3.0.5.tgz", + "integrity": "sha512-cEiJEAEoIbWfCZYKWhVwFuvPX1gETRYPw6LlaTKoxD3s2AkXzkCjnp6h0V77ozyqj0jakteJ4YqDJT830+lVGw==", + "license": "MIT", + "engines": { + "node": ">=14" + } + }, "node_modules/js-tokens": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", @@ -9020,6 +9143,12 @@ "node": ">=10" } }, + "node_modules/server-only": { + "version": "0.0.1", + "resolved": "https://registry.npmjs.org/server-only/-/server-only-0.0.1.tgz", + "integrity": "sha512-qepMx2JxAa5jjfzxG79yPPq+8BuFToHd1hm7kI+Z4zAq1ftQiP7HcxMhDDItrbtwVeLg/cY2JnKnrcFkmiswNA==", + "license": "MIT" + }, "node_modules/set-function-length": { "version": "1.2.2", "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz", @@ -9247,6 +9376,22 @@ "dev": true, "license": "MIT" }, + "node_modules/standardwebhooks": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/standardwebhooks/-/standardwebhooks-1.0.0.tgz", + "integrity": "sha512-BbHGOQK9olHPMvQNHWul6MYlrRTAOKn03rOe4A8O3CLWhNf4YHBqq2HJKKC+sfqpxiBY52pNeesD6jIiLDz8jg==", + "license": "MIT", + "dependencies": { + "@stablelib/base64": "^1.0.0", + "fast-sha256": "^1.3.0" + } + }, + "node_modules/std-env": { + "version": "3.9.0", + "resolved": "https://registry.npmjs.org/std-env/-/std-env-3.9.0.tgz", + "integrity": "sha512-UGvjygr6F6tpH7o2qyqR6QYpwraIjKSdtzyBdyytFOHmPZY917kwdwLG0RbOjWOnKmnm3PeHjaoLLMie7kPLQw==", + "license": "MIT" + }, "node_modules/stop-iteration-iterator": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/stop-iteration-iterator/-/stop-iteration-iterator-1.1.0.tgz", diff --git a/package.json b/package.json index df6e2a4..7de3ddc 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ "dependencies": { "@ai-sdk/anthropic": "^1.2.12", "@ai-sdk/openai": "^1.3.23", + "@clerk/nextjs": "^6.28.1", "@hookform/resolvers": "^5.2.0", "@octokit/rest": "^21.1.1", "@radix-ui/react-accordion": "^1.2.11", diff --git a/src/app/globals.css b/src/app/globals.css index a63a080..c7983d1 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -117,7 +117,168 @@ * { @apply border-border outline-ring/50; } + body { @apply bg-background text-foreground; } + + html { + scroll-behavior: smooth; + } +} + +@layer components { + /* Glassmorphism effects */ + .glass { + @apply bg-background/50 backdrop-blur-md border border-border/50; + } + + .glass-card { + @apply bg-card/80 backdrop-blur-sm border border-border/30 shadow-lg; + } + + /* Enhanced button animations */ + .btn-gradient { + @apply bg-gradient-to-r from-blue-600 to-purple-600 hover:from-blue-700 hover:to-purple-700 transition-all duration-300 transform hover:scale-105 active:scale-95; + } + + /* Floating elements animation */ + .float { + animation: float 3s ease-in-out infinite; + } + + .float-delay { + animation: float 3s ease-in-out infinite 1.5s; + } + + /* Text shimmer effect */ + .text-shimmer { + background: linear-gradient(90deg, + oklch(0.556 0 0), + oklch(0.708 0 0), + oklch(0.556 0 0) + ); + background-size: 200% auto; + -webkit-background-clip: text; + background-clip: text; + -webkit-text-fill-color: transparent; + animation: shimmer 2s linear infinite; + } + + /* Custom scrollbar */ + .custom-scrollbar::-webkit-scrollbar { + width: 8px; + } + + .custom-scrollbar::-webkit-scrollbar-track { + @apply bg-muted rounded-full; + } + + .custom-scrollbar::-webkit-scrollbar-thumb { + @apply bg-border hover:bg-ring rounded-full; + } + + /* Gradient borders */ + .gradient-border { + position: relative; + background: linear-gradient(90deg, + hsl(var(--primary)), + hsl(var(--accent)) + ); + padding: 1px; + border-radius: var(--radius); + } + + .gradient-border > div { + @apply bg-card rounded-[calc(var(--radius)-1px)]; + } + + /* Enhanced focus styles */ + .focus-ring { + @apply focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-background; + } +} + +@keyframes float { + 0%, 100% { + transform: translateY(0); + } + 50% { + transform: translateY(-10px); + } +} + +@keyframes shimmer { + 0% { + background-position: -200% center; + } + 100% { + background-position: 200% center; + } +} + +@keyframes pulse { + 0%, 100% { + opacity: 1; + } + 50% { + opacity: 0.5; + } +} + +/* Enhanced animations */ +@keyframes fadeInUp { + from { + opacity: 0; + transform: translateY(30px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes fadeInDown { + from { + opacity: 0; + transform: translateY(-30px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +.animate-fade-in-up { + animation: fadeInUp 0.6s ease-out; +} + +.animate-fade-in-down { + animation: fadeInDown 0.6s ease-out; +} + +/* Improved button hover effects */ +.btn-hover-glow:hover { + box-shadow: 0 0 20px hsl(var(--primary) / 0.3); +} + +/* Staggered animation delays */ +.animate-delay-100 { + animation-delay: 100ms; +} + +.animate-delay-200 { + animation-delay: 200ms; +} + +.animate-delay-300 { + animation-delay: 300ms; +} + +.animate-delay-400 { + animation-delay: 400ms; +} + +.animate-delay-500 { + animation-delay: 500ms; } diff --git a/src/app/page.tsx b/src/app/page.tsx index 1fd205d..26b310f 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,306 +1,473 @@ "use client"; -// Authentication removed -import { useState } from "react"; -import { Card, CardContent } from "@/components/ui/card"; +import { useState, useEffect } from "react"; +import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; import { Button } from "@/components/ui/button"; -import { Input } from "@/components/ui/input"; import { - Search, - GitBranch, - BarChart3, - FileText, Zap, Database, - Star, - GitFork, - Calendar, - ExternalLink, + Shield, + Palette, + Code2, + Github, + CheckCircle, + Circle, + Rocket, + Sparkles, + FileText, } from "lucide-react"; import { ThemeToggle } from "@/components/theme-toggle"; import Link from "next/link"; -import { useRouter } from "next/navigation"; -import { Badge } from "@/components/ui/badge"; -import { Skeleton } from "@/components/ui/skeleton"; -import { useFeaturedRepositories } from "@/hooks/use-featured-repositories"; +import SetupGuide from "@/components/setup-guide"; +import { checkEnvironmentVariables } from "@/lib/env-check"; +import Chat from "@/components/chat"; +import { SignedIn, SignedOut, SignInButton, UserButton } from "@clerk/nextjs"; export default function Home() { - const [searchQuery, setSearchQuery] = useState(''); - const router = useRouter(); - const { data: featuredRepositories, isLoading, error } = useFeaturedRepositories(4); - - const handleSearch = (e: React.FormEvent) => { - e.preventDefault(); - if (searchQuery.trim()) { - router.push(`/search?q=${encodeURIComponent(searchQuery)}`); - } - }; - - const formatNumber = (num: number) => { - if (num >= 1000000) { - return (num / 1000000).toFixed(1) + 'M'; - } - if (num >= 1000) { - return (num / 1000).toFixed(1) + 'k'; - } - return num.toString(); - }; + const [envStatus, setEnvStatus] = useState({ + clerk: false, + supabase: false, + ai: false, + allConfigured: false, + }); + const [showSetup, setShowSetup] = useState(false); - const formatDate = (dateString: string) => { - return new Date(dateString).toLocaleDateString('en-US', { - year: 'numeric', - month: 'short', - day: 'numeric', - }); - }; - - const formatBytes = (bytes: number) => { - if (bytes === 0) return '0 Bytes'; - const k = 1024; - const sizes = ['Bytes', 'KB', 'MB', 'GB']; - const i = Math.floor(Math.log(bytes) / Math.log(k)); - return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i]; - }; + useEffect(() => { + const status = checkEnvironmentVariables(); + setEnvStatus(status); + }, []); return (
- {/* Hero Section */} -
-
-
+ {/* Navigation Bar */} + -
- -

- Git Search + {/* Hero Section */} +
+
+
+
+
+
+ +
+
+
+ +

+ + Modern Web Development + +
+ Made Simple

-
-

- The ultimate GitHub repository directory with AI-focused statistics and comprehensive analysis -

+ +

+ A production-ready Next.js starter with authentication, database, AI integration, + and beautiful UI components. Get from zero to shipped in minutes, not hours. +

- {/* Search Bar */} -
-
-
- - setSearchQuery(e.target.value)} - className="pl-10 h-12 text-base" - /> -
- + + + + + + + + + + +
-
+ {/* Environment Status Indicators */} +
+
+ {envStatus.clerk ? ( +
+ +
+ {envStatus.supabase ? ( +
+ +
+ {envStatus.ai ? ( +
+
+

-
- {/* Featured Repositories - Moved to Top */} -
-
-

Featured Repositories

-

- Popular repositories with comprehensive AI-focused analysis + {/* Setup Guide */} + {showSetup && ( +

+ +
+ )} + +
+ + {/* Feature Showcase */} +
+
+

Everything You Need to Build Fast

+

+ Batteries-included starter kit with all the modern tools and integrations

-
- {isLoading ? ( - // Loading skeletons - Array.from({ length: 4 }).map((_, index) => ( - - -
- - -
- - - -
-
- {Array.from({ length: 4 }).map((_, i) => ( - - ))} -
-
- - - )) - ) : error ? ( - // Error state - - -

- Unable to load featured repositories. Please try again later. -

- - - ) : featuredRepositories && featuredRepositories.length > 0 ? ( - // Real data - featuredRepositories.map((repo) => ( - - -
-
-
- - {repo.name} - - - - -
- -
-
-
- - {formatDate(repo.updated_at)} -
-
- - - -
-
- -

- {repo.description || 'No description available'} -

+
+ {/* Authentication */} + + +
+
+ +
+ Authentication +
+

+ Complete user management with Clerk integration +

+ + +
+
+ + Sign-up & Sign-in flows +
+
+ + Protected routes middleware +
+
+ + User profile management +
+
+ + -
- {repo.author && ( - - {repo.author} - - )} - {repo.branch && ( - - {repo.branch} - - )} -
+ {/* Database */} + + +
+
+ +
+ Database +
+

+ Supabase PostgreSQL with real-time capabilities +

+ + +
+
+ + Row Level Security +
+
+ + Real-time subscriptions +
+
+ + Type-safe queries +
+
+ + - {/* Statistics with Icons */} -
-
- -
-
- {formatNumber(repo.stats?.total_lines || 0)} -
-
Lines
-
-
-
- -
-
- {formatNumber(repo.stats?.total_files_found || 0)} -
-
Files
-
-
-
- -
-
- {formatBytes(repo.stats?.estimated_size_bytes || 0)} -
-
Size
-
-
-
- -
-
- {formatNumber(repo.stats?.estimated_tokens || 0)} -
-
Tokens
-
-
-
-
- - - )) - ) : ( - // No data state - - -

- No featured repositories available. Start by analyzing some repositories! -

- - - )} -
+ {/* AI Integration */} + + +
+
+ +
+ AI Integration +
+

+ Vercel AI SDK with OpenAI and Claude support +

+ + +
+
+ + Streaming chat interface +
+
+ + Multiple AI providers +
+
+ + Real-time responses +
+
+ + -
- - - -
-
+ {/* UI Components */} + + +
+
+ +
+ UI Components +
+

+ 40+ shadcn/ui components with dark mode +

+ + +
+
+ + Accessible components +
+
+ + Dark/light theme toggle +
+
+ + TailwindCSS v4 +
+
+ + - {/* Feature Cards */} -
-
-

Platform Features

-

Advanced insights and analysis tools for GitHub repositories

-
-
- - -

Code Statistics

-

Lines of code, file counts, and complexity metrics

+ {/* TypeScript */} + + +
+
+ +
+ TypeScript +
+

+ Type-safe development with strict mode +

+ + +
+
+ + Strict mode enabled +
+
+ + Path aliases configured +
+
+ + Type-safe API routes +
+
+ - - - -

AI Token Estimates

-

Estimates for GPT-4, Claude, and Gemini models

+ + {/* Developer Experience */} + + +
+
+ +
+ Developer Experience +
+

+ Optimized for productivity and maintainability +

+ + +
+
+ + Hot reload & fast refresh +
+
+ + ESLint & Prettier +
+
+ + Docker dev container +
+
+ +
+
+ + {/* AI Chat Demo */} + +
+
+

Try the AI Chat

+

+ Experience the integrated AI chat powered by Vercel AI SDK +

+
- - -

Documentation

-

Auto-generated docs and architecture diagrams

- +
+ + + +
+
+ + + {/* Quick Start Section */} +
+

Ready to Build Something Amazing?

+

+ Clone the repository, add your environment variables, and start building your next project in minutes. +

+ +
+ - - -

Tech Stack Analysis

-

Language breakdown and technology insights

- +
-
+
+ + {/* Footer */} +
); }