ci: fix theme docs generate bug

* Added "Shadow" set (Red, Green, Blue, transparent BG)

3 additional themes sticking primarily to flat colors, which the exception of icons and border being slightly darker. All 3 themes also have transparent backgrounds that will show differently per-user via GiHub's own light and dark themes. Transparency should also still provide easy readability for both.

* Test

Just want to see if we can make the themes have a transparent background.

* Shadows moved under Transparent

---------

Co-authored-by: Zohan Subhash <zohan.subhash@gmail.com>

api/status/pat-info.js

@@ -2,11 +2,11 @@
  * @file Contains a simple cloud function that can be used to check which PATs are no
  * longer working. It returns a list of valid PATs, expired PATs and PATs with errors.
  *
- * @description This function is currently rate limited to 1 request per 10 minutes.
+ * @description This function is currently rate limited to 1 request per 5 minutes.
  */
 
 import { logger, request, dateDiff } from "../../src/common/utils.js";
-export const RATE_LIMIT_SECONDS = 60 * 5; // 1 request per 10 minutes
+export const RATE_LIMIT_SECONDS = 60 * 5; // 1 request per 5 minutes
 
 /**
  * Simple uptime check fetcher for the PATs.

api/status/up.js

@@ -2,13 +2,13 @@
  * @file Contains a simple cloud function that can be used to check if the PATs are still
  * functional.
  *
- * @description This function is currently rate limited to 1 request per 10 minutes.
+ * @description This function is currently rate limited to 1 request per 5 minutes.
  */
 
 import retryer from "../../src/common/retryer.js";
 import { logger, request } from "../../src/common/utils.js";
 
-export const RATE_LIMIT_SECONDS = 60 * 10; // 1 request per 10 minutes
+export const RATE_LIMIT_SECONDS = 60 * 5; // 1 request per 5 minutes
 
 /**
  * Simple uptime check fetcher for the PATs.

scripts/preview-theme.js

@@ -43,6 +43,23 @@ const ACCEPTED_COLOR_PROPS = Object.keys(COLOR_PROPS);
 const REQUIRED_COLOR_PROPS = ACCEPTED_COLOR_PROPS.slice(0, 4);
 const INVALID_REVIEW_COMMENT = (commentUrl) =>
   `Some themes are invalid. See the [Automated Theme Preview](${commentUrl}) comment above for more information.`;
+var OCTOKIT;
+var OWNER;
+var REPO;
+var PULL_REQUEST_ID;
+
+/**
+ * Incorrect JSON format error.
+ * @extends Error
+ * @param {string} message Error message.
+ * @returns {Error} IncorrectJsonFormatError.
+ */
+class IncorrectJsonFormatError extends Error {
+  constructor(message) {
+    super(message);
+    this.name = "IncorrectJsonFormatError";
+  }
+}
 
 /**
  * Retrieve PR number from the event payload.
@@ -126,15 +143,36 @@ const findComment = async (octokit, issueNumber, owner, repo, commenter) => {
  * Create or update the preview comment.
  *
  * @param {Object} octokit Octokit instance.
- * @param {Object} props Comment properties.
+ * @param {number} issueNumber Issue number.
+ * @param {Object} repo Repository name.
+ * @param {Object} owner Owner of the repository.
+ * @param {number} commentId Comment ID.
+ * @param {string} body Comment body.
  * @return {string} The comment URL.
  */
-const upsertComment = async (octokit, props) => {
+const upsertComment = async (
+  octokit,
+  issueNumber,
+  repo,
+  owner,
+  commentId,
+  body,
+) => {
   let resp;
-  if (props.comment_id !== undefined) {
+  if (commentId !== undefined) {
-    resp = await octokit.issues.updateComment(props);
+    resp = await octokit.issues.updateComment({
+      owner,
+      repo,
+      comment_id: commentId,
+      body,
+    });
   } else {
-    resp = await octokit.issues.createComment(props);
+    resp = await octokit.issues.createComment({
+      owner,
+      repo,
+      issue_number: issueNumber,
+      body,
+    });
   }
   return resp.data.html_url;
 };
@@ -269,22 +307,38 @@ const parseJSON = (json) => {
     if (typeof parsedJson === "object") {
       return parsedJson;
     } else {
-      throw new Error("PR diff is not a valid theme JSON object.");
+      throw new IncorrectJsonFormatError(
+        "PR diff is not a valid theme JSON object.",
+      );
     }
   } catch (error) {
-    let parsedJson = json
+    // Remove trailing commas (if any).
+    let parsedJson = json.replace(/(,\s*})/g, "}");
+
+    // Remove JS comments (if any).
+    parsedJson = parsedJson.replace(/\/\/[A-z\s]*\s/g, "");
+
+    // Fix incorrect open bracket (if any).
+    const splitJson = parsedJson
       .split(/([\s\r\s]*}[\s\r\s]*,[\s\r\s]*)(?=[\w"-]+:)/)
-      .filter((x) => typeof x !== "string" || !!x.trim());
+      .filter((x) => typeof x !== "string" || !!x.trim()); // Split json into array of strings and objects.
-    if (parsedJson[0].replace(/\s+/g, "") === "},") {
+    if (splitJson[0].replace(/\s+/g, "") === "},") {
-      parsedJson[0] = "},";
+      splitJson[0] = "},";
-      if (!/\s*}\s*,?\s*$/.test(parsedJson[1])) {
+      if (!/\s*}\s*,?\s*$/.test(splitJson[1])) {
-        parsedJson.push(parsedJson.shift());
+        splitJson.push(splitJson.shift());
       } else {
-        parsedJson.shift();
+        splitJson.shift();
       }
-      return Hjson.parse(parsedJson.join(""));
+      parsedJson = splitJson.join("");
-    } else {
+    }
-      throw error;
+
+    // Try to parse the fixed json.
+    try {
+      return Hjson.parse(parsedJson);
+    } catch (error) {
+      throw new IncorrectJsonFormatError(
+        `Theme JSON file could not be parsed: ${error.message}`,
+      );
     }
   }
 };
@@ -303,7 +357,7 @@ const DRY_RUN = process.env.DRY_RUN === "true" || false;
 /**
  * Main function.
  */
-export const run = async (prNumber) => {
+export const run = async () => {
   try {
     debug("Retrieve action information from context...");
     debug(`Context: ${inspect(github.context)}`);
@@ -312,40 +366,50 @@ export const run = async (prNumber) => {
       \r${THEME_CONTRIB_GUIDELINESS}
     `;
     const ccc = new ColorContrastChecker();
-    const octokit = github.getOctokit(getGithubToken());
+    OCTOKIT = github.getOctokit(getGithubToken());
-    const pullRequestId = prNumber ? prNumber : getPrNumber();
+    PULL_REQUEST_ID = getPrNumber();
-    const commenter = getCommenter();
     const { owner, repo } = getRepoInfo(github.context);
-    debug(`Owner: ${owner}`);
+    OWNER = owner;
-    debug(`Repo: ${repo}`);
+    REPO = repo;
+    const commenter = getCommenter();
+    PULL_REQUEST_ID = getPrNumber();
+    debug(`Owner: ${OWNER}`);
+    debug(`Repo: ${REPO}`);
     debug(`Commenter: ${commenter}`);
 
     // Retrieve the PR diff and preview-theme comment.
     debug("Retrieve PR diff...");
-    const res = await octokit.pulls.get({
+    const res = await OCTOKIT.pulls.get({
-      owner,
+      owner: OWNER,
-      repo,
+      repo: REPO,
-      pull_number: pullRequestId,
+      pull_number: PULL_REQUEST_ID,
       mediaType: {
         format: "diff",
       },
     });
     debug("Retrieve preview-theme comment...");
     const comment = await findComment(
-      octokit,
+      OCTOKIT,
-      pullRequestId,
+      PULL_REQUEST_ID,
-      owner,
+      OWNER,
-      repo,
+      REPO,
       commenter,
     );
 
     // Retrieve theme changes from the PR diff.
     debug("Retrieve themes...");
     const diff = parse(res.data);
+
+    // Retrieve all theme changes from the PR diff and convert to JSON.
+    debug("Retrieve theme changes...");
     const content = diff
       .find((file) => file.to === "themes/index.js")
-      .chunks[0].changes.filter((c) => c.type === "add")
+      .chunks.map((chunk) =>
-      .map((c) => c.content.replace("+", ""))
+        chunk.changes
+          .filter((c) => c.type === "add")
+          .map((c) => c.content.replace("+", ""))
+          .join(""),
+      )
       .join("");
     const themeObject = parseJSON(content);
     if (
@@ -515,13 +579,14 @@ export const run = async (prNumber) => {
     debug("Create or update theme-preview comment...");
     let comment_url;
     if (!DRY_RUN) {
-      comment_url = await upsertComment(octokit, {
+      comment_url = await upsertComment(
-        comment_id: comment?.id,
+        OCTOKIT,
-        issue_number: pullRequestId,
+        PULL_REQUEST_ID,
-        owner,
+        REPO,
-        repo,
+        OWNER,
-        body: commentBody,
+        comment?.id,
-      });
+        commentBody,
+      );
     } else {
       info(`DRY_RUN: Comment body: ${commentBody}`);
       comment_url = "";
@@ -538,18 +603,18 @@ export const run = async (prNumber) => {
       : INVALID_REVIEW_COMMENT(comment_url);
     if (!DRY_RUN) {
       await addReview(
-        octokit,
+        OCTOKIT,
-        pullRequestId,
+        PULL_REQUEST_ID,
-        owner,
+        OWNER,
-        repo,
+        REPO,
         reviewState,
         reviewReason,
       );
       await addRemoveLabel(
-        octokit,
+        OCTOKIT,
-        pullRequestId,
+        PULL_REQUEST_ID,
-        owner,
+        OWNER,
-        repo,
+        REPO,
         "invalid",
         !themesValid,
       );
@@ -561,18 +626,20 @@ export const run = async (prNumber) => {
     debug("Set review state to `REQUEST_CHANGES` and add `invalid` label...");
     if (!DRY_RUN) {
       await addReview(
-        octokit,
+        OCTOKIT,
-        pullRequestId,
+        PULL_REQUEST_ID,
-        owner,
+        OWNER,
-        repo,
+        REPO,
         "REQUEST_CHANGES",
-        error.message,
+        "**Something went wrong in the theme preview action:** `" +
+          error.message +
+          "`",
       );
       await addRemoveLabel(
-        octokit,
+        OCTOKIT,
-        pullRequestId,
+        PULL_REQUEST_ID,
-        owner,
+        OWNER,
-        repo,
+        REPO,
         "invalid",
         true,
       );

scripts/push-theme-readme.sh

@@ -6,6 +6,7 @@ export BRANCH_NAME=updated-theme-readme
 git --version
 git config --global user.email "no-reply@githubreadmestats.com"
 git config --global user.name "GitHub Readme Stats Bot"
+git config --global --add safe.directory ${GITHUB_WORKSPACE}
 git branch -d $BRANCH_NAME || true
 git checkout -b $BRANCH_NAME
 git add --all

themes/index.js

@@ -18,6 +18,27 @@ export const themes = {
     text_color: "417E87",
     bg_color: "ffffff00",
   },
+  shadow_red: {
+    title_color: "9A0000",
+    text_color: "444",
+    icon_color: "4F0000",
+    border_color: "4F0000",
+    bg_color: "ffffff00",
+  },
+  shadow_green: {
+    title_color: "007A00",
+    text_color: "444",
+    icon_color: "003D00",
+    border_color: "003D00",
+    bg_color: "ffffff00",
+  },
+  shadow_blue: {
+    title_color: "00779A",
+    text_color: "444",
+    icon_color: "004450",
+    border_color: "004490",
+    bg_color: "ffffff00",
+  },
   dark: {
     title_color: "fff",
     icon_color: "79ff97",