import { ChangeDetectionStrategy, Component } from '@angular/core';
import { toSignal } from '@angular/core/rxjs-interop';
import { injectLoad } from '@analogjs/router';

import { RoutedPage } from '../ui/routed-page';
import { load } from './[...path].server';

@Component({
  selector: 'app-route-path',
  changeDetection: ChangeDetectionStrategy.OnPush,
  imports: [RoutedPage],
  template: `<app-routed-page [data]="data()" />`,
})
export default class PathRoute {
  protected readonly data = toSignal(injectLoad<typeof load>(), {
    requireSync: true,
  });
}