init commit

src/app/components/ui/global-progress-bar/global-progress-bar.component.ts

@@ -0,0 +1,51 @@
+/**
+ * Global Progress Bar Component
+ * Professional Angular Resume Builder - GitHub-style Progress Bar
+ *
+ * @author David Valera Melendez <david@valera-melendez.de>
+ * @created 2025-08-08
+ * @location Made in Germany 🇩🇪
+ */
+
+import { Component, OnInit, OnDestroy } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+import { LoadingService } from '../../../services/loading.service';
+
+@Component({
+  selector: 'app-global-progress-bar',
+  standalone: true,
+  imports: [CommonModule],
+  templateUrl: './global-progress-bar.component.html',
+  styleUrls: ['./global-progress-bar.component.css']
+})
+export class GlobalProgressBarComponent implements OnInit, OnDestroy {
+  isLoading = false;
+  progress = 0;
+  
+  private destroy$ = new Subject<void>();
+
+  constructor(private loadingService: LoadingService) {}
+
+  ngOnInit(): void {
+    // Subscribe to global loading state
+    this.loadingService.globalLoading$
+      .pipe(takeUntil(this.destroy$))
+      .subscribe(loading => {
+        this.isLoading = loading;
+      });
+
+    // Subscribe to progress updates
+    this.loadingService.progress$
+      .pipe(takeUntil(this.destroy$))
+      .subscribe(progress => {
+        this.progress = progress;
+      });
+  }
+
+  ngOnDestroy(): void {
+    this.destroy$.next();
+    this.destroy$.complete();
+  }
+}