import React from "react";
import EditStaff, { comboItem } from "./EditStaff";
import EditStaffLoading from "./EditStaffLoading";
import { fetchIndivStaff, fetchStaffInvolvedProjects, fetchStaffSalaryEffectiveInfo, preloadStaff } from "@/app/api/staff";
import { fetchTeamCombo } from "@/app/api/team/actions";
import { fetchDepartmentCombo } from "@/app/api/departments/actions";
import { fetchPositionCombo } from "@/app/api/positions/actions";
import { fetchGradeCombo } from "@/app/api/grades/actions";
import { fetchSkillCombo } from "@/app/api/skill/actions";
import { fetchSalaryCombo } from "@/app/api/salarys/actions";
import { fetchCompanyCombo } from "@/app/api/companys/actions";
import { GradeLogInfo, PositionLogInfo, TeamLogInfo, fetchGradesLog, fetchPositionLog, fetchTeamLog } from "@/app/api/staffInfoHistory";

interface SubComponents {
  Loading: typeof EditStaffLoading;
} 

interface Props {
  id: number
}

export type InfoHistory = {
  gradeLog?: GradeLogInfo[],
  positionLog?: PositionLogInfo[],
  teamLog?: TeamLogInfo[],
}

const EditStaffWrapper: React.FC<Props> & SubComponents = async ({ 
  id
 }) => {
  preloadStaff()
  
  const [
    Staff,
    CompanyCombo,
    TeamCombo,
    DepartmentCombo,
    PositionCombo,
    GradeCombo,
    SkillCombo,
    SalaryCombo,
    SalaryEffectiveInfo,
    InvolvedProject,
    GradeLog,
    PositionLog,
    TeamLog,
  ] = await Promise.all([
    fetchIndivStaff(id),
    fetchCompanyCombo(),
    fetchTeamCombo(),
    fetchDepartmentCombo(),
    fetchPositionCombo(),
    fetchGradeCombo(),
    fetchSkillCombo(),
    fetchSalaryCombo(),
    fetchStaffSalaryEffectiveInfo(id),
    fetchStaffInvolvedProjects(id)??[],
    fetchGradesLog(id),
    fetchPositionLog(id),
    fetchTeamLog(id),
  ]);

  const combos: comboItem = {
    company: CompanyCombo.records,
    team: TeamCombo.records,
    department: DepartmentCombo.records,
    position: PositionCombo.records,
    grade: GradeCombo.records,
    skill: SkillCombo.records,
    salary: SalaryCombo.records,
  }   
  console.log(TeamLog)
  const InfoHistory: InfoHistory = {
    gradeLog: GradeLog,
    positionLog: PositionLog,
    teamLog: TeamLog,
  }

  Staff.data.joinDate = Staff.data.joinDate && dateArrayToString(Staff.data.joinDate) as string
  Staff.data.departDate = Staff.data.departDate && dateArrayToString(Staff.data.departDate) as string

  return <EditStaff 
            Staff={Staff.data} 
            combos={combos} 
            SalaryEffectiveInfo={SalaryEffectiveInfo} 
            InvolvedProject={InvolvedProject} 
            InfoHistory={InfoHistory}
          />;
};

EditStaffWrapper.Loading = EditStaffLoading;

export default EditStaffWrapper;


function dateArrayToString(dateArray: number[] | string): string {
  if (typeof dateArray === 'string'){
    return dateArray
  }
  const [year, month, day] = dateArray;
  console.log(dateArray)
  // Ensure the month is in the correct range (0-11)
  const monthIndex = month;
  
  // Create the date string in the format "YYYY-MM-DD"
  return `${year}-${monthIndex.toString().padStart(2, '0')}-${day.toString().padStart(2, '0')}`;
}