M frontend/containers/TravelColumns/index.tsx → frontend/containers/TravelColumns/index.tsx

@@ -38,8 +38,8 @@ if (!user) return false;
     const isInWaitingList = event?.waitingPassengers?.some(
       passenger => passenger.user?.id === `${user.id}`
     );
-    const isInTravel = event?.travels.some(travel =>
-      travel.passengers.some(passenger => passenger.user?.id === `${user.id}`)
+    const isInTravel = event?.travels?.some(travel =>
+      travel.passengers?.some(passenger => passenger.user?.id === `${user.id}`)
     );
     return !(isInWaitingList || isInTravel);
   }, [event, user]);
@@ -69,36 +69,24 @@ eventName={event?.name}
           title={t('event.no_travel.title')}
         />
       )) || (
-        <div className={classes.slider}>
-          <Slider ref={slider} {...sliderSettings}>
-            {sortedTravels?.map(travel => (
-              <Container
-                key={travel.id}
-                maxWidth="sm"
-                className={classes.slide}
-              >
-                <Travel
-                  travel={travel}
-                  {...props}
-                  canAddSelf={canAddSelf}
-                  getAddPassengerFunction={(addSelf: boolean) => () => {
-                    if (addSelf) {
-                      return addSelfToTravel(travel);
-                    } else {
-                      return toggleNewPassengerToTravel({travel});
-                    }
-                  }}
-                />
-              </Container>
-            ))}
-            <Container maxWidth="sm" className={classes.slide}>
-              <NoCar
-                eventName={event?.name}
-                title={t('event.no_other_travel.title')}
+        <Slider ref={slider} {...sliderSettings}>
+          {sortedTravels?.map(travel => (
+            <Container key={travel.id} maxWidth="sm" className={classes.slide}>
+              <Travel
+                travel={travel}
+                {...props}
+                canAddSelf={canAddSelf}
+                getAddPassengerFunction={(addSelf: boolean) => () => addSelf ? addSelfToTravel(travel): toggleNewPassengerToTravel({travel})}
               />
             </Container>
-          </Slider>
-        </div>
+          ))}
+          <Container maxWidth="sm" className={classes.slide}>
+            <NoCar
+              eventName={event?.name}
+              title={t('event.no_other_travel.title')}
+            />
+          </Container>
+        </Slider>
       )}
       {!!newPassengerTravelContext && (
         <AddPassengerToTravel
@@ -153,17 +141,6 @@ '& .slick-dots li:first-child button:before, & .slick-dots li:last-child button:before':
       {
         color: theme.palette.primary.main,
       },
-  },
-  slider: {
-    flexGrow: 1,
-    height: 1,
-    '& .slick-slider': {
-      height: '100%',
-      '& .slick-list': {
-        overflow: 'visible',
-      },
-      cursor: 'grab',
-    },
   },
   slide: {
     padding: theme.spacing(1),

M frontend/containers/WaitingList/index.tsx → frontend/containers/WaitingList/index.tsx

@@ -1,5 +1,4 @@ 
 import {useReducer, useState, useMemo, useCallback} from 'react';
-import clsx from 'clsx';
 import Typography from '@material-ui/core/Typography';
 import IconButton from '@material-ui/core/IconButton';
 import Icon from '@material-ui/core/Icon';

M frontend/pages/e/[uuid]/waitingList.tsx → frontend/pages/e/[uuid]/waitingList.tsx

@@ -1,8 +1,6 @@ 
 import {useState, useMemo, PropsWithChildren} from 'react';
-import EventLayout, { TabComponent } from '../../../layouts/Event';
-import {
-  EventByUuidDocument,
-} from '../../../generated/graphql';
+import EventLayout, {TabComponent} from '../../../layouts/Event';
+import {EventByUuidDocument} from '../../../generated/graphql';
 import useProfile from '../../../hooks/useProfile';
 import WaitingList from '../../../containers/WaitingList';
 import {AddPassengerToWaitingList} from '../../../containers/NewPassengerDialog';
@@ -20,7 +18,7 @@ const Page = (props: PropsWithChildren<Props>) => {
   return <EventLayout {...props} Tab={WaitingListTab} />;
 };
 
-const WaitingListTab: TabComponent = (props: {event}) => {
+const WaitingListTab: TabComponent = ({event}) => {
   const {user} = useProfile();
   const [addPassengerToWaitingListContext, toggleNewPassengerToWaitingList] =
     useState<NewPassengerDialogContext | null>(null);
@@ -30,8 +28,8 @@ if (!user) return false;
     const isInWaitingList = event?.waitingPassengers?.some(
       passenger => passenger.user?.id === `${user.id}`
     );
-    const isInTravel = event?.travels.some(travel =>
-      travel.passengers.some(passenger => passenger.user?.id === `${user.id}`)
+    const isInTravel = event?.travels?.some(travel =>
+      travel.passengers?.some(passenger => passenger.user?.id === `${user.id}`)
     );
     return !(isInWaitingList || isInTravel);
   }, [event, user]);