dp-gif-picker

A "GIF" button that opens a searchable GIPHY panel. Picking a GIF stores it as an ordinary
attachment through POST /giphy/attach and hands it to the surrounding form's dp-upload, which
adds it to the hidden attachment_uids field. A GIF is therefore never pasted into the text: it
renders in the attachment gallery exactly like an uploaded file and is removed from the form the
same way.

Source: static/js/components/AppGifPicker.js. Server: routers/giphy.py.

Availability#

The GIPHY API key is entered by an administrator in the Giphy service (/admin/services) and never reaches
the browser: every search runs on the server. The element asks GET /giphy/status once per page
and hides itself when no key is configured, so a site without GIPHY shows no button at all.

Attributes#

Attribute Default Description
endpoint /giphy Base URL of the GIPHY routes.
limit 24 Number of GIFs requested per search (1-50).

Behaviour#

  • Trending GIFs load when the panel first opens; typing searches after a 350 ms pause.
  • Escape or a click outside closes the panel; on phones (480px and below) it becomes a bottom sheet.
  • Each member may make 30 GIF searches per minute; beyond that the panel says to wait.
  • The panel always shows "Powered by GIPHY".

Events#

dp-gif:attached (bubbles, detail is the attachment record {uid, url, original_filename, ...}).
A dp-upload in attachment mode inside the same <form> listens for it.

Usage#

Place it beside the form's dp-upload:

<dp-upload multiple></dp-upload>
<dp-gif-picker></dp-gif-picker>

It is wired into the post composer, every comment form and the direct-message input.