import type { Metadata } from "next";

import { OnThisPage } from "@/components/design-system/on-this-page";
import { PageHeader } from "@/components/design-system/page-header";
import { EmployeesListSection } from "@/components/design-system/sections/registers-demo";
import { BonusesSection } from "@/components/design-system/sections/orders-bonuses-demo";
import { LeaveTypesSection } from "@/components/design-system/sections/setup-more-demo";
import { HrPayrollSection } from "@/components/design-system/sections/operations/accounting-demo";

export const metadata: Metadata = { title: "HR and payroll | Medora Design System" };

export default function HrPage() {
  return (
    <>
      <PageHeader title="HR and payroll" description="Employees, leave, time, pay items, loans, commission, salary advances, payroll runs and payslips." />
      <OnThisPage />
      <EmployeesListSection />
      <HrPayrollSection />
      <LeaveTypesSection />
      <BonusesSection />
    </>
  );
}