Untitled

import {View, Text, Image, StyleSheet, TouchableOpacity} from 'react-native';
import React, {useContext, useEffect, useState} from 'react';
import InterestsCardContent from './InterestsCardContent';
import styles from './InterestsCard_Style';
import { distanceCalculator } from '../../helpers/DistanceCalculator';
import  {useSelector} from 'react-redux'
import { userLocationCoordinates } from '../../reducers/UserLocationSlice';
const InterestsCard = ({item}) => {
  const [liked, setLiked] = useState(item.liked);
  const [notification, setNotification] = useState(false);
  
  const [distance, setDistance] = useState(0);
  
  const avgSpeed = 6;
const userCoordinates=useSelector(userLocationCoordinates)
  const getUserLocation = async () => {
    try {
      const data = userCoordinates
      if(data !== null) {
        const parsedData = data       // functions takes lat1, lat2, lng1, lng2
        const res = distanceCalculator(parsedData[1], item.lat, parsedData[0], item.lng);

        // calculate average time time = distance / average speed (avgSpeed = 6)
        const avgTime = (res.toFixed(0) / avgSpeed) * 60

        setDistance(avgTime.toFixed(0))
      }
    } catch (error) {
      console.log('Error: ', error);
    }
  }; 

 useEffect(() => {
    getUserLocation()
  }, [userCoordinates])  


  return (
    <View style={styles.interestsCardLayout}>
      {item.isRoute ? (
        <View
          style={styles.root}>
          <View
            style={styles.bottomView}></View>
          <View
            style={styles.middleView}></View>
          <View
            style={styles.topView}>
            <InterestsCardContent
              item={item}
              liked={liked}
              setLiked={setLiked}
              notification={notification}
              setNotification={setNotification}
              distance={distance}
            />
          </View>
        </View>
      ) : (
        <View
          style={styles.singleContainer}>
          <InterestsCardContent
            distance={distance}
            item={item}
            liked={liked}
            setLiked={setLiked}
            notification={notification}
            setNotification={setNotification}
          />
        </View>
      )}
    </View>
  );
};

export default InterestsCard;