Prefill GitHub issue with the error details

src/components/Error.vue

@@ -22,15 +22,14 @@
  </v-btn>
  </div>
  <div v-show="revealErrorDetails">
- <p class="my-3">Make sure that you include the following details in the issue:</p>
  <v-card class="my-3">
  <v-card-text>
  <pre class="mb-1" style="white-space: pre-wrap;">{{ JSON.stringify(error) }}</pre>
  Application Version: {{ applicationVersion }}<br>
  Browser: {{ browser }}
  </v-card-text>
  </v-card>
- <v-btn href="https://github.com/PavlidisLab/GemBrow/issues/new"
+ <v-btn :href="githubUrl"
  target="_blank" rel="noreferrer noopener">
  <v-icon>mdi-github</v-icon>
  Create an issue on GitHub
@@ -64,11 +63,31 @@ export default {
  subject: "Gemma Browser Bug Report: " + this.error.message,
  body: "Please indicate how this error can be reproduced here:\n"
  + "\n\n\n"
- + "Error details:\n" + JSON.stringify(this.error) + "\n"
+ + "Error details:\n"
+ + JSON.stringify(this.error) + "\n"
  + "\n"
  + "Application Version: " + this.applicationVersion + "\n"
  + "Browser: " + this.browser
  };
+ },
+ githubIssue() {
+ return {
+ title: this.error.message,
+ body: "Please indicate how this error can be reproduced here:\n"
+ + "\n\n\n"
+ + "Error details:\n"
+ + "```json\n" + JSON.stringify(this.error) + "\n```\n"
+ + "\n"
+ + "Application Version: " + this.applicationVersion + "\n"
+ + "Browser: " + this.browser,
+ labels: ["bug"]
+ };
+ },
+ githubUrl() {
+ return "https://github.com/PavlidisLab/GemBrow/issues/new"
+ + "?title=" + encodeURIComponent(this.githubIssue.title)
+ + "&body=" + encodeURIComponent(this.githubIssue.body)
+ + "&labels=" + encodeURIComponent(this.githubIssue.labels.join(","));
  }
  }
 };