@resys/feedback v1.1.0

Feedback

Client library for sending ReSys feedback.

Usage

Install

yarn add @resys/feedback

Sending feedback

import Feedback from '@resys/feedback';

const feedback = new Feedback('api-key');
// Attaches a screenshot of the body of the page to the issue
await feedback.screenshot(document.body);
// Add some metadata
feedback.addMetadata('User e-mail', 'john.doe@example.com');
// Sends feedback with a message
await feedback.send('Terrible, terrible issue has happened!');

You can also specify the URL to which the feedback is sent; if URL is not given, it automatically defaults to https://feedback.resys.io/api/feedback:

const feedback = new Feedback('api-key', 'https://example.resys.io/');

GDPR

If you use the screenshot() method of this library, make sure you first comply with GDPR, for example by asking for user approval before adding the screenshot. This can be achieved with a simple checkbox in the feedback window, that says for example "Include screenshot". If this checkbox is not checked, do not call the screenshot() method.

Attaching files

You can send blobs and plaintext files with the feedback.

// Attach file with the name 'file.txt', mimetype 'text/plain' and contents 'Text file!'
await feedback.attach('file.txt', 'text/plain', 'Text file!');

// Attach image
const blob = new Blob();
await feedback.attach('image.png', 'image/png', blob);

Note on importing

If the library is used in an environment where dynamic imports are supported, it is advisable to only import this library dynamically, e.g. when the user clicks the "Send feedback" button:

const App = () => (
  <button onClick={async () => {
    const Feedback = await import('@resys/feedback');
    const feedback = new Feedback('api-key');
    await feedback.send('feedback message');
  }}>
)

This is because feedback sending is expected to be somewhat rare and this library imports a few heavy packages that will increase filesize quite a bit if imported statically.