feat(api): improve report issue template

packages/api/package.json

@@ -12,12 +12,14 @@
     "@fastify/rate-limit": "^9.1.0",
     "fastify": "^4.26.2",
     "node-fetch": "^2.7.0",
-    "octokit": "^3.2.1"
+    "octokit": "^3.2.1",
+    "ua-parser-js": "^1.0.37"
   },
   "devDependencies": {
     "@tsconfig/node20": "^20.1.4",
     "@types/node": "^20.12.8",
     "@types/node-fetch": "2.6.11",
+    "@types/ua-parser-js": "^0.7.39",
     "@typescript-eslint/eslint-plugin": "^7.8.0",
     "@typescript-eslint/parser": "^7.8.0",
     "eslint": "^8.57.0",

packages/api/src/routes/v2/report.ts

@@ -1,6 +1,7 @@
 import { FastifyInstance, RouteShorthandOptions } from 'fastify';
 import environment from 'services/environment';
 import { octokit } from 'services/octokit';
+import { UAParser } from 'ua-parser-js';
 
 type PostReportBody = {
   reason?: string;
@@ -40,6 +41,7 @@ export default (server: FastifyInstance, options: RouteShorthandOptions, done: (
           owner: environment.github.owner,
           repo: environment.github.repo,
         });
+        const ua = new UAParser(request.body.userAgent ?? '').getResult();
         const url = new URL(request.body.url).hostname
           .split('.')
           .slice(-3)
@@ -54,10 +56,16 @@ export default (server: FastifyInstance, options: RouteShorthandOptions, done: (
           assignees: [environment.github.owner],
           body: [
             '## Specifications',
-            `- <b>Reason:</b> ${request.body.reason ?? '-'}`,
+            '#### Browser',
-            `- <b>URL:</b> ${request.body.url}`,
+            `${ua.browser.name ? `${ua.browser.name} ${ua.browser.version || ''}` : '-'}`,
-            `- <b>User-Agent:</b> ${request.body.userAgent ?? '-'}`,
+            '#### Device',
-            `- <b>Version:</b> ${request.body.version}`,
+            `${ua.device.type && ua.device.vendor ? `${ua.device.vendor} (${ua.device.type})` : '-'}`,
+            '#### Reason',
+            request.body.reason ?? '-',
+            '#### URL',
+            request.body.url,
+            '#### Version',
+            request.body.version,
           ].join('\n'),
           labels: ['bug'],
           owner: environment.github.owner,

packages/api/src/routes/v3/report.ts

@@ -1,6 +1,7 @@
 import { FastifyInstance, RouteShorthandOptions } from 'fastify';
 import environment from 'services/environment';
 import { octokit } from 'services/octokit';
+import { UAParser } from 'ua-parser-js';
 
 interface PostReportBody {
   readonly reason?: string;
@@ -29,7 +30,7 @@ export default (server: FastifyInstance, _options: RouteShorthandOptions, done:
               type: 'string',
             },
           },
-          required: ['url', 'version'],
+          required: ['reason', 'url', 'version'],
           type: 'object',
         },
       },
@@ -39,6 +40,7 @@ export default (server: FastifyInstance, _options: RouteShorthandOptions, done:
         owner: environment.github.owner,
         repo: environment.github.repo,
       });
+      const ua = new UAParser(request.body.userAgent ?? '').getResult();
       const url = new URL(request.body.url).hostname
         .split('.')
         .slice(-3)
@@ -55,10 +57,18 @@ export default (server: FastifyInstance, _options: RouteShorthandOptions, done:
           assignees: [environment.github.owner],
           body: [
             '## Specifications',
-            `- <b>Reason:</b> ${request.body.reason ?? '-'}`,
+            ...(ua.browser.name && ua.browser.version
-            `- <b>URL:</b> ${request.body.url}`,
+              ? ['#### Browser', `${ua.browser.name} (${ua.browser.version})`]
-            `- <b>User-Agent:</b> ${request.body.userAgent ?? '-'}`,
+              : []),
-            `- <b>Version:</b> ${request.body.version}`,
+            ...(ua.device.type && ua.device.vendor
+              ? ['#### Device', `${ua.device.vendor} (${ua.device.type})`]
+              : []),
+            '#### Reason',
+            request.body.reason ?? '-',
+            '#### URL',
+            request.body.url,
+            '#### Version',
+            request.body.version,
           ].join('\n'),
           labels: ['bug'],
           owner: environment.github.owner,

yarn.lock

@@ -929,6 +929,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/ua-parser-js@npm:^0.7.39":
+  version: 0.7.39
+  resolution: "@types/ua-parser-js@npm:0.7.39"
+  checksum: 10c0/fea522f42dfc2854d9c93144a13c3db3bbe1c791458451db06d46bec7e1dbbe945d1542e02bb38378e39a04bdb7810b43e2ead26f9e6c250832e187312522708
+  languageName: node
+  linkType: hard
+
 "@typescript-eslint/eslint-plugin@npm:^7.8.0":
   version: 7.8.0
   resolution: "@typescript-eslint/eslint-plugin@npm:7.8.0"
@@ -1307,6 +1314,7 @@ __metadata:
     "@tsconfig/node20": "npm:^20.1.4"
     "@types/node": "npm:^20.12.8"
     "@types/node-fetch": "npm:2.6.11"
+    "@types/ua-parser-js": "npm:^0.7.39"
     "@typescript-eslint/eslint-plugin": "npm:^7.8.0"
     "@typescript-eslint/parser": "npm:^7.8.0"
     eslint: "npm:^8.57.0"
@@ -1320,6 +1328,7 @@ __metadata:
     ts-node: "npm:^10.9.2"
     tsconfig-paths: "npm:^4.2.0"
     typescript: "npm:^5.4.5"
+    ua-parser-js: "npm:^1.0.37"
   languageName: unknown
   linkType: soft
 
@@ -5396,6 +5405,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"ua-parser-js@npm:^1.0.37":
+  version: 1.0.37
+  resolution: "ua-parser-js@npm:1.0.37"
+  checksum: 10c0/dac8cf82a55b2e097bd2286954e01454c4cfcf23c9d9b56961ce94bda3cec5a38ca536e6e84c20a4000a9d4b4a4abcbd98ec634ccebe21be36595ea3069126e4
+  languageName: node
+  linkType: hard
+
 "undefsafe@npm:^2.0.5":
   version: 2.0.5
   resolution: "undefsafe@npm:2.0.5"