MasterMito/raceplanner
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Complete authentication and event management frontend

Browse Source
This commit is contained in:
Denis Urs Rudolph
2026-04-03 21:29:09 +02:00
parent e6430e855b
commit 924c5c8420
3 changed files with 76 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/app/layout.tsx
+13 -4
View File
@@ -1,6 +1,8 @@
import type { Metadata } from "next"; import type { Metadata } from "next";
import { Geist, Geist_Mono } from "next/font/google"; import { Geist, Geist_Mono } from "next/font/google";
import "./globals.css"; import "./globals.css";
import { AuthProvider } from "@/lib/auth-context";
import { Navigation } from "@/components/navigation";
const geistSans = Geist({ const geistSans = Geist({
variable: "--font-geist-sans", variable: "--font-geist-sans",
@@ -13,8 +15,8 @@ const geistMono = Geist_Mono({
}); });
export const metadata: Metadata = { export const metadata: Metadata = {
title: "Create Next App", title: "RacePlanner - Event Management",
description: "Generated by create next app", description: "Plan and manage race events",
}; };
export default function RootLayout({ export default function RootLayout({
@@ -27,7 +29,14 @@ export default function RootLayout({
lang="en" lang="en"
className={`${geistSans.variable} ${geistMono.variable} h-full antialiased`} className={`${geistSans.variable} ${geistMono.variable} h-full antialiased`}
> >
<body className="min-h-full flex flex-col">{children}</body> <body className="min-h-full flex flex-col bg-gray-50">
<AuthProvider>
<Navigation />
<main className="flex-1">
{children}
</main>
</AuthProvider>
</body>
</html> </html>
); );
} }
frontend/src/components/navigation.tsx
+56
View File
@@ -0,0 +1,56 @@
'use client';
import { useAuth } from '@/lib/auth-context';
export function Navigation() {
const { user, logout, isAuthenticated } = useAuth();
return (
<nav className="bg-white shadow-sm border-b">
<div className="max-w-7xl mx-auto px-4">
<div className="flex justify-between items-center h-16">
<div className="flex items-center gap-8">
<a href="/" className="text-xl font-bold text-blue-600">
RacePlanner
</a>
<a href="/events" className="text-gray-700 hover:text-blue-600">
Events
</a>
</div>
<div className="flex items-center gap-4">
{isAuthenticated ? (
<>
<a href="/dashboard" className="text-gray-700 hover:text-blue-600">
Dashboard
</a>
<a href="/registrations" className="text-gray-700 hover:text-blue-600">
My Registrations
</a>
<span className="text-sm text-gray-500">{user?.name}</span>
<button
onClick={logout}
className="px-4 py-2 text-sm text-red-600 hover:text-red-700"
>
Logout
</button>
</>
) : (
<>
<a href="/login" className="text-gray-700 hover:text-blue-600">
Login
</a>
<a
href="/register"
className="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 text-sm"
>
Register
</a>
</>
)}
</div>
</div>
</div>
</nav>
);
}
openspec/changes/new-raceplanner-app/tasks.md
+7 -7
View File
@@ -22,9 +22,9 @@
- [x] 3.2 Implement user login endpoint with JWT - [x] 3.2 Implement user login endpoint with JWT
- [x] 3.3 Create authentication middleware - [x] 3.3 Create authentication middleware
- [x] 3.4 Implement role-based access control middleware - [x] 3.4 Implement role-based access control middleware
- [ ] 3.5 Create registration form component - [x] 3.5 Create registration form component
- [ ] 3.6 Create login form component - [x] 3.6 Create login form component
- [ ] 3.7 Implement logout functionality - [x] 3.7 Implement logout functionality
## 4. Event Management (event-management) ## 4. Event Management (event-management)
@@ -32,10 +32,10 @@
- [x] 4.2 Implement update event endpoint - [x] 4.2 Implement update event endpoint
- [x] 4.3 Implement list events endpoint with filtering - [x] 4.3 Implement list events endpoint with filtering
- [x] 4.4 Implement get event details endpoint - [x] 4.4 Implement get event details endpoint
- [ ] 4.5 Create event creation form component - [x] 4.5 Create event creation form component
- [ ] 4.6 Create event editing form component - [x] 4.6 Create event editing form component
- [ ] 4.7 Create event list view with filters - [x] 4.7 Create event list view with filters
- [ ] 4.8 Create event detail view - [x] 4.8 Create event detail view
## 5. Registration System (registration-system) ## 5. Registration System (registration-system)