diff --git a/packages/berlin/src/components/events/Events.tsx b/packages/berlin/src/components/events/Events.tsx index 953c53b7..e95c794d 100644 --- a/packages/berlin/src/components/events/Events.tsx +++ b/packages/berlin/src/components/events/Events.tsx @@ -24,7 +24,7 @@ export default function Events({ events, errorMessage }: EventsProps) { return (
handleClick(event.id)} >
@@ -44,13 +44,15 @@ export default function Events({ events, errorMessage }: EventsProps) { )}
-
- {`${event.name} -
+ {event.imageUrl && ( +
+ {`${event.name} +
+ )}
); }) diff --git a/packages/berlin/src/components/header/Header.tsx b/packages/berlin/src/components/header/Header.tsx index 87b0cfb4..bd2f3b63 100644 --- a/packages/berlin/src/components/header/Header.tsx +++ b/packages/berlin/src/components/header/Header.tsx @@ -7,7 +7,6 @@ import { Menu, User } from 'lucide-react'; // API import { fetchEventNavLinks, - fetchEvents, fetchNavLinks, fetchUserRegistrations, GetUserResponse, @@ -31,10 +30,11 @@ import Icon from '../icon'; import ThemeToggler from '../theme-toggler'; import ZupassLoginButton from '../zupass-button'; -export default function NewHeader() { +export default function Header() { const theme = useAppStore((state) => state.theme); - const { user } = useUser(); const [isMenuOpen, setIsMenuOpen] = useState(false); + const navigate = useNavigate(); + const { user } = useUser(); return (
@@ -50,7 +50,7 @@ export default function NewHeader() { )}
-
+
navigate('/')}> Lexicon Logo

Lexicon

@@ -86,12 +86,6 @@ export default function NewHeader() { const HeaderLinks = ({ user }: { user: GetUserResponse }) => { const { eventId } = useParams(); - const { data: events } = useQuery({ - queryKey: ['events'], - queryFn: () => fetchEvents({ serverUrl: import.meta.env.VITE_SERVER_URL }), - enabled: !!user, - }); - const { data: registrationsData } = useQuery({ queryKey: [user?.id, 'registrations'], queryFn: () => @@ -109,7 +103,6 @@ const HeaderLinks = ({ user }: { user: GetUserResponse }) => { refetchInterval: 10000, }); - // eslint-disable-next-line @typescript-eslint/no-unused-vars const { data: eventNavLinks } = useQuery({ queryKey: ['eventNavLinks'], queryFn: () => @@ -119,37 +112,47 @@ const HeaderLinks = ({ user }: { user: GetUserResponse }) => { }); const links = useMemo(() => { - const baseLinks = [ - { - title: 'My Proposals', - link: events ? `/events/${events?.[0].id}/register` : '', - }, - { - title: 'Agenda', - link: events ? `/events/${events?.[0].id}/cycles` : '', - }, - ]; - - if ( - registrationsData?.some((registration) => registration.status === 'APPROVED') && - navLinks && - navLinks.length > 0 - ) { - const additionalNavLinks = navLinks.map((eventNavLink) => ({ - title: eventNavLink.title, - link: eventNavLink.link || '', - })); - return [...baseLinks, ...additionalNavLinks]; + if (eventId) { + // User is within an event + const approvedRegistration = + registrationsData + ?.filter((reg) => reg.eventId === eventId) + .some((registration) => registration.status === 'APPROVED') ?? false; + + const eventBaseLinks = [ + { + title: 'My Proposals', + link: `/events/${eventId}/register`, + }, + { + title: 'Agenda', + link: `/events/${eventId}/cycles`, + }, + ]; + + const fetchedEventNavLinks = eventNavLinks?.map(({ title, link }) => ({ title, link })) ?? []; + + return approvedRegistration ? [...fetchedEventNavLinks, ...eventBaseLinks] : []; + } else { + // User is outside of an event + const baseLinks = [ + { + title: 'Events', + link: `/events`, + }, + ]; + + const fetchedNavLinks = navLinks?.map(({ title, link }) => ({ title, link })) ?? []; + + return [...fetchedNavLinks, ...baseLinks]; } - - return baseLinks; - }, [events, registrationsData, navLinks]); + }, [eventId, eventNavLinks, navLinks, registrationsData]); return links.map(({ title, link }) => ( {title} diff --git a/packages/berlin/src/pages/Events.tsx b/packages/berlin/src/pages/Events.tsx index 685ca579..f796d4d6 100644 --- a/packages/berlin/src/pages/Events.tsx +++ b/packages/berlin/src/pages/Events.tsx @@ -41,7 +41,7 @@ function Events() { Events
-
+