SEO/AEO, Farb schema, breadcrumbs

bizmatch/src/app/pages/details/details-user/details-user.component.ts

@@ -5,6 +5,7 @@ import { Observable } from 'rxjs';
 import { BusinessListing, CommercialPropertyListing, User } from '../../../../../../bizmatch-server/src/models/db.model';
 import { KeycloakUser, emailToDirName } from '../../../../../../bizmatch-server/src/models/main.model';
 import { environment } from '../../../../environments/environment';
+import { BreadcrumbItem, BreadcrumbsComponent } from '../../../components/breadcrumbs/breadcrumbs.component';
 import { AuthService } from '../../../services/auth.service';
 import { HistoryService } from '../../../services/history.service';
 import { ImageService } from '../../../services/image.service';
@@ -17,13 +18,18 @@ import { formatPhoneNumber, map2User } from '../../../utils/utils';
 @Component({
   selector: 'app-details-user',
   standalone: true,
-  imports: [SharedModule],
+  imports: [SharedModule, BreadcrumbsComponent],
   templateUrl: './details-user.component.html',
   styleUrl: '../details.scss',
 })
 export class DetailsUserComponent {
   private id: string | undefined = this.activatedRoute.snapshot.params['id'] as string | undefined;
   user: User;
+  breadcrumbs: BreadcrumbItem[] = [
+    { label: 'Home', url: '/home', icon: 'fas fa-home' },
+    { label: 'Professionals', url: '/brokerListings' },
+    { label: 'Profile' }
+  ];
   user$: Observable<KeycloakUser>;
   keycloakUser: KeycloakUser;
   environment = environment;