- Added a progress bar to the pokemon rows

src/app/features/plan/plan-pokemon/plan-pokemonV2.component.ts

@@ -30,7 +30,6 @@ interface PokemonStatusEvent {
     MatCardModule
   ],
   template: `
-
     <mat-card
       class="pokemon-row"
       [class.selected]="isSelected"
@@ -71,6 +70,9 @@ interface PokemonStatusEvent {
             </div>
           </div>
         </div>
+      <div class="progress-bar-container">
+        <div class="progress-bar" [style.width.%]="calculateCatchProgress()"></div>
+      </div>
     </mat-card>
   `,
   styles: [`
@@ -143,6 +145,21 @@ interface PokemonStatusEvent {
       font-weight: 500;
       color: #4CAF50;
     }
+
+    .progress-bar-container {
+      width: 100%;
+      height: 4px;
+      background: #e0e0e0;
+      border-radius: 2px;
+      margin-top: 8px;
+      overflow: hidden;
+    }
+
+    .progress-bar {
+      height: 100%;
+      background: #4CAF50;
+      transition: width 0.3s ease;
+    }
   `]
 })
 export class PlanPokemonV2Component {
@@ -222,8 +239,32 @@ export class PlanPokemonV2Component {
     return total + breedCount + evolveCount;
   }
 
+  calculateTotalCaught(): number {
+    let count = 0;
+
+    this.pokemon_family.evolve_to.forEach(target => {
+      if (this.isTargetCompleted(target)) {
+        count += 1;
+      }
+    });
+
+    this.pokemon_family.breed_for.forEach(target => {
+      if (this.isTargetCompleted(target)) {
+        count += 1;
+      }
+    });
+
+    return count;
+  }
+
+  calculateCatchProgress(): number {
+    const totalNeeded = this.pokemon_family.catch_count;
+    const caughtCount = this.calculateTotalCaught();
+    return (caughtCount / totalNeeded) * 100;
+  }
+
   updateCatchCount() {
-    const newCount = this.calculateTotalNeeded();
+    const newCount = this.calculateTotalCaught();
     if (newCount !== this.pokemon_family.catch_count) {
       this.pokemon_family.catch_count = newCount;
       if (newCount === 0) {
@@ -255,4 +296,5 @@ export class PlanPokemonV2Component {
   onSelect() {
     this.familySelected.emit(this.pokemon_family);
   }
-}
+}
+