Skip to content

Commit

Permalink
Add format stats option (#2155)
Browse files Browse the repository at this point in the history
* feat: added `format_stats` option (#2128)

* refactor: change `format_stats` to `short_values` (#2128)

* test: create shorten values test (#2128)

* Update readme.md

Co-authored-by: Rick Staa <rick.staa@outlook.com>

* refactor: rename ``short_values`` to ``number_format``

* Update readme.md

Co-authored-by: Rick Staa <rick.staa@outlook.com>

* Update src/cards/stats-card.js

Co-authored-by: Rick Staa <rick.staa@outlook.com>

* refactor: format codebase

---------

Co-authored-by: Rick Staa <rick.staa@outlook.com>
  • Loading branch information
CaedenPH and rickstaa authored Apr 1, 2023
1 parent b928f51 commit d8244a7
Show file tree
Hide file tree
Showing 5 changed files with 18 additions and 1 deletion.
2 changes: 2 additions & 0 deletions api/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ export default async (req, res) => {
locale,
disable_animations,
border_radius,
number_format,
border_color,
} = req.query;
res.setHeader("Content-Type", "image/svg+xml");
Expand Down Expand Up @@ -88,6 +89,7 @@ export default async (req, res) => {
custom_title,
border_radius,
border_color,
number_format,
locale: locale ? locale.toLowerCase() : null,
disable_animations: parseBoolean(disable_animations),
}),
Expand Down
1 change: 1 addition & 0 deletions readme.md
Original file line number Diff line number Diff line change
Expand Up @@ -289,6 +289,7 @@ You can provide multiple comma-separated values in the bg_color option to render
- `text_bold` - Use bold text _(boolean)_. Default: `true`.
- `disable_animations` - Disables all animations in the card _(boolean)_. Default: `false`.
- `ring_color` - Color of the rank circle _(hex color)_. Defaults to the theme ring color if it exists and otherwise the title color.
- `number_format` - Switch between two available formats for displaying the card values `short` (i.e. `6.6k`) and `long` (i.e. `6626`). Default: `short`.

> **Note**
> When hide_rank=`true`, the minimum card width is 270 px + the title length and padding.
Expand Down
6 changes: 5 additions & 1 deletion src/cards/stats-card.js
Original file line number Diff line number Diff line change
Expand Up @@ -39,8 +39,10 @@ const createTextNode = ({
showIcons,
shiftValuePos,
bold,
number_format,
}) => {
const kValue = kFormatter(value);
const kValue =
number_format.toLowerCase() === "long" ? value : kFormatter(value);
const staggerDelay = (index + 3) * 150;

const labelOffset = showIcons ? `x="25"` : "";
Expand Down Expand Up @@ -103,6 +105,7 @@ const renderStatsCard = (stats = {}, options = { hide: [] }) => {
custom_title,
border_radius,
border_color,
number_format = "short",
locale,
disable_animations = false,
} = options;
Expand Down Expand Up @@ -192,6 +195,7 @@ const renderStatsCard = (stats = {}, options = { hide: [] }) => {
showIcons: show_icons,
shiftValuePos: 79.01 + (isLongLocale ? 50 : 0),
bold: text_bold,
number_format,
}),
);

Expand Down
1 change: 1 addition & 0 deletions src/cards/types.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ export type StatCardOptions = CommonOptions & {
line_height: number | string;
custom_title: string;
disable_animations: boolean;
number_format: string;
};

export type RepoCardOptions = CommonOptions & {
Expand Down
9 changes: 9 additions & 0 deletions tests/renderStatsCard.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -357,4 +357,13 @@ describe("Test renderStatsCard", () => {
document.body.innerHTML = renderStatsCard(stats, {});
expect(document.querySelector("rect")).toHaveAttribute("rx", "4.5");
});

it("should shorten values", () => {
stats["totalCommits"] = 1999;

document.body.innerHTML = renderStatsCard(stats);
expect(getByTestId(document.body, "commits").textContent).toBe("2k");
document.body.innerHTML = renderStatsCard(stats, { number_format: "long" });
expect(getByTestId(document.body, "commits").textContent).toBe("1999");
});
});

0 comments on commit d8244a7

Please sign in to comment.