Welcome to Our Orthopaedic Surgery Clinic

Your health and mobility are our priority.

About Us

We are a team of experienced orthopaedic surgeons dedicated to providing top-quality care for all your musculoskeletal needs.

Our Services

Joint Replacement
Sports Medicine
Pediatric Orthopaedics
Trauma Surgery

Specialties

We specialize in various orthopaedic conditions including, but not limited to:

Arthritis
Fractures
Tendon Injuries
Spinal Disorders

Contact Us

import React, { useState } from 'react'; import { LayoutDashboard, ClipboardList, Package, Users, PlusCircle, Activity, LogOut } from 'lucide-react'; // --- Types --- type Procedure = 'UKR' | 'TKR' | 'THR' | 'RSA' | 'Other'; type Role = 'Observed' | 'Assisted' | 'Supervised' | 'Independent'; interface CaseLog { id: string; patientName: string; date: string; role: Role; procedure: Procedure; type: 'Primary' | 'Revision'; notes: string; } // --- Mock Data --- const MOCK_CASES: CaseLog[] = [ { id: '1', patientName: 'John Doe', date: '2024-05-10', role: 'Independent', procedure: 'TKR', type: 'Primary', notes: 'Successful cementless fixation.' }, { id: '2', patientName: 'Jane Smith', date: '2024-05-12', role: 'Supervised', procedure: 'THR', type: 'Revision', notes: 'Handled acetabular bone loss.' }, ]; export default function SurgeonPortal() { const [view, setView] = useState<'dashboard' | 'logging' | 'inventory'>('dashboard'); const [cases, setCases] = useState(MOCK_CASES); return (

{/* Sidebar Navigation */} {/* Main Content Area */}

{view === 'dashboard' && } {view === 'logging' && { setCases([newCase, ...cases]); setView('dashboard'); }} />}

); } // --- Components --- function NavItem({ icon, label, active, onClick }: { icon: any, label: string, active: boolean, onClick: () => void }) { return ( ); } function Dashboard({ cases }: { cases: CaseLog[] }) { return (

Practice Analytics

Overview of surgical outcomes and volume

{/* KPI Cards */}

{/* Recent Cases Table */}

Recent Surgical Logs

{cases.map((c) => ( ))}

Patient	Procedure	Role	Type	Date
{c.patientName}	{c.procedure}	{c.role}	{c.type}	{c.date}

); } function CaseLoggingForm({ onSave }: { onSave: (c: CaseLog) => void }) { const [formData, setFormData] = useState>({ procedure: 'TKR', role: 'Independent', type: 'Primary' }); return (

Log New Surgery

Patient Name setFormData({...formData, patientName: e.target.value})} />

Procedure

Role

Clinical Notes

setFormData({...formData, notes: e.target.value})} />
        </div>
      </div>
      <button 
        onClick={() => onSave({ ...formData, id: Date.now().toString(), date: new Date().toISOString().split('T')[0] } as CaseLog)}
        className="mt-6 w-full bg-blue-600 text-white py-3 rounded-xl font-bold hover:bg-blue-700 transition"
      >
        Save Case to Registry
      </button>
    </div>
  );
}

function StatCard({ title, value, color }: { title: string, value: string, color: string }) {
  return (
    <div className={`bg-white p-6 rounded-xl border-l-4 shadow-sm ${color}`}>
      <div className="text-sm text-slate-500 uppercase font-semibold">{title}</div>
      <div className="text-3xl font-bold mt-1 text-slate-800">{value}</div>
    </div>
  );
}
    <footer>
        <p>© 2026 Orthopaedic Surgery Clinic. All Rights Reserved.</p>
        <p><i>Medical Disclaimer: This website is intended for informational purposes only and should not be used as a substitute for professional medical advice.</i></p>
    </footer>
</body>
</html>