"use client";

import { useParams } from "next/navigation";
import UserManagement from "../users_management/page";
import ServiceManagement from "@/app/admindashboard/services_management/page";
import ApiManagement from "../api_management/page";
import AccountSettings from "@/app/components/settings";
import PaymentManagement from "../payment_management/page";
import { Typography } from "@mui/material";

export default function DashboardSection() {
  const { section } = useParams<{ section: string }>();

  const renderContent = () => {
    switch (section) {
      case "users management":
        return <UserManagement />;
      case "services management":
        return <ServiceManagement />;
      case "apis management":
        return <ApiManagement />;
      case "payment management":
        return <PaymentManagement />;
      case "transaction":
        return "Transaction";
      case "notifications":
        return "Notifications";
      case "settings":
        return <AccountSettings />;
      default:
        return <Typography variant="h5">Section Not Found</Typography>;
    }
  };

  return <>{renderContent()}</>;
}
