From 36794996244a93d36c063cbebc8f433fd0af499a Mon Sep 17 00:00:00 2001
From: Anouar Ben Saad <bensaad.tig@gmail.com>
Date: Sun, 14 Nov 2021 20:03:21 +0100
Subject: [PATCH] #1 add swipe features based on swipe.

---
 styled-components/src/Card/index.js |  7 ++++++-
 styled-components/src/Main/index.js | 10 ++++++++++
 2 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/styled-components/src/Card/index.js b/styled-components/src/Card/index.js
index b0334ff..0259ff0 100644
--- a/styled-components/src/Card/index.js
+++ b/styled-components/src/Card/index.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import React,{useEffect} from 'react';
 import { Animated } from 'react-native';
 
 import { ACTION_OFFSET } from '../../utils/constants';
@@ -11,8 +11,13 @@ export default function Card({
   isFirst,
   swipe,
   tiltSign,
+  setCurrentPet,
   ...rest
 }) {
+  useEffect(() => {
+    setCurrentPet(name);
+  }, [name])
+
   const rotate = Animated.multiply(swipe.x, tiltSign).interpolate({
     inputRange: [-ACTION_OFFSET, 0, ACTION_OFFSET],
     outputRange: ['8deg', '0deg', '-8deg'],
diff --git a/styled-components/src/Main/index.js b/styled-components/src/Main/index.js
index 44cc26f..5f59d74 100644
--- a/styled-components/src/Main/index.js
+++ b/styled-components/src/Main/index.js
@@ -8,6 +8,7 @@ import { pets as petsObj } from './data';
 import { Container } from './styles';
 
 export default function Main() {
+  const [currentPet, setCurrentPet] = useState("");
   const swipe = useRef(new Animated.ValueXY()).current;
   const tiltSign = useRef(new Animated.Value(1)).current;
   const [pets, setPets] = useState(petsObj);
@@ -18,6 +19,13 @@ export default function Main() {
     }
   }, [pets]);
 
+  const swipeLeft = (petName) => {
+    console.warn("swipe left",petName);
+  }
+  const swipeRight = (petName) => {
+    console.warn("swipe right",petName);
+  }
+
   const panResponder = useRef(
     PanResponder.create({
       onMoveShouldSetPanResponder: () => true,
@@ -31,6 +39,7 @@ export default function Main() {
         const userAction = Math.abs(dx) > ACTION_OFFSET;
 
         if (userAction) {
+          dx > 0 ? swipeRight(currentPet) : swipeLeft(currentPet);
           Animated.timing(swipe, {
             duration: 200,
             toValue: {
@@ -84,6 +93,7 @@ export default function Main() {
               isFirst={isFirst}
               swipe={swipe}
               tiltSign={tiltSign}
+              setCurrentPet={setCurrentPet}
               {...panHandlers}
             />
           );