refactor: Use sintax with function clear

Author: mateusbslopes

src/Item.jsx

@@ -4,7 +4,7 @@ export default ({ children, increaseValue, decreaseValue, setViewValue }) => {
   const [x, setX] = useState(0);
   const [viewX, setViewX] = useState(0);
 
-  const ref = createRef();
+  const itemRef = createRef();
 
   const getTouches = (evt) => evt.touches;
 
@@ -49,7 +49,7 @@ export default ({ children, increaseValue, decreaseValue, setViewValue }) => {
     <div
       draggable
       class="item-content"
-      ref={ref}
+      ref={itemRef}
       onTouchMove={handleTouchMove}
       onTouchStart={handleTouchStart}
       onTouchEnd={handleTouchEnd}

src/ReactCarousel.jsx

@@ -2,41 +2,26 @@ import React, { createRef, useEffect, useState } from "react";
 import Item from "./Item.jsx";
 import style from "./style";
 
-export default ({
-  value = 0,
-  setValue,
-  children,
-  navigation,
-}) => {
+export default ({ value = 0, setValue, children, navigation }) => {
   const [viewValue, setViewValue] = useState(0);
 
   const firstItemRef = createRef();
   const carousel = createRef();
 
-  const increaseValue = () => {
-    if (value !== children.length - 1) {
-      setValue(value + 1);
-    }
-  };
+  const increaseValue = () =>
+    value !== children.length - 1 && setValue(value + 1);
 
-  const decreaseValue = () => {
-    if (value !== 0) {
-      setValue(value - 1);
-    }
-  };
+  const decreaseValue = () => value !== 0 && setValue(value - 1);
 
   const moveCarousel = (value, duration) => {
     const firstItemStyle = firstItemRef.current.style;
     firstItemStyle.transitionDuration = duration;
     firstItemStyle.marginLeft = value;
   };
 
-  const canMove = () => {
-    return (
-      (viewValue < 0 && value !== 0) ||
-      (viewValue > 0 && value !== children.length - 1)
-    );
-  };
+  const canMove = () =>
+    (viewValue < 0 && value !== 0) ||
+    (viewValue > 0 && value !== children.length - 1);
 
   useEffect(() => {
     if (canMove(viewValue))