initial commit

frontend/src/app/layout/header-bar/header-bar.component.ts

@@ -0,0 +1,25 @@
+import { ChangeDetectionStrategy, Component, signal } from '@angular/core';
+import { MatIconModule } from '@angular/material/icon';
+import { MatButtonModule } from '@angular/material/button';
+import { MatBadgeModule } from '@angular/material/badge';
+
+/**
+ * Header Bar component for the Command Hub.
+ * Per spec Section 3.1: 64px tall, app title + live indicator + notification bell + settings.
+ * Uses M3 top app bar pattern.
+ */
+@Component({
+  selector: 'app-header-bar',
+  standalone: true,
+  imports: [MatIconModule, MatButtonModule, MatBadgeModule],
+  templateUrl: './header-bar.component.html',
+  styleUrl: './header-bar.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class HeaderBarComponent {
+  protected readonly notificationCount = signal(3);
+  protected readonly isConnected = signal(true);
+
+  // TODO: Wire up notification panel (spec Section 2: Notifications Panel)
+  // TODO: Wire up settings navigation
+}