feat: custom card title (#293)

* Custom stats title (anuraghazra#229)

* Add custom title test

* remove unused code

* Update readme.md to include the `custom_title` option

* Update readme_es.md to include `custom_title` option

Co-Authored-By: José Javier Rodríguez Zas <jjavierdguezas@gmail.com>

* Merge branch 'master' of https://github.com/anuraghazra/github-readme-stats.git into custom-title

* feat: added customTitle option in Card

Co-authored-by: José Javier Rodríguez Zas <jjavierdguezas@gmail.com>
Co-authored-by: Anurag <hazru.anurag@gmail.com>

src/cards/repo-card.js

@@ -106,7 +106,7 @@ const renderRepoCard = (repo, options = {}) => {
   }).join("");
 
   const card = new Card({
-    title: header,
+    defaultTitle: header,
     titlePrefixIcon: icons.contribs,
     width: 400,
     height,

src/cards/stats-card.js

@@ -65,6 +65,7 @@ const renderStatsCard = (stats = {}, options = { hide: [] }) => {
     text_color,
     bg_color,
     theme = "default",
+    custom_title,
   } = options;
 
   const lheight = parseInt(line_height, 10);
@@ -167,7 +168,8 @@ const renderStatsCard = (stats = {}, options = { hide: [] }) => {
 
   const apostrophe = ["x", "s"].includes(name.slice(-1)) ? "" : "s";
   const card = new Card({
-    title: `${encodeHTML(name)}'${apostrophe} GitHub Stats`,
+    customTitle: custom_title,
+    defaultTitle: `${encodeHTML(name)}'${apostrophe} GitHub Stats`,
     width: 495,
     height,
     colors: {

src/cards/top-languages-card.js

@@ -69,6 +69,7 @@ const renderTopLanguages = (topLangs, options = {}) => {
     hide,
     theme,
     layout,
+    custom_title,
   } = options;
 
   let langs = Object.values(topLangs);
@@ -170,7 +171,8 @@ const renderTopLanguages = (topLangs, options = {}) => {
   }
 
   const card = new Card({
-    title: "Most Used Languages",
+    customTitle: custom_title,
+    defaultTitle: "Most Used Languages",
     width,
     height,
     colors: {

src/cards/wakatime-card.js

@@ -59,6 +59,7 @@ const renderWakatimeCard = (stats = {}, options = { hide: [] }) => {
     bg_color,
     theme = "default",
     hide_progress,
+    custom_title,
   } = options;
 
   const lheight = parseInt(line_height, 10);
@@ -99,7 +100,8 @@ const renderWakatimeCard = (stats = {}, options = { hide: [] }) => {
   });
 
   const card = new Card({
-    title: "Wakatime Week Stats",
+    customTitle: custom_title,
+    defaultTitle: "Wakatime Week Stats",
     width: 495,
     height,
     colors: {

src/common/Card.js

@@ -1,4 +1,4 @@
-const { FlexLayout } = require("../common/utils");
+const { FlexLayout, encodeHTML } = require("../common/utils");
 const { getAnimations } = require("../getStyles");
 
 class Card {
@@ -6,7 +6,8 @@ class Card {
     width = 100,
     height = 100,
     colors = {},
-    title = "",
+    customTitle,
+    defaultTitle = "",
     titlePrefixIcon,
   }) {
     this.width = width;
@@ -17,7 +18,11 @@ class Card {
 
     // returns theme based colors with proper overrides and defaults
     this.colors = colors;
-    this.title = title;
+    this.title =
+      customTitle !== undefined
+        ? encodeHTML(customTitle)
+        : encodeHTML(defaultTitle);
+
     this.css = "";
 
     this.paddingX = 25;