feat: apply new layout overhaul

src/app/modules/dashboard/sections/mensa-section/mensa-section.component.ts

@@ -0,0 +1,148 @@
+/*
+ * Copyright (C) 2022 StApps
+ * This program is free software: you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the Free
+ * Software Foundation, version 3.
+ *
+ * This program is distributed in the hope that it will be useful, but WITHOUT
+ * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
+ * FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for
+ * more details.
+ *
+ * You should have received a copy of the GNU General Public License along with
+ * this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+import {Component} from '@angular/core';
+import {ActivatedRoute, Router} from '@angular/router';
+import {AlertController, ModalController} from '@ionic/angular';
+import {combineLatest, Subscription} from 'rxjs';
+import {
+  debounceTime,
+  distinctUntilChanged,
+  startWith,
+  take,
+} from 'rxjs/operators';
+import {NGXLogger} from 'ngx-logger';
+import {SCThings} from '@openstapps/core';
+
+import {DataProvider} from '../../../data/data.provider';
+import {DataRoutingService} from '../../../data/data-routing.service';
+import {FoodDataListComponent} from '../../../data/list/food-data-list.component';
+import {PositionService} from '../../../map/position.service';
+import {SettingsProvider} from '../../../settings/settings.provider';
+import {FavoritesService} from '../../../favorites/favorites.service';
+import {ContextMenuService} from '../../../menu/context/context-menu.service';
+import {ConfigProvider} from '../../../config/config.provider';
+
+/**
+ * Shows a section with meals of the chosen mensa
+ */
+@Component({
+  selector: 'stapps-mensa-section',
+  templateUrl: 'mensa-section.component.html',
+  styleUrls: ['mensa-section.component.scss'],
+})
+export class MensaSectionComponent extends FoodDataListComponent {
+  sub: Subscription;
+
+  constructor(
+    protected readonly alertController: AlertController,
+    protected dataProvider: DataProvider,
+    protected readonly contextMenuService: ContextMenuService,
+    protected readonly settingsProvider: SettingsProvider,
+    protected readonly logger: NGXLogger,
+    protected dataRoutingService: DataRoutingService,
+    protected router: Router,
+    route: ActivatedRoute,
+    protected positionService: PositionService,
+    public modalController: ModalController,
+    protected favoritesService: FavoritesService,
+    configProvider: ConfigProvider,
+  ) {
+    super(
+      alertController,
+      dataProvider,
+      contextMenuService,
+      settingsProvider,
+      logger,
+      dataRoutingService,
+      router,
+      route,
+      positionService,
+      configProvider,
+    );
+  }
+
+  async initialize() {
+    super.initialize();
+
+    this.subscriptions.push(
+      combineLatest([
+        this.queryTextChanged.pipe(
+          debounceTime(this.searchQueryDueTime),
+          distinctUntilChanged(),
+          startWith(this.queryText),
+        ),
+        this.favoritesService.favoritesChanged$,
+      ]).subscribe(async query => {
+        this.queryText = query[0];
+        this.from = 0;
+        if (
+          typeof this.filterQuery !== 'undefined' ||
+          this.queryText?.length > 0 ||
+          this.showDefaultData
+        ) {
+          await this.fetchAndUpdateItems();
+          this.queryChanged.next();
+        }
+      }),
+    );
+  }
+
+  /**
+   * Fetches/updates the favorites (search page component's method override)
+   */
+  async fetchAndUpdateItems() {
+    this.favoritesService
+      .search(this.queryText, this.filterQuery, this.sortQuery)
+      .pipe(take(1))
+      .subscribe(result => {
+        this.items = new Promise(resolve => {
+          resolve(
+            result.data && result.data.filter(item => this.isMensaThing(item)),
+          );
+        });
+      });
+  }
+
+  /**
+   * Helper function as 'typeof' is not accessible in HTML
+   *
+   * @param item TODO
+   */
+  isMensaThing(item: SCThings): boolean {
+    return (
+      this.hasCategories(item) &&
+      ((item.categories as string[]).includes('canteen') ||
+        (item.categories as string[]).includes('cafe') ||
+        (item.categories as string[]).includes('student canteen') ||
+        (item.categories as string[]).includes('restaurant'))
+    );
+  }
+
+  /**
+   * TODO
+   *
+   * @param item TODO
+   */
+  hasCategories(item: SCThings): item is SCThings & {categories: string[]} {
+    return typeof (item as {categories: string[]}).categories !== 'undefined';
+  }
+
+  /**
+   * Action when user clicked edit to this section
+   */
+  onSectionEdit() {
+    void this.router.navigate(['/canteen']);
+  }
+}