diff --git a/src/app/app.component.html b/src/app/app.component.html index 2c6c05a..85df9f9 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,4 +1,4 @@ - Loading... +
(); items: Map = new Map(); - itemsSubject = new Subject>(); headerScrollShadow = false; categoryListScrollShadow = true; @@ -31,21 +29,16 @@ export class AppComponent implements OnInit { @HostBinding('class.loading') loading = true; - constructor(private spreadSheetService: SpreadsheetService) {} + constructor(private menuService: MenuService) {} ngOnInit(): void { - this.sectionsSubject.subscribe((sections) => { - this.sections = sections; - this.selectedSection = this.sections[0]; - this._loadItems(); - }); - - this.itemsSubject.subscribe((items) => { - this.items = items; - this.loading = false; + this.menuService.menuObservable.subscribe((menu) => { + if (menu) { + this.sections = Array.from(menu.keys()); + this.items = menu; + this.loading = false; + } }); - - this._loadSections(); fromEvent(window, 'scroll') .pipe(debounce(() => interval(100))) .subscribe(() => this._onScroll()); @@ -73,41 +66,6 @@ export class AppComponent implements OnInit { }); } - private _loadSections(): void { - this.spreadSheetService.getSections().subscribe((sections) => { - this.sectionsSubject.next(sections.values[0]); - }); - } - - private _loadItems(): void { - this.spreadSheetService.getMenuItems().subscribe((items) => { - const itemsArray = items.values; - const sectionItemsMap = new Map(); - this.sections.forEach((section) => { - sectionItemsMap.set( - section, - this._parseItems(itemsArray.filter((item) => item[2] === section)) - ); - }); - this.itemsSubject.next(sectionItemsMap); - }); - } - - private _parseItems(itemArray: string[][]): SBMenuItem[] { - const items: SBMenuItem[] = []; - itemArray.forEach((item) => { - items.push({ - title: this._parseItem(item[0]), - price: this._parseItem(item[1]), - category: this._parseItem(item[2]), - type: this._parseItem(item[3]), - description: this._parseItem(item[4]), - image: this._parseItem(item[5]), - } as SBMenuItem); - }); - return items; - } - /** Handles the scroll event and updates the selected section based on the current scroll position. @returns {void} @@ -145,8 +103,4 @@ export class AppComponent implements OnInit { } } } - - private _parseItem(item: string): string | null { - return item != '-' ? item : null; - } } diff --git a/src/app/app.module.ts b/src/app/app.module.ts index b2fe981..5c02820 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -1,4 +1,4 @@ -import { NgModule } from '@angular/core'; +import { APP_INITIALIZER, NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { HttpClientModule } from '@angular/common/http'; @@ -6,6 +6,7 @@ import { AppComponent } from '@sertao-bar/app/app.component'; import { SBSectionItemsPipe } from '@sertao-bar/pipes/section-items.pipe'; import { SBMenuSectionComponent } from '@sertao-bar/components/menu-section/menu-section.component'; import { SBCategoryListComponent } from '@sertao-bar/components/category-list/category-list.component'; +import { MenuService } from '@sertao-bar/services/menu/menu.service'; @NgModule({ declarations: [AppComponent, SBSectionItemsPipe], @@ -15,7 +16,15 @@ import { SBCategoryListComponent } from '@sertao-bar/components/category-list/ca SBCategoryListComponent, HttpClientModule, ], - providers: [{ provide: Window, useValue: window }], + providers: [ + { provide: Window, useValue: window }, + { + provide: APP_INITIALIZER, + useFactory: () => () => {}, + multi: true, + deps: [MenuService], + }, + ], bootstrap: [AppComponent], }) export class AppModule {} diff --git a/src/services/spreadsheet/spreadsheet.service.spec.ts b/src/services/menu/menu.service.spec.ts similarity index 62% rename from src/services/spreadsheet/spreadsheet.service.spec.ts rename to src/services/menu/menu.service.spec.ts index 0d6390f..bfa402e 100644 --- a/src/services/spreadsheet/spreadsheet.service.spec.ts +++ b/src/services/menu/menu.service.spec.ts @@ -1,13 +1,13 @@ import { TestBed } from '@angular/core/testing'; -import { SpreadsheetService } from './spreadsheet.service'; +import { MenuService } from './menu.service'; describe('SpreadsheetService', () => { - let service: SpreadsheetService; + let service: MenuService; beforeEach(() => { TestBed.configureTestingModule({}); - service = TestBed.inject(SpreadsheetService); + service = TestBed.inject(MenuService); }); it('should be created', () => { diff --git a/src/services/menu/menu.service.ts b/src/services/menu/menu.service.ts new file mode 100644 index 0000000..ed05850 --- /dev/null +++ b/src/services/menu/menu.service.ts @@ -0,0 +1,64 @@ +import { Injectable } from '@angular/core'; +import { HttpClient } from '@angular/common/http'; +import { BehaviorSubject, firstValueFrom, Observable, of } from 'rxjs'; +import { SBSpreadsheetResponse } from '@sertao-bar/models/spreadsheet-response'; +import { environment } from '@sertao-bar/environments/environment'; +import { SBMenuItem } from '@sertao-bar/models/menu-item'; + +@Injectable({ + providedIn: 'root', +}) +export class MenuService { + menuObservable: Observable | null>; + private menuSubject: BehaviorSubject | null> = + new BehaviorSubject | null>(null); + apiUrl: string = environment.api_url; + apiKey: string = environment.api_key; + + constructor(private http: HttpClient) { + this.menuObservable = this.menuSubject.asObservable(); + this.loadMenu(); + } + + getSections(): Observable { + const requestUrl = `${this.apiUrl}sections?alt=json&key=${this.apiKey}`; + return this.http.get(requestUrl); + } + + getMenuItems(): Observable { + const requestUrl = `${this.apiUrl}data?alt=json&key=${this.apiKey}`; + return this.http.get(requestUrl); + } + + async loadMenu(): Promise { + const sections = (await firstValueFrom(this.getSections())).values[0]; + const menuItems = (await firstValueFrom(this.getMenuItems())).values; + const sectionItemsMap = new Map(); + sections.forEach((section) => { + sectionItemsMap.set( + section, + this._parseItems(menuItems.filter((item) => item[2] === section)) + ); + }); + this.menuSubject.next(sectionItemsMap); + } + + private _parseItems(itemArray: string[][]): SBMenuItem[] { + const items: SBMenuItem[] = []; + itemArray.forEach((item) => { + items.push({ + title: this._parseItem(item[0]), + price: this._parseItem(item[1]), + category: this._parseItem(item[2]), + type: this._parseItem(item[3]), + description: this._parseItem(item[4]), + image: this._parseItem(item[5]), + } as SBMenuItem); + }); + return items; + } + + private _parseItem(item: string): string | null { + return item != '-' ? item : null; + } +} diff --git a/src/services/spreadsheet/spreadsheet.service.ts b/src/services/spreadsheet/spreadsheet.service.ts deleted file mode 100644 index c393da3..0000000 --- a/src/services/spreadsheet/spreadsheet.service.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { Injectable } from '@angular/core'; -import { HttpClient } from '@angular/common/http'; -import { Observable, of } from 'rxjs'; -import { SBSpreadsheetResponse } from '@sertao-bar/models/spreadsheet-response'; -import { environment } from '@sertao-bar/environments/environment'; - -@Injectable({ - providedIn: 'root', -}) -export class SpreadsheetService { - apiUrl: string = environment.api_url; - apiKey: string = environment.api_key; - - constructor(private http: HttpClient) {} - - getSections(): Observable { - const requestUrl = `${this.apiUrl}sections?alt=json&key=${this.apiKey}`; - return this.http.get(requestUrl); - } - - getMenuItems(): Observable { - const requestUrl = `${this.apiUrl}data?alt=json&key=${this.apiKey}`; - return this.http.get(requestUrl); - } -}