Calendar/src/renderers/ColumnRenderer.ts

// Column rendering strategy interface and implementations

import { CalendarConfig } from '../core/CalendarConfig';
import { ResourceCalendarData } from '../types/CalendarTypes';
import { DateCalculator } from '../utils/DateCalculator';

/**
 * Interface for column rendering strategies
 */
export interface ColumnRenderer {
  render(columnContainer: HTMLElement, context: ColumnRenderContext): void;
}

/**
 * Context for column rendering
 */
export interface ColumnRenderContext {
  currentWeek: Date;
  config: CalendarConfig;
  resourceData?: ResourceCalendarData | null;
}

/**
 * Date-based column renderer (original functionality)
 */
export class DateColumnRenderer implements ColumnRenderer {
  private dateCalculator!: DateCalculator;

  render(columnContainer: HTMLElement, context: ColumnRenderContext): void {
    const { currentWeek, config } = context;
    
    // Initialize date calculator
    this.dateCalculator = new DateCalculator(config);
    
    const dates = this.dateCalculator.getWorkWeekDates(currentWeek);
    const dateSettings = config.getDateViewSettings();
    const daysToShow = dates.slice(0, dateSettings.weekDays);
    
    console.log('DateColumnRenderer: About to render', daysToShow.length, 'date columns');

    daysToShow.forEach((date) => {
      const column = document.createElement('swp-day-column');
      (column as any).dataset.date = this.dateCalculator.formatISODate(date);
      
      const eventsLayer = document.createElement('swp-events-layer');
      column.appendChild(eventsLayer);
      
      columnContainer.appendChild(column);
    });
  }

}

/**
 * Resource-based column renderer
 */
export class ResourceColumnRenderer implements ColumnRenderer {
  render(columnContainer: HTMLElement, context: ColumnRenderContext): void {
    const { resourceData } = context;
    
    if (!resourceData) {
      console.warn('ResourceColumnRenderer: No resource data available for resource columns');
      return;
    }

    console.log('ResourceColumnRenderer: About to render', resourceData.resources.length, 'resource columns');

    resourceData.resources.forEach((resource) => {
      const column = document.createElement('swp-resource-column');
      (column as any).dataset.resource = resource.name;
      (column as any).dataset.employeeId = resource.employeeId;
      (column as any).dataset.date = resourceData.date;
      
      const eventsLayer = document.createElement('swp-events-layer');
      column.appendChild(eventsLayer);
      
      columnContainer.appendChild(column);
    });
  }
}