Extract search bar into a standalone component and fix header design.

frontend/src/app/components/header/header.component.ts

@@ -6,18 +6,36 @@ import { AuthenticationService } from '../../core/service/authentication.service
 import { CommonModule } from '@angular/common';
 import { SideMenuComponent } from '../side-menu/side-menu.component';
 import { MatRippleModule } from '@angular/material/core';
+import { FormControl, ReactiveFormsModule } from '@angular/forms';
+import { PublicationsSearchBarComponent } from '../publications-search-bar/publications-search-bar.component';
+import { MatTooltipModule } from '@angular/material/tooltip';
 
 @Component({
   selector: 'app-header',
   standalone: true,
-  imports: [CommonModule, MatButtonModule, MatIconModule, RouterModule, SideMenuComponent, MatRippleModule],
+  imports: [
+    CommonModule,
+    MatButtonModule,
+    MatIconModule,
+    RouterModule,
+    SideMenuComponent,
+    MatRippleModule,
+    ReactiveFormsModule,
+    PublicationsSearchBarComponent,
+    MatTooltipModule
+  ],
   templateUrl: './header.component.html',
   styleUrl: './header.component.scss',
 })
 export class HeaderComponent {
   private authenticationService = inject(AuthenticationService);
+  searchControl = new FormControl('');
 
   get isAuthenticated(): boolean {
     return this.authenticationService.isAuthenticated();
   }
+  
+  searchPublications(): void {
+
+  }
 }