Create a simple company list component

I had hoped to fancy this up more (esp. the HTML), but it works and I need to go to bed.

The one really nice thing is that I was able to use a `Signal` in the component to avoid having any subscriptions anywhere!

.vscode/settings.json

@@ -29,7 +29,8 @@
       "sortorder",
       "testid",
       "todos",
-      "unsub"
+      "unsub",
+      "VINCH"
     ],
     "angular.enable-experimental-ivy-prompt": false,
 }

client/src/app/company-list/company-list.component.html

@@ -0,0 +1,16 @@
+<div class="flex-row">
+  <div class="flex-1">
+    <h1 class="company-list-title">Companies</h1>
+    <div class="flex-row">
+      @if (this.companies()) {
+        <div class="flex-1">
+          <div class="company-cards-container flex-row gap-8 flex-wrap">
+            @for (company of this.companies(); track company._id) {
+              <app-company-card class="company-card" [company]="company" ></app-company-card>
+            }
+          </div>
+        </div>
+      }
+    </div>
+  </div>
+</div>

client/src/app/company-list/company-list.component.spec.ts

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

client/src/app/company-list/company-list.component.ts

@@ -0,0 +1,20 @@
+import { Component, Signal } from '@angular/core';
+import { toSignal } from '@angular/core/rxjs-interop';
+import { CompanyCardComponent } from '../company-card/company-card.component';
+import { UserService } from '../users/user.service';
+import { Company } from './company';
+
+@Component({
+  selector: 'app-company-list',
+  standalone: true,
+  imports: [CompanyCardComponent],
+  templateUrl: './company-list.component.html',
+  styleUrl: './company-list.component.scss'
+})
+export class CompanyListComponent {
+  companies: Signal<Company[]>;
+
+  constructor(private userService: UserService) {
+    this.companies = toSignal(this.userService.getCompanies());
+  }
+}