import { CommonModule } from '@angular/common';
import { Component, Input, OnInit, inject } from '@angular/core';
import { ChartComponent } from '../../components/chart/chart.component';
import {
  ChartAxisPosition,
  ChartType,
} from '../../components/chart/chart-type';
import { ChartConfig } from '../../components/chart/chart-config';
import { DataService } from '../../services/data.service';
import { Milestone } from '../../enums/milestone';

@Component({
  selector: 'fbi-scores',
  standalone: true,
  imports: [CommonModule, ChartComponent],
  templateUrl: './scores.component.html',
  styleUrl: './scores.component.scss',
})
export class ScoresComponent implements OnInit {
  @Input() county: string = '644';
  @Input() school: string = '3067';
  @Input() grade!: number;

  chart: ChartConfig = {
    type: ChartType.Bar,
    axis: [
      {
        label: 'Year',
        source: Milestone.Year,
        position: ChartAxisPosition.Bottom,
        stacked: true,
      },
      {
        label: [
          'Beginning Learner',
          'Developing Learner',
          'Proficient Learner',
          'Distinguished Learner',
        ],
        source: [
          Milestone.ELA0,
          Milestone.ELA1,
          Milestone.ELA2,
          Milestone.ELA3,
        ],
        position: ChartAxisPosition.Left,
        stacked: true,
        stack: 'ELA',
        min: 0,
        max: 100,
      },
      {
        label: [
          'Beginning Learner',
          'Developing Learner',
          'Proficient Learner',
          'Distinguished Learner',
        ],
        source: [
          Milestone.Math0,
          Milestone.Math1,
          Milestone.Math2,
          Milestone.Math3,
        ],
        position: ChartAxisPosition.Right,
        stacked: true,
        stack: 'Math',
        min: 0,
        max: 100,
      },
    ],
  };

  data: Record<string, any>[] = [];

  private dataService = inject(DataService);

  ngOnInit(): void {
    const county = this.county;
    const school = this.school;
    const grade = this.grade;

    this.dataService.Data$.subscribe((data: Record<string, any>[]) => {
      this.data = data.filter(
        (d: Record<string, any>) =>
          d[Milestone.County] === county &&
          d[Milestone.School] === school &&
          d[Milestone.Grade] === grade
      );
    });
  }
}
