feat: limit langs shown on wakatime card (#988)

api/wakatime.js

@@ -25,6 +25,7 @@ module.exports = async (req, res) => {
     custom_title,
     locale,
     layout,
+    langs_count,
     api_domain,
     range,
     border_radius,
@@ -66,6 +67,7 @@ module.exports = async (req, res) => {
         border_radius,
         locale: locale ? locale.toLowerCase() : null,
         layout,
+        langs_count,
       }),
     );
   } catch (err) {

docs/readme_de.md

@@ -174,6 +174,7 @@ Du kannst mehrere, mit Kommas separierte, Werte in der bg_color Option angeben,
 - `hide_progress` - Verbirgt die Fortschrittanzeige und Prozentzahl _(boolean)_
 - `custom_title` - Legt einen benutzerdefinierten Titel fest
 - `layout` - Wechselt zwischen zwei verschiedenen Layouts: `default` & `compact`
+- `langs_count` - Begrenzt die Anzahl der angezeigten Sprachen auf der Karte
 - `api_domain` - Legt eine benutzerdefinierte API Domain fest, z.B. für [Hakatime](https://github.com/mujx/hakatime) oder [Wakapi](https://github.com/muety/wakapi)
 - `range` – Fragt eine eine Zeitspanne an, als die standardmäßig in WakaTime hinterlegte, z.B. `last_7_days`. Siehe [WakaTime API Dokumentation](https://wakatime.com/developers#stats).
 

docs/readme_es.md

@@ -192,6 +192,7 @@ Puedes pasar mútliples valores separados por coma en la opción `bg_color` para
 - `hide_progress` - Oculta la barra de progreso y el porcentaje _(booleano)_
 - `custom_title` - Establece un título personalizado
 - `layout` - Cambia entre los dos diseños disponibles `default` & `compact`
+- `langs_count` - Limita el número de idiomas que aparecen en el mapa
 - `api_domain` - Establece un dominio de API personalizado para la tarjeta
 
 ---

readme.md

@@ -211,6 +211,7 @@ You can provide multiple comma-separated values in bg_color option to render a g
 - `hide_progress` - Hides the progress bar and percentage _(boolean)_
 - `custom_title` - Sets a custom title for the card
 - `layout` - Switch between two available layouts `default` & `compact`
+- `langs_count` - Limit number of languages on the card, defaults to all reported langauges
 - `api_domain` - Set a custom API domain for the card, e.g. to use services like [Hakatime](https://github.com/mujx/hakatime) or [Wakapi](https://github.com/muety/wakapi)
 - `range` – Request a range different from your WakaTime default, e.g. `last_7_days`. See [WakaTime API docs](https://wakatime.com/developers#stats) for list of available options.
 

src/cards/wakatime-card.js

@@ -2,7 +2,7 @@ const Card = require("../common/Card");
 const I18n = require("../common/I18n");
 const { getStyles } = require("../getStyles");
 const { wakatimeCardLocales } = require("../translations");
-const { getCardColors, FlexLayout } = require("../common/utils");
+const { clampValue, getCardColors, FlexLayout } = require("../common/utils");
 const { createProgressNode } = require("../common/createProgressNode");
 const languageColors = require("../common/languageColors.json");
 
@@ -99,6 +99,7 @@ const renderWakatimeCard = (stats = {}, options = { hide: [] }) => {
     custom_title,
     locale,
     layout,
+    langs_count = languages ? languages.length : 0,
     border_radius
   } = options;
 
@@ -109,6 +110,8 @@ const renderWakatimeCard = (stats = {}, options = { hide: [] }) => {
 
   const lheight = parseInt(line_height, 10);
 
+  langsCount = clampValue(parseInt(langs_count), 1, langs_count);
+
   // returns theme based colors with proper overrides and defaults
   const { titleColor, textColor, iconColor, bgColor } = getCardColors({
     title_color,
@@ -121,6 +124,7 @@ const renderWakatimeCard = (stats = {}, options = { hide: [] }) => {
   const statItems = languages
     ? languages
         .filter((language) => language.hours || language.minutes)
+        .slice(0, langsCount)
         .map((language) => {
           return createTextNode({
             id: language.name,