M frontend/containers/Car/HeaderEditing.js → frontend/containers/Car/HeaderEditing.js

@@ -1,4 +1,4 @@ 
-import {useState, useReducer, useCallback, useEffect} from 'react';
+import {useState, useReducer, useCallback, useEffect, useMemo} from 'react';
 import Typography from '@material-ui/core/Typography';
 import IconButton from '@material-ui/core/IconButton';
 import Icon from '@material-ui/core/Icon';
@@ -26,16 +26,17 @@ const [updateEvent] = useUpdateEventMutation();
   const [updateCar] = useUpdateCarMutation();
   const [deleteCar] = useDeleteCarMutation({refetchQueries: ['event']});
   const [removing, toggleRemoving] = useReducer(i => !i, false);
+  const dateMoment = useMemo(() => {
+    if (!car?.departure) return moment();
+    else return moment(car.departure);
+  }, [car?.departure]);
 
   // States
   const [name, setName] = useState(car?.name ?? '');
   const [seats, setSeats] = useState(car?.seats ?? 4);
   const [meeting, setMeeting] = useState(car?.meeting ?? '');
-  const [date, setDate] = useState(
-    car?.departure
-      ? moment(car.departure).format('YYYY-MM-DD')
-      : moment().format('YYYY-MM-DD')
-  );
+  const [date, setDate] = useState(dateMoment.format('YYYY-MM-DD'));
+  const [time, setTime] = useState(dateMoment.format('HH:mm'));
   const [phone, setPhone] = useState(car ? car['phone_number'] : '');
   const [details, setDetails] = useState(car?.details ?? '');
 
@@ -73,6 +74,10 @@ },
             },
           });
       }
+      const departure = moment(
+        `${date} ${time}`,
+        'YYYY-MM-DD HH:mm'
+      ).toISOString();
       await updateCar({
         variables: {
           id: car.id,
@@ -80,7 +85,7 @@ carUpdate: {
             name,
             seats,
             meeting,
-            departure: moment(date).toISOString(),
+            departure,
             phone_number: phone,
             details,
             passengers: car.passengers ? car.passengers.slice(0, seats) : [],
@@ -131,16 +136,28 @@ className={classes.edit}
         >
           <Icon>done</Icon>
         </IconButton>
-        {/* TODO Add time input */}
         <TextField
           label={t('car.creation.date')}
           value={date}
           onChange={e => setDate(e.target.value)}
           className={classes.picker}
           fullWidth
-          id="NewCarDateTime"
+          id="NewCarDate"
           name="date"
           type="date"
+          InputLabelProps={{
+            shrink: true,
+          }}
+        />
+        <TextField
+          label={t('car.creation.time')}
+          value={time}
+          onChange={e => setTime(e.target.value)}
+          className={classes.picker}
+          fullWidth
+          id="NewCarTime"
+          name="time"
+          type="time"
           InputLabelProps={{
             shrink: true,
           }}

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

@@ -1,4 +1,4 @@ 
-import {useState, forwardRef} from 'react';
+import {useState, forwardRef, useMemo} from 'react';
 import Dialog from '@material-ui/core/Dialog';
 import DialogActions from '@material-ui/core/DialogActions';
 import DialogContent from '@material-ui/core/DialogContent';
@@ -20,15 +20,20 @@ const NewCarDialog = ({open, toggle}) => {
   const {t} = useTranslation();
   const classes = useStyles();
   const addToast = useToastsStore(s => s.addToast);
-  const addToEvent = useAddToEvents();
+  const {addToEvent} = useAddToEvents();
   const event = useEventStore(s => s.event);
   const [createCar] = useCreateCarMutation({refetchQueries: ['event']});
+  const dateMoment = useMemo(() => {
+    if (!event?.date) return moment();
+    else return moment(event.date);
+  }, [event?.date]);
 
   // States
   const [name, setName] = useState('');
   const [seats, setSeats] = useState(4);
   const [meeting, setMeeting] = useState('');
-  const [date, setDate] = useState(moment().format('YYYY-MM-DD'));
+  const [date, setDate] = useState(dateMoment.format('YYYY-MM-DD'));
+  const [time, setTime] = useState(dateMoment.format('HH:mm'));
   const [phone, setPhone] = useState('');
   const [details, setDetails] = useState('');
   const canCreate = !!name && !!seats;
@@ -36,13 +41,17 @@ 
   const onCreate = async e => {
     if (e.preventDefault) e.preventDefault();
     try {
+      const departure = moment(
+        `${date} ${time}`,
+        'YYYY-MM-DD HH:mm'
+      ).toISOString();
       await createCar({
         variables: {
           car: {
             name,
             seats,
             meeting,
-            departure: moment(date).toISOString(),
+            departure,
             phone_number: phone,
             details,
             event: event.id,
@@ -87,7 +96,6 @@ autoFocus
             id="NewCarName"
             name="name"
           />
-          {/* TODO Add time input */}
           <TextField
             label={t('car.creation.date')}
             value={date}
@@ -97,6 +105,19 @@ fullWidth
             id="NewCarDateTime"
             name="date"
             type="date"
+            InputLabelProps={{
+              shrink: true,
+            }}
+          />
+          <TextField
+            label={t('car.creation.time')}
+            value={time}
+            onChange={e => setTime(e.target.value)}
+            className={classes.picker}
+            fullWidth
+            id="NewCarTime"
+            name="time"
+            type="time"
             InputLabelProps={{
               shrink: true,
             }}

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

@@ -86,7 +86,8 @@ "details": "Notes",
       "phone": "Contact"
     },
     "creation": {
-      "date": "Départ",
+      "date": "Date du départ",
+      "time": "Heure du départ",
       "title": "Ajouter une voiture",
       "name": "Nom de la voiture",
       "seats": "Nombre de places",

M frontend/public/sw.js.map → frontend/public/sw.js.map

@@ -1,1 +1,1 @@ 
-{"version":3,"file":"sw.js","sources":["../../../../../tmp/49b8229bab823f5e5b2c7e7fc1045a1b/sw.js"],"sourcesContent":["import {registerRoute as workbox_routing_registerRoute} from '/home/tim/Projets/caroster/frontend/node_modules/workbox-routing/registerRoute.mjs';\nimport {NetworkFirst as workbox_strategies_NetworkFirst} from '/home/tim/Projets/caroster/frontend/node_modules/workbox-strategies/NetworkFirst.mjs';\nimport {NetworkOnly as workbox_strategies_NetworkOnly} from '/home/tim/Projets/caroster/frontend/node_modules/workbox-strategies/NetworkOnly.mjs';\nimport {clientsClaim as workbox_core_clientsClaim} from '/home/tim/Projets/caroster/frontend/node_modules/workbox-core/clientsClaim.mjs';/**\n * Welcome to your Workbox-powered service worker!\n *\n * You'll need to register this file in your web app.\n * See https://goo.gl/nhQhGp\n *\n * The rest of the code is auto-generated. Please don't update this file\n * directly; instead, make changes to your Workbox build configuration\n * and re-run your build process.\n * See https://goo.gl/2aRDsh\n */\n\n\nimportScripts(\n  \n);\n\n\n\n\n\n\n\nself.skipWaiting();\n\nworkbox_core_clientsClaim();\n\n\n\nworkbox_routing_registerRoute(\"/\", new workbox_strategies_NetworkFirst({ \"cacheName\":\"start-url\", plugins: [{ cacheWillUpdate: async ({request, response, event, state}) => { if (response && response.type === 'opaqueredirect') { return new Response(response.body, {status: 200, statusText: 'OK', headers: response.headers}); } return response; } }] }), 'GET');\nworkbox_routing_registerRoute(/.*/i, new workbox_strategies_NetworkOnly({ \"cacheName\":\"dev\", plugins: [] }), 'GET');\n\n\n\n\n"],"names":["importScripts","self","skipWaiting","workbox_core_clientsClaim","workbox_routing_registerRoute","workbox_strategies_NetworkFirst","plugins","cacheWillUpdate","request","response","event","state","type","Response","body","status","statusText","headers","workbox_strategies_NetworkOnly"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAGyI;EACzI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;EAGAA,aAAa;EAUbC,IAAI,CAACC,WAAL;AAEAC,sBAAyB;AAIzBC,uBAA6B,CAAC,GAAD,EAAM,IAAIC,oBAAJ,CAAoC;EAAE,eAAY,WAAd;EAA2BC,EAAAA,OAAO,EAAE,CAAC;EAAEC,IAAAA,eAAe,EAAE,OAAO;EAACC,MAAAA,OAAD;EAAUC,MAAAA,QAAV;EAAoBC,MAAAA,KAApB;EAA2BC,MAAAA;EAA3B,KAAP,KAA6C;EAAE,UAAIF,QAAQ,IAAIA,QAAQ,CAACG,IAAT,KAAkB,gBAAlC,EAAoD;EAAE,eAAO,IAAIC,QAAJ,CAAaJ,QAAQ,CAACK,IAAtB,EAA4B;EAACC,UAAAA,MAAM,EAAE,GAAT;EAAcC,UAAAA,UAAU,EAAE,IAA1B;EAAgCC,UAAAA,OAAO,EAAER,QAAQ,CAACQ;EAAlD,SAA5B,CAAP;EAAiG;;EAAC,aAAOR,QAAP;EAAkB;EAA5O,GAAD;EAApC,CAApC,CAAN,EAAmU,KAAnU,CAA7B;AACAL,uBAA6B,CAAC,KAAD,EAAQ,IAAIc,mBAAJ,CAAmC;EAAE,eAAY,KAAd;EAAqBZ,EAAAA,OAAO,EAAE;EAA9B,CAAnC,CAAR,EAAgF,KAAhF,CAA7B;;"}+{"version":3,"file":"sw.js","sources":["../../../../../tmp/6d2d5d5bde7727ad4ad498fd99253030/sw.js"],"sourcesContent":["import {registerRoute as workbox_routing_registerRoute} from '/home/tim/Projets/caroster/frontend/node_modules/workbox-routing/registerRoute.mjs';\nimport {NetworkFirst as workbox_strategies_NetworkFirst} from '/home/tim/Projets/caroster/frontend/node_modules/workbox-strategies/NetworkFirst.mjs';\nimport {NetworkOnly as workbox_strategies_NetworkOnly} from '/home/tim/Projets/caroster/frontend/node_modules/workbox-strategies/NetworkOnly.mjs';\nimport {clientsClaim as workbox_core_clientsClaim} from '/home/tim/Projets/caroster/frontend/node_modules/workbox-core/clientsClaim.mjs';/**\n * Welcome to your Workbox-powered service worker!\n *\n * You'll need to register this file in your web app.\n * See https://goo.gl/nhQhGp\n *\n * The rest of the code is auto-generated. Please don't update this file\n * directly; instead, make changes to your Workbox build configuration\n * and re-run your build process.\n * See https://goo.gl/2aRDsh\n */\n\n\nimportScripts(\n  \n);\n\n\n\n\n\n\n\nself.skipWaiting();\n\nworkbox_core_clientsClaim();\n\n\n\nworkbox_routing_registerRoute(\"/\", new workbox_strategies_NetworkFirst({ \"cacheName\":\"start-url\", plugins: [{ cacheWillUpdate: async ({request, response, event, state}) => { if (response && response.type === 'opaqueredirect') { return new Response(response.body, {status: 200, statusText: 'OK', headers: response.headers}); } return response; } }] }), 'GET');\nworkbox_routing_registerRoute(/.*/i, new workbox_strategies_NetworkOnly({ \"cacheName\":\"dev\", plugins: [] }), 'GET');\n\n\n\n\n"],"names":["importScripts","self","skipWaiting","workbox_core_clientsClaim","workbox_routing_registerRoute","workbox_strategies_NetworkFirst","plugins","cacheWillUpdate","request","response","event","state","type","Response","body","status","statusText","headers","workbox_strategies_NetworkOnly"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAGyI;EACzI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;EAGAA,aAAa;EAUbC,IAAI,CAACC,WAAL;AAEAC,sBAAyB;AAIzBC,uBAA6B,CAAC,GAAD,EAAM,IAAIC,oBAAJ,CAAoC;EAAE,eAAY,WAAd;EAA2BC,EAAAA,OAAO,EAAE,CAAC;EAAEC,IAAAA,eAAe,EAAE,OAAO;EAACC,MAAAA,OAAD;EAAUC,MAAAA,QAAV;EAAoBC,MAAAA,KAApB;EAA2BC,MAAAA;EAA3B,KAAP,KAA6C;EAAE,UAAIF,QAAQ,IAAIA,QAAQ,CAACG,IAAT,KAAkB,gBAAlC,EAAoD;EAAE,eAAO,IAAIC,QAAJ,CAAaJ,QAAQ,CAACK,IAAtB,EAA4B;EAACC,UAAAA,MAAM,EAAE,GAAT;EAAcC,UAAAA,UAAU,EAAE,IAA1B;EAAgCC,UAAAA,OAAO,EAAER,QAAQ,CAACQ;EAAlD,SAA5B,CAAP;EAAiG;;EAAC,aAAOR,QAAP;EAAkB;EAA5O,GAAD;EAApC,CAApC,CAAN,EAAmU,KAAnU,CAA7B;AACAL,uBAA6B,CAAC,KAAD,EAAQ,IAAIc,mBAAJ,CAAmC;EAAE,eAAY,KAAd;EAAqBZ,EAAAA,OAAO,EAAE;EAA9B,CAAnC,CAAR,EAAgF,KAAhF,CAA7B;;"}