fucking stupid commit

firebase-config.ts

@@ -0,0 +1,14 @@
+// src/firebase-config.ts
+import { initializeApp } from 'firebase/app';
+import { getAuth } from 'firebase/auth';
+
+const firebaseConfig = {
+    apiKey: "AIzaSyAWY7JVT8SXo0_ROK1wRO5aw55cs1iBcsA",
+    authDomain: "shellhacks-go.firebaseapp.com",
+    projectId: "shellhacks-go",
+    storageBucket: "shellhacks-go.appspot.com",
+    messagingSenderId: "1037212198068",
+    appId: "1:1037212198068:web:b3541842a649dc87b6a3e1"
+};
+const app = initializeApp(firebaseConfig);
+export const auth = getAuth(app);

package.json

@@ -15,17 +15,23 @@
     "@astrojs/tailwind": "^5.1.1",
     "@astrojs/vercel": "^7.8.1",
     "@auth0/auth0-react": "^2.2.4",
+    "@auth0/auth0-spa-js": "^2.1.3",
     "@radix-ui/react-dialog": "^1.1.1",
     "@radix-ui/react-dropdown-menu": "^2.1.1",
     "@radix-ui/react-icons": "^1.3.0",
+    "@radix-ui/react-label": "^2.1.0",
     "@radix-ui/react-navigation-menu": "^1.2.0",
+    "@radix-ui/react-separator": "^1.1.0",
     "@radix-ui/react-slot": "^1.1.0",
     "@radix-ui/react-tabs": "^1.1.0",
     "@radix-ui/react-toast": "^1.2.1",
     "astro": "^4.15.9",
+    "auth0-js": "^9.27.0",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.1",
     "elevenlabs": "^0.16.0",
+    "firebase": "^10.13.2",
+    "firebaseui": "^6.1.0",
     "framer-motion": "^11.9.0",
     "lucide-react": "^0.446.0",
     "radix-ui": "^1.0.1",

src/components/FirebaseAuth.tsx

@@ -0,0 +1,181 @@
+import { useState, useEffect } from 'react'
+import { initializeApp } from 'firebase/app'
+import { getAuth, createUserWithEmailAndPassword, signInWithEmailAndPassword, onAuthStateChanged, signOut, GoogleAuthProvider, signInWithPopup } from 'firebase/auth'
+import type { User } from 'firebase/auth'
+import { Button } from "@/components/ui/button"
+import { Input } from "@/components/ui/input"
+import { Label } from "@/components/ui/label"
+import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
+import { Separator } from "@/components/ui/separator"
+import { logout } from '@/utils/logout'
+import { Cookie } from 'lucide-react'
+import Cookies from 'js-cookie'
+
+const firebaseConfig = {
+    apiKey: "AIzaSyAWY7JVT8SXo0_ROK1wRO5aw55cs1iBcsA",
+    authDomain: "shellhacks-go.firebaseapp.com",
+    projectId: "shellhacks-go",
+    storageBucket: "shellhacks-go.appspot.com",
+    messagingSenderId: "1037212198068",
+    appId: "1:1037212198068:web:b3541842a649dc87b6a3e1"
+};
+
+// Initialize Firebase
+const app = initializeApp(firebaseConfig)
+const auth = getAuth(app)
+const googleProvider = new GoogleAuthProvider()
+
+export default function FirebaseAuthComponent() {
+    const [email, setEmail] = useState('')
+    const [password, setPassword] = useState('')
+    const [user, setUser] = useState<User | null>(null)
+    const [error, setError] = useState<string | null>(null)
+
+    useEffect(() => {
+        const unsubscribe = onAuthStateChanged(auth, (currentUser) => {
+            setUser(currentUser)
+            console.log('User:', currentUser)
+            fetch('http://3.147.36.237:3000/callback', {
+                method: 'GET',
+                headers: {
+                  'Authorization': `Bearer ${user?.accessToken}` // Include ID token in request
+                }
+              });
+        });
+        return () => unsubscribe()
+    }, [])
+
+    const handleSignup = async (e: React.FormEvent) => {
+        e.preventDefault()
+        try {
+            console.log('Creating account')
+            await createUserWithEmailAndPassword(auth, email, password)
+            setError(null)
+        } catch (error) {
+            setError('Failed to create an account')
+            console.error(error)
+        }
+    }
+
+    const handleLogin = async (e: React.FormEvent) => {
+        e.preventDefault()
+        try {
+            await signInWithEmailAndPassword(auth, email, password)
+            console.log('Logged in')
+            setError(null)
+        } catch (error) {
+            setError('Failed to log in')
+            console.error(error)
+        }
+    }
+
+    const handleGoogleSignIn = async () => {
+        try {
+            await signInWithPopup(auth, googleProvider)
+            setError(null)
+        } catch (error) {
+            setError('Failed to sign in with Google')
+            console.error(error)
+        }
+    }
+
+    const handleLogout = async () => {
+        try {
+            await signOut(auth)
+            logout();
+            console.log('Logged out')
+        } catch (error) {
+            console.error('Failed to log out', error)
+        }
+    }
+
+    return (
+        <Card className="w-[350px]">
+            <CardHeader>
+                <CardTitle>Firebase Authentication</CardTitle>
+                <CardDescription>Login or create a new account</CardDescription>
+            </CardHeader>
+            <CardContent>
+                {user ? (
+                    <div className="text-center">
+                        <p className="mb-4">Welcome, {user.email}!</p>
+                        <Button onClick={handleLogout}>Logout</Button>
+                    </div>
+                ) : (
+                    <Tabs defaultValue="login">
+                        <TabsList className="grid w-full grid-cols-2">
+                            <TabsTrigger value="login">Login</TabsTrigger>
+                            <TabsTrigger value="signup">Signup</TabsTrigger>
+                        </TabsList>
+                        <TabsContent value="login">
+                            <form onSubmit={handleLogin} className="space-y-4">
+                                <div className="space-y-2">
+                                    <Label htmlFor="login-email">Email</Label>
+                                    <Input
+                                        id="login-email"
+                                        type="email"
+                                        placeholder="Email"
+                                        value={email}
+                                        onChange={(e) => setEmail(e.target.value)}
+                                        required
+                                    />
+                                </div>
+                                <div className="space-y-2">
+                                    <Label htmlFor="login-password">Password</Label>
+                                    <Input
+                                        id="login-password"
+                                        type="password"
+                                        placeholder="Password"
+                                        value={password}
+                                        onChange={(e) => setPassword(e.target.value)}
+                                        required
+                                    />
+                                </div>
+                                <Button type="submit" className="w-full">Login</Button>
+                            </form>
+                        </TabsContent>
+                        <TabsContent value="signup">
+                            <form onSubmit={handleSignup} className="space-y-4">
+                                <div className="space-y-2">
+                                    <Label htmlFor="signup-email">Email</Label>
+                                    <Input
+                                        id="signup-email"
+                                        type="email"
+                                        placeholder="Email"
+                                        value={email}
+                                        onChange={(e) => setEmail(e.target.value)}
+                                        required
+                                    />
+                                </div>
+                                <div className="space-y-2">
+                                    <Label htmlFor="signup-password">Password</Label>
+                                    <Input
+                                        id="signup-password"
+                                        type="password"
+                                        placeholder="Password"
+                                        value={password}
+                                        onChange={(e) => setPassword(e.target.value)}
+                                        required
+                                    />
+                                </div>
+                                <Button type="submit" className="w-full">Sign Up</Button>
+                            </form>
+                        </TabsContent>
+                    </Tabs>
+                )}
+                {!user && (
+                    <>
+                        <Separator className="my-4" />
+                        <Button onClick={handleGoogleSignIn} variant="outline" className="w-full">
+                            Sign in with Google
+                        </Button>
+                    </>
+                )}
+            </CardContent>
+            <CardFooter>
+                {error && <p className="text-red-500 text-sm">{error}</p>}
+            </CardFooter>
+        </Card>
+    )
+}

src/components/Landing.tsx

@@ -6,7 +6,7 @@ import { BookOpen, Brain, Lightbulb, Rocket } from "lucide-react"
 
 export default function LandingPage() {
   useEffect(() => {
-
+    console.log('Fetching data from the API...');
     fetch('http://3.147.36.237:3000/api/cards/ret-cards', {
         method: 'GET',
         headers: {
@@ -20,7 +20,7 @@ export default function LandingPage() {
     .catch(error => {
         console.error('Error during API request:', error);
     });
-}, []); 
+}, []);
   return (
     <main className="flex-grow">
       <section className="bg-gradient-to-b to-white from-white py-20">

src/components/ui/input.tsx

@@ -0,0 +1,25 @@
+import * as React from "react"
+
+import { cn } from "@/lib/utils"
+
+export interface InputProps
+  extends React.InputHTMLAttributes<HTMLInputElement> {}
+
+const Input = React.forwardRef<HTMLInputElement, InputProps>(
+  ({ className, type, ...props }, ref) => {
+    return (
+      <input
+        type={type}
+        className={cn(
+          "flex h-9 w-full rounded-md border border-neutral-200 bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-neutral-950 placeholder:text-neutral-500 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-neutral-950 disabled:cursor-not-allowed disabled:opacity-50 dark:border-neutral-800 dark:file:text-neutral-50 dark:placeholder:text-neutral-400 dark:focus-visible:ring-neutral-300",
+          className
+        )}
+        ref={ref}
+        {...props}
+      />
+    )
+  }
+)
+Input.displayName = "Input"
+
+export { Input }

src/components/ui/label.tsx

@@ -0,0 +1,24 @@
+import * as React from "react"
+import * as LabelPrimitive from "@radix-ui/react-label"
+import { cva, type VariantProps } from "class-variance-authority"
+
+import { cn } from "@/lib/utils"
+
+const labelVariants = cva(
+  "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+)
+
+const Label = React.forwardRef<
+  React.ElementRef<typeof LabelPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> &
+    VariantProps<typeof labelVariants>
+>(({ className, ...props }, ref) => (
+  <LabelPrimitive.Root
+    ref={ref}
+    className={cn(labelVariants(), className)}
+    {...props}
+  />
+))
+Label.displayName = LabelPrimitive.Root.displayName
+
+export { Label }

src/components/ui/separator.tsx

@@ -0,0 +1,29 @@
+import * as React from "react"
+import * as SeparatorPrimitive from "@radix-ui/react-separator"
+
+import { cn } from "@/lib/utils"
+
+const Separator = React.forwardRef<
+  React.ElementRef<typeof SeparatorPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>
+>(
+  (
+    { className, orientation = "horizontal", decorative = true, ...props },
+    ref
+  ) => (
+    <SeparatorPrimitive.Root
+      ref={ref}
+      decorative={decorative}
+      orientation={orientation}
+      className={cn(
+        "shrink-0 bg-neutral-200 dark:bg-neutral-800",
+        orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
+        className
+      )}
+      {...props}
+    />
+  )
+)
+Separator.displayName = SeparatorPrimitive.Root.displayName
+
+export { Separator }

src/layouts/AppLayout.astro

@@ -22,7 +22,7 @@ import { ViewTransitions } from "astro:transitions";
 	<body class="min-h-screen flex flex-col">
 		<div class="flex flex-col min-h-screen">
 			<!-- <Header client:only="react" /> -->
-			<DashboardHeader client:only="react"/>
+			<DashboardHeader client:only="react" />
 			<main class="flex-grow" transition:animate="slide">
 				<div class="container mx-auto px-4 py-8">
 					<!-- This is where the page-specific content will go -->