'Projecting an icon to the screen in the Timeline according to the title value from the API. How can I do that?

Here I am pulling data from API and this json data has title element.According to this title, I want to take the icons from my images file and show them on the timeline. innerCircle={'dot'} // According to the title information, the icon will be placed here

const TimelineCard = () => {
  
  const [notifications, setNotifications] = useState([]);

  const getData = async () => {
    try {
     const response = await fetch('https://6228f5cebe12fc453892c7d8.mockapi.io/task1');
     const json = await response.json();
     setNotifications(json);
   } catch (error) {
     console.error(error);
   } finally {
     setLoading(false);
   }
 }

 useEffect(() => {
   getData();
 }, []);


 console.log(notifications);
  return (
      <View style={styles.container}>
        <Timeline
          data={notifications}
          circleSize={30}
          circleColor='rgb(45,156,219)'
          lineColor="green"
          timeContainerStyle={styles.timeContainer}
          timeStyle={styles.time}
          descriptionStyle={styles.description}
          options={{
            style: {paddingTop: 5},
          }}
          isUsingFlatlist={true}
          innerCircle={'dot'}
          detailContainerStyle={styles.detailContainer}
          columnFormat="two-column"
        />
      </View>
  );
};

export default TimelineCard;


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source