automatically inject bug_report.md into js

.github/ISSUE_TEMPLATE/bug_report.md

@@ -1,6 +1,6 @@
 ---
 name: Bug report
-about: Create a report to help us improve (After v3.1.1, preferably open this report from inside the dribbblish settings `About > Report Bugs` as it adds additional info automatically)
+about: Create a report to help us improve (After v3.1.1, preferably open this report from inside the Dribbblish settings `About > Report Bugs` as it adds additional info automatically)
 title: ""
 labels: ["bug"]
 assignees: ""
@@ -18,10 +18,10 @@ Steps to reproduce the behavior:
 <!-- If applicable, add screenshots to help explain your problem. -->
 
 **Desktop Setup**
- - Operating System: <!-- [e.g. Windows 10, MacOS 10.14] -->
+- Operating System: <!-- [e.g. Windows 10, MacOS 10.14] -->
- - Spotify: <!-- [e.g. 1.1.71.560] from `Menu (Three dots top left) > Help > About` -->
+- Spotify: <!-- [e.g. 1.1.71.560] from `Menu (Three dots top left) > Help > About` -->
- - Spicetify: <!-- [e.g. 2.4.1] run `spicetify -v` -->
+- Spicetify: <!-- [e.g. 2.4.1] run `spicetify -v` -->
- - Dribbblish: <!-- [e.g. 3.0.1] from `Dribblish Settings > About` -->
+- Dribbblish: <!-- [e.g. 3.0.1] from `Dribbblish Settings > About` -->
 
 **Logs**
 <!--
@@ -35,5 +35,5 @@ Steps to reproduce the behavior:
 
 <!-- Paste logs below or attach a screenshot -->
 ```console
-
+[paste logs here]
 ```

src/js/main.js

@@ -358,31 +358,9 @@ Dribbblish.on("ready", () => {
         data: "Create Report",
         onChange: () => {
             const reportBody = `
-                **Describe the bug**
+                ${process.env.BUG_REPORT}
-                <!-- A clear and concise description of what the bug is. -->
-                
-                **To Reproduce**
-                Steps to reproduce the behavior:
-                1. 
-                
-                **Screenshots**
-                <!-- If applicable, add screenshots to help explain your problem. -->
-                
-                **Logs**
-                <!--
-                    Add logs from console. To do that
-                    1. Run \`spicetify enable-devtool\` in terminal
-                    2. Spotify will be restarted
-                    3. Hit <kbd>Ctrl + Shift + I</kbd> to open DevTools window
-                    4. Navigate to tab Console
-                    5. Copy console window content.
-                -->
-                
-                <!-- Paste logs below or attach a screenshot -->
-                \`\`\`console
-                
-                \`\`\`
 
+                <!-- Leave the lines below as they are -->
                 ---
 
                 ### Info for Contributors:

webpack.config.js

@@ -6,7 +6,7 @@ const fs = require("fs");
 
 const icons = {};
 // Add Material Icons
-let iconDir = path.resolve(__dirname, "./node_modules/@material-icons/svg/svg");
+let iconDir = path.resolve(__dirname, "node_modules/@material-icons/svg/svg");
 for (const dir of fs.readdirSync(iconDir)) {
     icons[dir.replace("_", "-")] = {};
     for (const file of fs.readdirSync(path.resolve(iconDir, dir))) {
@@ -14,14 +14,14 @@ for (const dir of fs.readdirSync(iconDir)) {
     }
 }
 // Add Custom Icons
-iconDir = path.resolve(__dirname, "./src/icons");
+iconDir = path.resolve(__dirname, "src/icons");
 for (const icon of fs.readdirSync(iconDir)) {
     icons[icon.replace(/\..*?$/, "")] = fs.readFileSync(path.resolve(iconDir, icon), { encoding: "utf8" });
 }
 
 /** @type {import('webpack').Configuration} */
 module.exports = {
-    entry: [path.resolve(__dirname, "./src/js/main.js"), path.resolve(__dirname, "./src/styles/main.scss"), path.resolve(__dirname, "./src/styles/Colors.scss")],
+    entry: [path.resolve(__dirname, "src/js/main.js"), path.resolve(__dirname, "src/styles/main.scss"), path.resolve(__dirname, "src/styles/Colors.scss")],
     output: {
         path: path.resolve(__dirname, "dist"),
         filename: "dribbblish-dynamic.js"
@@ -29,11 +29,11 @@ module.exports = {
     module: {
         rules: [
             {
-                include: path.resolve(__dirname, "./src/js/main.js"),
+                include: path.resolve(__dirname, "src/js/main.js"),
                 use: []
             },
             {
-                include: path.resolve(__dirname, "./src/styles/main.scss"),
+                include: path.resolve(__dirname, "src/styles/main.scss"),
                 type: "asset/resource",
                 generator: {
                     filename: "user.css"
@@ -47,7 +47,7 @@ module.exports = {
                             sassOptions: {
                                 functions: {
                                     "font64($font)": (font) => {
-                                        const file = path.resolve(__dirname, "./src/fonts", font.getValue());
+                                        const file = path.resolve(__dirname, "src/fonts", font.getValue());
                                         return new sass.types.String(`"data:font/truetype;charset=utf-8;base64,${fs.readFileSync(file, { encoding: "base64" })}"`);
                                     }
                                 }
@@ -57,18 +57,24 @@ module.exports = {
                 ]
             },
             {
-                include: path.resolve(__dirname, "./src/styles/Colors.scss"),
+                include: path.resolve(__dirname, "src/styles/Colors.scss"),
                 type: "asset/resource",
                 generator: {
                     filename: "color.ini"
                 },
-                use: [path.resolve(__dirname, "./src/loaders/color-loader.js")]
+                use: [path.resolve(__dirname, "src/loaders/color-loader.js")]
             }
         ]
     },
     devtool: "inline-source-map",
     plugins: [
         new webpack.DefinePlugin({
+            "process.env.BUG_REPORT": JSON.stringify(
+                fs
+                    .readFileSync(path.resolve(__dirname, ".github/ISSUE_TEMPLATE/bug_report.md"), { encoding: "utf8" })
+                    .replace(/^---(.*?\r?\n)+---(.*?\r?\n)*?(?=\S)/, "") // Replace GitHub header
+                    .replace(/\*\*Desktop Setup\*\*\r?\n(- .*?\r?\n)+\r?\n/, "") // Replace **Desktop Setup** block
+            ),
             "process.env.DRIBBBLISH_ICONS": JSON.stringify(icons),
             "process.env.DRIBBBLISH_VERSION": JSON.stringify(process.env.DRIBBBLISH_VERSION ?? "Dev"),
             "process.env.COMMIT_HASH": JSON.stringify(process.env.COMMIT_HASH ?? "local")