From a1e8cf071f6cf8395d883610e01e4e58241ceb61 Mon Sep 17 00:00:00 2001
From: Guus van der Meer <info@guus.ninja>
Date: Mon, 25 Dec 2023 21:09:59 +0100
Subject: [PATCH] Added action that forces prettier (#10583)

---
 .github/workflows/prettier.yml | 35 ++++++++++++++++++++++++++++++++++
 src/data/menu/index.html       | 27 +++++++++++++++++---------
 src/data/menu/script.js        | 26 +++++++++++++++----------
 src/data/menu/style.css        |  5 +++--
 4 files changed, 72 insertions(+), 21 deletions(-)
 create mode 100644 .github/workflows/prettier.yml

diff --git a/.github/workflows/prettier.yml b/.github/workflows/prettier.yml
new file mode 100644
index 00000000..8c1fd0dc
--- /dev/null
+++ b/.github/workflows/prettier.yml
@@ -0,0 +1,35 @@
+name: Prettier
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - main
+
+jobs:
+  prettier:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Run Prettier
+        run: npm run prettier
+
+      - name: Check for changes
+        id: changes
+        run: |
+          git diff --name-only --exit-code HEAD^ HEAD | grep -vE 'package-lock.json'
+
+      - name: Fail if changes found
+        run: |
+          if [ -n "${{ steps.changes.outputs.stdout }}" ]; then
+            echo "There are changes after running Prettier. Please run Prettier locally and commit the changes.";
+            exit 1;
+          fi
diff --git a/src/data/menu/index.html b/src/data/menu/index.html
index 59439eb4..063b5331 100644
--- a/src/data/menu/index.html
+++ b/src/data/menu/index.html
@@ -27,16 +27,25 @@ <h3>
           <span id="hostname">example.com</span>
         </h3>
         <select id="report_issue_type">
-          <option value="general" data-translate="generalIssueOption">
-          </option>
-          <option value="scrollbar" data-translate="scrollbarIssueOption">
-          </option>
-          <option value="modal" data-translate="modalIssueOption">
-          </option>
+          <option value="general" data-translate="generalIssueOption"></option>
+          <option
+            value="scrollbar"
+            data-translate="scrollbarIssueOption"
+          ></option>
+          <option value="modal" data-translate="modalIssueOption"></option>
         </select>
-        <label id="general_issue_description" data-translate="reportAnonNotes"></label>
-        <label id="scrollbar_issue_description" data-translate="scrollbarIssueDescription"></label>
-        <label id="modal_issue_description" data-translate="modalIssueDescription"></label>
+        <label
+          id="general_issue_description"
+          data-translate="reportAnonNotes"
+        ></label>
+        <label
+          id="scrollbar_issue_description"
+          data-translate="scrollbarIssueDescription"
+        ></label>
+        <label
+          id="modal_issue_description"
+          data-translate="modalIssueDescription"
+        ></label>
         <textarea id="report-notes"></textarea>
         <button id="report_anon_send" data-translate="reportAnonSend"></button>
         <button
diff --git a/src/data/menu/script.js b/src/data/menu/script.js
index 9b093ae2..51631a55 100644
--- a/src/data/menu/script.js
+++ b/src/data/menu/script.js
@@ -59,18 +59,24 @@ document.getElementById("report_anon").addEventListener("click", function (e) {
 });
 
 issueTypeSelect.addEventListener("change", () => {
-  let issueTypeValue = issueTypeSelect.options[issueTypeSelect.selectedIndex].value;
-
-  document.querySelectorAll("label[id*='issue_description']").forEach((label) => {
-    label.style.display = "none";
-  });
-
-  reportNotesTextarea.style.display = (issueTypeValue == "general") ? "block" : "none";
-  document.getElementById(`${issueTypeValue}_issue_description`).style.display = "block";
+  let issueTypeValue =
+    issueTypeSelect.options[issueTypeSelect.selectedIndex].value;
+
+  document
+    .querySelectorAll("label[id*='issue_description']")
+    .forEach((label) => {
+      label.style.display = "none";
+    });
+
+  reportNotesTextarea.style.display =
+    issueTypeValue == "general" ? "block" : "none";
+  document.getElementById(`${issueTypeValue}_issue_description`).style.display =
+    "block";
 });
 
 document.getElementById("report_anon_send").addEventListener("click", () => {
-  let issueTypeValue = issueTypeSelect.options[issueTypeSelect.selectedIndex].value;
+  let issueTypeValue =
+    issueTypeSelect.options[issueTypeSelect.selectedIndex].value;
 
   switchMenu("menu_loading");
   chrome.runtime.sendMessage(
@@ -79,7 +85,7 @@ document.getElementById("report_anon_send").addEventListener("click", () => {
       tabId: currentTab.id,
       anon: true,
       issueType: issueTypeValue,
-      notes: (issueTypeValue == "general") ? reportNotesTextarea.value : null,
+      notes: issueTypeValue == "general" ? reportNotesTextarea.value : null,
     },
     (message) => {
       if (message.error) {
diff --git a/src/data/menu/style.css b/src/data/menu/style.css
index 02cdac89..2222ce1c 100644
--- a/src/data/menu/style.css
+++ b/src/data/menu/style.css
@@ -45,11 +45,12 @@ h3 {
   margin-top: 0px;
 }
 
-#report_issue_type, label[id*='issue_description'] {
+#report_issue_type,
+label[id*="issue_description"] {
   margin-bottom: 5px;
 }
 
-label[id*='issue_description'] {
+label[id*="issue_description"] {
   color: rgb(43, 43, 43);
   font-style: italic;
   display: none;