fix: Show GitHub stars on social wrapper

src/app/common/social-wrapper/social-wrapper.component.html

@@ -1,17 +1,24 @@
 <div class="social-wrapper">
-  <a href="https://twitter.com/nestframework"
-     title="Twitter account"
-     target="_blank">
+  <a
+    href="https://twitter.com/nestframework"
+    title="Twitter account"
+    target="_blank"
+  >
     <i class="fa-brands fa-x-twitter"></i>
   </a>
-  <a href="https://github.com/nestjs/nest"
-     title="Github repository"
-     target="_blank">
+  <a
+    href="https://github.com/nestjs/nest"
+    title="Github repository"
+    target="_blank"
+  >
     <i class="fa-brands fa-github"></i>
+    <span class="github-stars">{{ githubStars }}</span>
   </a>
-  <a href="https://stackoverflow.com/questions/tagged/nestjs"
-     title="Stackoverflow"
-     target="_blank">
+  <a
+    href="https://stackoverflow.com/questions/tagged/nestjs"
+    title="Stackoverflow"
+    target="_blank"
+  >
     <i class="fa-brands fa-stack-overflow"></i>
   </a>
   <a
@@ -21,10 +28,12 @@
   >
     <i class="fa fa-globe"></i>
   </a>
-  <a href="https://discord.gg/G7Qnnhy"
-     title="Discord"
-     target="_blank"
-     rel="nofollow">
+  <a
+    href="https://discord.gg/G7Qnnhy"
+    title="Discord"
+    target="_blank"
+    rel="nofollow"
+  >
     <i class="fa-brands fa-discord"></i>
   </a>
 </div>

src/app/common/social-wrapper/social-wrapper.component.scss

@@ -54,3 +54,9 @@
     display: none;
   }
 }
+
+.github-stars{
+  padding: 0px 5px;
+    font-size: 15px;
+    font-family: Verdana, Geneva, Tahoma, sans-serif;
+}

src/app/common/social-wrapper/social-wrapper.component.ts

@@ -1,8 +1,40 @@
-import { Component } from '@angular/core';
+import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
 
 @Component({
   selector: 'app-social-wrapper',
   templateUrl: './social-wrapper.component.html',
-  styleUrls: ['./social-wrapper.component.scss']
+  styleUrls: ['./social-wrapper.component.scss'],
 })
-export class SocialWrapperComponent {}
+export class SocialWrapperComponent implements OnInit {
+  githubStars: string = '';
+
+  constructor(private http: HttpClient, private cdr: ChangeDetectorRef) {}
+
+  ngOnInit(): void {
+    const owner = 'nestjs';
+    const repo = 'nest';
+    const apiUrl = `https://api.github.com/repos/${owner}/${repo}`;
+
+    this.http.get<any>(apiUrl).subscribe({
+      next: (data) => {
+        const stars = data.stargazers_count;
+        this.githubStars = this.formatStars(stars);
+        this.cdr.detectChanges();
+      },
+      error: (err) => {
+        console.error('GitHub API error:', err);
+      },
+    });
+  }
+
+  private formatStars(count: number): string {
+    if (count >= 1_000_000) {
+      return (count / 1_000_000).toFixed(1).replace(/\.0$/, '') + 'M';
+    } else if (count >= 1_000) {
+      return (count / 1_000).toFixed(1).replace(/\.0$/, '') + 'k';
+    } else {
+      return count.toString();
+    }
+  }
+}