https://github.com/rfoel/use-zendesk

A React hook to initialize Zendesk widget
https://github.com/rfoel/use-zendesk

hook react zendesk

Last synced: 4 days ago
JSON representation

A React hook to initialize Zendesk widget

• Host: GitHub
• URL: https://github.com/rfoel/use-zendesk
• Owner: rfoel
• License: mit
• Created: 2020-05-21T17:43:56.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2023-01-17T08:04:11.000Z (almost 2 years ago)
• Last Synced: 2024-08-08T14:59:47.834Z (3 months ago)
• Topics: hook, react, zendesk
• Language: JavaScript
• Size: 1.73 MB
• Stars: 5
• Watchers: 1
• Forks: 1
• Open Issues: 32
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE

Awesome Lists containing this project

README

        
# use-zendesk

React hook to initialize Zendesk widget

[![npm version](https://badge.fury.io/js/use-zendesk.svg)](https://www.npmjs.com/package/use-zendesk)

[![GitHub license](https://img.shields.io/github/license/rfoel/use-zendesk.svg)](https://github.com/rfoel/use-zendesk/blob/master/LICENSE) ![GitHub stars](https://img.shields.io/github/stars/rfoel/use-zendesk?style=social)

## Install

```bash

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](https://developer.zendesk.com/embeddables/docs/widget/chat) can be passed as argument and will be forwarded to the `zESettings` object.

```jsx

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 (

    


      

        

        


          Edit src/App.js and save to reload.

        

        

          Learn React

        

      

    

  )

}


export default App

```

## Locale

Locale can be passed to the hook. Options can be found [here](https://support.zendesk.com/hc/en-us/articles/203761906-Language-codes-for-Zendesk-supported-languages). They also can be changed after mounting the app.

```jsx

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](https://support.zendesk.com/hc/en-us/articles/203761906-Language-codes-for-Zendesk-supported-languages). | en-us   | `false`  |

| `onLoad` | Callback function called when the widget loads                                                                                                                                       | null    | `false`  |

## Contributing

Issues and pull requests are welcome.

## License

[MIT](https://github.com/rfoell/install-latest/blob/master/LICENSE)