Issue with conditionally rendering plyr-react media from json error

Trying to conditionally render different media (aud/vid) from a json file in react but getting errors. Here is the code

{surgeryData.map((data) => (
          <div>
           
<Plyr
                    source={
                      type = {data.type},
                      sources = [
                        {
                          src= {data.media}
                        }
                      ]
                    }
                  />

          </div>
        ))}

Whether I use “=” after source or “:” react doesn’t seem to like the nested data inside the source. Any solutions? Thanks in advance.