Description

The useHotglue is the primary way of using the @hotglue/widget package outside of the inline Connections component. Use this to launch the widget and access utility functions.

Usage

First you must include the HotglueConfig provider as a higher order component in your React app. For example, in index.js:

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import HotglueConfig from '@hotglue/widget';

ReactDOM.render(
  <HotglueConfig
    config={{
      apiKey: 'your-public-environment-api-key',
      envId: 'your-env-id'
    }}
  >
    <App />
  </HotglueConfig>,
  document.getElementById('root')
);

Then you can use the useHotglue hook anywhere, as shown below:

import { Connections } from '@hotglue/widget';

const App = (props) => {
   const { openWidget } = useHotglue();

  return (
    <div>
        <button onClick={() => openWidget('test-user')}>Open</button>
    </div>
  );
};

export default App;

Functions

Below is a reference of all of the currently supported functions from the useHotglue hook.

useHotglue

Description

Usage

Functions

openWidget

link

reconnect

disconnect

setListener

createJob