feature(top langs card): add ability to change progress bar background color in normal layout (resolves #3307) #3312

a-s-t-e-y-a · 2023-10-01T17:06:16Z

"prog_bg_color" query added to change the background of progress bar

…e background of progress bar

vercel · 2023-10-01T17:06:19Z

@a-s-t-e-y-a is attempting to deploy a commit to the github readme stats Team on Vercel.

A member of the Team first needs to authorize it.

Le0X8 · 2023-10-01T18:17:52Z

As requested in #3307

a-s-t-e-y-a · 2023-10-03T12:17:30Z

@rickstaa @anuraghazra @qwerty541 could you please review my PR

codecov · 2023-10-11T18:48:33Z

Codecov Report

All modified lines are covered by tests ✅

Comparison is base (712cb18) 98.38% compared to head (6c0cb91) 98.38%.
Report is 10 commits behind head on master.

Additional details and impacted files

@@           Coverage Diff           @@
##           master    #3312   +/-   ##
=======================================
  Coverage   98.38%   98.38%           
=======================================
  Files          27       27           
  Lines        5931     5950   +19     
  Branches      526      527    +1     
=======================================
+ Hits         5835     5854   +19     
  Misses         93       93           
  Partials        3        3

Files	Coverage Δ
api/top-langs.js	`100.00% <100.00%> (ø)`
src/cards/top-languages-card.js	`99.77% <100.00%> (+<0.01%)`	⬆️

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

qwerty541

Hey, @a-s-t-e-y-a! Thanks for your pull request! Generally your code is well, i'm ready to give my approval when requested changes will be done. Also it will be good if you can cover this feature with test. In case if you can provide a link on test deployment to be sure that it works, i'm okay with adding test in future pull request.

qwerty541 · 2023-10-11T18:49:24Z

readme.md

@@ -143,7 +143,7 @@ Change the `?username=` value to your GitHub username.
 > By default, the stats card only shows statistics like stars, commits and pull requests from public repositories. To show private statistics on the stats card, you should [deploy your own instance](#deploy-on-your-own) using your own GitHub API token.

 > [!NOTE]\
-> Available ranks are S (top 1%), A+ (12.5%), A (25%), A- (37.5%), B+ (50%), B (62.5%), B- (75%), C+ (87.5%) and C (everyone). This ranking scheme is based on the [Japanese academic grading](https://wikipedia.org/wiki/Academic_grading_in_Japan) system. The global percentile is calculated as a weighted sum of percentiles for each statistic (number of commits, pull requests, reviews, issues, stars and followers), based on the cumulative distribution function of the [exponential](https://wikipedia.org/wiki/exponential_distribution) and the [log-normal](https://wikipedia.org/wiki/Log-normal_distribution) distributions. The implementation can be investigated at [src/calculateRank.js](./src/calculateRank.js). The circle around the rank shows 100 minus the global percentile.
+> Available ranks are S (top 1%), A+ (12.5%), A (25%), A- (37.5%), B+ (50%), B (62.5%), B- (75%), C+ (87.5%) and C (everyone). This ranking scheme is based on the [Japanese academic grading](https://wikipedia.org/wiki/Academic_grading_in_Japan) system. The global percentile is calculated as a weighted sum of percentiles for each statistic (number of commits, pull requests, reviews, issues, stars and followers), based on the cumulative distribution function of the [exponential](https://wikipedia.org/wiki/exponential_distribution) and the [log-normal](https://wikipedia.org/wiki/Log-normal_distribution) distributions. The implementation can be investigated at [src/calculateRank.js](https://github.com/anuraghazra/github-readme-stats/blob/master/src/calculateRank.js). The circle around the rank shows 100 minus the global percentile.


Your pull request should contain changes only related to linked issue, you should remove this. Instead of this you should add information about new query parameter into language card options section https://github.com/anuraghazra/github-readme-stats#language-card-exclusive-options.

qwerty541 · 2023-10-11T18:52:33Z

src/cards/top-languages-card.js

  } = options;
-
+  console.log(prog_bg_color);


This console log should be removed

qwerty541 · 2023-10-11T18:55:00Z

api/top-langs.js

@@ -33,9 +33,9 @@ export default async (req, res) => {
    border_color,
    disable_animations,
    hide_progress,
+    prog_bg_color,


Let's rename it to progress_bar_bg_color or prog_bar_bg_color everywhere for consistency.

qwerty541 · 2023-10-11T18:56:30Z

src/cards/top-languages-card.js

@@ -322,9 +332,10 @@ const createDonutLanguagesNode = ({ langs, totalSize }) => {
 * @param {Lang[]} langs Array of programming languages.
 * @param {number} width Card width.
 * @param {number} totalLanguageSize Total size of all languages.
+ * @param {string} prog_bg_color Total size of all languages.


Description of this function argument was copy-pasted from previous. You should write correct description. Also type of argument does not indicate that it can be undefined.

qwerty541 · 2023-10-11T18:57:38Z

src/cards/top-languages-card.js

 * @returns {string} Normal layout card SVG object.
 */
-const renderNormalLayout = (langs, width, totalLanguageSize) => {
+const renderNormalLayout = (langs, width, totalLanguageSize, prog_bg_color) => {


It's better to use camel case for this function argument.

qwerty541 · 2023-10-11T18:59:26Z

src/cards/top-languages-card.js

@@ -203,11 +203,19 @@ const trimTopLanguages = (topLangs, langs_count, hide) => {
 * @param {number} props.width The card width
 * @param {string} props.color Color of the programming language.
 * @param {string} props.name Name of the programming language.
+ * @param {string} props.prog_bg_color Color of the background of progress bar


Type of this argument does not indicate that it can be undefined.

qwerty541 · 2023-10-11T19:03:11Z

src/cards/types.d.ts

@@ -6,6 +6,7 @@ export type CommonOptions = {
  icon_color: string;
  text_color: string;
  bg_color: string;
+  prog_bg_color: string;


It is wrong place for adding this parameter since it is exclusive for top languages card. It should be moved to TopLangOptions. Most likely that it is the reason why you did not get type error missing undefined variant in previous comments.

qwerty541 · 2023-10-11T20:02:42Z

src/cards/top-languages-card.js

+  name,
+  progress,
+  index,
+  prog_bg_color,


It's better to use camel case for this function argument.

Le0X8 · 2023-11-02T08:50:54Z

@a-s-t-e-y-a could you please change everything requested?

anuraghazra#3307 enhancement : prog_bg_color query added to change th…

e291374

…e background of progress bar

github-actions bot added the lang-card Issues related to the language card. label Oct 1, 2023

a-s-t-e-y-a mentioned this pull request Oct 1, 2023

Progress bar background color #3307

Open

anuraghazra#3066 bug Fixed : readme.md file as stated

0eb16bd

github-actions bot added the documentation Improvements or additions to documentation. label Oct 1, 2023

a-s-t-e-y-a added 2 commits October 2, 2023 00:17

anuraghazra#3066 bug Fixed : readme.md file as stated"

6fcf07e

anuraghazra#3066 bug Fixed : readme.md file as stated

6c0cb91

imrushikesh77 approved these changes Oct 1, 2023

View reviewed changes

a-s-t-e-y-a mentioned this pull request Oct 2, 2023

Fix: Progress Bar Background Color Issue (#3307) #3313

Closed

Le0X8 mentioned this pull request Oct 6, 2023

Progress bar background color #3307 option added #3328

Closed

qwerty541 requested changes Oct 11, 2023

View reviewed changes

qwerty541 requested a review from rickstaa October 11, 2023 20:12

qwerty541 assigned a-s-t-e-y-a Oct 11, 2023

qwerty541 added enhancement New feature or request. feature labels Oct 11, 2023

qwerty541 linked an issue Oct 11, 2023 that may be closed by this pull request

Progress bar background color #3307

Open

qwerty541 changed the title ~~#3307 enhancement : prog_bg_color query added~~ feature(top langs card): add ability to change progress bar background color in normal layout (resolves #3307) Oct 11, 2023

Le0X8 mentioned this pull request Oct 12, 2023

feature: add progress bar background color option #3346

Closed

github-actions bot added the ⭐ top pull request Top pull request. label Oct 16, 2023

github-actions bot mentioned this pull request Oct 16, 2023

Top Issues Dashboard #1935

Open

This was referenced Oct 18, 2023

Fix progress bar #3388

Open

Made changes and Tried solve #3307 #3396

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feature(top langs card): add ability to change progress bar background color in normal layout (resolves #3307) #3312

feature(top langs card): add ability to change progress bar background color in normal layout (resolves #3307) #3312

a-s-t-e-y-a commented Oct 1, 2023

vercel bot commented Oct 1, 2023

Le0X8 commented Oct 1, 2023

a-s-t-e-y-a commented Oct 3, 2023 •

edited

codecov bot commented Oct 11, 2023

qwerty541 left a comment

qwerty541 Oct 11, 2023

qwerty541 Oct 11, 2023

qwerty541 Oct 11, 2023

qwerty541 Oct 11, 2023

qwerty541 Oct 11, 2023

qwerty541 Oct 11, 2023

qwerty541 Oct 11, 2023

qwerty541 Oct 11, 2023

Le0X8 commented Nov 2, 2023

feature(top langs card): add ability to change progress bar background color in normal layout (resolves #3307) #3312

Are you sure you want to change the base?

feature(top langs card): add ability to change progress bar background color in normal layout (resolves #3307) #3312

Conversation

a-s-t-e-y-a commented Oct 1, 2023

vercel bot commented Oct 1, 2023

Le0X8 commented Oct 1, 2023

a-s-t-e-y-a commented Oct 3, 2023 • edited

codecov bot commented Oct 11, 2023

Codecov Report

qwerty541 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Le0X8 commented Nov 2, 2023

a-s-t-e-y-a commented Oct 3, 2023 •

edited