feat(appointment-details): display basic viewings info

draylegend · Sep 26, 2022 · 06b8de3 · 06b8de3
1 parent 1f92fa0
commit 06b8de3
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 3 deletions.
diff --git a/libs/appointment/domain/src/lib/appointment.facade.ts b/libs/appointment/domain/src/lib/appointment.facade.ts
@@ -11,6 +11,7 @@ export class AppointmentFacade {
   visibleDays$ = this.store.select(selectors.selectVisibleDays);
   viewings$ = this.store.select(selectors.selectViewings);
   weekSpan$ = this.store.select(selectors.selectWeekSpan);
+  selectedViewings$ = this.store.select(selectors.selectSelectedViewings);
   history: string[] = [];
 
   constructor(private store: Store<State>) {}

diff --git a/libs/appointment/domain/src/lib/appointment.selectors.ts b/libs/appointment/domain/src/lib/appointment.selectors.ts
@@ -32,3 +32,7 @@ export const selectViewings = createSelector(selectFeature, s => {
 export const selectWeekSpan = createSelector(selectFeature, s =>
   getWeekSpan(s.selectedYear, s.selectedWeek),
 );
+
+export const selectSelectedViewings = createSelector(selectFeature, s =>
+  s.selectedViewings.map(id => s.entities[id]),
+);
diff --git a/libs/appointment/features/details-feature/src/lib/details-feature.component.html b/libs/appointment/features/details-feature/src/lib/details-feature.component.html
@@ -1 +1,3 @@
-<section></section>
+<section>
+  <pre>{{ facade.selectedViewings$ | ngrxPush | json }}</pre>
+</section>
diff --git a/libs/appointment/features/details-feature/src/lib/details-feature.component.scss b/libs/appointment/features/details-feature/src/lib/details-feature.component.scss
@@ -16,4 +16,5 @@ section {
   border-radius: 4px;
   height: 75vh;
   width: 75vw;
+  overflow: auto;
 }
diff --git a/libs/appointment/features/details-feature/src/lib/details-feature.component.ts b/libs/appointment/features/details-feature/src/lib/details-feature.component.ts
@@ -1,19 +1,21 @@
-import { Location } from '@angular/common';
+import { JsonPipe, Location } from '@angular/common';
 import {
   ChangeDetectionStrategy,
   Component,
   HostListener,
 } from '@angular/core';
 import { AppointmentFacade } from '@immomio/appointment/domain';
+import { PushModule } from '@ngrx/component';
 
 @Component({
   changeDetection: ChangeDetectionStrategy.OnPush,
   standalone: true,
   styleUrls: ['./details-feature.component.scss'],
   templateUrl: './details-feature.component.html',
+  imports: [PushModule, JsonPipe],
 })
 export class DetailsFeatureComponent {
-  constructor(private facade: AppointmentFacade, private location: Location) {}
+  constructor(public facade: AppointmentFacade, private location: Location) {}
 
   @HostListener('click', ['$event.target']) hostClick(e: HTMLElement) {
     if (e.closest('section')) {