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

@@ -1,5 +1,8 @@ 
+import Button from '@mui/material/Button';
 import Typography from '@mui/material/Typography';
 import {useTheme} from '@mui/material/styles';
+import {useTranslation} from 'react-i18next';
+import {useRouter} from 'next/router';
 import Box from '@mui/material/Box';
 import ShareEvent from '../ShareEvent';
 import SupportCaroster from '../SupportCaroster';
@@ -7,22 +10,18 @@ 
 interface Props {
   eventName: string;
   title: string;
-  description: string;
+  isCarosterPlus: string;
   showImage?: boolean;
 }
 
-const NoCar = ({eventName, title, description, showImage}: Props) => {
+const NoCar = ({eventName, title, isCarosterPlus, showImage}: Props) => {
+  const {t} = useTranslation();
   const theme = useTheme();
+  const router = useRouter();
+  const {uuid} = router.query
 
   return (
-    <Box
-      my={4}
-      mx="auto"
-      pb={16}
-      mt={9}
-      maxWidth="100%"
-      width={340}
-    >
+    <Box my={4} mx="auto" pb={16} mt={9} maxWidth="100%" width={340}>
       <Typography variant="h6" align="center" color="textSecondary">
         {title}
       </Typography>
@@ -43,16 +42,31 @@ src="/assets/car.png"
         />
       )}
       <Typography sx={{whiteSpace: 'pre-line', mt: 4}} color="textSecondary">
-        {description}
+        {isCarosterPlus
+          ? t('event.no_travel.plus.desc')
+          : t('event.no_travel.desc')}
       </Typography>
-      <ShareEvent
-        color="primary"
-        sx={{
-          mt: 4,
-          backgroundColor: '#fff',
-        }}
-        title={`Caroster ${eventName}`}
-      />
+      {!isCarosterPlus && (
+        <ShareEvent
+          color="primary"
+          sx={{
+            mt: 4,
+            backgroundColor: '#fff',
+          }}
+          title={`Caroster ${eventName}`}
+        />
+      )}
+      {isCarosterPlus && (
+        <Box textAlign="center" width={1} mt={4}>
+          <Button
+            variant="outlined"
+            color="primary"
+            onClick={() => router.push(`/e/${uuid}/alerts`)}
+          >
+            {t('event.no_travel.plus.action')}
+          </Button>
+        </Box>
+      )}
       <Box mt={4} display="flex" justifyContent="center">
         <SupportCaroster />
       </Box>

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

@@ -1,6 +1,7 @@ 
 import {useMemo, useState} from 'react';
 import Masonry from '@mui/lab/Masonry';
 import Box from '@mui/material/Box';
+import moment from 'moment';
 import {useTranslation} from 'react-i18next';
 import {useTheme} from '@mui/material/styles';
 import useEventStore from '../../stores/useEventStore';
@@ -19,7 +20,6 @@ import usePermissions from '../../hooks/usePermissions';
 import useDisplayTravels from './useDisplayTravels';
 import useDisplayMarkers from './useDisplayMarkers';
 import FilterByDate from '../../components/FilterByDate';
-import moment from 'moment';
 
 interface Props {
   toggle: () => void;
@@ -76,11 +76,7 @@ <NoCar
         showImage
         eventName={event?.name}
         title={t('event.no_travel.title')}
-        description={
-          isCarosterPlus
-            ? t('event.no_travel.plus.desc')
-            : t('event.no_travel.desc')
-        }
+        isCarosterPlus={isCarosterPlus}
       />
     );
 
@@ -142,11 +138,7 @@ <MasonryContainer key="no_other_travel">
             <NoCar
               eventName={event?.name}
               title={t('event.no_other_travel.title')}
-              description={
-                isCarosterPlus
-                  ? t('event.no_travel.plus.desc')
-                  : t('event.no_travel.desc')
-              }
+              isCarosterPlus={isCarosterPlus}
             />
           </MasonryContainer>
         </Masonry>

M frontend/locales/en.json → frontend/locales/en.json

@@ -74,6 +74,7 @@ "event.loginToAttend.login": "$t(menu.login)",
   "event.loginToAttend.signup": "$t(signup.title)",
   "event.no_other_travel.title": "There are currently no other trip",
   "event.no_travel.plus.desc": "Create an alert to receive an email in case of a nearby departure",
+  "event.no_travel.plus.action": "Create an alert",
   "event.no_travel.desc": "1. Subscribe to the waiting list\n2. Share the event\n3. You will be notified when a new travel is added",
   "event.no_travel.title": "There are currently no trips",
   "event.not_found": "Project not found",

M frontend/locales/fr.json → frontend/locales/fr.json

@@ -74,6 +74,7 @@ "event.loginToAttend.login": "$t(menu.login)",
   "event.loginToAttend.signup": "$t(signup.title)",
   "event.no_other_travel.title": "Pas d'autres trajets pour le moment",
   "event.no_travel.plus.desc": "Créez une alerte de covoiturage pour être notifié",
+  "event.no_travel.plus.action": "Créer une alerte",
   "event.no_travel.desc": "1. Inscrivez-vous dans la liste d’attente \n2. Partagez l’événement \n3. Vous serez notifié lorsqu’un nouveau trajet sera ajouté",
   "event.no_travel.title": "Pas de trajets pour le moment",
   "event.not_found": "Projet introuvable",