M app/src/containers/Fab/index.js → app/src/containers/Fab/index.js

@@ -3,13 +3,15 @@ import Icon from '@material-ui/core/Icon';
 import FabMui from '@material-ui/core/Fab';
 import {makeStyles} from '@material-ui/core/styles';
 
-const Fab = ({open, ...props}) => {
-  const classes = useStyles({open});
+const Fab = ({open, children, ...props}) => {
+  const variant = children ? 'extended' : 'round';
+  const classes = useStyles({open, variant});
 
   return (
     <div className={classes.container}>
-      <FabMui color="secondary" {...props}>
-        <Icon>add</Icon>
+      <FabMui color="secondary" variant={variant} {...props}>
+        <Icon className={classes.icon}>add</Icon>
+        {children}
       </FabMui>
     </div>
   );
@@ -23,6 +25,9 @@ right: theme.spacing(3),
     transition: 'all 0.3s ease',
     transform: open ? 'rotate(45deg)' : '',
     zIndex: theme.zIndex.speedDial,
+  }),
+  icon: ({variant}) => ({
+    marginRight: variant === 'extended' ? theme.spacing(1) : theme.spacing(0),
   }),
 }));
 

M app/src/locales/fr.json → app/src/locales/fr.json

@@ -104,7 +104,8 @@ },
   "dashboard": {
     "title": "Évènements",
     "actions": {
-      "see_event": "Voir"
+      "see_event": "Voir",
+      "add_event": "Créer un caroster"
     },
     "sections": {
       "future": "Évènement à venir",

M app/src/pages/Dashboard.js → app/src/pages/Dashboard.js

@@ -76,7 +76,9 @@ futureEvents={futureEvents}
           noDateEvents={noDateEvents}
         />
       )}
-      <Fab onClick={() => history.push('/new')} aria-label="add-event" />
+      <Fab onClick={() => history.push('/new')} aria-label="add-event">
+        {t('dashboard.actions.add_event')}
+      </Fab>
     </LayoutDefault>
   );
 };