<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Discourse: pre-initializers/chat-plugin-api.js</title>
    
      <link type="text/css" rel="stylesheet" href="styles/vendor/prism-custom.css">
    
    <link type="text/css" rel="stylesheet" href="styles/styles.css">
    
</head>
<body>

<header class="layout-header">
  
  <h1>
    <a href="./index.html">
      Discourse
    </a>
  </h1>
  <nav class="layout-nav">
    <ul><li class="nav-heading">Classes</li><li class="nav-heading"><span class="nav-item-type type-class" title="class">C</span><span class="nav-item-name is-class"><a href="PluginApi.html">PluginApi</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="PluginApi.html#decorateChatMessage">decorateChatMessage</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="PluginApi.html#registerChatComposerButton">registerChatComposerButton</a></span></li><li class="nav-heading"><span class="nav-item-type type-class" title="class">C</span><span class="nav-item-name is-class"><a href="module.exports.html">exports</a></span></li></ul><ul><li class="nav-heading">Modules</li><li class="nav-heading"><span class="nav-item-type type-module" title="module">M</span><span class="nav-item-name is-module"><a href="module-ChatApi.html">ChatApi</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="module-ChatApi.html#categoryPermissions">categoryPermissions</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="module-ChatApi.html#channel">channel</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="module-ChatApi.html#channels">channels</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="module-ChatApi.html#createChannel">createChannel</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="module-ChatApi.html#createChannelArchive">createChannelArchive</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="module-ChatApi.html#destroyChannel">destroyChannel</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="module-ChatApi.html#followChannel">followChannel</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="module-ChatApi.html#listChannelMemberships">listChannelMemberships</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="module-ChatApi.html#listCurrentUserChannels">listCurrentUserChannels</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="module-ChatApi.html#moveChannelMessages">moveChannelMessages</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="module-ChatApi.html#sendMessage">sendMessage</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="module-ChatApi.html#unfollowChannel">unfollowChannel</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="module-ChatApi.html#updateChannel">updateChannel</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="module-ChatApi.html#updateChannelStatus">updateChannelStatus</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="module-ChatApi.html#updateCurrentUserChannelNotificationsSettings">updateCurrentUserChannelNotificationsSettings</a></span></li></ul><li class="nav-heading"><a href="global.html">Globals</a></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="global.html#load">load</a></span></li><li class="nav-item"><span class="nav-item-type type-function" title="function">F</span><span class="nav-item-name is-function"><a href="global.html#loadMore">loadMore</a></span></li>
  </nav>
</header>


<main class="layout-main  layout-content--source">
  <div class="container">
    <p class="page-kind">source</p>
    <h1 class="page-title">pre-initializers/chat-plugin-api.js</h1>
    



    

<section>
    <article>
        <pre id="source" class="source-page line-numbers"><code class="language-js">import { withPluginApi } from "discourse/lib/plugin-api";
import {
  addChatMessageDecorator,
  resetChatMessageDecorators,
} from "discourse/plugins/chat/discourse/components/chat-message";
import { registerChatComposerButton } from "discourse/plugins/chat/discourse/lib/chat-composer-buttons";

/**
 * Class exposing the javascript API available to plugins and themes.
 * @class PluginApi
 */

/**
 * Callback used to decorate a chat message
 *
 * @callback PluginApi~decorateChatMessageCallback
 * @param {ChatMessage} chatMessage - model
 * @param {HTMLElement} messageContainer - DOM node
 * @param {ChatChannel} chatChannel - model
 */

/**
 * Decorate a chat message
 *
 * @memberof PluginApi
 * @instance
 * @function decorateChatMessage
 * @param {PluginApi~decorateChatMessageCallback} decorator
 * @example
 *
 * api.decorateChatMessage((chatMessage, messageContainer) => {
 *   messageContainer.dataset.foo = chatMessage.id;
 * });
 */

/**
 * Register a button in the chat composer
 *
 * @memberof PluginApi
 * @instance
 * @function registerChatComposerButton
 * @param {Object} options
 * @param {number} options.id - The id of the button
 * @param {function} options.action - An action name or an anonymous function called when the button is pressed, eg: "onFooClicked" or `() => { console.log("clicked") }`
 * @param {string} options.icon - A valid font awesome icon name, eg: "far fa-image"
 * @param {string} options.label - Text displayed on the button, a translatable key, eg: "foo.bar"
 * @param {string} options.translatedLabel - Text displayed on the button, a string, eg: "Add gifs"
 * @param {string} [options.position] - Can be "inline" or "dropdown", defaults to "inline"
 * @param {string} [options.title] - Title attribute of the button, a translatable key, eg: "foo.bar"
 * @param {string} [options.translatedTitle] - Title attribute of the button, a string, eg: "Add gifs"
 * @param {string} [options.ariaLabel] - aria-label attribute of the button, a translatable key, eg: "foo.bar"
 * @param {string} [options.translatedAriaLabel] - aria-label attribute of the button, a string, eg: "Add gifs"
 * @param {string} [options.classNames] - Additional names to add to the button’s class attribute, eg: ["foo", "bar"]
 * @param {boolean} [options.displayed] - Hide or show the button
 * @param {boolean} [options.disabled] - Sets the disabled attribute on the button
 * @param {number} [options.priority] - An integer defining the order of the buttons, higher comes first, eg: `700`
 * @param {Array.&lt;string>} [options.dependentKeys] - List of property names which should trigger a refresh of the buttons when changed, eg: `["foo.bar", "bar.baz"]`
 * @example
 *
 * api.registerChatComposerButton({
 *   id: "foo",
 *   displayed() {
 *     return this.site.mobileView &amp;&amp; this.canAttachUploads;
 *   }
 * });
 */

export default {
  name: "chat-plugin-api",
  after: "inject-discourse-objects",

  initialize() {
    withPluginApi("1.2.0", (api) => {
      const apiPrototype = Object.getPrototypeOf(api);

      if (!apiPrototype.hasOwnProperty("decorateChatMessage")) {
        Object.defineProperty(apiPrototype, "decorateChatMessage", {
          value(decorator) {
            addChatMessageDecorator(decorator);
          },
        });
      }

      if (!apiPrototype.hasOwnProperty("registerChatComposerButton")) {
        Object.defineProperty(apiPrototype, "registerChatComposerButton", {
          value(button) {
            registerChatComposerButton(button);
          },
        });
      }
    });
  },

  teardown() {
    resetChatMessageDecorators();
  },
};
</code></pre>
    </article>
</section>




  </div>
</main>

<footer class="layout-footer">
  <div class="container">
    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 4.0.0</a>
  </div>
</footer>



<script src="scripts/prism.dev.js"></script>
</body>
</html>