configuration pocketbase terminé (#5)

# Conflicts:
#	.gitignore

src/app/routes/profile/profile-list/profile-list.component.html

@@ -1,30 +1,28 @@
-<section class="pb-10 relative">
-  <div class="relative overflow-hidden">
-
-    <div class="max-w-[85rem] mx-auto px-4 sm:px-6 lg:px-8 pt-24 pb-10">
-      <div class="mt-8 mx-auto max-w-3xl space-y-2">
-        <app-search/>
-      </div>
-    </div>
-
-  </div>
-
-
-  <div class="max-w-6xl mx-auto px-4">
-    <app-display-profile-card (onDisplayChange)="showNewDisplay($event)"/>
-
-    @switch (display()){
-      @case ('list'.toUpperCase()){
-        <app-horizental-profile-list/>
-      }
-      @case ('grid'.toUpperCase()){
-        <app-vertical-profile-list/>
-      }
-      @default{
-        <app-vertical-profile-list/>
-      }
-    }
-
-  </div>
-</section>
-
+<section class="pb-10 relative">
+  <div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8 pt-24 pb-10 flex sm:flex-row flex-col space-y-2 items-center sm:space-x-4 ">
+    <div class="flex-1">
+      <app-search/>
+    </div>
+    <div class="">
+      <app-display-profile-card (onDisplayChange)="showNewDisplay($event)"/>
+    </div>
+  </div>
+
+
+  <div class="max-w-6xl mx-auto px-4">
+
+    @switch (display()) {
+      @case ('list'.toUpperCase()) {
+        <app-horizental-profile-list [profiles]="profiles"/>
+      }
+      @case ('grid'.toUpperCase()) {
+        <app-vertical-profile-list [profiles]="profiles"/>
+      }
+      @default {
+        <app-vertical-profile-list [profiles]="profiles"/>
+      }
+    }
+
+  </div>
+</section>
+

src/app/routes/profile/profile-list/profile-list.component.spec.ts

@@ -1,23 +1,27 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { ProfileListComponent } from './profile-list.component';
-
-describe('ProfileListComponent', () => {
-  let component: ProfileListComponent;
-  let fixture: ComponentFixture<ProfileListComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [ProfileListComponent]
-    })
-    .compileComponents();
-
-    fixture = TestBed.createComponent(ProfileListComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ProfileListComponent } from './profile-list.component';
+import {provideRouter} from "@angular/router";
+
+describe('ProfileListComponent', () => {
+  let component: ProfileListComponent;
+  let fixture: ComponentFixture<ProfileListComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [ProfileListComponent],
+      providers:[
+        provideRouter([])
+      ]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(ProfileListComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/routes/profile/profile-list/profile-list.component.ts

@@ -1,47 +1,46 @@
-import {Component, inject, signal} from '@angular/core';
-import {ActivatedRoute} from "@angular/router";
-import {SearchComponent} from "@app/shared/features/search/search.component";
-import {
-  HorizentalProfileItemComponent
-} from "@app/shared/components/horizental-profile-item/horizental-profile-item.component";
-import {
-  VerticalProfileItemComponent
-} from "@app/shared/components/vertical-profile-item/vertical-profile-item.component";
-import {DisplayProfileCardComponent} from "@app/shared/features/display-profile-card/display-profile-card.component";
-import {JsonPipe} from "@angular/common";
-import {
-  HorizentalProfileListComponent
-} from "@app/shared/components/horizental-profile-list/horizental-profile-list.component";
-import {
-  VerticalProfileListComponent
-} from "@app/shared/components/vertical-profile-list/vertical-profile-list.component";
-
-@Component({
-  selector: 'app-profile-list',
-  standalone: true,
-  imports: [
-    SearchComponent,
-    HorizentalProfileItemComponent,
-    VerticalProfileItemComponent,
-    DisplayProfileCardComponent,
-    JsonPipe,
-    HorizentalProfileListComponent,
-    VerticalProfileListComponent
-  ],
-  templateUrl: './profile-list.component.html',
-  styleUrl: './profile-list.component.scss'
-})
-export class ProfileListComponent {
-
-  private readonly route = inject(ActivatedRoute);
-  protected profiles = this.route.snapshot.data['profiles'];
-  protected display = signal<string>('grid'.toUpperCase());
-
-  constructor() {
-    console.log(this.profiles)
-  }
-
-  showNewDisplay($event: string) {
-    this.display.set($event.toUpperCase())
-  }
-}
+import {Component, inject, signal} from '@angular/core';
+import {ActivatedRoute} from "@angular/router";
+import {SearchComponent} from "@app/shared/features/search/search.component";
+import {
+  HorizentalProfileItemComponent
+} from "@app/shared/components/horizental-profile-item/horizental-profile-item.component";
+import {
+  VerticalProfileItemComponent
+} from "@app/shared/components/vertical-profile-item/vertical-profile-item.component";
+import {DisplayProfileCardComponent} from "@app/shared/features/display-profile-card/display-profile-card.component";
+import {JsonPipe} from "@angular/common";
+import {
+  HorizentalProfileListComponent
+} from "@app/shared/components/horizental-profile-list/horizental-profile-list.component";
+import {
+  VerticalProfileListComponent
+} from "@app/shared/components/vertical-profile-list/vertical-profile-list.component";
+import {UntilDestroy} from "@ngneat/until-destroy";
+import {Profile} from "@app/shared/models/profile";
+
+@Component({
+  selector: 'app-profile-list',
+  standalone: true,
+  imports: [
+    SearchComponent,
+    HorizentalProfileItemComponent,
+    VerticalProfileItemComponent,
+    DisplayProfileCardComponent,
+    JsonPipe,
+    HorizentalProfileListComponent,
+    VerticalProfileListComponent
+  ],
+  templateUrl: './profile-list.component.html',
+  styleUrl: './profile-list.component.scss'
+})
+@UntilDestroy()
+export class ProfileListComponent {
+
+  private readonly route = inject(ActivatedRoute);
+  protected profiles : Profile[] = this.route.snapshot.data['profiles'] as Profile[];
+  protected display = signal<string>('grid'.toUpperCase());
+
+  showNewDisplay($event: string) {
+    this.display.set($event.toUpperCase())
+  }
+}