feat: manage tenants and leases (#4)

frontend/src/app/components/workspace-navigation/workspace-navigation.css

@@ -21,7 +21,7 @@
 .navigation-items {
   display: grid;
   height: 100%;
-  grid-template-columns: repeat(3, minmax(0, 1fr));
+  grid-template-columns: repeat(5, minmax(0, 1fr));
   gap: 4px;
 }
 .navigation-item.mat-mdc-button {

frontend/src/app/components/workspace-navigation/workspace-navigation.html

@@ -47,6 +47,48 @@
       </svg>
       <span>Appartements</span>
     </button>
+    <button
+      mat-button
+      type="button"
+      class="navigation-item"
+      [class.active]="activeTab() === 'tenants'"
+      [attr.aria-current]="activeTab() === 'tenants' ? 'page' : null"
+      (click)="tabSelected.emit('tenants')"
+    >
+      <svg
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke="currentColor"
+        stroke-width="1.8"
+        aria-hidden="true"
+      >
+        <circle cx="9" cy="8" r="3" />
+        <path
+          d="M3.5 20v-2.5A4.5 4.5 0 0 1 8 13h2a4.5 4.5 0 0 1 4.5 4.5V20M16 5.5a3 3 0 0 1 0 5.8M17 14a4.5 4.5 0 0 1 3.5 4.4V20"
+        />
+      </svg>
+      <span>Locataires</span>
+    </button>
+    <button
+      mat-button
+      type="button"
+      class="navigation-item"
+      [class.active]="activeTab() === 'leases'"
+      [attr.aria-current]="activeTab() === 'leases' ? 'page' : null"
+      (click)="tabSelected.emit('leases')"
+    >
+      <svg
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke="currentColor"
+        stroke-width="1.8"
+        aria-hidden="true"
+      >
+        <path d="M6 3h9l4 4v14H6z" />
+        <path d="M14 3v5h5M9 12h7M9 16h7" />
+      </svg>
+      <span>Baux</span>
+    </button>
     <button
       mat-button
       type="button"

frontend/src/app/components/workspace-navigation/workspace-navigation.ts

@@ -2,7 +2,7 @@ import { Component, input, output } from '@angular/core';
 import { MatButtonModule } from '@angular/material/button';
 import { BrandMark } from '../brand-mark';
 
-export type WorkspaceTab = 'dashboard' | 'apartments' | 'settings';
+export type WorkspaceTab = 'dashboard' | 'apartments' | 'tenants' | 'leases' | 'settings';
 
 @Component({
   selector: 'app-workspace-navigation',