@flower-city-online/itinerary-lib 0.0.31 → 0.0.32

package/src/lib/itinerary-app/modules/itineraries/components/app-sidebar-desktop/app-sidebar-desktop.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AppSidebarDesktopComponent } from './app-sidebar-desktop.component';
+
+describe('AppSidebarDesktopComponent', () => {
+  let component: AppSidebarDesktopComponent;
+  let fixture: ComponentFixture<AppSidebarDesktopComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [AppSidebarDesktopComponent]
+    })
+    .compileComponents();
+    
+    fixture = TestBed.createComponent(AppSidebarDesktopComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/itinerary-app/modules/itineraries/components/app-sidebar-desktop/app-sidebar-desktop.component.ts

@@ -0,0 +1,71 @@
+import { Component } from '@angular/core';
+import { Iicon } from '../../../../_interface/icon';
+import { ICONS } from '../../../../_constants/constants';
+import { NavigationEnd, Router } from '@angular/router';
+import { ItinerariesRoutesEnum } from '../../../../_enums/ItenariesRoutes.enum';
+import { filter } from 'rxjs';
+import { Location } from "@angular/common";
+
+@Component({
+    selector: 'lib-app-sidebar-desktop',
+    templateUrl: './app-sidebar-desktop.component.html',
+    styleUrl: './app-sidebar-desktop.component.css',
+    standalone: false
+})
+export class AppSidebarDesktopComponent {
+  ICONS: Iicon = ICONS;
+  currentUrl = '';
+  back() {
+    this.location.back();
+  }
+
+  constructor(
+    private router: Router,
+    private location: Location
+  ) {
+    this.router.events
+    .pipe(
+      filter(
+        (event): event is NavigationEnd => event instanceof NavigationEnd,
+      ),
+    )
+    .subscribe((event: NavigationEnd) => {
+      this.currentUrl = event.urlAfterRedirects;
+    });
+  }
+
+  openCommentsSearch() {
+    this.router.navigate([
+      ItinerariesRoutesEnum.ITINERARY,
+      ItinerariesRoutesEnum.COMMENT_SEARCH,
+    ]);
+    
+  }
+
+  openSearch() {
+    this.router.navigate([
+      ItinerariesRoutesEnum.SEARCH,
+    ]);
+  }
+
+  openExplorePage() {
+    this.router.navigate([
+      ItinerariesRoutesEnum.ITINERARY,
+      ItinerariesRoutesEnum.EXPLORE,
+    ])
+  }
+
+  openBuilderPage() {
+    this.router.navigate([
+      ItinerariesRoutesEnum.ITINERARY,
+      ItinerariesRoutesEnum.BUILDER,
+    ]);
+  }
+
+  openFavoritesPage() {
+    this.router.navigate([
+      ItinerariesRoutesEnum.ITINERARY,
+      ItinerariesRoutesEnum.FAVORITES,
+    ]);
+  }
+}

package/src/lib/itinerary-app/modules/itineraries/components/comment-filter-menu/comment-filter-menu.component.html

@@ -0,0 +1,11 @@
+<div [class]="cssClass + ' filter-menu py-3'">
+  <lib-selectable
+    class="test"
+    (click)="changeSelection()"
+    (selectionchange)="changeSelection()"
+    [formControl]="filterControl"
+    [options]="options"
+    [singleSelectionOnly]="true"
+  >
+  </lib-selectable>
+</div>

package/src/lib/itinerary-app/modules/itineraries/components/comment-filter-menu/comment-filter-menu.component.scss

@@ -0,0 +1,39 @@
+@use "../../../../_styles/colors" as *;
+
+$box-shadow-primary: 9.026px 8.205px 22.153px 2.051px rgba(17, 16, 20, 0.65);
+$box-shadow-secondary: -4.102px -4.102px 13.128px -2.462px
+  rgba(203, 199, 209, 0.25);
+
+.filter-menu {
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+}
+
+.checkmark-icon-btn img {
+  margin-left: 1.6px;
+}
+:root {
+  --lib-list-button-height: 30px
+}
+::ng-deep .selectable-container .btn-selectable.button-solid {
+  --padding-start: 13px;
+  --padding-end: 13px;
+  --padding-top: 7px;
+  --padding-bottom: 7px;
+  font-size: 11.49px;
+  font-weight: 400;
+  line-height: 160%;
+  color: var(--ion-text-color-secondary);
+  margin: 0;
+  letter-spacing: 0px;
+  --background: var(--cyrano-dark-color);
+  --box-shadow: none;
+  border-radius: 34px;
+  min-height: 30px;
+  height: 30px;
+}
+
+::ng-deep .selectable-container .btn-selectable.button-solid.selected {
+  --background: linear-gradient(94.44deg, #FE3C72 1.26%, #E15561 100%);
+}

package/src/lib/itinerary-app/modules/itineraries/components/comment-filter-menu/comment-filter-menu.component.spec.ts

@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CommentFilterMenuComponent } from './comment-filter-menu.component';
+
+describe('CommentFilterMenuComponent', () => {
+  let component: CommentFilterMenuComponent;
+  let fixture: ComponentFixture<CommentFilterMenuComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [CommentFilterMenuComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(CommentFilterMenuComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/itinerary-app/modules/itineraries/components/comment-filter-menu/comment-filter-menu.component.ts

@@ -0,0 +1,45 @@
+import {
+  ChangeDetectionStrategy,
+  ChangeDetectorRef,
+  Component,
+  EventEmitter,
+  Input,
+  OnInit,
+  Output,
+} from '@angular/core';
+import { FormControl } from '@angular/forms';
+import { IFilterMenuOptions } from '../../../../_interface/filterMenuOptions';
+import { Iicon } from '../../../../_interface/icon';
+import { ApiService } from '../../../../_services/api.service';
+import { ICONS } from '../../../../_constants/constants';
+@Component({
+    changeDetection: ChangeDetectionStrategy.OnPush,
+    selector: 'comment-filter-menu',
+    templateUrl: './comment-filter-menu.component.html',
+    styleUrl: './comment-filter-menu.component.scss',
+    standalone: false
+})
+export class CommentFilterMenuComponent implements OnInit {
+  @Input() cssClass!: string;
+  @Output() onFilterClick: EventEmitter<void> = new EventEmitter<void>();
+  ICONS: Iicon = ICONS;
+  options: IFilterMenuOptions[] = [];
+  filterControl = new FormControl();
+  constructor(
+    public apiService: ApiService,
+    private cdr: ChangeDetectorRef,
+  ) { }
+
+  ngOnInit(): void {
+    this.apiService
+      .get('/assets/filterMenuOptionsData.json')
+      .subscribe((data) => {
+        this.options = data as IFilterMenuOptions[];
+        this.cdr.detectChanges();
+        this.filterControl.setValue(this.options[0].value);
+      });
+  }
+
+  changeSelection(): void { }
+  handleFilterClick = (): void => this.onFilterClick.emit();
+}

package/src/lib/itinerary-app/modules/itineraries/components/delete-itineraries/delete-itineraries.component.html

@@ -0,0 +1,28 @@
+  <div class="delete-modal text-center" [formGroup]="deleteForm">
+    <img [ngSrc]="ICONS['delete']" height="46" width="46" class="mx-auto" />
+    
+    <h3 class="font-[Calistoga] mt-5">
+      {{ "SNACKBAR.DELETE_ITINERARY" | translate }}
+    </h3>
+    
+    <p class="text-white mb-2 max-w-[80%] ml-auto mr-auto mt-1 text-[10px]">
+      {{ "ADMIN.GRID.PERMANENT_DELETION" | translate }}
+    </p>
+    
+    <div class="check-box-field flex items-center justify-center gap-2">
+      <lib-dashed-checkbox formControlName="confirmDelete" class="check-box"></lib-dashed-checkbox>
+      <label class="text-[8px]">{{ "ADMIN.GRID.DELETE_ITEM_WARNING" | translate }}</label>
+    </div>
+    <ng-container *ngIf="showErrorMessage">
+      <p class="error-message text-[8px]">{{ "MAIN_ARCHIVES.DELETE_ERROR_MESSAGE" | translate }}</p>
+    </ng-container>
+    
+    <div class="flex justify-center gap-10 mt-5">
+      <button class="custom-flat-button font-[Calistoga]" (click)="closeModal()">
+        {{ "COMMON.KEEP" | translate }}
+      </button>
+      <button class="custom-flat-button-highlighted-font font-[Calistoga]" (click)="deleteItinerary()">
+        {{ "COMMON.DELETE" | translate }}
+      </button>
+    </div>
+  </div>

package/src/lib/itinerary-app/modules/itineraries/components/delete-itineraries/delete-itineraries.component.scss

@@ -0,0 +1,22 @@
+.check-box-field {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 10px;
+  margin-top: 30px;
+}
+
+.check-box-field {
+  span {
+    margin-left: 8px;
+  }
+}
+
+.check-box {
+  height: 20px !important;
+  width: 20px !important;
+}
+
+.error-message {
+  color: #c7472e;
+}

package/src/lib/itinerary-app/modules/itineraries/components/delete-itineraries/delete-itineraries.component.spec.ts

@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DeleteItinerariesComponent } from './delete-itineraries.component';
+
+describe('DeleteItinerariesComponent', () => {
+  let component: DeleteItinerariesComponent;
+  let fixture: ComponentFixture<DeleteItinerariesComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [DeleteItinerariesComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(DeleteItinerariesComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/itinerary-app/modules/itineraries/components/delete-itineraries/delete-itineraries.component.ts

@@ -0,0 +1,50 @@
+import { ChangeDetectionStrategy, Component, EventEmitter, OnInit, Output } from '@angular/core';
+import { ModalService } from '../../../../_services/modal.service';
+import { Iicon } from '../../../../_interface/icon'; 
+import { ICONS } from '../../../../_constants/constants';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+
+@Component({
+    changeDetection: ChangeDetectionStrategy.OnPush,
+    selector: 'app-delete-itineraries',
+    templateUrl: './delete-itineraries.component.html',
+    styleUrl: './delete-itineraries.component.scss',
+    standalone: false
+})
+export class DeleteItinerariesComponent implements OnInit {
+  @Output() deleteItineraryEvent: EventEmitter<string> = new EventEmitter<string>();
+  ICONS: Iicon = ICONS;
+  deleteForm!: FormGroup;
+  showErrorMessage: boolean = false;
+
+  constructor(
+    public modalService: ModalService,
+    private fb: FormBuilder
+  ) {
+    this.deleteForm = this.fb.group({
+      confirmDelete: [false, Validators.required] // initial value unchecked
+    });
+  }
+
+  closeModal(): void {
+    this.modalService.toggleModal = !this.modalService.toggleModal;
+  }
+
+  ngOnInit() {
+    this.deleteForm.valueChanges.subscribe(() => {
+      this.showErrorMessage = false;
+    });
+  }
+
+  onOk(): void {}
+
+
+  deleteItinerary(): void {
+    if(!this.deleteForm.value.confirmDelete) {
+      this.showErrorMessage = true;
+    } else {
+      this.deleteItineraryEvent.emit();
+      this.modalService.toggleModal = false;
+    }
+  }
+}

package/src/lib/itinerary-app/modules/itineraries/components/filter-menu/filter-menu.component.html

@@ -0,0 +1,13 @@
+<div [class]="cssClass + ' filter-menu py-3'">
+  <lib-selectable
+    (click)="changeSelection()"
+    (selectionchange)="changeSelection()"
+    [formControl]="filterControl"
+    [options]="options"
+    [singleSelectionOnly]="true"
+  >
+  </lib-selectable>
+  <lib-icon-btn (click)="handleFilterClick()">
+    <img [ngSrc]="ICONS['filter']" height="15" width="15" />
+  </lib-icon-btn>
+</div>

package/src/lib/itinerary-app/modules/itineraries/components/filter-menu/filter-menu.component.scss

@@ -0,0 +1,16 @@
+@use "../../../../_styles/colors" as *;
+
+$box-shadow-primary: 9.026px 8.205px 22.153px 2.051px rgba(17, 16, 20, 0.65);
+$box-shadow-secondary: -4.102px -4.102px 13.128px -2.462px
+  rgba(203, 199, 209, 0.25);
+
+.filter-menu {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-top: 10px;
+}
+
+.checkmark-icon-btn img {
+  margin-left: 1.6px;
+}

package/src/lib/itinerary-app/modules/itineraries/components/filter-menu/filter-menu.component.ts

@@ -0,0 +1,45 @@
+import {
+  ChangeDetectionStrategy,
+  ChangeDetectorRef,
+  Component,
+  EventEmitter,
+  Input,
+  OnInit,
+  Output,
+} from '@angular/core';
+import { FormControl } from '@angular/forms';  
+import { IFilterMenuOptions } from '../../../../_interface/filterMenuOptions';
+import { Iicon } from '../../../../_interface/icon';
+import { ApiService } from '../../../../_services/api.service';
+import { ICONS } from '../../../../_constants/constants';
+@Component({
+    changeDetection: ChangeDetectionStrategy.OnPush,
+    selector: 'app-filter-menu',
+    templateUrl: './filter-menu.component.html',
+    styleUrl: './filter-menu.component.scss',
+    standalone: false
+})
+export class FilterMenuComponent implements OnInit {
+  @Input() cssClass!: string;
+  @Output() onFilterClick: EventEmitter<void> = new EventEmitter<void>();
+  ICONS: Iicon = ICONS;
+  options: IFilterMenuOptions[] = [];
+  filterControl = new FormControl();
+  constructor(
+    public apiService: ApiService,
+    private cdr: ChangeDetectorRef,
+  ) {}
+
+  ngOnInit(): void {
+    this.apiService
+      .get('/assets/filterMenuOptionsData.json')
+      .subscribe((data) => {
+        this.options = data as IFilterMenuOptions[];
+        this.cdr.detectChanges();
+        this.filterControl.setValue(this.options[0].value);
+      });
+  }
+
+  changeSelection(): void {}
+  handleFilterClick = (): void => this.onFilterClick.emit();
+}

package/src/lib/itinerary-app/modules/itineraries/components/no-visual-map-filters/no-visual-map-filters.component.css

@@ -0,0 +1,30 @@
+.filter-title {
+    font-size: 16px;
+}
+
+.filters-description {
+    font-size: var(--font-size-medium);
+}
+
+.filter-button {
+    box-shadow: 4.1px 4.1px 8.2px 0px #00000052 inset;
+    box-shadow: -2.46px -2.46px 3.28px 0px #FFFFFF1A inset;
+    padding: 6.56px 13.13px;
+    border-radius: 27px;
+}
+
+.custom-select {
+    box-shadow: 4.1px 4.1px 8.2px 0px #00000052 inset;
+    box-shadow: -2.46px -2.46px 3.28px 0px #FFFFFF1A inset;
+    background: transparent;
+}
+
+.selectedbutton {
+    background: linear-gradient(94.44deg, #FE3C72 1.26%, #E15561 100%);
+}
+
+.filter-footer {
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+}

package/src/lib/itinerary-app/modules/itineraries/components/no-visual-map-filters/no-visual-map-filters.component.html

@@ -0,0 +1,104 @@
+<div>
+  <!-- Header -->
+  <div class="header-main-bar px-5 pt-5 pb-5 mr-3 flex items-center justify-between">
+    <lib-icon-btn class="checkmark-icon-button" (click)="firstButtonClick()">
+      <img [ngSrc]="ICONS['back']" height="12" width="13" />
+    </lib-icon-btn>
+    <div class="flex">
+      <h4 class="mr-1 filter-title font-[Calistoga]">
+        {{ "ITINERARY.MAP_FILTER" | translate }}
+      </h4>
+    </div>
+    <div></div>
+  </div>
+
+  <!-- Body -->
+  <div class="px-5 pt-5 pb-5 mr-3">
+    <div class="filters-description text-center">
+      Create and apply custom advanced filters to the map or select popular preset filters.
+    </div>
+
+    <!-- Preset Filter Buttons -->
+    <div class="preset-filters w-full pt-4 mt-4">
+      <button
+        class="filter-button font-[Gilroy] ml-2"
+        *ngFor="let preset of presetFilters"
+        (click)="applyPreset(preset)"
+        [class.selectedbutton]="selectedPresets?.includes(preset.name)"
+      >
+        {{ preset.name }}
+      </button>
+    </div>
+
+    <h4 class="font-[Gilroy] font-semibold mt-8 mb-2">Filters</h4>
+
+    <!-- Custom Filter Selectors -->
+    <div class="flex justify-left gap-10">
+      <!-- Field Dropdown -->
+      <div class="relative w-64">
+        <select
+          class="custom-select block w-full px-4 py-2 pr-10 text-lg border border-transparent rounded-full appearance-none transition-all duration-200 font-[Gilroy]"
+          [(ngModel)]="selectedField"
+          (change)="onFieldChange()"
+        >
+          <option value="" disabled selected>Field</option>
+          <option *ngFor="let field of filterFields" [value]="field">{{ field }}</option>
+        </select>
+        <div class="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-4">
+          <svg class="h-5 w-5 text-red-500" xmlns="http://www.w3.org/2000/svg" fill="#FE3C72">
+            <path
+              fill-rule="evenodd"
+              d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"
+              clip-rule="evenodd"
+            />
+          </svg>
+        </div>
+      </div>
+
+      <!-- Condition Dropdown -->
+      <div class="relative w-64">
+        <select
+          class="custom-select block w-full px-4 py-2 pr-10 text-lg border border-transparent rounded-full appearance-none transition-all duration-200 font-[Gilroy]"
+          [(ngModel)]="selectedCondition"
+        >
+          <option value="" disabled selected>Condition</option>
+          <option *ngFor="let cond of filterConditions[selectedField]" [value]="cond">{{ cond }}</option>
+        </select>
+        <div class="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-4">
+          <svg class="h-5 w-5 text-red-500" xmlns="http://www.w3.org/2000/svg" fill="#FE3C72">
+            <path
+              fill-rule="evenodd"
+              d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"
+              clip-rule="evenodd"
+            />
+          </svg>
+        </div>
+      </div>
+    </div>
+
+    <div class="flex flex-col gap-3 mt-3" *ngIf="conditionsArray?.length">
+      <div class="filter-container flex justify-between" *ngFor="let condition of conditionsArray; let i = index; ">
+        <button
+          class="filter-button font-[Gilroy] ml-2 selectedbutton"
+        >
+          {{ condition.name ? condition.name + '|' : '' }} {{ condition.field }} and {{ condition.condition }}
+        </button>
+
+        <img (click)="removeCondition(i)" [ngSrc]="ICONS['deletePink']" height="15" width="16" />
+      </div>
+    </div>
+
+    <!-- Add Filter Button -->
+    <div class="flex gap-2 mt-4">
+      <img src="assets/icons/plus.svg" />
+      <span (click)="applyCustomFilter()">Add Filter</span>
+    </div>
+  </div>
+</div>
+<div class="filter-footer">
+  <lib-footer-shared
+    (continueButtonClick)="applyFilter()"
+    [canContinue]="true"
+    continueButtonText="Apply"
+  ></lib-footer-shared>
+</div>

package/src/lib/itinerary-app/modules/itineraries/components/no-visual-map-filters/no-visual-map-filters.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { NoVisualMapFiltersComponent } from './no-visual-map-filters.component';
+
+describe('NoVisualMapFiltersComponent', () => {
+  let component: NoVisualMapFiltersComponent;
+  let fixture: ComponentFixture<NoVisualMapFiltersComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [NoVisualMapFiltersComponent]
+    })
+    .compileComponents();
+    
+    fixture = TestBed.createComponent(NoVisualMapFiltersComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/itinerary-app/modules/itineraries/components/no-visual-map-filters/no-visual-map-filters.component.ts

@@ -0,0 +1,88 @@
+import { Component, EventEmitter, Output } from "@angular/core";
+import { Iicon } from "../../../../_interface/icon";
+import { ICONS } from "../../../../_constants/constants";
+import { IConditions } from "../../../../_interface/conditions";
+import { IPresetRecord } from "../../../../_interface/presetRecord";
+
+@Component({
+    selector: 'lib-no-visual-map-filters',
+    templateUrl: './no-visual-map-filters.component.html',
+    styleUrl: './no-visual-map-filters.component.css',
+    standalone: false
+})
+export class NoVisualMapFiltersComponent {
+  ICONS: Iicon = ICONS;
+  selectedPresets: string[] = [];
+  conditionsArray: IConditions[] = [];
+
+  @Output() presetsChanged: EventEmitter<IPresetRecord[]> = new EventEmitter<IPresetRecord[]>();
+
+  @Output() backButtonClicked: EventEmitter<void> = new EventEmitter<void>();
+
+  // Example preset filters
+  presetFilters: Array<IPresetRecord> = [
+    { name: 'Restaurants', field: 'type', condition: 'restaurant' },
+    { name: 'Good Rating', field: 'rating', condition: '>=4' },
+    { name: 'Open Now', field: 'open_now', condition: true },
+  ];
+
+  
+
+  // Dynamic fields and their possible conditions
+  filterFields: string[] = ['type', 'rating', 'open_now'];
+
+  filterConditions: { [key: string]: string[] } = {
+    type: ['restaurant', 'cafe', 'lodging', 'store'],
+    rating: ['>=3', '>=4', '>=4.5'],
+    open_now: ['true', 'false'],
+  };
+
+  selectedField: string = '';
+  selectedCondition: string = '';
+  selectedPreset: string | null = null;
+
+  firstButtonClick() {
+    this.backButtonClicked.emit();
+  }
+
+  applyPreset(preset: IPresetRecord) {
+    if(this.selectedPresets.includes(preset.name)) {
+      this.selectedPresets = this.selectedPresets.filter(name => name !== preset.name);
+      this.conditionsArray = this.conditionsArray.filter(condition => condition.name !== preset.name);
+    } else {
+      this.selectedPresets.push(preset.name);
+      this.conditionsArray.push({
+        name: preset.name,
+        field: preset.field,
+        condition: preset.condition
+      });
+    }     
+  }
+
+  onFieldChange() {
+    this.selectedCondition = ''; // Reset condition when field changes
+  }
+
+  removeCondition(i: number) {
+    this.conditionsArray.splice(i, 1);
+  }
+
+  applyCustomFilter() {
+    this.conditionsArray.push({
+      name: '',
+      field: this.selectedField,
+      condition: this.selectedCondition
+    });
+    this.selectedField = '';
+    this.selectedCondition = '';
+  }
+
+  applyFilter() {
+    this.presetsChanged.emit(this.conditionsArray);
+    this.backButtonClicked.emit();
+  }
+
+  applyGooglePlacesFilter(field: string, condition: string) {
+    console.log(field, condition);
+  }
+}