Merge pull request #287 from anuraghazra/master

[pull] master from anuraghazra:master

.github/workflows/empty-issues-closer.yaml

@@ -30,7 +30,7 @@ jobs:
       - uses: actions/checkout@b4ffde65f46336ab88eb53be808477a3936bae11 # v4.1.1
 
       - name: Run empty issues closer action
-        uses: rickstaa/empty-issues-closer-action@1e7541f3bb442b6df5fe07e8cc2f5184076f2246 # v1.1.44
+        uses: rickstaa/empty-issues-closer-action@096c761b38032baf0e9e6bb65c17abf0615a6e41 # v1.1.47
         env:
           github_token: ${{ secrets.GITHUB_TOKEN }}
         with:

.github/workflows/top-issues-dashboard.yml

@@ -34,7 +34,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Run top issues action
-        uses: rickstaa/top-issues-action@9ab0c00b87dbcfb3a34ebdaab6151e058a0bf352 # v1.3.69
+        uses: rickstaa/top-issues-action@ba0b5f329a1a85074e84b1944a7154202248b630 # v1.3.71
         env:
           github_token: ${{ secrets.GITHUB_TOKEN }}
         with:

api/pin.js

@@ -24,6 +24,7 @@ export default async (req, res) => {
     locale,
     border_radius,
     border_color,
+    description_lines_count,
   } = req.query;
 
   res.setHeader("Content-Type", "image/svg+xml");
@@ -96,6 +97,7 @@ export default async (req, res) => {
         border_color,
         show_owner: parseBoolean(show_owner),
         locale: locale ? locale.toLowerCase() : null,
+        description_lines_count,
       }),
     );
   } catch (err) {

package.json

@@ -43,7 +43,7 @@
     "@uppercod/css-to-object": "^1.1.1",
     "axios-mock-adapter": "^1.22.0",
     "color-contrast-checker": "^2.1.0",
-    "eslint": "^8.53.0",
+    "eslint": "^8.54.0",
     "eslint-config-prettier": "^9.0.0",
     "hjson": "^3.2.2",
     "husky": "^8.0.3",
@@ -57,7 +57,7 @@
     "prettier": "^3.1.0"
   },
   "dependencies": {
-    "axios": "^1.6.1",
+    "axios": "^1.6.2",
     "dotenv": "^16.3.1",
     "emoji-name-map": "^1.2.8",
     "github-username-regex": "^1.0.0",

readme.md

@@ -386,6 +386,7 @@ If we don't support your language, please consider contributing! You can find mo
 #### Repo Card Exclusive Options
 
 *   `show_owner` - Shows the repo's owner name *(boolean)*. Default: `false`.
+*   `description_lines_count` - Manually set the number of lines for the description *(number)*. Specified value will be clamped between 1 and 3. If this parameter is not specified, the number of lines will be automatically adjusted according to the actual length of the description. Default: `undefined`.
 
 #### Gist Card Exclusive Options
 

src/cards/repo-card.js

@@ -12,10 +12,13 @@ import {
   wrapTextMultiline,
   iconWithLabel,
   createLanguageNode,
+  clampValue,
 } from "../common/utils.js";
 import { repoCardLocales } from "../translations.js";
 
 const ICON_SIZE = 16;
+const DESCRIPTION_LINE_WIDTH = 59;
+const DESCRIPTION_MAX_LINES = 3;
 
 /**
  * Retrieves the repository description and wraps it to fit the card width.
@@ -73,22 +76,34 @@ const renderRepoCard = (repo, options = {}) => {
     border_radius,
     border_color,
     locale,
+    description_lines_count,
   } = options;
 
   const lineHeight = 10;
   const header = show_owner ? nameWithOwner : name;
   const langName = (primaryLanguage && primaryLanguage.name) || "Unspecified";
   const langColor = (primaryLanguage && primaryLanguage.color) || "#333";
+  const descriptionMaxLines = description_lines_count
+    ? clampValue(description_lines_count, 1, DESCRIPTION_MAX_LINES)
+    : DESCRIPTION_MAX_LINES;
 
   const desc = parseEmojis(description || "No description provided");
-  const multiLineDescription = wrapTextMultiline(desc);
-  const descriptionLines = multiLineDescription.length;
+  const multiLineDescription = wrapTextMultiline(
+    desc,
+    DESCRIPTION_LINE_WIDTH,
+    descriptionMaxLines,
+  );
+  const descriptionLinesCount = description_lines_count
+    ? clampValue(description_lines_count, 1, DESCRIPTION_MAX_LINES)
+    : multiLineDescription.length;
+
   const descriptionSvg = multiLineDescription
     .map((line) => `<tspan dy="1.2em" x="25">${encodeHTML(line)}</tspan>`)
     .join("");
 
   const height =
-    (descriptionLines > 1 ? 120 : 110) + descriptionLines * lineHeight;
+    (descriptionLinesCount > 1 ? 120 : 110) +
+    descriptionLinesCount * lineHeight;
 
   const i18n = new I18n({
     locale,

src/cards/types.d.ts

@@ -32,6 +32,7 @@ export type StatCardOptions = CommonOptions & {
 
 export type RepoCardOptions = CommonOptions & {
   show_owner: boolean;
+  description_lines_count: number;
 };
 
 export type TopLangOptions = CommonOptions & {

tests/renderRepoCard.test.js

@@ -339,4 +339,34 @@ describe("Test renderRepoCard", () => {
       "No description provided",
     );
   });
+
+  it("should have correct height with specified `description_lines_count` parameter", () => {
+    // Testing short description
+    document.body.innerHTML = renderRepoCard(data_repo.repository, {
+      description_lines_count: 1,
+    });
+    expect(document.querySelector("svg")).toHaveAttribute("height", "120");
+    document.body.innerHTML = renderRepoCard(data_repo.repository, {
+      description_lines_count: 3,
+    });
+    expect(document.querySelector("svg")).toHaveAttribute("height", "150");
+
+    // Testing long description
+    const longDescription =
+      "A tool that will make a lot of iPhone/iPad developers' life easier. It shares your app over-the-air in a WiFi network. Bonjour is used and no configuration is needed.";
+    document.body.innerHTML = renderRepoCard(
+      { ...data_repo.repository, description: longDescription },
+      {
+        description_lines_count: 3,
+      },
+    );
+    expect(document.querySelector("svg")).toHaveAttribute("height", "150");
+    document.body.innerHTML = renderRepoCard(
+      { ...data_repo.repository, description: longDescription },
+      {
+        description_lines_count: 1,
+      },
+    );
+    expect(document.querySelector("svg")).toHaveAttribute("height", "120");
+  });
 });