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>

CONTRIBUTING.md

@@ -47,11 +47,7 @@ All you need to do is edit the [themes/index.js](./themes/index.js) file and add
 
 While creating the Pull request to add a new theme **don't forget to add a screenshot of how your theme looks**, you can also test how it looks using custom URL parameters like `title_color`, `icon_color`, `bg_color`, `text_color`, `border_color`
 
-> **Note**
+> NOTE: If you are contributing your theme just because you are using it personally, then you can [customize the looks](./readme.md#customization) of your card with URL params instead.
-> If you are contributing your theme just because you are using it personally, then you can [customize the looks](./readme.md#customization) of your card with URL params instead.
-
-> **Note**
-> If your theme name contains multiple words (ie, hyphenated or underscor-ed theme names), please add two versions of theme: one with hyphens and one with underscores. This is to ensure backward-compatability with when we had hyphens for some themes and underscores for others.
 
 ## Any contributions you make will be under the MIT Software License
 

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/generate-theme-doc.js

@@ -56,7 +56,6 @@ const createStatMdLink = (theme) => {
 const generateLinks = (fn) => {
   return Object.keys(themes)
     .map((name) => fn(name))
-    .filter((name) => !name.includes('-'))
     .join("");
 };
 
@@ -68,7 +67,7 @@ const generateTable = ({ isRepoCard }) => {
   const rows = [];
   const themesFiltered = Object.keys(themes).filter(
     (name) => name !== (!isRepoCard ? "default_repocard" : "default"),
-  ).filter((name) => !name.includes('-'));
+  );
 
   for (let i = 0; i < themesFiltered.length; i += 3) {
     const one = themesFiltered[i];

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

@@ -12,18 +12,33 @@ export const themes = {
     text_color: "434d58",
     bg_color: "fffefe",
   },
-  "default-repocard": {
-    title_color: "2f80ed",
-    icon_color: "586069", // icon color is different
-    text_color: "434d58",
-    bg_color: "fffefe",
-  },
   transparent: {
     title_color: "006AFF",
     icon_color: "0579C3",
     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",
@@ -54,12 +69,6 @@ export const themes = {
     text_color: "427b58",
     bg_color: "fbf1c7",
   },
-  "gruvbox-light": {
-    title_color: "b57614",
-    icon_color: "af3a03",
-    text_color: "427b58",
-    bg_color: "fbf1c7",
-  },
   tokyonight: {
     title_color: "70a5fd",
     icon_color: "bf91f3",
@@ -120,24 +129,12 @@ export const themes = {
     text_color: "fffefe",
     bg_color: "273849",
   },
-  vue_dark: {
-    title_color: "41b883",
-    icon_color: "41b883",
-    text_color: "fffefe",
-    bg_color: "273849",
-  },
   "shades-of-purple": {
     title_color: "fad000",
     icon_color: "b362ff",
     text_color: "a599e9",
     bg_color: "2d2b55",
   },
-  shades_of_purple: {
-    title_color: "fad000",
-    icon_color: "b362ff",
-    text_color: "a599e9",
-    bg_color: "2d2b55",
-  },
   nightowl: {
     title_color: "c792ea",
     icon_color: "ffeb95",
@@ -156,12 +153,6 @@ export const themes = {
     text_color: "0cf574",
     bg_color: "040f0f",
   },
-  blue_green: {
-    title_color: "2f97c1",
-    icon_color: "f5b700",
-    text_color: "0cf574",
-    bg_color: "040f0f",
-  },
   algolia: {
     title_color: "00AEFF",
     icon_color: "2DDE98",
@@ -174,12 +165,6 @@ export const themes = {
     text_color: "ffd95b",
     bg_color: "000000",
   },
-  great_gatsby: {
-    title_color: "ffa726",
-    icon_color: "ffb74d",
-    text_color: "ffd95b",
-    bg_color: "000000",
-  },
   darcula: {
     title_color: "BA5F17",
     icon_color: "84628F",
@@ -210,24 +195,6 @@ export const themes = {
     text_color: "fff",
     bg_color: "000",
   },
-  solarized_dark: {
-    title_color: "268bd2",
-    icon_color: "b58900",
-    text_color: "859900",
-    bg_color: "002b36",
-  },
-  solarized_light: {
-    title_color: "268bd2",
-    icon_color: "b58900",
-    text_color: "859900",
-    bg_color: "fdf6e3",
-  },
-  chartreuse_dark: {
-    title_color: "7fff00",
-    icon_color: "00AEFF",
-    text_color: "fff",
-    bg_color: "000",
-  },
   nord: {
     title_color: "81a1c1",
     text_color: "d8dee9",
@@ -246,12 +213,6 @@ export const themes = {
     text_color: "a6accd",
     bg_color: "292d3e",
   },
-  material_palenight: {
-    title_color: "c792ea",
-    icon_color: "89ddff",
-    text_color: "a6accd",
-    bg_color: "292d3e",
-  },
   graywhite: {
     title_color: "24292e",
     icon_color: "24292e",
@@ -276,24 +237,6 @@ export const themes = {
     text_color: "ffffff",
     bg_color: "000000",
   },
-  vision_friendly_dark: {
-    title_color: "ffb000",
-    icon_color: "785ef0",
-    text_color: "ffffff",
-    bg_color: "000000",
-  },
-  ayu_mirage: {
-    title_color: "f4cd7c",
-    icon_color: "73d0ff",
-    text_color: "c7c8c2",
-    bg_color: "1f2430",
-  },
-  midnight_purple: {
-    title_color: "9745f5",
-    icon_color: "9f4bff",
-    text_color: "ffffff",
-    bg_color: "000000",
-  },
   calm: {
     title_color: "e07a5f",
     icon_color: "edae49",
@@ -306,12 +249,6 @@ export const themes = {
     text_color: "509E2F",
     bg_color: "ffffff",
   },
-  flag_india: {
-    title_color: "ff8f1c",
-    icon_color: "250E62",
-    text_color: "509E2F",
-    bg_color: "ffffff",
-  },
   omni: {
     title_color: "FF79C6",
     icon_color: "e7de79",
@@ -360,12 +297,6 @@ export const themes = {
     text_color: "d9c8a9",
     bg_color: "402b23",
   },
-  "kacho-ga": {
-    title_color: "bf4a3f",
-    icon_color: "a64833",
-    text_color: "d9c8a9",
-    bg_color: "402b23",
-  },
   outrun: {
     title_color: "ffcc00",
     icon_color: "ff1aff",
@@ -384,18 +315,6 @@ export const themes = {
     text_color: "718CA1",
     bg_color: "1D252C",
   },
-  "ocean-dark": {
-    title_color: "8957B2",
-    icon_color: "FFFFFF",
-    text_color: "92D534",
-    bg_color: "151A28",
-  },
-  "city-lights": {
-    title_color: "5D8CB3",
-    icon_color: "4798FF",
-    text_color: "718CA1",
-    bg_color: "1D252C",
-  },
   github_dark: {
     title_color: "58A6FF",
     icon_color: "1F6FEB",
@@ -414,24 +333,6 @@ export const themes = {
     text_color: "dbdbdb",
     bg_color: "252334",
   },
-  "github-dark": {
-    title_color: "58A6FF",
-    icon_color: "1F6FEB",
-    text_color: "C3D1D9",
-    bg_color: "0D1117",
-  },
-  "discord-old-blurple": {
-    title_color: "7289DA",
-    icon_color: "7289DA",
-    text_color: "FFFFFF",
-    bg_color: "2C2F33",
-  },
-  "aura-dark": {
-    title_color: "ff7372",
-    icon_color: "6cffd0",
-    text_color: "dbdbdb",
-    bg_color: "252334",
-  },
   panda: {
     title_color: "19f9d899",
     icon_color: "19f9d899",
@@ -444,12 +345,6 @@ export const themes = {
     text_color: "c5cdd3",
     bg_color: "1b2932",
   },
-  "noctis-minimus": {
-    title_color: "d3b692",
-    icon_color: "72b7c0",
-    text_color: "c5cdd3",
-    bg_color: "1b2932",
-  },
   cobalt2: {
     title_color: "ffc600",
     icon_color: "ffffff",
@@ -507,26 +402,6 @@ export const themes = {
     border_color: "3B4048",
     bg_color: "23272E",
   },
-  "rose-pine": {
-    title_color: "9ccfd8",
-    icon_color: "ebbcba",
-    text_color: "e0def4",
-    bg_color: "191724",
-  },
-  "date-night": {
-    title_color: "DA7885",
-    text_color: "E1B2A2",
-    icon_color: "BB8470",
-    border_color: "170F0C",
-    bg_color: "170F0C",
-  },
-  "one-dark-pro": {
-    title_color: "61AFEF",
-    text_color: "E5C06E",
-    icon_color: "C678DD",
-    border_color: "3B4048",
-    bg_color: "23272E",
-  },
   rose: {
     title_color: "8d192b",
     text_color: "862931",
@@ -541,13 +416,6 @@ export const themes = {
     border_color: "85A4C0",
     bg_color: "030314",
   },
-  "holi-theme": {
-    title_color: "5FABEE",
-    text_color: "D6E7FF",
-    icon_color: "5FABEE",
-    border_color: "85A4C0",
-    bg_color: "030314",
-  },
 };
 
 export default themes;