Fix: Add graceful error handling for territories not in World Bank API

src/app/services/world-bank.ts

@@ -1,7 +1,7 @@
 import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
-import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
+import { Observable, of } from 'rxjs';
+import { map, catchError } from 'rxjs/operators';
 
 export interface CountryData {
   name: string;
@@ -25,6 +25,11 @@ export class WorldBankService {
     
     return this.http.get<any>(url).pipe(
       map(response => {
+        // Check if API returned an error message
+        if (response[0]?.message) {
+          throw new Error(`World Bank API: ${response[0].message[0].value}`);
+        }
+        
         const country = response[1][0];
         return {
           name: country.name || 'N/A',
@@ -34,6 +39,18 @@ export class WorldBankService {
           longitude: country.longitude || 'N/A',
           latitude: country.latitude || 'N/A'
         };
+      }),
+      catchError(error => {
+        console.error(`Failed to fetch data for ${countryCode}:`, error);
+        // Return placeholder data instead of failing completely
+        return of({
+          name: `Country Code: ${countryCode}`,
+          capital: 'Data not available',
+          region: 'Not available in World Bank API',
+          incomeLevel: 'N/A',
+          longitude: 'N/A',
+          latitude: 'N/A'
+        });
       })
     );
   }