import type { Metadata } from "next";

import { OnThisPage } from "@/components/design-system/on-this-page";
import { PageHeader } from "@/components/design-system/page-header";
import { ActivityLogSection } from "@/components/design-system/sections/activity-log-demo";
import { AccessSection } from "@/components/design-system/sections/layout-patterns/access-demo";
import { ActivitySection } from "@/components/design-system/sections/operations/system";

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

export default function AccessPage() {
  return (
    <>
      <PageHeader title="Roles and users" description="Who may do what: roles and their permissions, user accounts, and the activity, alerts and access they leave behind. Which dashboard panels each role sees is set under Reports, Dashboard panels per role." />
      <OnThisPage />
      <AccessSection />
      <ActivitySection />
      <ActivityLogSection />
    </>
  );
}