title: Problem when adding a picture from flamelink
body: <p>I have a problem when I'm trying to load a picture from my Flamelink schema that is connected to my Firebase DB.</p>
  <p>I have a simple component that displays a puppy for sale:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>const PuppyCard = (props) =&gt; {
    return (
      &lt;div className='PuppyCard'&gt;
        &lt;div className='PuppyCard__img'&gt;
          &lt;img src={props.data.picture} alt={props.data.name} /&gt;
        &lt;/div&gt;
        &lt;div className='PuppyCard__text'&gt;
          &lt;h2&gt;{props.data.name}&lt;/h2&gt;
          &lt;h3&gt;{props.data.sex}&lt;/h3&gt;
          &lt;h4&gt;{props.data.age}&lt;/h4&gt;
          &lt;h4&gt;{props.data.price}&lt;/h4&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    )
  }</code></pre>
  </div>
  </div>
  </p>
  <p>And as you can see there is a props.data.picture as my src for the image, but when i try to load it on the website i get everything but the picture. After looking into my DB i saw that the picture is not a file but a reference to the other folder created by flamelink:
  <a href="https://i.stack.imgur.com/HVM2Y.png" rel="nofollow noreferrer">1</a></p>
  <p>This is what i am fetching from the DB right now.</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>getPuppies = () =&gt; {
      db
        .collection('fl_content')
        .get()
        .then(docs =&gt; {
          if (!docs.empty) {
            let allPuppies = []
            docs.forEach(function (doc) {
              const puppy = {
                id: doc,
                ...doc.data()
              }
  
              allPuppies.push(puppy)
            })
  
            this.setState({
              puppies: allPuppies
            }, () =&gt; {
              this.setState({
                isLoaded: true
              })
            })
          }
        })
    }</code></pre>
  </div>
  </div>
  </p>
  <p>Any help is appreciated!</p>