Enhance GitHub Stats Functionality in scripts.js

[guibranco]

Closes #

📑 Description

✅ Checks

• [X] My pull request adheres to the code style of this project
• [X] My code requires changes to the documentation
• [X] I have updated the documentation as required
• [X] All the tests have passed

☢️ Does this introduce a breaking change?

• [ ] Yes
• [X] No

ℹ Additional Information

Summary by CodeRabbit

• New Features

  • Introduced dynamic updates for GitHub statistics, ensuring users see current data without needing to refresh the page.
  • Added a feature that refreshes GitHub stats every 15 minutes for improved user experience.

• Refactor

  • Enhanced the structure of the code by separating the functionality for updating GitHub statistics into its own function.

[coderabbitai[bot]]

Walkthrough

The changes enhance the functionality of the init and drawChart functions in the Src/static/scripts.js file. A new function, showGitHubStats, is introduced to dynamically update GitHub statistics and streaks with a random refresh parameter to avoid caching. The drawChart function now includes a call to showGitHubStats, which is set to execute every 15 minutes, ensuring the statistics remain current without a page refresh. This modular approach improves the maintainability of the code.

Changes

File	Change Summary
Src/static/scripts.js	Added function showGitHubStats() to update GitHub statistics dynamically.
	Refactored init and drawChart functions to incorporate the new statistics function.

Poem

In the code where rabbits play,
GitHub stats now dance and sway.
Every fifteen minutes, they refresh,
Keeping data fresh, oh what a mesh!
With a hop and a skip, we cheer,
For stats that shine, so bright and clear! 🐇✨

---

Recent review details

**Configuration used: CodeRabbit UI** **Review profile: CHILL**

Commits

Files that changed from the base of the PR and between d9ba6321b81872dba74d6a37b537974f67c51fc1 and 03ca3355ee124c88525a49a95908e85d03b49bf4.

Files selected for processing (1)

* Src/static/scripts.js (2 hunks)

Additional context used

GitHub Check: Codacy Static Code Analysis

Src/static/scripts.js

[notice] 206-206: Src/static/scripts.js#L206 Delete `··`

Additional comments not posted (3)

Src/static/scripts.js (3)

Line range hint `11-16`: **Refactoring looks good!** The refactoring of the `init` function to move the code for setting the source URLs for GitHub statistics and streaks to a separate function `showGitHubStats` improves the modularity and maintainability of the code. --- `194-202`: **LGTM!** The changes to the `drawChart` function to include a call to `showGitHubStats` and set up an interval to call `showGitHubStats` every 15 minutes improve the user experience by ensuring that the GitHub stats are current without requiring a page refresh. --- `204-215`: **New function looks good!** The new `showGitHubStats` function improves the modularity of the code by separating the functionality of updating the GitHub statistics and streaks dynamically. The use of a random `refresh` parameter ensures that the displayed data is updated periodically, preventing caching issues.

Tools

GitHub Check: Codacy Static Code Analysis

[notice] 206-206: Src/static/scripts.js#L206 Delete `··`

--- Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

Share

- [X](https://twitter.com/intent/tweet?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A&url=https%3A//coderabbit.ai) - [Mastodon](https://mastodon.social/share?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A%20https%3A%2F%2Fcoderabbit.ai) - [Reddit](https://www.reddit.com/submit?title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&text=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code.%20Check%20it%20out%3A%20https%3A//coderabbit.ai) - [LinkedIn](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fcoderabbit.ai&mini=true&title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&summary=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code)

Tips

### Chat There are 3 ways to chat with [CodeRabbit](https://coderabbit.ai): - Review comments: Directly reply to a review comment made by CodeRabbit. Example: -- `I pushed a fix in commit , please review it.` -- `Generate unit testing code for this file.` - `Open a follow-up GitHub issue for this discussion.` - Files and specific lines of code (under the "Files changed" tab): Tag `@coderabbitai` in a new review comment at the desired location with your query. Examples: -- `@coderabbitai generate unit testing code for this file.` -- `@coderabbitai modularize this function.` - PR comments: Tag `@coderabbitai` in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples: -- `@coderabbitai generate interesting stats about this repository and render them as a table.` -- `@coderabbitai read src/utils.ts and generate unit testing code.` -- `@coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.` -- `@coderabbitai help me debug CodeRabbit configuration file.` Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. ### CodeRabbit Commands (Invoked using PR comments) - `@coderabbitai pause` to pause the reviews on a PR. - `@coderabbitai resume` to resume the paused reviews. - `@coderabbitai review` to trigger an incremental review. This is useful when automatic reviews are disabled for the repository. - `@coderabbitai full review` to do a full review from scratch and review all the files again. - `@coderabbitai summary` to regenerate the summary of the PR. - `@coderabbitai resolve` resolve all the CodeRabbit review comments. - `@coderabbitai configuration` to show the current CodeRabbit configuration for the repository. - `@coderabbitai help` to get help. ### Other keywords and placeholders - Add `@coderabbitai ignore` anywhere in the PR description to prevent this PR from being reviewed. - Add `@coderabbitai summary` to generate the high-level summary at a specific location in the PR description. - Add `@coderabbitai` anywhere in the PR title to generate the title automatically. ### CodeRabbit Configuration File (`.coderabbit.yaml`) - You can programmatically configure CodeRabbit by adding a `.coderabbit.yaml` file to the root of your repository. - Please see the [configuration documentation](https://docs.coderabbit.ai/guides/configure-coderabbit) for more information. - If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: `# yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json` ### Documentation and Community - Visit our [Documentation](https://coderabbit.ai/docs) for detailed information on how to use CodeRabbit. - Join our [Discord Community](https://discord.com/invite/GsXnASn26c) to get help, request features, and share feedback. - Follow us on [X/Twitter](https://twitter.com/coderabbitai) for updates and announcements.

[penify-dev[bot]]

PR Review 🔍

⏱️ Estimated effort to review [1-5]	3, because the changes involve refactoring and introducing new functionality, which requires understanding the existing code structure and ensuring compatibility.
🧪 Relevant tests	No
⚡ Possible issues	Possible Bug: The random refresh parameter in `showGitHubStats` could lead to unnecessary API calls, potentially exceeding rate limits.
🔒 Security concerns	No

[sonarcloud[bot]]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
No data about Coverage
0.0% Duplication on New Code

See analysis details on SonarCloud

[penify-dev[bot]]

PR Code Suggestions ✨

Category	Suggestion	Score
Possible issue	Add element existence checks before setting their src attributes to prevent potential errors ___ **Consider validating the existence of the elements with IDs gh_stats and gh_streak before attempting to set their src attributes to avoid potential runtime errors.** [Src/static/scripts.js [207-211]](https://github.com/guibranco/projects-monitor/pull/522/files#diff-38a7d87a918ade34cc7e0534b88e73ea9ba774277c1f6d5ecf2eed5ab4e9e5fbR207-R211) ```diff -document.getElementById("gh_stats").src = - "https://github-readme-stats-guibranco.vercel.app/api" + - "?username=guibranco&line_height=28&card_width=490&hide_title=true&hide_border=true" + - "&show_icons=true&theme=chartreuse-dark&icon_color=7FFF00&include_all_commits=true" + - "&count_private=true&show=reviews,discussions_started&count_private=true&refresh=" + refresh; +const ghStatsElement = document.getElementById("gh_stats"); +if (ghStatsElement) { + ghStatsElement.src = + "https://github-readme-stats-guibranco.vercel.app/api" + + "?username=guibranco&line_height=28&card_width=490&hide_title=true&hide_border=true" + + "&show_icons=true&theme=chartreuse-dark&icon_color=7FFF00&include_all_commits=true" + + "&count_private=true&show=reviews,discussions_started&count_private=true&refresh=" + refresh; +} ``` Suggestion importance[1-10]: 9 Why: This suggestion addresses a potential runtime error by ensuring that the elements exist before trying to access their properties, which is crucial for robust code.	9
Performance	Change the random refresh value to a timestamp to control API request frequency ___ **The refresh parameter is generated randomly; consider using a more controlled approach to avoid excessive requests to the GitHub stats API.** [Src/static/scripts.js [205]](https://github.com/guibranco/projects-monitor/pull/522/files#diff-38a7d87a918ade34cc7e0534b88e73ea9ba774277c1f6d5ecf2eed5ab4e9e5fbR205-R205) ```diff -const refresh = Math.floor(Math.random() * 100000); +const refresh = Date.now(); // Use current timestamp as a refresh value ``` Suggestion importance[1-10]: 7 Why: While changing the `refresh` value to a timestamp can help control the frequency of API requests, the randomization may serve a purpose in preventing caching issues.	7
	Check for online status before calling the showGitHubStats function to optimize API usage ___ **Ensure that the showGitHubStats function is only called if the user is online to prevent unnecessary API calls when offline.** [Src/static/scripts.js [194]](https://github.com/guibranco/projects-monitor/pull/522/files#diff-38a7d87a918ade34cc7e0534b88e73ea9ba774277c1f6d5ecf2eed5ab4e9e5fbR194-R194) ```diff -showGitHubStats(); +if (navigator.onLine) { + showGitHubStats(); +} ``` Suggestion importance[1-10]: 6 Why: This suggestion improves performance by checking the user's online status before making API calls, but it is a minor optimization compared to the other suggestions.	6

[github-actions[bot]]

Infisical secrets check: :white_check_mark: No secrets leaked!

Scan results:

9:43PM INF scanning for exposed secrets...
9:43PM INF 472 commits scanned.
9:43PM INF scan completed in 210ms
9:43PM INF no leaks found

[github-actions[bot]]

:rocket: Postman tests are disabled

:x: The Postman collection run is disabled.

[github-actions[bot]]

:test_tube: Request tests summary

:white_check_mark: All test requests succeeded

[github-actions[bot]]

:mag: Database integrity summary

:white_check_mark: The database integrity check succeeded

[github-actions[bot]]

:fire_engine: Smoke tests summary

:fire: Smoke tests passed!