Creates a new Streaks Card #3338

yaten2302 · 2023-10-09T14:10:20Z

Fixes issue - #3209

This PR creates a new streak card which shows the user's streak on GitHub.

Screenshots

…tats

vercel · 2023-10-09T14:10:24Z

@yaten2302 is attempting to deploy a commit to the github readme stats Team on Vercel.

A member of the Team first needs to authorize it.

rickstaa

@yaten2302 First, you did an excellent job on your first PR. You can be genuinely proud of yourself 🚀. I added some things that need to be improved before this pull request can be merged. Besides these points, the pull requests also lack tests, which need to be added. You can check out the tests folder to see how these tests should be implemented.

I also like the simplicity of the design of your card. I think when icons are added, it truly gives users a different card than the one already provided by https://github.com/DenverCoder1/github-readme-streak-stats ❤️‍🔥. One improvement I can think of is to add a small graph to the right of the stats that displays the user's contributions over time (see https://github.com/Ashutosh00710/github-readme-activity-graph) 🤔.

api/streak.js

rickstaa · 2023-10-13T13:01:36Z

readme.md

@@ -568,6 +571,24 @@ Change the `?username=` value to your [Wakatime](https://wakatime.com) username.

 ***


Suggested change

***

rickstaa · 2023-10-13T13:01:42Z

readme.md

+### Hide individual elements from the streaks card
+
+To hide individual elements form the card, use - `&hide=params`, where `params` = `totalContributions`, `weeklyLongest`, `weeklyCurrent`, `dailyLongest`, `dailyCurrent`
+


Suggested change

***

src/cards/streak-card.js

rickstaa · 2023-10-13T13:05:21Z

src/common/utils.js

@@ -123,13 +123,23 @@ const iconWithLabel = (icon, label, testid, iconSize) => {
 /**
 * Retrieves num with suffix k(thousands) precise to 1 decimal if greater than 999.
 *
- * @param {number} num The number to format.
- * @returns {string|number} The formatted number.
+ *  num The number to format.


Why are the typings removed 🤔 ?

I guess, I removed those typings by mistake, will add those again 👍

rickstaa · 2023-10-13T13:07:14Z

src/common/utils.js

-    : Math.sign(num) * Math.abs(num);
+    : Math.sign(num) * Math.abs(num); */
+
+  if (typeof num == "number") {


Why does this need to be changed? This function should only accept numbers. In its current form strings should be converted before they enter the function.

I changed this because while rendering the streaks card, it requires some additional information in the value (like - days or weeks)

If this is reverted to the original code, then it will show NaN in the value instead of 2 weeks or something.
This change will not affect the other cards. But, if you want, then I can make a separate function in the utils.js specifically for the Streaks card?

I see. You should handle this problem outside the kFormatter function. Maybe only use the kformatter function when the value is a number:

github-readme-stats/src/cards/streak-card.js

Line 19 in 33f132b

const kValue = number_format === "long" ? value : kFormatter(value);

src/fetchers/streak-fetcher.js

rickstaa · 2023-10-13T13:51:51Z

Since my comments will take you some time to implement, I already attached the hacktoberfest-accepted label so that this pull request will appear in your hacktoberfest portal 👍🏻.

yaten2302 · 2023-10-13T18:03:12Z

Hi @rickstaa, thanks for your valuable suggestions, I'll surely make the necessary changes ASAP.
Also, I would like to state, that I had a similar idea of creating a Graph of user's contributions, as mentioned by you. I thought of creating a separate issue for, I thought that the Graph would look odd in the Streaks card?

So, should I create a separate card for the graph or should I add it here only?

rickstaa · 2023-10-14T08:32:02Z

Hi @rickstaa, thanks for your valuable suggestions, I'll surely make the necessary changes ASAP. Also, I would like to state, that I had a similar idea of creating a Graph of user's contributions, as mentioned by you. I thought of creating a separate issue for, I thought that the Graph would look odd in the Streaks card.

So, should I create a separate card for the graph or add it here?

Or something like this

Which I quickly created in GIMP. Coding it would be more work, though. But maybe you can combine the code in https://github.com/Ashutosh00710/github-readme-activity-graph/tree/main/src with the code you already have 🤔.

@qwerty541, @anuraghazra, what are your thoughts on this design and whether we should add a new streak card in the GRS repository?

anuraghazra · 2023-10-14T15:25:14Z

what are your thoughts on this design and whether we should add a new streak card in the GRS repository?

Will have to think this through, I'm not sure about adding this Card.

There are already solutions out there which have better design & more features and specific to streaks Card
Not sure if it would be healthy to add streaks Card both in terms of open source morality & the monopoly, I find it a bit conflicting in one hand github-readme-stats is probably the most popular stats card service out there and I want other stats card service like readme-activity-tree & github-readme-streaks-card to also be part of the community instead of us having all the Cards and being a monopoly.
More cards -> more maintenance -> more vercel load

rickstaa · 2023-10-15T08:23:49Z

what are your thoughts on this design and whether we should add a new streak card in the GRS repository?

Will have to think this through, I'm not sure about adding this Card.

There are already solutions out there which have better design & more features and specific to streaks Card

Not sure if it would be healthy to add streaks Card both in terms of open source morality & the monopoly, I find it a bit conflicting in one hand github-readme-stats is probably the most popular stats card service out there and I want other stats card service like readme-activity-tree & github-readme-streaks-card to also be part of the community instead of us having all the Cards and being a monopoly.

More cards -> more maintenance -> more vercel load

@anuraghazra, thanks for your thoughts. Those are excellent points, and I think it is similar to the statement by @qwerty541 that we should only add this Card if it has a unique design/feature set compared to https://github.com/DenverCoder1/github-readme-streak-stats (see #3209 (comment)). Sadly, the current implementation by @yaten2302, in my opinion, is not unique enough. I think my design, which combines https://github.com/Ashutosh00710/github-readme-activity-graph and https://github.com/DenverCoder1/github-readme-streak-stats, would offer a special card for users. Neverteless, this Card might be best realised as a feature/pull request to https://github.com/DenverCoder1/github-readme-streak-stats instead of being added to GRS.

rickstaa · 2023-10-15T08:35:36Z

what are your thoughts on this design and whether we should add a new streak card in the GRS repository?

Will have to think this through, I'm not sure about adding this Card.

There are already solutions out there which have better design & more features and specific to streaks Card

Not sure if it would be healthy to add streaks Card both in terms of open source morality & the monopoly, I find it a bit conflicting in one hand github-readme-stats is probably the most popular stats card service out there and I want other stats card service like readme-activity-tree & github-readme-streaks-card to also be part of the community instead of us having all the Cards and being a monopoly.

More cards -> more maintenance -> more vercel load

@anuraghazra, thanks for your thoughts. Those are excellent points, and I think it is similar to the statement by @qwerty541 that we should only add this Card if it has a unique design/feature set compared to https://github.com/DenverCoder1/github-readme-streak-stats (see #3209 (comment)). Sadly, the current implementation by @yaten2302, in my opinion, is not unique enough. I think my design, which combines https://github.com/Ashutosh00710/github-readme-activity-graph and https://github.com/DenverCoder1/github-readme-streak-stats, would offer a special card for users. Neverteless, this Card might be best realised as a feature/pull request to https://github.com/DenverCoder1/github-readme-streak-stats instead of being added to GRS.

Originally posted by @rickstaa in #3338 (comment)

rickstaa · 2023-10-15T08:36:10Z

@qwerty541, @anuraghazra Let's continue the discussion on #3338.

yaten2302 · 2023-10-15T10:48:28Z

@rickstaa, @anuraghazra, @qwerty541, is this card not required or it requires a change in its design?

rickstaa · 2023-10-15T14:26:23Z

@rickstaa, @anuraghazra, @qwerty541, is this card not required, or it requires a change in its design?

To summarize. We concluded that your card doesn't offer more new features compared to https://github.com/DenverCoder1/github-readme-streak-stats. Adding it to GRS might create a monopoly against https://github.com/DenverCoder1/github-readme-streak-stats since this project is more popular 😅. Maybe @anuraghazra can elaborate on whether he wants to accept this card if it has a very different design from https://github.com/DenverCoder1/github-readme-streak-stats.

anuraghazra · 2023-10-16T18:09:25Z

Conclusion: let's refrain from adding Card. Given there are already better solutions out there which people can use, plus it reduces our maintenance and dev efforts.

rickstaa · 2023-10-17T09:12:30Z

Conclusion: let's refrain from adding Card. Given there are already better solutions out there which people can use, plus it reduces our maintenance and dev efforts.

I agree. Let's close this when Hacktoberfest is over 👍🏻.

yaten2302 and others added 10 commits August 27, 2023 15:55

test translations.js

e044cc8

test icons.js

f48d5c4

test stats-fetcher.js

53decae

test types.d.ts

b19934f

all changes reverted

982375f

Merge branch 'anuraghazra:master' into master

575766b

Merge branch 'anuraghazra:master' into master

aa03a75

added streak card to readme

b20a4b1

added streak card

1766373

Merge branch 'master' of https://github.com/yaten2302/github-readme-s…

dd8b478

…tats

github-actions bot added documentation Improvements or additions to documentation. card-i18n Card text translations. labels Oct 9, 2023

Merge branch 'anuraghazra:master' into master

33f132b

rickstaa requested changes Oct 13, 2023

View reviewed changes

rickstaa added the hacktoberfest-accepted label Oct 13, 2023

rickstaa closed this Oct 17, 2023

rickstaa reopened this Oct 17, 2023

rickstaa mentioned this pull request Oct 17, 2023

Feature Request: Designing a new stat card for showing GitHub streak #3209

Closed

yaten2302 added 2 commits October 23, 2023 00:35

Merge branch 'anuraghazra:master' into master

0c3cd3d

Update gist.js

c873703

github-actions bot added the gist-card label Oct 22, 2023

yaten2302 closed this by deleting the head repository Oct 22, 2023

yaten2302 mentioned this pull request Dec 14, 2023

Migrate codebase to Typescript #2052

Open

qwerty541 mentioned this pull request Jan 28, 2024

Trophies Card #3613

Open

This was referenced May 4, 2024

Add option to combine languages #3530

Open

Wakatime leaderboards stats #3721

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Creates a new Streaks Card #3338

Creates a new Streaks Card #3338

yaten2302 commented Oct 9, 2023

vercel bot commented Oct 9, 2023

rickstaa left a comment

rickstaa Oct 13, 2023

rickstaa Oct 13, 2023

rickstaa Oct 13, 2023

yaten2302 Oct 13, 2023

rickstaa Oct 13, 2023

yaten2302 Oct 13, 2023

rickstaa Oct 14, 2023

rickstaa commented Oct 13, 2023

yaten2302 commented Oct 13, 2023

rickstaa commented Oct 14, 2023 •

edited

Loading

anuraghazra commented Oct 14, 2023

rickstaa commented Oct 15, 2023

rickstaa commented Oct 15, 2023

rickstaa commented Oct 15, 2023

yaten2302 commented Oct 15, 2023

rickstaa commented Oct 15, 2023

anuraghazra commented Oct 16, 2023

rickstaa commented Oct 17, 2023

		@@ -568,6 +571,24 @@ Change the `?username=` value to your [Wakatime](https://wakatime.com) username.

		***

		### Hide individual elements from the streaks card

		To hide individual elements form the card, use - `&hide=params`, where `params` = `totalContributions`, `weeklyLongest`, `weeklyCurrent`, `dailyLongest`, `dailyCurrent`

Creates a new Streaks Card #3338

Creates a new Streaks Card #3338

Conversation

yaten2302 commented Oct 9, 2023

Fixes issue - #3209

Screenshots

vercel bot commented Oct 9, 2023

rickstaa left a comment

Choose a reason for hiding this comment

rickstaa Oct 13, 2023

Choose a reason for hiding this comment

rickstaa Oct 13, 2023

Choose a reason for hiding this comment

rickstaa Oct 13, 2023

Choose a reason for hiding this comment

yaten2302 Oct 13, 2023

Choose a reason for hiding this comment

rickstaa Oct 13, 2023

Choose a reason for hiding this comment

yaten2302 Oct 13, 2023

Choose a reason for hiding this comment

rickstaa Oct 14, 2023

Choose a reason for hiding this comment

rickstaa commented Oct 13, 2023

yaten2302 commented Oct 13, 2023

rickstaa commented Oct 14, 2023 • edited Loading

anuraghazra commented Oct 14, 2023

rickstaa commented Oct 15, 2023

rickstaa commented Oct 15, 2023

rickstaa commented Oct 15, 2023

yaten2302 commented Oct 15, 2023

rickstaa commented Oct 15, 2023

anuraghazra commented Oct 16, 2023

rickstaa commented Oct 17, 2023

rickstaa commented Oct 14, 2023 •

edited

Loading