react swipe card failed to compile

Question

Im working on a project where im creating swipe card effect and im getting failed to compile when running npm run start:dev on the app

import React from 'react';
import Cards, { Card } from 'react-swipe-card'


const data = ['Alexandre', 'Thomas', 'Lucien']

const SwipeCard = () => (
  return (
      <Cards onEnd={action('end')} className='master-root'>
        {data.map(item => 
          <Card 
            onSwipeLeft={action('swipe left')} 
            onSwipeRight={action('swipe right')}>
            <h2>{item}</h2>
          </Card>
        )}
      </Cards>
  )
);

export default SwipeCard;

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

Doc can be found here

Answer 1

You are using an arrow function without a body for your SwipeCard component which has an implicit return, so you can just remove the return statement.

const SwipeCard = () => (
  <Cards onEnd={action("end")} className="master-root">
    {data.map(item => (
      <Card
        key={item}
        onSwipeLeft={action("swipe left")}
        onSwipeRight={action("swipe right")}
      >
        <h2>{item}</h2>
      </Card>
    ))}
  </Cards>
);