complete

Author: sumitbhuia

.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": ["next/core-web-vitals", "next/typescript"]
+}

.gitignore

@@ -0,0 +1,38 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*
+.local
+.env
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

README.md

@@ -0,0 +1,33 @@
+import { NextResponse } from 'next/server'
+import { PrismaClient } from '@prisma/client'
+import { cookies } from 'next/headers'
+
+const prisma = new PrismaClient()
+
+export async function POST(request: Request) {
+    const { username, password } = await request.json()
+    console.log('Received username:', username)
+    console.log('Received password:', password)
+  
+    try {
+      const user = await prisma.user.findUnique({ where: { username } })
+      if (!user) {
+        console.log('User not found')
+        return NextResponse.json({ error: 'Invalid credentials' }, { status: 400 })
+      }
+
+    if (user.password !== password) {
+        console.log('Invalid password')
+        return NextResponse.json({ error: 'Invalid credentials' }, { status: 400 })
+    }
+  
+      cookies().set('userId', user.id, { httpOnly: true, secure: process.env.NODE_ENV === 'production' })
+      cookies().set('username', user.username, { httpOnly: true, secure: process.env.NODE_ENV === 'production' })
+  
+      return NextResponse.json({ message: 'Login successful' })
+    } catch (error) {
+      console.error('Login error:', error)
+      return NextResponse.json({ error: 'An error occurred during login' }, { status: 500 })
+    }
+  }
+  

app/api/login/route.ts

@@ -0,0 +1,39 @@
+'use server'
+
+import { cookies } from 'next/headers'
+import { getUserById, getAllUsers, updateUserTopic } from '@/lib/data'
+import { User, LeaderboardEntry, Topic } from './types'
+
+export async function getUserData(): Promise<User> {
+  const userId = cookies().get('userId')?.value
+  if (!userId) {
+    throw new Error('User not authenticated')
+  }
+  const user = await getUserById(userId)
+  if (!user) {
+    throw new Error('User not found')
+  }
+  return user
+}
+
+export async function getLeaderboardData(): Promise<LeaderboardEntry[]> {
+  const users = await getAllUsers()
+  return users.map(user => ({
+    name: user.username,
+    progress: calculateOverallProgress(user.topics),
+    avatar: '/placeholder.svg?height=40&width=40',
+    topics: user.topics,
+  })).sort((a, b) => b.progress - a.progress)
+}
+
+export async function updateTopic(topicName: string, field: keyof Topic, value: number): Promise<Topic> {
+  const userId = cookies().get('userId')?.value
+  if (!userId) {
+    throw new Error('User not authenticated')
+  }
+  return await updateUserTopic(userId, topicName, field, value)
+}
+
+function calculateOverallProgress(topics: Topic[]): number {
+  return Math.round(topics.reduce((sum, topic) => sum + topic.progress, 0) / topics.length)
+}

app/dashboard/action.ts

@@ -0,0 +1,13 @@
+import { DashboardComponent } from "@/components/dashboard";
+
+export default function Dashboard() {
+  return (
+
+
+        <div className="bg-stone-950 text-white">
+          <DashboardComponent />
+        </div>
+
+
+  );
+}

app/dashboard/page.tsx

@@ -0,0 +1,40 @@
+export interface Topic {
+    name: string;
+    progress: number;
+    learning: number;
+    leetcodeEasy: number;
+    leetcodeMedium: number;
+    leetcodeHard: number;
+  }
+  
+  export interface User {
+    id: string;
+    username: string;
+    topics: Topic[];
+  }
+  
+  export interface LeaderboardEntry {
+    name: string;
+    progress: number;
+    avatar: string;
+    topics: Topic[];
+  }
+
+
+
+export interface Topic {
+  id: string;
+  name: string;
+  progress: number;
+  learning: number;
+  leetcodeEasy: number;
+  leetcodeMedium: number;
+  leetcodeHard: number;
+  userId: string;
+}
+
+export interface Toast {
+  title: string;
+  description: string;
+  variant?: 'default' | 'destructive';
+}

app/dashboard/types.ts

@@ -0,0 +1,95 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+body {
+  font-family: Arial, Helvetica, sans-serif;
+}
+
+@layer utilities {
+  .text-balance {
+    text-wrap: balance;
+  }
+}
+
+@layer base {
+  :root {
+    --background: 0 0% 100%;
+    --foreground: 20 14.3% 4.1%;
+    --card: 0 0% 100%;
+    --card-foreground: 20 14.3% 4.1%;
+    --popover: 0 0% 100%;
+    --popover-foreground: 20 14.3% 4.1%;
+    --primary: 24 9.8% 10%;
+    --primary-foreground: 60 9.1% 97.8%;
+    --secondary: 60 4.8% 95.9%;
+    --secondary-foreground: 24 9.8% 10%;
+    --muted: 60 4.8% 95.9%;
+    --muted-foreground: 25 5.3% 44.7%;
+    --accent: 60 4.8% 95.9%;
+    --accent-foreground: 24 9.8% 10%;
+    --destructive: 0 84.2% 60.2%;
+    --destructive-foreground: 60 9.1% 97.8%;
+    --border: 20 5.9% 90%;
+    --input: 20 5.9% 90%;
+    --ring: 20 14.3% 4.1%;
+    --chart-1: 12 76% 61%;
+    --chart-2: 173 58% 39%;
+    --chart-3: 197 37% 24%;
+    --chart-4: 43 74% 66%;
+    --chart-5: 27 87% 67%;
+    --radius: 0.5rem;
+  }
+  .dark {
+    --background: 20 14.3% 4.1%;
+    --foreground: 60 9.1% 97.8%;
+    --card: 20 14.3% 4.1%;
+    --card-foreground: 60 9.1% 97.8%;
+    --popover: 20 14.3% 4.1%;
+    --popover-foreground: 60 9.1% 97.8%;
+    --primary: 60 9.1% 97.8%;
+    --primary-foreground: 24 9.8% 10%;
+    --secondary: 12 6.5% 15.1%;
+    --secondary-foreground: 60 9.1% 97.8%;
+    --muted: 12 6.5% 15.1%;
+    --muted-foreground: 24 5.4% 63.9%;
+    --accent: 12 6.5% 15.1%;
+    --accent-foreground: 60 9.1% 97.8%;
+    --destructive: 0 62.8% 30.6%;
+    --destructive-foreground: 60 9.1% 97.8%;
+    --border: 12 6.5% 15.1%;
+    --input: 12 6.5% 15.1%;
+    --ring: 24 5.7% 82.9%;
+    --chart-1: 220 70% 50%;
+    --chart-2: 160 60% 45%;
+    --chart-3: 30 80% 55%;
+    --chart-4: 280 65% 60%;
+    --chart-5: 340 75% 55%;
+  }
+}
+
+@layer base {
+  * {
+    @apply border-border;
+  }
+  body {
+    @apply bg-background text-foreground;
+  }
+}
+
+.toast {
+  background-color: #1a202c;
+  color: white;
+  padding: 12px;
+  border-radius: 8px;
+  display: flex;
+  flex-direction: column;
+}
+
+.toast.destructive {
+  background-color: #e53e3e;
+}
+
+.toast.default {
+  background-color: #2d3748;
+}

app/favicon.ico

@@ -0,0 +1,38 @@
+import type { Metadata } from "next";
+import localFont from "next/font/local";
+import "./globals.css";
+import { ToastProvider } from "@/components/ui/toast"; 
+
+const geistSans = localFont({
+  src: "./fonts/GeistVF.woff",
+  variable: "--font-geist-sans",
+  weight: "100 900",
+});
+const geistMono = localFont({
+  src: "./fonts/GeistMonoVF.woff",
+  variable: "--font-geist-mono",
+  weight: "100 900",
+});
+
+export const metadata: Metadata = {
+  title: "DSA Progress",
+  description: "Track your DSA progress",
+};
+
+export default function RootLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return (
+    <html lang="en">
+      <body
+        className={`${geistSans.variable} ${geistMono.variable} antialiased`}
+      >
+        <ToastProvider>
+        {children}
+        </ToastProvider>
+      </body>
+    </html>
+  );
+}

app/fonts/GeistMonoVF.woff

@@ -0,0 +1,69 @@
+'use client'
+
+import { useState } from 'react'
+import { useRouter } from 'next/navigation'
+import { Button } from "@/components/ui/button"
+import { Input } from "@/components/ui/input"
+import { useToast } from "@/components/ui/toast"
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
+
+
+export default function LoginPage() {
+  const [username, setUsername] = useState('')
+  const [password, setPassword] = useState('')
+  const router = useRouter()
+  const { toast } = useToast()
+
+  const handleLogin = async (e: React.FormEvent) => {
+    e.preventDefault()
+    try {
+      const response = await fetch('/api/login', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ username, password }),
+      })
+      if (!response.ok) {
+        throw new Error('Login failed')
+      }
+      router.push('/dashboard')
+    } catch (error) {
+      toast({
+        title: "Login Error",
+        description: error instanceof Error ? error.message : 'An error occurred during login',
+        variant: "destructive",
+      })
+    }
+  }
+
+  return (
+    <div className="flex items-center justify-center min-h-screen bg-black">
+        <Card className="w-full max-w-md bg-black border-green-600">
+        <CardHeader>
+          <CardTitle className='text-green-600 flex justify-center items-center'>Login to DSA Progress</CardTitle>
+          <CardDescription className='text-gray-600 flex justify-center items-center'>Enter your credentials to access your dashboard</CardDescription>
+        </CardHeader>
+        <CardContent>
+      <form onSubmit={handleLogin} className="space-y-4">
+        <Input
+          className='text-white bg-black border-green-600'
+          type="text"
+          value={username}
+          onChange={(e) => setUsername(e.target.value)}
+          placeholder="Username"
+          required
+        />
+        <Input
+        className='text-white bg-black border-green-600'
+          type="password"
+          value={password}
+          onChange={(e) => setPassword(e.target.value)}
+          placeholder="Password"
+          required
+        />
+        <Button className='text-white w-full text-lg my-10  border border-input bg-green-600 hover:bg-green-950 hover:text-white' type="submit">Login</Button>
+      </form>
+      </CardContent>
+      </Card>
+    </div>
+  )
+}

app/fonts/GeistVF.woff

@@ -0,0 +1,13 @@
+import { DashboardComponent } from "../components/dashboard";
+
+export default function Dashboard() {
+  return (
+
+
+        <div className="bg-stone-950 text-white">
+          <DashboardComponent />
+        </div>
+
+
+  );
+}