send-feedback

send-feedback electron element - that could be used to get user feedback from electron app

Project maintained by electron-elements Hosted on GitHub Pages — Theme by mattgraham

reporters

The reporter of the send-feedback element is the way the actual feedback is sent. It is only called if the input is valid, after validating all the fields.

Default reporters

`emailReporter`

This reporter will open up the default email app of the operating system, and have the email ready to be sent to address you will specify.

Use emailReporter.useReporter to register a reporter. For data property this repoter just needs the email to be specifed:

sendFeedback.useReporter('emailReporter', {
  email: '<your-support-email-address>'
});

`browserReporter`

This will open up the url specified in the browser, it will be like a GET request. You can specify the query parameter.

sendFeedback.useReporter('browserReporter', {
  url: 'https://example.com',
  titleParam: 'title', // optional, default is title
  bodyParam: 'body' //  optional, default is body
});

`githubReporter`

This will open up the browser to issue tracker. The title, body will be set and it will be fromatted with markdown.

sendFeedback.useReporter('githubReporter', {
  url: 'https://github.com/<username>/<repo>/issues/new'
});

`postRequestReporter`

This reporter can send a post request in background to a server. The send-feedback element will show a reporter a loader until the feedback is successfully sent.

sendFeedback.useReporter('postRequestReporter', {
  url: 'url of your server',
  titleParam: 'string' // optional the title parameter default is title
  bodyParam: 'string' // optional the body parameter default is body
});

The loader shown, can be customized:

// default is &#10004; Feedback sent.
// &#10060; -> ✔
sendFeedback.loaderSucessText = 'your desired text';

// default is &#10060; Error sending feedback! try again..
// &#10060; -> ❌
sendFeedback.loaderErrorText = 'your desired text';

You can take a look this setting up backend tutorial for setting up a backend that accpets feedback sent from the app.

Custom reporter

If none of the default reporters fit your needs, you can write your own reporter. This can be done by passing a function to sendFeedback.useReporter. And when user clicks the send feedback button the function will be called with the following data as an object:

{
  title, // String. The title the user entered
  body,  // String. The details user entered
  logs // Object. Pre read logs with filename as key and file content as value.
}

If your custom reporter need to use the built in loader, if your code is waiting something that takes time, you can show the loader using this.showLoader() in the custom function, and to stop the loader this.hideLoader(). If you want to show error you need to pass true as a argument indicating an error had occured this.hideLoader(true).

Note: The filename if the path passed into the sendFeedback.logs array. see documentation of logs for more info.