diff --git a/src/app/main/component/events/components/events-list/events-list.component.html b/src/app/main/component/events/components/events-list/events-list.component.html
index 5a1a92fb31..ad5d77b225 100644
--- a/src/app/main/component/events/components/events-list/events-list.component.html
+++ b/src/app/main/component/events/components/events-list/events-list.component.html
@@ -25,14 +25,14 @@
         <div class="dropdown" (click)="timeFilter.open()">
           <mat-label class="filter">{{ 'homepage.events.time' | translate }}</mat-label>
           <mat-select #timeFilter [formControl]="timeFilterControl" multiple>
-            <mat-option [value]="0" (click)="toggleAllSelection(timeList, 'timeList')">
+            <mat-option [value]="0" (click)="toggleAllSelection(timeList, 'eventTime')">
               {{ 'homepage.events.time-any-time' | translate }}
             </mat-option>
             <mat-divider></mat-divider>
             <mat-option
               [value]="eventTime"
               *ngFor="let eventTime of eventTimeList"
-              (onSelectionChange)="updateSelectedFilters(eventTime, $event)"
+              (onSelectionChange)="updateSelectedFilters(eventTime, $event, timeList, 'eventTime', eventTimeList)"
             >
               {{ getLangValue(eventTime.nameUa, eventTime.nameEn) }}
             </mat-option>
@@ -41,14 +41,14 @@
         <div class="dropdown" (click)="locationFilter.open()">
           <mat-label class="filter">{{ 'homepage.events.filter-location' | translate }}</mat-label>
           <mat-select #locationFilter [formControl]="locationFilterControl" multiple>
-            <mat-option [value]="0" (click)="toggleAllSelection(locationList, 'locationList')">{{
+            <mat-option [value]="0" (click)="toggleAllSelection(locationList, 'cities')">{{
               'homepage.events.filter-location-аny-location' | translate
             }}</mat-option>
             <mat-divider></mat-divider>
             <mat-option
               [value]="location"
               *ngFor="let location of eventLocationList"
-              (onSelectionChange)="updateSelectedFilters(location, $event)"
+              (onSelectionChange)="updateSelectedFilters(location, $event, locationList, 'cities', eventLocationList)"
             >
               {{ getLangValue(location.nameUa, location.nameEn) }}
             </mat-option>
@@ -57,11 +57,15 @@
         <div class="dropdown" (click)="statusFilter.open()">
           <mat-label class="filter">{{ 'homepage.events.filter-status' | translate }}</mat-label>
           <mat-select #statusFilter [formControl]="statusFilterControl" multiple>
-            <mat-option [value]="0" (click)="toggleAllSelection(statusesList, 'statusList')">{{
+            <mat-option [value]="0" (click)="toggleAllSelection(statusesList, 'statuses')">{{
               'homepage.events.filter-status-аny-status' | translate
             }}</mat-option>
             <mat-divider></mat-divider>
-            <mat-option [value]="status" *ngFor="let status of statusList" (onSelectionChange)="updateSelectedFilters(status, $event)">
+            <mat-option
+              [value]="status"
+              *ngFor="let status of statusList"
+              (onSelectionChange)="updateSelectedFilters(status, $event, statusesList, 'statuses', statusList)"
+            >
               {{ getLangValue(status.nameUa, status.nameEn) }}
             </mat-option>
           </mat-select>
@@ -69,11 +73,15 @@
         <div class="dropdown" (click)="typeFilter.open()">
           <mat-label class="filter">{{ 'homepage.events.filter-type' | translate }}</mat-label>
           <mat-select #typeFilter [formControl]="typeFilterControl" multiple>
-            <mat-option [value]="0" (click)="toggleAllSelection(typesList, 'typeList')">{{
+            <mat-option [value]="0" (click)="toggleAllSelection(typesList, 'tags')">{{
               'homepage.events.filter-аny-type' | translate
             }}</mat-option>
             <mat-divider></mat-divider>
-            <mat-option *ngFor="let type of typeList" [value]="type" (onSelectionChange)="updateSelectedFilters(type, $event)">
+            <mat-option
+              *ngFor="let type of typeList"
+              [value]="type"
+              (onSelectionChange)="updateSelectedFilters(type, $event, typesList, 'tags', typeList)"
+            >
               <span>{{ getLangValue(type.nameUa, type.nameEn) }}</span>
             </mat-option>
           </mat-select>
@@ -86,7 +94,7 @@
     <hr />
     <div class="active-filter-container">
       <p>
-        {{ 'homepage.events.item-found-text' | translate }} {{ selectedFilters.length }}
+        {{ 'homepage.events.item-found-text' | translate }} {{ remaining }}
         {{ 'homepage.events.items-event-text' | translate }}
       </p>
       <div class="chips">
diff --git a/src/app/main/component/events/components/events-list/events-list.component.spec.ts b/src/app/main/component/events/components/events-list/events-list.component.spec.ts
index 53c2d4ca5a..5d8abdeebd 100644
--- a/src/app/main/component/events/components/events-list/events-list.component.spec.ts
+++ b/src/app/main/component/events/components/events-list/events-list.component.spec.ts
@@ -13,14 +13,20 @@ import { Store } from '@ngrx/store';
 import { MatDialog, MatDialogModule } from '@angular/material/dialog';
 import { eventStatusList, TagsArray, eventTimeList } from '../../models/event-consts';
 import { By } from '@angular/platform-browser';
-import { MatOption } from '@angular/material/core';
+import { MatOption, MatOptionSelectionChange } from '@angular/material/core';
 import { FormControl } from '@angular/forms';
 import { EventPageResponceDto } from '../../models/events.interface';
 
 describe('EventsListComponent', () => {
   let component: EventsListComponent;
   let fixture: ComponentFixture<EventsListComponent>;
-
+  const eventStatusList = [
+    { nameEn: 'Open', nameUa: 'Відкритa' },
+    { nameEn: 'Closed', nameUa: 'Закритa' },
+    { nameEn: 'Joined', nameUa: 'Вже доєднані' },
+    { nameEn: 'Created', nameUa: 'Створенa' },
+    { nameEn: 'Saved', nameUa: 'Збережена' }
+  ];
   const MockReqest = {
     page: [],
     totalElements: 4
@@ -223,7 +229,7 @@ describe('EventsListComponent', () => {
       { nameEn: 'two', nameUa: 'два' },
       { nameEn: 'three', nameUa: 'три' }
     ];
-    const filterRemoved = [{ nameEn: 'three', nameUa: 'три' }];
+    const filterRemoved = { nameEn: 'three', nameUa: 'три' };
     const res = [
       { nameEn: 'one', nameUa: 'один' },
       { nameEn: 'two', nameUa: 'два' }
@@ -240,6 +246,7 @@ describe('EventsListComponent', () => {
     expect(spy).toHaveBeenCalledTimes(1);
     expect(component.selectedFilters).toEqual(res);
   });
+
   it('should check weather getUniqueCities works correctly', () => {
     const expected = [
       { nameEn: 'Kyiv', nameUa: 'Київ' },
@@ -280,57 +287,29 @@ describe('EventsListComponent', () => {
     });
   });
 
-  it('should subscribe to form control changes for all form controls', () => {
-    component.timeFilterControl = timeFilterControl;
-    component.locationFilterControl = locationFilterControl;
-    component.statusFilterControl = statusFilterControl;
-    component.typeFilterControl = typeFilterControl;
-
-    const spy = spyOn(component, 'updateSelectedFilters');
-
-    component.subscribeOnFormControlsChanges();
-
-    timeFilterControl.setValue('Some value');
-    locationFilterControl.setValue('Some value');
-    statusFilterControl.setValue('Some value');
-    typeFilterControl.setValue('Some value');
-
-    expect(spy).toHaveBeenCalledTimes(4);
-  });
-
   it('should remove existing filter when deselected', () => {
-    component.selectedFilters = ['filter1', 'filter2'];
-    const mockEvent = { isUserInput: true, source: { selected: false } };
-    component.updateSelectedFilters('filter1', mockEvent);
-    expect(component.selectedFilters).toEqual(['filter2']);
+    let mockEvent: MatOptionSelectionChange = {
+      isUserInput: true,
+      source: { selected: true } as MatOption
+    };
+    component.updateSelectedFilters(eventStatusList[0], mockEvent, component.statusesList, 'statuses', component.statusList);
+    component.updateSelectedFilters(eventStatusList[1], mockEvent, component.statusesList, 'statuses', component.statusList);
+    mockEvent = { isUserInput: true, source: { selected: false } as MatOption };
+    component.updateSelectedFilters(eventStatusList[1], mockEvent, component.statusesList, 'statuses', component.statusList);
+    expect(component.selectedFilters).toEqual([{ nameEn: 'Open', nameUa: 'Відкритa' }]);
   });
 
   it('should add new filter when selected', () => {
-    component.selectedFilters = ['filter1', 'filter2'];
-    const mockEvent = { isUserInput: true, source: { selected: true } };
-    component.updateSelectedFilters('filter3', mockEvent);
-    expect(component.selectedFilters).toEqual(['filter1', 'filter2', 'filter3']);
-  });
-
-  it('should not modify selectedFilters when no user input', () => {
-    component.selectedFilters = ['filter1', 'filter2'];
-    const mockEvent = { isUserInput: false, source: { selected: true } };
-    component.updateSelectedFilters('filter3', mockEvent);
-    expect(component.selectedFilters).toEqual(['filter1', 'filter2']);
-  });
-
-  it('should not modify selectedFilters when already deselected', () => {
-    component.selectedFilters = ['filter1', 'filter2'];
-    const mockEvent = { isUserInput: true, source: { selected: false } };
-    component.updateSelectedFilters('filter3', mockEvent);
-    expect(component.selectedFilters).toEqual(['filter1', 'filter2']);
-  });
-
-  it('should not modify selectedFilters when already selected', () => {
-    component.selectedFilters = ['filter1', 'filter2'];
-    const mockEvent = { isUserInput: true, source: { selected: true } };
-    component.updateSelectedFilters('filter2', mockEvent);
-    expect(component.selectedFilters).toEqual(['filter1', 'filter2']);
+    const mockEvent: MatOptionSelectionChange = {
+      isUserInput: true,
+      source: { selected: true } as MatOption
+    };
+    component.updateSelectedFilters(eventStatusList[0], mockEvent, component.statusesList, 'statuses', component.statusList);
+    component.updateSelectedFilters(eventStatusList[1], mockEvent, component.statusesList, 'statuses', component.statusList);
+    expect(component.selectedFilters).toEqual([
+      { nameEn: 'Open', nameUa: 'Відкритa' },
+      { nameEn: 'Closed', nameUa: 'Закритa' }
+    ]);
   });
 
   it('should check weather search works correctly', () => {
diff --git a/src/app/main/component/events/components/events-list/events-list.component.ts b/src/app/main/component/events/components/events-list/events-list.component.ts
index 1ea69804ed..069ddd6ba1 100644
--- a/src/app/main/component/events/components/events-list/events-list.component.ts
+++ b/src/app/main/component/events/components/events-list/events-list.component.ts
@@ -1,5 +1,5 @@
 import { Component, Injector, OnDestroy, OnInit, ViewChild } from '@angular/core';
-import { EventPageResponceDto } from '../../models/events.interface';
+import { EventFilterCriteriaIntarface, EventPageResponceDto } from '../../models/events.interface';
 import { UserOwnAuthService } from '@auth-service/user-own-auth.service';
 import { ReplaySubject } from 'rxjs';
 import { LocalStorageService } from '@global-service/localstorage/local-storage.service';
@@ -7,14 +7,23 @@ import { Store } from '@ngrx/store';
 import { IAppState } from 'src/app/store/state/app.state';
 import { IEcoEventsState } from 'src/app/store/state/ecoEvents.state';
 import { GetEcoEventsByPageAction } from 'src/app/store/actions/ecoEvents.actions';
-import { TagsArray, eventTimeList, eventStatusList, OptionItem, allSelectedFlags, AllSelectedFlags } from '../../models/event-consts';
+import {
+  TagsArray,
+  eventTimeList,
+  eventStatusList,
+  OptionItem,
+  allSelectedFlags,
+  AllSelectedFlags,
+  EventFilterCriteria,
+  allSelectedFilter
+} from '../../models/event-consts';
 import { LanguageService } from '../../../../i18n/language.service';
 import { Router } from '@angular/router';
 import { AuthModalComponent } from '@global-auth/auth-modal/auth-modal.component';
 import { MatDialog } from '@angular/material/dialog';
 import { FormControl } from '@angular/forms';
 import { MatSelect } from '@angular/material/select';
-import { MatOption } from '@angular/material/core';
+import { MatOption, MatOptionSelectionChange } from '@angular/material/core';
 import { UserFriendsService } from '@global-user/services/user-friends.service';
 import { FriendModel } from '@global-user/models/friend.model';
 import { takeUntil } from 'rxjs/operators';
@@ -40,7 +49,8 @@ export class EventsListComponent implements OnInit, OnDestroy {
   public isLoggedIn: string;
   private destroyed$: ReplaySubject<any> = new ReplaySubject<any>(1);
   ecoEvents$ = this.store.select((state: IAppState): IEcoEventsState => state.ecoEventsState);
-
+  private eventFilterCriteria: EventFilterCriteriaIntarface = EventFilterCriteria;
+  private allSelectedFilter = allSelectedFilter;
   public page = 0;
   public hasNext = true;
   public remaining = 0;
@@ -73,7 +83,6 @@ export class EventsListComponent implements OnInit, OnDestroy {
   }
 
   ngOnInit(): void {
-    this.subscribeOnFormControlsChanges();
     this.localStorageService.setEditMode('canUserEdit', false);
     this.checkUserSingIn();
     this.userOwnAuthService.getDataFromLocalStorage();
@@ -107,34 +116,83 @@ export class EventsListComponent implements OnInit, OnDestroy {
     }
   }
 
-  updateSelectedFilters(value: any, event): void {
+  public updateSelectedFilters(
+    value: OptionItem,
+    event: MatOptionSelectionChange,
+    optionsList: MatSelect,
+    dropdownName: string,
+    filterList: Array<OptionItem>
+  ): void {
     const existingFilterIndex = this.selectedFilters.indexOf(value);
-    if (event.isUserInput && !event.source.selected && existingFilterIndex !== -1) {
+    const isUserInput = event.isUserInput && existingFilterIndex !== -1;
+    if (isUserInput && !event.source.selected) {
       this.selectedFilters.splice(existingFilterIndex, 1);
+      this.deleteFromEventFilterCriteria(value, dropdownName);
+      this.checkAllSelectedFilters(value, optionsList, dropdownName, filterList);
+    }
+
+    if (event.isUserInput && !event.source.selected) {
+      this.checkAllSelectedFilters(value, optionsList, dropdownName, filterList);
+    }
+
+    if (!event.source.selected) {
+      this.deleteFromEventFilterCriteria(value, dropdownName);
     }
-    if (event.isUserInput && event.source.selected && existingFilterIndex === -1) {
+
+    if (!isUserInput && event.source.selected) {
       this.selectedFilters.push(value);
+      this.addToEventFilterCriteria(value, dropdownName);
+      this.checkAllSelectedFilters(value, optionsList, dropdownName, filterList);
     }
+    this.dispatchStore(true);
   }
 
-  subscribeOnFormControlsChanges(): void {
-    const formControls = [
-      { control: this.timeFilterControl },
-      { control: this.locationFilterControl },
-      { control: this.statusFilterControl },
-      { control: this.typeFilterControl }
-    ];
-
-    formControls.forEach((formControl) => {
-      formControl.control.valueChanges.subscribe((value) => {
-        this.updateSelectedFilters(value, Event);
+  private checkAllSelectedFilters(value: OptionItem, optionsList: MatSelect, dropdownName: string, filterList: Array<OptionItem>) {
+    if (this.allSelectedFlags[dropdownName]) {
+      optionsList.options.first.deselect();
+      filterList.forEach((item) => {
+        if (item.nameEn !== value.nameEn) {
+          this.addToEventFilterCriteria(item, dropdownName);
+        }
       });
-    });
+      this.selectedFilters = this.selectedFilters.filter((item) => this.allSelectedFilter[dropdownName].nameEn !== item.nameEn);
+      this.selectedFilters = [...this.selectedFilters, ...filterList.filter((item) => item.nameEn !== value.nameEn)];
+    }
+
+    this.allSelectedFlags[dropdownName] = this.eventFilterCriteria[dropdownName].length >= filterList.length;
+
+    if (this.allSelectedFlags[dropdownName]) {
+      optionsList.options.first.select();
+      this.selectedFilters = this.selectedFilters.filter((item1) => !filterList.some((item2) => item2.nameEn === item1.nameEn));
+      this.selectedFilters.push(this.allSelectedFilter[dropdownName]);
+      this.eventFilterCriteria[dropdownName] = [];
+    }
+  }
+
+  private deleteFromEventFilterCriteria(value: OptionItem, dropdownName: string) {
+    this.eventFilterCriteria = {
+      ...this.eventFilterCriteria,
+      [dropdownName]: this.eventFilterCriteria[dropdownName].filter((item) => item !== value.nameEn)
+    };
+  }
+
+  private addToEventFilterCriteria(value: OptionItem, dropdownName: string) {
+    this.eventFilterCriteria = {
+      ...this.eventFilterCriteria,
+      [dropdownName]: [...this.eventFilterCriteria[dropdownName], value.nameEn]
+    };
   }
 
   public dispatchStore(res: boolean): void {
     if (this.hasNext && this.page !== undefined) {
-      this.store.dispatch(GetEcoEventsByPageAction({ currentPage: this.page, numberOfEvents: this.eventsPerPage, reset: res }));
+      this.store.dispatch(
+        GetEcoEventsByPageAction({
+          currentPage: this.page,
+          numberOfEvents: this.eventsPerPage,
+          reset: res,
+          filter: this.eventFilterCriteria
+        })
+      );
     }
   }
 
@@ -154,26 +212,23 @@ export class EventsListComponent implements OnInit, OnDestroy {
     return cities;
   }
 
-  public toggleAllSelection(optionsList: any, dropdownName: string): void {
+  public toggleAllSelection(optionsList: MatSelect, dropdownName: string): void {
     this.allSelectedFlags[dropdownName] = !this.allSelectedFlags[dropdownName];
-    this.isSelectedOptions(optionsList, dropdownName);
-  }
-
-  public isSelectedOptions(optionsList: any, dropdownName: string): void {
-    this.optionsList = optionsList;
     if (this.allSelectedFlags[dropdownName]) {
-      this.optionsList.options.forEach((item: MatOption) => {
-        if (item.value !== 0) {
-          this.selectedFilters.push(item.value);
+      optionsList.options.forEach((item: MatOption) => {
+        if (item.value === 0) {
+          this.selectedFilters.push(allSelectedFilter[dropdownName]);
+        }
+        if (!this.eventFilterCriteria[dropdownName]) {
+          this.eventFilterCriteria[dropdownName] = [];
         }
+        this.selectedFilters = this.selectedFilters.filter((value) => value !== item.value);
         item.select();
-        this.allSelectedFlags[dropdownName] = true;
       });
     } else {
-      this.optionsList.options.forEach((item: MatOption) => {
+      optionsList.options.forEach((item: MatOption) => {
         item.deselect();
-        this.allSelectedFlags[dropdownName] = false;
-        this.selectedFilters = this.selectedFilters.filter((value) => value !== item.value);
+        this.selectedFilters = this.selectedFilters.filter((value) => value !== item.value && value !== allSelectedFilter[dropdownName]);
       });
     }
   }
@@ -182,12 +237,33 @@ export class EventsListComponent implements OnInit, OnDestroy {
     this.searchToggle = !this.searchToggle;
   }
 
-  public deleteOneFilter(filter, index): void {
-    [this.timeList, this.statusesList, this.locationList, this.typesList].forEach((list) => {
-      const item = list.options.find((option: MatOption) => filter.nameEn === option.value.nameEn);
-      if (item) {
+  public deleteOneFilter(filter: OptionItem, index: number): void {
+    let deleted = true;
+    const keyMapping = {
+      eventTime: 0,
+      statuses: 1,
+      cities: 2,
+      tags: 3
+    };
+    [this.timeList, this.statusesList, this.locationList, this.typesList].forEach((list, arrayIndex) => {
+      Object.keys(this.allSelectedFilter).forEach((dropdownName) => {
+        if (this.allSelectedFilter[dropdownName].nameEn === filter.nameEn) {
+          list.options.forEach((item) => {
+            if (arrayIndex === keyMapping[dropdownName]) {
+              item.deselect();
+              this.allSelectedFlags[dropdownName] = false;
+            }
+          });
+          if (deleted) {
+            this.selectedFilters.splice(index, 1);
+            deleted = false;
+          }
+        }
+      });
+      const item2 = list.options.find((option: MatOption) => filter.nameEn === option.value.nameEn);
+      if (item2) {
         this.selectedFilters.splice(index, 1);
-        item.deselect();
+        item2.deselect();
       }
     });
   }
@@ -199,6 +275,16 @@ export class EventsListComponent implements OnInit, OnDestroy {
       });
     });
     this.selectedFilters.splice(0, this.selectedFilters.length);
+    Object.keys(this.eventFilterCriteria).forEach((dropdownName) => {
+      if (this.eventFilterCriteria[dropdownName].length) {
+        this.eventFilterCriteria[dropdownName] = [];
+      }
+    });
+    Object.keys(this.allSelectedFlags).forEach((dropdownName) => {
+      if (this.allSelectedFlags[dropdownName].length) {
+        this.allSelectedFlags[dropdownName] = false;
+      }
+    });
   }
 
   private checkUserSingIn(): void {
diff --git a/src/app/main/component/events/models/event-consts.ts b/src/app/main/component/events/models/event-consts.ts
index ece532aec9..fde0c99a03 100644
--- a/src/app/main/component/events/models/event-consts.ts
+++ b/src/app/main/component/events/models/event-consts.ts
@@ -9,17 +9,24 @@ export interface OptionItem {
 }
 
 export interface AllSelectedFlags {
-  typeList: boolean;
-  timeList: boolean;
-  statusList: boolean;
-  locationList: boolean;
+  tags: boolean;
+  eventTime: boolean;
+  statuses: boolean;
+  cities: boolean;
 }
 
 export const allSelectedFlags = {
-  timeList: false,
-  statusList: false,
-  typeList: false,
-  locationList: false
+  eventTime: false,
+  statuses: false,
+  tags: false,
+  cities: false
+};
+
+export const allSelectedFilter = {
+  eventTime: { nameEn: 'Any time', nameUa: 'Будь-який час' },
+  cities: { nameEn: 'All cites', nameUa: 'Всі міста' },
+  statuses: { nameEn: 'Any status', nameUa: 'Будь-який статус' },
+  tags: { nameEn: 'All types', nameUa: 'Всі типи' }
 };
 
 export const TagsArray = [
@@ -29,8 +36,8 @@ export const TagsArray = [
 ];
 
 export const eventTimeList = [
-  { nameEn: 'Upcoming', nameUa: 'Майбутній' },
-  { nameEn: 'Passed', nameUa: 'Завершений' }
+  { nameEn: 'Future', nameUa: 'Майбутній' },
+  { nameEn: 'Past', nameUa: 'Завершений' }
 ];
 
 export const eventStatusList = [
@@ -63,3 +70,10 @@ export const WeekArray = [
   { nameEn: '6 days', nameUa: '6 днів' },
   { nameEn: '7 days', nameUa: '7 днів' }
 ];
+
+export let EventFilterCriteria = {
+  eventTime: [],
+  cities: [],
+  statuses: [],
+  tags: []
+};
diff --git a/src/app/main/component/events/models/events.interface.ts b/src/app/main/component/events/models/events.interface.ts
index cce9c3513b..3810cd51e4 100644
--- a/src/app/main/component/events/models/events.interface.ts
+++ b/src/app/main/component/events/models/events.interface.ts
@@ -159,3 +159,9 @@ export interface InitialStartDate {
   initialDate: Date;
   initialStartTime: string;
 }
+export interface EventFilterCriteriaIntarface {
+  eventTime: Array<string>;
+  cities: Array<string>;
+  statuses: Array<string>;
+  tags: Array<string>;
+}
diff --git a/src/app/main/component/events/services/events.service.spec.ts b/src/app/main/component/events/services/events.service.spec.ts
index 88b78f63cf..ac37973a67 100644
--- a/src/app/main/component/events/services/events.service.spec.ts
+++ b/src/app/main/component/events/services/events.service.spec.ts
@@ -2,12 +2,15 @@ import { TestBed } from '@angular/core/testing';
 import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
 import { EventsService } from 'src/app/main/component/events/services/events.service';
 import { environment } from '@environment/environment';
+import { EventFilterCriteriaIntarface } from '../models/events.interface';
+import { EventFilterCriteria } from '../models/event-consts';
 
 describe('EventsService', () => {
   let service: EventsService;
   let httpTestingController: HttpTestingController;
   const url = environment.backendLink;
   const formData = new FormData();
+  const eventFilterCriteria: EventFilterCriteriaIntarface = EventFilterCriteria;
   const data: any = {
     additionalImages: ['string'],
     dates: [
@@ -85,10 +88,13 @@ describe('EventsService', () => {
   });
 
   it('should make GET request to get all events', () => {
-    service.getEvents(0, 1).subscribe((event: any) => {
+    service.getEvents(0, 1, eventFilterCriteria).subscribe((event: any) => {
       expect(event).toEqual(data);
     });
-    const req = httpTestingController.expectOne(`${url}events?page=0&size=1`);
+    const req = httpTestingController.expectOne(
+      `${url}events?page=0&size=1&cities=${eventFilterCriteria.cities}&tags=${eventFilterCriteria.tags}` +
+        `&eventTime=${eventFilterCriteria.eventTime}&statuses=${eventFilterCriteria.statuses}`
+    );
     expect(req.request.method).toEqual('GET');
     req.flush(data);
   });
diff --git a/src/app/main/component/events/services/events.service.ts b/src/app/main/component/events/services/events.service.ts
index 53116556f8..fb5a9b9360 100644
--- a/src/app/main/component/events/services/events.service.ts
+++ b/src/app/main/component/events/services/events.service.ts
@@ -2,7 +2,7 @@ import { Injectable, OnDestroy } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { Observable, ReplaySubject, BehaviorSubject } from 'rxjs';
 import { environment } from '@environment/environment';
-import { EventResponseDto, PagePreviewDTO, DateEvent } from '../models/events.interface';
+import { EventResponseDto, PagePreviewDTO, DateEvent, EventFilterCriteriaIntarface } from '../models/events.interface';
 
 @Injectable({
   providedIn: 'root'
@@ -66,8 +66,11 @@ export class EventsService implements OnDestroy {
     return this.http.put<any>(`${this.backEnd}events/update`, formData);
   }
 
-  public getEvents(page: number, quantity: number): Observable<any> {
-    return this.http.get(`${this.backEnd}events?page=${page}&size=${quantity}`);
+  public getEvents(page: number, quantity: number, filter: EventFilterCriteriaIntarface): Observable<any> {
+    return this.http.get(
+      `${this.backEnd}events?page=${page}&size=${quantity}&cities=${filter.cities}` +
+        `&tags=${filter.tags}&eventTime=${filter.eventTime}&statuses=${filter.statuses}`
+    );
   }
 
   public getSubscribedEvents(page: number, quantity: number): Observable<EventResponseDto> {
diff --git a/src/app/store/actions/ecoEvents.actions.ts b/src/app/store/actions/ecoEvents.actions.ts
index 650070d61f..8094954576 100644
--- a/src/app/store/actions/ecoEvents.actions.ts
+++ b/src/app/store/actions/ecoEvents.actions.ts
@@ -1,5 +1,9 @@
 import { createAction, props } from '@ngrx/store';
-import { EventPageResponceDto, EventResponseDto } from 'src/app/main/component/events/models/events.interface';
+import {
+  EventFilterCriteriaIntarface,
+  EventPageResponceDto,
+  EventResponseDto
+} from 'src/app/main/component/events/models/events.interface';
 
 export enum EventsActions {
   GetEcoEventsByPage = '[Events] Get events by page',
@@ -37,7 +41,7 @@ export const DeleteEcoEventSuccessAction = createAction(EventsActions.DeleteEcoE
 
 export const GetEcoEventsByPageAction = createAction(
   EventsActions.GetEcoEventsByPage,
-  props<{ currentPage: number; numberOfEvents: number; reset: boolean }>()
+  props<{ currentPage: number; numberOfEvents: number; reset: boolean; filter: EventFilterCriteriaIntarface }>()
 );
 
 export const GetEcoEventsByPageSuccessAction = createAction(
diff --git a/src/app/store/effects/ecoEvents.effects.ts b/src/app/store/effects/ecoEvents.effects.ts
index 73160343b5..acc6760c17 100644
--- a/src/app/store/effects/ecoEvents.effects.ts
+++ b/src/app/store/effects/ecoEvents.effects.ts
@@ -3,7 +3,11 @@ import { Actions, createEffect, ofType } from '@ngrx/effects';
 import { Store } from '@ngrx/store';
 import { of } from 'rxjs';
 import { catchError, map, mergeMap } from 'rxjs/operators';
-import { EventPageResponceDto, EventResponseDto } from 'src/app/main/component/events/models/events.interface';
+import {
+  EventFilterCriteriaIntarface,
+  EventPageResponceDto,
+  EventResponseDto
+} from 'src/app/main/component/events/models/events.interface';
 import { EventsService } from 'src/app/main/component/events/services/events.service';
 import {
   CreateEcoEventAction,
@@ -32,8 +36,8 @@ export class EventsEffects {
   getEcoEventsByPage = createEffect(() => {
     return this.actions.pipe(
       ofType(GetEcoEventsByPageAction),
-      mergeMap((actions: { currentPage: number; numberOfEvents: number; reset: boolean }) => {
-        return this.eventsService.getEvents(actions.currentPage, actions.numberOfEvents).pipe(
+      mergeMap((actions: { currentPage: number; numberOfEvents: number; reset: boolean; filter: EventFilterCriteriaIntarface }) => {
+        return this.eventsService.getEvents(actions.currentPage, actions.numberOfEvents, actions.filter).pipe(
           map((ecoEvents: EventResponseDto) => GetEcoEventsByPageSuccessAction({ ecoEvents, reset: actions.reset })),
           catchError((error) => of(ReceivedFailureAction(error)))
         );