TS

import { Component, OnInit, Input, EventEmitter, Output } from '@angular/core';
import { DataService } from "../data.service";
import { Recipe } from '../logic/Recipe';
import { Router } from '@angular/router';
import { GeolocationService } from '../geolocation.service';
import { FormControl } from '@angular/forms';


@Component({
  selector: 'app-list',
  templateUrl: './list.component.html',
  styleUrls: ['./list.component.css']
})

export class ListComponent implements OnInit {

  list: [Recipe]
  @Output() notifyDelete: EventEmitter<number> = new EventEmitter<number>();


  constructor(private data: DataService,
    private router: Router,
    private geolocation: GeolocationService,
  ) { }

  goDetails(recipe: Recipe) {
    this.router.navigate(["/recipe", recipe._id]);

  }

  goMap(recipe: Recipe) {
    const mapURL = this.geolocation.getMapLink(recipe.location);
    location.href = mapURL;
  }

  share(recipe: Recipe) {
    const shareText = `I had this coffee at ${recipe.place} and for me it was ${recipe.rating} stars`;
    if ('share' in navigator) {
      (navigator as any).share({
        title: recipe.name,
        text: shareText,
        url: window.location.href
      }).then(() => console.log("shared")).catch(() => console.log("error sharing"));
    } else {
      const shareURL = `whatsapp://send?text=${encodeURIComponent(shareText)}`;
      location.href = shareURL;
    }
  }

  ngOnInit(): void {
    this.data.getList(list => {
      this.list = list;


    })
  }


  FormControl = new FormControl('');
}