@for (chunk of docs(); track chunk; let i = $index) {
  <div class="space-y-2">
    <div class="flex items-center text-text-secondary text-sm font-medium">
      <i class="ri-text-block mr-1"></i>
      <p class="flex gap-2 ml-0.5">
        <span>Chunk-{{i}}</span>
        <span>·</span>
        <span>{{chunk.pageContent.length}} characters</span>
      </p>
    </div>
    <div class="text-text-primary text-sm font-body break-words whitespace-normal">{{chunk.pageContent}}</div>
  </div>
} @empty {
  @if (error()) {
    <div class="text-text-warning">
      {{error()}}
    </div>
  }
}

@if (loading()) {
  <ngm-spin class="absolute w-full h-full left-0 top-0"/>
}