plugin.html

      <div class="search-container">
        <input value={searchTerm} onChange={handleChange} />
        <button onClick={() => { getResults(searchTerm) }}>Search</button>
      </div>
      <div className="container">
        {searchResults ? (searchResults.map((item) => {
          { console.log(item.links) }
          return (
            <>
              <div className="image-container">
                <div className="grid-image" style={{ backgroundImage: 'url(' + item.links.download + ')' }} />
                <div className="details-container">
                  <div>
                    Name: {item.alt_description}
                  </div>
                  <div>
                    By <User className="icon" />: {item.user.username}
                  </div>
                  <div>
                    Likes <Heart className="icon" />: {item.likes}
                  </div>
                  <div className="icons-container">
                    <div className="icon-btn" data-image={item.links.download} onClick={(e) => { downloadIt(e.target.dataset.image) }}>Download <CloudDownload className="icon" /></div>
                    <div className="icon-btn"><a className="link" href={item.links.html}>Link <LinkExternal className="icon" /></a></div>
                  </div>
                </div>
              </div>
              <hr />
            </>
          )
        })) : (<></>)}
      </div>