tsms/src/components/EditStaff/EditStaffWrapper.tsx

import React from "react";
import EditStaff, { comboItem } from "./EditStaff";
import EditStaffLoading from "./EditStaffLoading";
import { StaffResult, fetchIndivStaff, fetchStaff, fetchTeamLeads, preloadStaff } from "@/app/api/staff";
import { useSearchParams } from "next/navigation";
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";

interface SubComponents {
  Loading: typeof EditStaffLoading;
} 

interface Props {
  id: number
}

const EditStaffWrapper: React.FC<Props> & SubComponents = async ({ 
  id
 }) => {
  preloadStaff()
  const [
    Staff,
    CompanyCombo,
    TeamCombo,
    DepartmentCombo,
    PositionCombo,
    GradeCombo,
    SkillCombo,
    SalaryCombo,
  ] = await Promise.all([
    fetchIndivStaff(id),
    fetchCompanyCombo(),
    fetchTeamCombo(),
    fetchDepartmentCombo(),
    fetchPositionCombo(),
    fetchGradeCombo(),
    fetchSkillCombo(),
    fetchSalaryCombo(),
  ]);
  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(Staff.data)

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

EditStaffWrapper.Loading = EditStaffLoading;

export default EditStaffWrapper;