use-zendesk

React hook to initialize Zendesk widget

Install

npm install --save use-zendesk

Usage

Simply pass your Zendesk key to the hook and initialize it anywhere in your app, preferably in your root component. All other settings from here can be passed as argument and will be forwarded to the zESettings object.

import React from 'react'
import logo from './logo.svg'
import './App.css'
 
import useZendesk from 'use-zendesk'
 
function App() {
  useZendesk({ key: YOUR_ZENDESK_KEY })
 
  return (
    <div className='App'>
      <header className='App-header'>
        <img src={logo} className='App-logo' alt='logo' />
        <p>
          Edit <code>src/App.js</code> and save to reload.
        </p>
        <a
          className='App-link'
          href='https://reactjs.org'
          target='_blank'
          rel='noopener noreferrer'
        >
          Learn React
        </a>
      </header>
    </div>
  )
}
 
export default App

Locale

Locale can be passed to the hook. Options can be found here. They also can be changed after mounting the app.

useZendesk({ key: YOUR_ZENDESK_KEY, locale: 'pt-br' })

Props

Name	Description	Default	Required
key	Your Zendesk key.		true
locale	Locale of your app, can be changed after mount. Options can be found here.	en-us	false
onLoad	Callback function called when the widget loads	null	false

Contributing

Issues and pull requests are welcome.

License

MIT