last step

first-app/src/app/details/details.ts

@@ -21,8 +21,11 @@ export class Details {
     });
     constructor() {
         const housingLocationId = parseInt(this.route.snapshot.params['id'], 10);
-        this.housingLocation = this.housingService.getHousingLocationById(housingLocationId);
+        this.housingService.getHousingLocationById(housingLocationId).then((housingLocation) => {
+            this.housingLocation = housingLocation;
+        });
     }
+
     submitApplication() {
         this.housingService.submitApplication(
             this.applyForm.value.firstName ?? '',

first-app/src/app/home/home.ts

@@ -18,8 +18,12 @@ export class Home {
     filteredLocationList: HousingLocationInfo[] = [];
 
     constructor() {
-        this.housingLocationList = this.housingService.getAllHousingLocations();
-        this.filteredLocationList = this.housingLocationList;
+        this.housingService
+            .getAllHousingLocations()
+            .then((housingLocationList: HousingLocationInfo[]) => {
+                this.housingLocationList = housingLocationList;
+                this.filteredLocationList = housingLocationList;
+            });
     }
 
     filterResults(text: string) {
@@ -27,6 +31,8 @@ export class Home {
             this.filteredLocationList = this.housingLocationList;
             return;
         }
-        this.filteredLocationList = this.housingLocationList.filter((housingLocation) => housingLocation?.city.toLowerCase().includes(text.toLowerCase()),);
+        this.filteredLocationList = this.housingLocationList
+            .filter((housingLocation) => housingLocation?.city.toLowerCase()
+                .includes(text.toLowerCase()),);
     }
 }

first-app/src/app/housing.ts

@@ -1,121 +1,25 @@
 import {Injectable} from '@angular/core';
 import {HousingLocationInfo} from './housinglocation';
+
 @Injectable({
     providedIn: 'root',
 })
 export class HousingService {
-    readonly baseUrl = 'https://angular.dev/assets/images/tutorials/common';
-    protected housingLocationList: HousingLocationInfo[] = [
-        {
-            id: 0,
-            name: 'Acme Fresh Start Housing',
-            city: 'Chicago',
-            state: 'IL',
-            photo: `${this.baseUrl}/bernard-hermant-CLKGGwIBTaY-unsplash.jpg`,
-            availableUnits: 4,
-            wifi: true,
-            laundry: true,
-        },
-        {
-            id: 1,
-            name: 'A113 Transitional Housing',
-            city: 'Santa Monica',
-            state: 'CA',
-            photo: `${this.baseUrl}/brandon-griggs-wR11KBaB86U-unsplash.jpg`,
-            availableUnits: 0,
-            wifi: false,
-            laundry: true,
-        },
-        {
-            id: 2,
-            name: 'Warm Beds Housing Support',
-            city: 'Juneau',
-            state: 'AK',
-            photo: `${this.baseUrl}/i-do-nothing-but-love-lAyXdl1-Wmc-unsplash.jpg`,
-            availableUnits: 1,
-            wifi: false,
-            laundry: false,
-        },
-        {
-            id: 3,
-            name: 'Homesteady Housing',
-            city: 'Chicago',
-            state: 'IL',
-            photo: `${this.baseUrl}/ian-macdonald-W8z6aiwfi1E-unsplash.jpg`,
-            availableUnits: 1,
-            wifi: true,
-            laundry: false,
-        },
-        {
-            id: 4,
-            name: 'Happy Homes Group',
-            city: 'Gary',
-            state: 'IN',
-            photo: `${this.baseUrl}/krzysztof-hepner-978RAXoXnH4-unsplash.jpg`,
-            availableUnits: 1,
-            wifi: true,
-            laundry: false,
-        },
-        {
-            id: 5,
-            name: 'Hopeful Apartment Group',
-            city: 'Oakland',
-            state: 'CA',
-            photo: `${this.baseUrl}/r-architecture-JvQ0Q5IkeMM-unsplash.jpg`,
-            availableUnits: 2,
-            wifi: true,
-            laundry: true,
-        },
-        {
-            id: 6,
-            name: 'Seriously Safe Towns',
-            city: 'Oakland',
-            state: 'CA',
-            photo: `${this.baseUrl}/phil-hearing-IYfp2Ixe9nM-unsplash.jpg`,
-            availableUnits: 5,
-            wifi: true,
-            laundry: true,
-        },
-        {
-            id: 7,
-            name: 'Hopeful Housing Solutions',
-            city: 'Oakland',
-            state: 'CA',
-            photo: `${this.baseUrl}/r-architecture-GGupkreKwxA-unsplash.jpg`,
-            availableUnits: 2,
-            wifi: true,
-            laundry: true,
-        },
-        {
-            id: 8,
-            name: 'Seriously Safe Towns',
-            city: 'Oakland',
-            state: 'CA',
-            photo: `${this.baseUrl}/saru-robert-9rP3mxf8qWI-unsplash.jpg`,
-            availableUnits: 10,
-            wifi: false,
-            laundry: false,
-        },
-        {
-            id: 9,
-            name: 'Capital Safe Towns',
-            city: 'Portland',
-            state: 'OR',
-            photo: `${this.baseUrl}/webaliser-_TPTXZd9mOo-unsplash.jpg`,
-            availableUnits: 6,
-            wifi: true,
-            laundry: true,
-        },
-    ];
-    getAllHousingLocations(): HousingLocationInfo[] {
-        return this.housingLocationList;
+    url = 'http://localhost:3000/locations';
+
+    async getAllHousingLocations(): Promise<HousingLocationInfo[]> {
+        const data = await fetch(this.url);
+        return (await data.json()) ?? [];
     }
-    getHousingLocationById(id: number): HousingLocationInfo | undefined {
-        return this.housingLocationList.find((housingLocation) => housingLocation.id === id);
+
+    async getHousingLocationById(id: number): Promise<HousingLocationInfo | undefined> {
+        const data = await fetch(`${this.url}?id=${id}`);
+        const locationJson = await data.json();
+        return locationJson[0] ?? {};
     }
+
     submitApplication(firstName: string, lastName: string, email: string) {
-        console.log(
-            `Homes application received: firstName: ${firstName}, lastName: ${lastName}, email: ${email}.`,
-        );
+        // tslint:disable-next-line
+        console.log(firstName, lastName, email);
     }
 }