cardosofelipe/eventspace
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add "Edit" button to event details page

Browse Source 
Introduced an "Edit" button in the event details header for improved user access to editing event information. This button uses a link with an outline variant and includes an icon for better visual context. The layout was adjusted to accommodate the new button while preserving responsiveness.
This commit is contained in:
Felipe Cardoso
2025-03-14 03:06:39 +01:00
parent e50fca4e77
commit 74d37fc54c
1 changed files with 41 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
frontend/src/app/(main)/dashboard/events/[slug]/page.tsx
View File

@@ -21,6 +21,7 @@ import {
Loader2Icon, Loader2Icon,
MailIcon, MailIcon,
MapPinIcon, MapPinIcon,
PencilIcon,
PhoneIcon, PhoneIcon,
} from "lucide-react"; } from "lucide-react";
@@ -77,39 +78,47 @@ export default function EventDetailPage() {
return ( return (
<div> <div>
<header className="mb-8"> <header className="mb-8 flex justify-between items-start">
<h1 className="text-4xl font-bold tracking-tight">{event.title}</h1> <div>
<div className="mt-2 flex items-center gap-2"> <h1 className="text-4xl font-bold tracking-tight">{event.title}</h1>
{event.is_public ? ( <div className="mt-2 flex items-center gap-2">
<Badge variant="default">Public</Badge> {event.is_public ? (
) : ( <Badge variant="default">Public</Badge>
<Badge variant="secondary">Private</Badge> ) : (
)} <Badge variant="secondary">Private</Badge>
{event.is_active && ( )}
<Badge {event.is_active && (
variant="outline" <Badge
className="bg-green-50 text-green-700 border-green-200" variant="outline"
> className="bg-green-50 text-green-700 border-green-200"
Active >
</Badge> Active
)} </Badge>
{event.rsvp_enabled && ( )}
<Badge {event.rsvp_enabled && (
variant="outline" <Badge
className="bg-blue-50 text-blue-700 border-blue-200" variant="outline"
> className="bg-blue-50 text-blue-700 border-blue-200"
RSVP Enabled >
</Badge> RSVP Enabled
)} </Badge>
{event.gift_registry_enabled && ( )}
<Badge {event.gift_registry_enabled && (
variant="outline" <Badge
className="bg-purple-50 text-purple-700 border-purple-200" variant="outline"
> className="bg-purple-50 text-purple-700 border-purple-200"
Gift Registry >
</Badge> Gift Registry
)} </Badge>
)}
</div>
</div> </div>
<Button asChild variant="outline" className="flex items-center gap-2">
<Link href={`/dashboard/events/${event.slug}/edit`}>
<PencilIcon className="h-4 w-4" />
<span>Edit</span>
</Link>
</Button>
</header> </header>
<div className="grid grid-cols-1 md:grid-cols-3 gap-6"> <div className="grid grid-cols-1 md:grid-cols-3 gap-6">