Custom UI- SearchGif

Add your component within Root with this line:

<Delivered.SearchGif apiKey={deliveredConfig.giphyKey} render={props => <YourCustomComponent {...props} />} />


  • display GIFs
  • search GIFs
  • send GIFs

Provided props

  • err (string) error message if getting the GIFs has failed.
  • results (array) all the GIFs to be displayed.
  • handleSearchStringChange (function) updates the search terms used in searchGifs.
  • searchGifs (function) searches for GIFs that match the search keywords and updates results.
  • changeGif(original, fixed) (function) updates the original and fixed GIF values. These are used in MessagesBox when sending the GIF.
  • toggleOpenState(property) (function) used to change the value of the searchGif property which determines whether or not this component should render something. Should be called when the user clicks on a GIF, after changeGif.

Next: ChatTitle