I am attempting to use string interpolation to replace part of an image path with the relevant object from the JSON array, however I get the following error:

Invalid call at line 22: require(../../images/${object.activeIcon}.png)]

Why is this happening?

function TabBar() {
      const insets = useSafeAreaInsets();
      const tabs = [
        {title: 'Menus', activeIcon: 'cocktail-active'},
        {title: 'Discover', activeIcon: 'discover-active'},
        {title: 'Profile', activeIcon: 'profile-active'},
      ];
    
      return (
        <>
          <View style={styles.main}>
            {tabs.map(function (object, i) {
              return (
                <View style={styles.tabView} key={i}>
                  <Image style={styles.icon}
                source={require(`../../images/${object.activeIcon}.png`)}
              />
              <Text style={styles.active}>{object.title}</Text>
            </View>
          );
        })}
      </View>
      <View style={{marginBottom: insets.bottom}} />
    </>
  );
}