Calendar/src/v2/features/resource/ResourceRenderer.ts

import { from, IEnumerable } from 'ts-linq-light';
import { IGroupingRenderer, RenderContext } from '../../core/IGroupingRenderer';
import { NextFunction, RenderData } from '../../core/RenderBuilder';

interface Resource {
  id: string;
  name?: string;
}

export class ResourceRenderer implements IGroupingRenderer<Resource> {
  readonly type = 'resource';

  render(
    resources: IEnumerable<Resource>,
    data: RenderData,
    next: NextFunction,
    context: RenderContext
  ): void {
    const dates = data.dates || from([]);

    for (const resource of resources) {
      const colspan = next.count(dates);

      const cell = document.createElement('swp-resource-header');
      cell.dataset.resourceId = resource.id;
      cell.textContent = resource.name || resource.id;

      if (colspan > 1) {
        cell.style.gridColumn = `span ${colspan}`;
      }

      context.headerContainer.appendChild(cell);

      next.render(dates);
    }
  }
}