For my discussion forum image, why is the image not showing on my react website? I attached the file structure of my files and my corresponding code below along with the output
[enter image description here](https://i.sstatic.net/oT6xo9uA.png)

export default Cards;

import discussionForum from '../images/discussionforum.png';
import React from 'react';
import './Cards.css';
import CardItem from './CardItem';

function Cards() {
    return (
        <div className='cards'>
            <h1>Check out these EPIC Features!</h1>
            <div className='cards__container'>
                <div className='cards__wrapper'>
                    <ul className='cards__items'>
                        <CardItem
                            src={discussionForum}
                            text='Discussion Forum'
                            label='Adventure'
                            path='/services'
                        />
                    </ul>
                </div>
            </div>
        </div>
    );
}