Quiero poder dar un nombre de clase diferente al mapear a través de una matriz de imágenes como esta:

 {array.map((step, i) => { return ( <> <img className={styles.img`${i}`} /> </> ) })}

Sin embargo, sigo recibiendo un error en Gatsby: Error en la función eval en ... ruta del archivo y luego filepath_module_scss__WEBPACK_IMPORTED_MODULE_1 _.default.img no es una función

¿Qué error de sintaxis estoy haciendo aquí? ¿Cómo puedo cambiar dinámicamente los nombres de clase si no es así?