From 1430b24bf49649ac77d1bfdcbb7f8ef30a4e6853 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sat, 7 Mar 2026 02:08:15 +0000
Subject: [PATCH] Add src/app/admin/page.tsx

---
 src/app/admin/page.tsx | 219 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 219 insertions(+)
 create mode 100644 src/app/admin/page.tsx

diff --git a/src/app/admin/page.tsx b/src/app/admin/page.tsx
new file mode 100644
index 0000000..889205d
--- /dev/null
+++ b/src/app/admin/page.tsx
@@ -0,0 +1,219 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
+import HeroLogoBillboardSplit from "@/components/sections/hero/HeroLogoBillboardSplit";
+import FeatureCardTwentyOne from "@/components/sections/feature/FeatureCardTwentyOne";
+import PricingCardFive from "@/components/sections/pricing/PricingCardFive";
+import MetricCardTwo from "@/components/sections/metrics/MetricCardTwo";
+import FaqBase from "@/components/sections/faq/FaqBase";
+import ContactText from "@/components/sections/contact/ContactText";
+import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
+import { Settings, Users, Lock, BarChart3, AlertTriangle, HelpCircle, Shield, Database, Key, Monitor } from "lucide-react";
+
+export default function AdminPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-magnetic"
+      defaultTextAnimation="reveal-blur"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="medium"
+      background="circleGradient"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="normal"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleApple
+          brandName="HealthCare Hub"
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Features", id: "features" },
+            { name: "Appointments", id: "/appointments" },
+            { name: "Patients", id: "/patients" },
+            { name: "Admin", id: "/admin" },
+            { name: "Contact", id: "contact" },
+          ]}
+        />
+      </div>
+
+      <div id="hero" data-section="hero">
+        <HeroLogoBillboardSplit
+          logoText="ADMIN CONTROL"
+          description="Hospital staff management and system configuration dashboard for healthcare administrators and IT personnel. Manage user accounts, configure system settings, monitor security, and oversee institutional operations."
+          background={{ variant: "plain" }}
+          buttons={[
+            { text: "Go to Dashboard", href: "#dashboard" },
+            { text: "View Documentation", href: "#faq" },
+          ]}
+          layoutOrder="default"
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ab61rTDKmrydpiUl7xdk36wxrL/an-illustration-of-multi-level-access-co-1772848851210-f52f6d74.png"
+          imageAlt="Admin control center"
+          frameStyle="browser"
+          mediaAnimation="slide-up"
+        />
+      </div>
+
+      <div id="dashboard" data-section="dashboard">
+        <FeatureCardTwentyOne
+          title="Core Administration Features"
+          description="Comprehensive tools for managing healthcare staff and system operations"
+          tag="Admin Features"
+          tagIcon={Settings}
+          tagAnimation="slide-up"
+          accordionItems={[
+            {
+              id: "1",              title: "Staff & User Management",              content: "Create, modify, and remove user accounts for doctors, nurses, administrators, and IT personnel. Assign role-based access controls (RBAC) with granular permissions. Track user activity and login history. Manage department assignments and supervision hierarchies. Set password policies and enforce multi-factor authentication."},
+            {
+              id: "2",              title: "System Configuration & Settings",              content: "Configure system-wide settings including facility information, working hours, holidays, and operational schedules. Customize alert thresholds and notification preferences. Set data retention policies and backup schedules. Configure email and SMS settings for system notifications. Manage API integrations and third-party connections."},
+            {
+              id: "3",              title: "Security & Compliance",              content: "Enforce HIPAA compliance requirements and audit trails. Manage security policies including password standards, session timeouts, and encryption protocols. Review security logs and suspicious activity reports. Configure IP whitelisting and network security settings. Generate compliance reports for regulatory audits."},
+            {
+              id: "4",              title: "Database & Data Management",              content: "Monitor database performance and optimize queries. Configure automated backup schedules and recovery procedures. Manage data archival and purging policies. Track data usage and storage capacity. Export data in various formats for reporting and analysis."},
+            {
+              id: "5",              title: "Monitoring & Analytics",              content: "Real-time system health monitoring and performance metrics. Track user login patterns and access times. Generate detailed usage reports and analytics. Monitor API usage and integration performance. Set up alerts for system anomalies and failures."},
+            {
+              id: "6",              title: "Support & Maintenance",              content: "Access system logs for troubleshooting and diagnostics. Manage system updates and patches. View support tickets and escalation procedures. Access knowledge base and documentation. Contact technical support for critical issues."},
+          ]}
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ab61rTDKmrydpiUl7xdk36wxrL/a-modern-hospital-patient-management-das-1772848850585-3ec4652a.png"
+          imageAlt="Administration dashboard"
+          mediaAnimation="slide-up"
+          useInvertedBackground={true}
+          mediaPosition="right"
+        />
+      </div>
+
+      <div id="configuration" data-section="configuration">
+        <MetricCardTwo
+          title="Configuration Overview"
+          description="Key metrics for system management and oversight"
+          metrics={[
+            { id: "1", value: "500+", description: "Total Users Managed" },
+            { id: "2", value: "50", description: "Active Departments" },
+            { id: "3", value: "99.9%", description: "System Uptime" },
+            { id: "4", value: "100%", description: "HIPAA Compliance" },
+          ]}
+          gridVariant="uniform-all-items-equal"
+          textboxLayout="default"
+          animationType="slide-up"
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="packages" data-section="packages">
+        <PricingCardFive
+          title="Admin Access Tiers"
+          description="Different permission levels for various administrative roles"
+          tag="User Roles"
+          tagIcon={Users}
+          tagAnimation="slide-up"
+          textboxLayout="default"
+          animationType="slide-up"
+          useInvertedBackground={true}
+          plans={[
+            {
+              id: "basic",              tag: "Department Manager",              tagIcon: Monitor,
+              price: "$0",              period: "/month",              description: "Manage staff within your department and view departmental analytics.",              button: { text: "Assign Role", href: "#contact" },
+              featuresTitle: "Permissions:",              features: [
+                "View department staff",                "Manage schedules",                "View departmental reports",                "Manage local settings"],
+            },
+            {
+              id: "professional",              tag: "System Administrator",              tagIcon: Shield,
+              price: "$0",              period: "/month",              description: "Full system administration including user management and security configuration.",              button: { text: "Assign Role", href: "#contact" },
+              featuresTitle: "Permissions:",              features: [
+                "Manage all users & roles",                "Configure system settings",                "Security & compliance management",                "View all analytics",                "Manage integrations"],
+            },
+            {
+              id: "enterprise",              tag: "Chief Information Officer",              tagIcon: Database,
+              price: "$0",              period: "/month",              description: "Executive-level access with strategic oversight and advanced reporting.",              button: { text: "Assign Role", href: "#contact" },
+              featuresTitle: "Permissions:",              features: [
+                "All System Administrator permissions",                "Strategic analytics & insights",                "Budget and resource planning",                "Vendor management",                "Executive reporting",                "Crisis management protocols"],
+            },
+          ]}
+        />
+      </div>
+
+      <div id="faq" data-section="faq">
+        <FaqBase
+          title="Administration FAQs"
+          description="Common questions about staff management and system configuration"
+          tag="Help & Support"
+          tagIcon={HelpCircle}
+          tagAnimation="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          faqsAnimation="slide-up"
+          faqs={[
+            {
+              id: "1",              title: "How do I create a new staff account?",              content: "Navigate to User Management in the admin panel. Click 'Add New User' and fill in the staff member's information including name, email, department, and role. Select the appropriate permission level (Doctor, Nurse, Administrator, etc.) and send an invitation email. The staff member will receive a secure link to set their password on first login."},
+            {
+              id: "2",              title: "What are the different user roles and permissions?",              content: "HealthCare Hub offers multiple role types: Doctors (clinical access), Nurses (patient care), Administrators (institutional management), IT Staff (system maintenance), and Department Managers (departmental oversight). Each role has customizable permissions that can be adjusted based on your facility's specific needs. Custom roles can also be created for specialized positions."},
+            {
+              id: "3",              title: "How do I reset a staff member's password?",              content: "Go to User Management, search for the staff member, and click the three-dot menu next to their name. Select 'Reset Password' and the system will generate a temporary password or send them a password reset link. The staff member will be prompted to create a new password on their next login. This process is logged for security audit purposes."},
+            {
+              id: "4",              title: "How can I deactivate a user account?",              content: "In the User Management section, find the user account you want to deactivate. Click the menu icon and select 'Deactivate Account'. The account will be disabled but all historical data associated with that user will be preserved for audit and compliance purposes. You can reactivate the account later if needed."},
+            {
+              id: "5",              title: "How do I configure system-wide settings?",              content: "Access the Settings panel from the admin dashboard. Here you can configure facility information, working hours, holidays, alert thresholds, notification preferences, data retention policies, email/SMS settings, and integration parameters. Changes take effect immediately but are logged for audit trails."},
+            {
+              id: "6",              title: "How is HIPAA compliance enforced in the admin panel?",              content: "The system enforces HIPAA compliance through end-to-end encryption, comprehensive audit trails, role-based access controls, automatic session timeouts, multi-factor authentication, and regular security assessments. All administrative actions are logged and can be reviewed in the compliance reports section."},
+            {
+              id: "7",              title: "How do I monitor system performance?",              content: "The System Health dashboard provides real-time monitoring of system performance metrics including CPU usage, memory allocation, database performance, API response times, and user activity. You can set up alerts for performance anomalies and download detailed performance reports."},
+            {
+              id: "8",              title: "How can I export data and generate reports?",              content: "Use the Reports section to generate custom reports on user activity, system performance, security events, or compliance metrics. Reports can be exported in PDF, CSV, or Excel formats. You can schedule automated report generation and delivery to specified email addresses."},
+          ]}
+        />
+      </div>
+
+      <div id="contact" data-section="contact">
+        <ContactText
+          text="Need technical support or have questions about administration? Contact our dedicated support team for assistance with staff management, system configuration, or security concerns."
+          animationType="entrance-slide"
+          buttons={[
+            { text: "Email Support", href: "mailto:admin-support@healthcarehub.com" },
+            { text: "Schedule Call", href: "#" },
+          ]}
+          background={{ variant: "radial-gradient" }}
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterLogoEmphasis
+          logoText="HealthCare Hub"
+          columns={[
+            {
+              items: [
+                { label: "Dashboard", href: "/" },
+                { label: "Admin Panel", href: "/admin" },
+                { label: "Documentation", href: "#" },
+              ],
+            },
+            {
+              items: [
+                { label: "About Us", href: "/" },
+                { label: "Contact Support", href: "#contact" },
+                { label: "Support Portal", href: "#" },
+              ],
+            },
+            {
+              items: [
+                { label: "Privacy Policy", href: "#" },
+                { label: "Terms of Service", href: "#" },
+                { label: "Security", href: "#" },
+              ],
+            },
+            {
+              items: [
+                { label: "Twitter", href: "https://twitter.com" },
+                { label: "LinkedIn", href: "https://linkedin.com" },
+                { label: "Facebook", href: "https://facebook.com" },
+              ],
+            },
+          ]}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}