diff --git a/src/components/filter-config/filter-config.component.html b/src/components/filter-config/filter-config.component.html
new file mode 100644
index 0000000..f150fe1
--- /dev/null
+++ b/src/components/filter-config/filter-config.component.html
@@ -0,0 +1 @@
+<p>filter-config works!</p>
diff --git a/src/components/filter-config/filter-config.component.scss b/src/components/filter-config/filter-config.component.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/filter-config/filter-config.component.spec.ts b/src/components/filter-config/filter-config.component.spec.ts
new file mode 100644
index 0000000..dc674f1
--- /dev/null
+++ b/src/components/filter-config/filter-config.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { FilterConfigComponent } from './filter-config.component';
+
+describe('FilterConfigComponent', () => {
+  let component: FilterConfigComponent;
+  let fixture: ComponentFixture<FilterConfigComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [FilterConfigComponent]
+    })
+    .compileComponents();
+    
+    fixture = TestBed.createComponent(FilterConfigComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/components/filter-config/filter-config.component.ts b/src/components/filter-config/filter-config.component.ts
new file mode 100644
index 0000000..a7ccfb1
--- /dev/null
+++ b/src/components/filter-config/filter-config.component.ts
@@ -0,0 +1,13 @@
+import { Component, inject } from '@angular/core';
+import { QueryService } from '../../services/query.service';
+
+@Component({
+  selector: 'fbi-filter-config',
+  standalone: true,
+  imports: [],
+  templateUrl: './filter-config.component.html',
+  styleUrl: './filter-config.component.scss',
+})
+export class FilterConfigComponent {
+  private queryService = inject(QueryService);
+}
diff --git a/src/components/metadata/metadata.component.html b/src/components/metadata/metadata.component.html
index b2f2614..9f6e766 100644
--- a/src/components/metadata/metadata.component.html
+++ b/src/components/metadata/metadata.component.html
@@ -6,6 +6,5 @@
 ></fbi-tree>
 
 <fbi-window #filter [config]="windowConfig"
-  >content content content content content content content content content
-  content content content content content content content content content
-</fbi-window>
+  ><fbi-filter-config></fbi-filter-config
+></fbi-window>
diff --git a/src/components/metadata/metadata.component.ts b/src/components/metadata/metadata.component.ts
index 8f835e2..d67870c 100644
--- a/src/components/metadata/metadata.component.ts
+++ b/src/components/metadata/metadata.component.ts
@@ -1,18 +1,19 @@
 import { Component, ViewChild } from '@angular/core';
-import { TreeComponent } from '../tree/tree.component';
+import { faAdd, faFilter } from '@fortawesome/free-solid-svg-icons';
+import { combineLatest } from 'rxjs';
+import { Action } from '../../models/action';
+import { Query } from '../../models/query';
 import { TreeNode } from '../../models/tree-node';
 import { MetaService } from '../../services/meta.service';
-import { Action } from '../../models/action';
-import { faAdd, faFilter } from '@fortawesome/free-solid-svg-icons';
 import { QueryService } from '../../services/query.service';
-import { combineLatest } from 'rxjs';
-import { Query } from '../../models/query';
+import { FilterConfigComponent } from '../filter-config/filter-config.component';
+import { TreeComponent } from '../tree/tree.component';
 import { WindowComponent } from '../window/window.component';
 
 @Component({
   selector: 'fbi-metadata',
   standalone: true,
-  imports: [TreeComponent, WindowComponent],
+  imports: [FilterConfigComponent, TreeComponent, WindowComponent],
   templateUrl: './metadata.component.html',
   styleUrl: './metadata.component.scss',
 })
diff --git a/src/components/query/query.component.ts b/src/components/query/query.component.ts
index dcc0751..3b24762 100644
--- a/src/components/query/query.component.ts
+++ b/src/components/query/query.component.ts
@@ -1,9 +1,4 @@
 import { Component } from '@angular/core';
-import { TreeComponent } from '../tree/tree.component';
-import { TreeNode } from '../../models/tree-node';
-import { QueryService } from '../../services/query.service';
-import { Query } from '../../models/query';
-import { Action } from '../../models/action';
 import {
   faArrowDown,
   faArrowUp,
@@ -13,9 +8,14 @@ import {
   faSortDesc,
   faSortDown,
 } from '@fortawesome/free-solid-svg-icons';
-import { ExecuteService } from '../../services/execute.service';
-import { Header } from '../../models/header';
 import { SORT } from '../../enums/sort';
+import { Action } from '../../models/action';
+import { Header } from '../../models/header';
+import { Query } from '../../models/query';
+import { TreeNode } from '../../models/tree-node';
+import { ExecuteService } from '../../services/execute.service';
+import { QueryService } from '../../services/query.service';
+import { TreeComponent } from '../tree/tree.component';
 
 @Component({
   selector: 'fbi-query',
diff --git a/src/components/result/result.component.ts b/src/components/result/result.component.ts
index 6210dea..523f564 100644
--- a/src/components/result/result.component.ts
+++ b/src/components/result/result.component.ts
@@ -1,13 +1,13 @@
 import { CommonModule } from '@angular/common';
 import { Component } from '@angular/core';
-import { TreeComponent } from '../tree/tree.component';
-import { QueryService } from '../../services/query.service';
-import { Query } from '../../models/query';
-import { ExecuteService } from '../../services/execute.service';
-import { TableComponent } from '../table/table.component';
-import { Result } from '../../models/result';
 import { Header } from '../../models/header';
 import { Page } from '../../models/page';
+import { Query } from '../../models/query';
+import { Result } from '../../models/result';
+import { ExecuteService } from '../../services/execute.service';
+import { QueryService } from '../../services/query.service';
+import { TableComponent } from '../table/table.component';
+import { TreeComponent } from '../tree/tree.component';
 
 @Component({
   selector: 'fbi-result',
diff --git a/src/components/select/select.component.ts b/src/components/select/select.component.ts
index 2af5f9c..68fc8d5 100644
--- a/src/components/select/select.component.ts
+++ b/src/components/select/select.component.ts
@@ -1,9 +1,9 @@
-import { Component, Input, OnInit, inject } from '@angular/core';
 import { CommonModule } from '@angular/common';
+import { Component, Input, OnInit, inject } from '@angular/core';
+import { FormsModule } from '@angular/forms';
 import { Observable } from 'rxjs';
 import { KeyValue } from '../../models/key-value';
 import { FilterService } from '../../services/filters.service';
-import { FormsModule } from '@angular/forms';
 
 @Component({
   selector: 'fbi-select',
diff --git a/src/components/table/table.component.ts b/src/components/table/table.component.ts
index 1341dce..ec9bb39 100644
--- a/src/components/table/table.component.ts
+++ b/src/components/table/table.component.ts
@@ -7,16 +7,16 @@ import {
   Output,
   SimpleChanges,
 } from '@angular/core';
-import { Header } from '../../models/header';
+import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
 import {
   faSort,
   faSortDown,
   faSortUp,
 } from '@fortawesome/free-solid-svg-icons';
-import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
 import { SORT } from '../../enums/sort';
-import { Result } from '../../models/result';
+import { Header } from '../../models/header';
 import { Page } from '../../models/page';
+import { Result } from '../../models/result';
 
 @Component({
   selector: 'fbi-table',
diff --git a/src/components/tree/tree.component.ts b/src/components/tree/tree.component.ts
index 425afb3..6e5a758 100644
--- a/src/components/tree/tree.component.ts
+++ b/src/components/tree/tree.component.ts
@@ -1,9 +1,9 @@
-import { Component, EventEmitter, Input, Output } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { TreeNode } from '../../models/tree-node';
+import { Component, EventEmitter, Input, Output } from '@angular/core';
 import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
 import { faCaretDown, faCaretRight } from '@fortawesome/free-solid-svg-icons';
 import { Action } from '../../models/action';
+import { TreeNode } from '../../models/tree-node';
 
 @Component({
   selector: 'fbi-tree',
diff --git a/src/components/window/window.component.ts b/src/components/window/window.component.ts
index 34aca0b..20e6ac2 100644
--- a/src/components/window/window.component.ts
+++ b/src/components/window/window.component.ts
@@ -1,3 +1,4 @@
+import { CommonModule, DOCUMENT } from '@angular/common';
 import {
   Component,
   EventEmitter,
@@ -6,7 +7,6 @@ import {
   Input,
   Output,
 } from '@angular/core';
-import { CommonModule, DOCUMENT } from '@angular/common';
 import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
 import { faRectangleXmark } from '@fortawesome/free-regular-svg-icons';
 import { WindowConfig } from './window-config';