 Server : Apache/2 System : Linux server-15-235-50-60 5.15.0-164-generic #174-Ubuntu SMP Fri Nov 14 20:25:16 UTC 2025 x86_64 User : gositeme ( 1004) PHP Version : 8.2.29 Disable Function : exec,system,passthru,shell_exec,proc_close,proc_open,dl,popen,show_source,posix_kill,posix_mkfifo,posix_getpwuid,posix_setpgid,posix_setsid,posix_setuid,posix_setgid,posix_seteuid,posix_setegid,posix_uname Directory : /home/gositeme/domains/lavocat.ca/public_html/src/pages/ |
import React from 'react';
import Head from 'next/head';
import { motion } from 'framer-motion';
import {
Scale,
Users,
Search,
Award,
Heart,
Briefcase,
FileText,
Shield,
GraduationCap,
Building,
UserCheck,
Clock,
Star,
TrendingUp,
Globe,
BookOpen,
PenTool,
Gavel,
Users2,
Settings
} from 'lucide-react';
import LayoutWithSidebar from '@/components/LayoutWithSidebar';
interface RoleInfo {
id: string;
title: string;
description: string;
icon: React.ComponentType<any>;
color: string;
category: string;
responsibilities: string[];
requirements: string[];
benefits: string[];
hierarchy: number;
}
const JusticeRoles: React.FC = () => {
const roles: RoleInfo[] = [
// Judicial Branch
{
id: 'judge',
title: 'Judge',
description: 'Presides over court proceedings, makes legal decisions, and ensures justice is served',
icon: Gavel,
color: 'from-indigo-500 to-indigo-600',
category: 'Judicial',
responsibilities: [
'Preside over court proceedings',
'Make legal decisions and rulings',
'Ensure fair and impartial trials',
'Manage court administration',
'Interpret and apply laws'
],
requirements: [
'Law degree and bar admission',
'Extensive legal experience',
'Judicial appointment or election',
'Strong ethical standards',
'Excellent decision-making skills'
],
benefits: [
'Highest level of judicial authority',
'Comprehensive court oversight',
'Advanced legal research tools',
'Case management systems',
'Judicial analytics dashboard'
],
hierarchy: 95
},
{
id: 'court-clerk',
title: 'Court Clerk',
description: 'Manages court records, administrative functions, and supports judicial operations',
icon: FileText,
color: 'from-violet-500 to-violet-600',
category: 'Judicial',
responsibilities: [
'Manage court records and files',
'Process legal documents',
'Coordinate court schedules',
'Support judicial staff',
'Maintain court databases'
],
requirements: [
'Administrative experience',
'Knowledge of court procedures',
'Attention to detail',
'Strong organizational skills',
'Legal document processing'
],
benefits: [
'Court administration tools',
'Document management systems',
'Scheduling coordination',
'Record keeping automation',
'Judicial support access'
],
hierarchy: 35
},
// Legal Practice
{
id: 'lawyer',
title: 'Lawyer',
description: 'Provides legal representation, counsel, and advocacy for clients',
icon: Scale,
color: 'from-blue-500 to-blue-600',
category: 'Legal Practice',
responsibilities: [
'Provide legal representation',
'Advise clients on legal matters',
'Prepare legal documents',
'Represent clients in court',
'Negotiate settlements'
],
requirements: [
'Law degree (JD/LLB)',
'Bar admission',
'Legal practice experience',
'Strong analytical skills',
'Excellent communication'
],
benefits: [
'Case management tools',
'Client portal access',
'Document automation',
'Legal research databases',
'Analytics and reporting'
],
hierarchy: 90
},
{
id: 'jurist',
title: 'Jurist',
description: 'Contributes to legal scholarship, theory, and jurisprudence development',
icon: BookOpen,
color: 'from-emerald-500 to-emerald-600',
category: 'Legal Practice',
responsibilities: [
'Conduct legal research',
'Develop legal theories',
'Write scholarly publications',
'Contribute to jurisprudence',
'Academic collaboration'
],
requirements: [
'Advanced legal education',
'Research experience',
'Academic credentials',
'Theoretical knowledge',
'Publication record'
],
benefits: [
'Legal research tools',
'Scholarly publication platform',
'Theory development resources',
'Academic collaboration network',
'Research analytics'
],
hierarchy: 88
},
{
id: 'paralegal',
title: 'Paralegal',
description: 'Supports lawyers with legal research, document preparation, and case management',
icon: FileText,
color: 'from-orange-500 to-orange-600',
category: 'Legal Practice',
responsibilities: [
'Conduct legal research',
'Prepare legal documents',
'Organize case files',
'Assist with trial preparation',
'Manage client communications'
],
requirements: [
'Paralegal certification',
'Legal research skills',
'Document preparation experience',
'Attention to detail',
'Strong organizational skills'
],
benefits: [
'Legal research tools',
'Document templates',
'Case management systems',
'Team collaboration tools',
'Professional development'
],
hierarchy: 40
},
// Alternative Dispute Resolution
{
id: 'mediator',
title: 'Mediator',
description: 'Facilitates dispute resolution through neutral mediation services',
icon: Heart,
color: 'from-emerald-500 to-emerald-600',
category: 'ADR',
responsibilities: [
'Facilitate dispute resolution',
'Guide settlement negotiations',
'Maintain neutrality',
'Document agreements',
'Provide conflict resolution'
],
requirements: [
'Mediation certification',
'Conflict resolution training',
'Neutrality and impartiality',
'Strong communication skills',
'Understanding of legal processes'
],
benefits: [
'Mediation tools and templates',
'Settlement tracking systems',
'Conflict resolution resources',
'Case management platform',
'Professional network access'
],
hierarchy: 85
},
// Specialized Services
{
id: 'legal-consultant',
title: 'Legal Consultant',
description: 'Provides expert legal advice and strategic consulting services',
icon: Briefcase,
color: 'from-cyan-500 to-cyan-600',
category: 'Specialized',
responsibilities: [
'Provide legal consulting',
'Strategic legal planning',
'Expert legal advice',
'Risk assessment',
'Compliance guidance'
],
requirements: [
'Advanced legal expertise',
'Consulting experience',
'Specialized knowledge areas',
'Strategic thinking skills',
'Business acumen'
],
benefits: [
'Consulting tools and templates',
'Expert network access',
'Strategic planning resources',
'Client advisory systems',
'Professional development'
],
hierarchy: 80
},
{
id: 'investigator',
title: 'Investigator',
description: 'Conducts legal investigations and gathers evidence for cases',
icon: Search,
color: 'from-orange-500 to-orange-600',
category: 'Specialized',
responsibilities: [
'Conduct legal investigations',
'Gather evidence',
'Interview witnesses',
'Prepare investigation reports',
'Support legal proceedings'
],
requirements: [
'Investigation experience',
'Evidence collection skills',
'Interview techniques',
'Report writing abilities',
'Legal knowledge'
],
benefits: [
'Investigation tools',
'Evidence tracking systems',
'Case research databases',
'Report generation tools',
'Professional training'
],
hierarchy: 75
},
{
id: 'expert-witness',
title: 'Expert Witness',
description: 'Provides specialized expertise and testimony for legal cases',
icon: Award,
color: 'from-pink-500 to-pink-600',
category: 'Specialized',
responsibilities: [
'Provide expert testimony',
'Analyze technical evidence',
'Prepare expert reports',
'Support legal teams',
'Maintain credibility'
],
requirements: [
'Specialized expertise',
'Professional credentials',
'Testimony experience',
'Strong communication skills',
'Credibility and reputation'
],
benefits: [
'Expert testimony tools',
'Credential verification',
'Case collaboration access',
'Professional network',
'Continuing education'
],
hierarchy: 70
},
{
id: 'notary',
title: 'Notary Public',
description: 'Provides notarial services and document authentication',
icon: PenTool,
color: 'from-brown-500 to-brown-600',
category: 'Specialized',
responsibilities: [
'Authenticate documents',
'Administer oaths',
'Witness signatures',
'Maintain notarial records',
'Verify identities'
],
requirements: [
'Notary commission',
'Identity verification training',
'Document authentication skills',
'Record keeping abilities',
'Ethical standards'
],
benefits: [
'Notarial tools and templates',
'Document authentication systems',
'Record keeping automation',
'Client verification tools',
'Professional support'
],
hierarchy: 15
},
// Support Staff
{
id: 'secretary',
title: 'Legal Secretary',
description: 'Manages legal office operations and administrative tasks',
icon: FileText,
color: 'from-green-500 to-green-600',
category: 'Support',
responsibilities: [
'Manage office operations',
'Process legal documents',
'Coordinate schedules',
'Handle communications',
'Maintain filing systems'
],
requirements: [
'Administrative experience',
'Legal document knowledge',
'Organizational skills',
'Communication abilities',
'Technology proficiency'
],
benefits: [
'Office management tools',
'Document processing systems',
'Calendar management',
'Communication platforms',
'Professional development'
],
hierarchy: 50
},
{
id: 'assistant',
title: 'Legal Assistant',
description: 'Streamlines administrative tasks and supports legal operations',
icon: UserCheck,
color: 'from-teal-500 to-teal-600',
category: 'Support',
responsibilities: [
'Streamline administrative tasks',
'Support legal operations',
'Manage communications',
'Coordinate activities',
'Maintain records'
],
requirements: [
'Administrative skills',
'Legal environment experience',
'Technology proficiency',
'Communication skills',
'Organizational abilities'
],
benefits: [
'Task management tools',
'Communication platforms',
'Calendar integration',
'Reporting systems',
'Professional growth'
],
hierarchy: 30
},
{
id: 'clerk',
title: 'Law Clerk',
description: 'Supports legal research and case preparation for attorneys',
icon: BookOpen,
color: 'from-amber-500 to-amber-600',
category: 'Support',
responsibilities: [
'Conduct legal research',
'Prepare case materials',
'Review legal documents',
'Assist with court proceedings',
'Support attorneys'
],
requirements: [
'Legal research skills',
'Document review experience',
'Analytical thinking',
'Attention to detail',
'Legal knowledge'
],
benefits: [
'Legal research databases',
'Document review tools',
'Case preparation systems',
'Professional mentorship',
'Skill development'
],
hierarchy: 40
},
// Education & Training
{
id: 'law-student',
title: 'Law Student',
description: 'Gains legal education and practical experience in legal practice',
icon: GraduationCap,
color: 'from-blue-500 to-blue-600',
category: 'Education',
responsibilities: [
'Complete legal education',
'Gain practical experience',
'Participate in legal research',
'Develop legal skills',
'Network with professionals'
],
requirements: [
'Enrollment in law school',
'Academic performance',
'Interest in legal practice',
'Professional development',
'Mentorship participation'
],
benefits: [
'Educational resources',
'Mentorship programs',
'Practical experience opportunities',
'Professional networking',
'Skill development tools'
],
hierarchy: 25
},
{
id: 'legal-intern',
title: 'Legal Intern',
description: 'Gains hands-on experience in legal practice and case management',
icon: Clock,
color: 'from-gray-500 to-gray-600',
category: 'Education',
responsibilities: [
'Gain practical training',
'Assist with legal work',
'Learn case management',
'Develop professional skills',
'Contribute to legal teams'
],
requirements: [
'Legal education background',
'Internship placement',
'Professional attitude',
'Learning orientation',
'Team collaboration'
],
benefits: [
'Practical training programs',
'Case exposure opportunities',
'Mentorship relationships',
'Skill development',
'Professional networking'
],
hierarchy: 20
},
// Administration
{
id: 'admin',
title: 'Administrator',
description: 'Manages platform operations, users, and system administration',
icon: Settings,
color: 'from-purple-500 to-purple-600',
category: 'Administration',
responsibilities: [
'Manage platform operations',
'Oversee user management',
'Monitor system performance',
'Ensure security compliance',
'Coordinate legal teams'
],
requirements: [
'Administrative experience',
'System management skills',
'Legal environment knowledge',
'Leadership abilities',
'Technology proficiency'
],
benefits: [
'System administration tools',
'User management platforms',
'Analytics and reporting',
'Security controls',
'Professional development'
],
hierarchy: 100
},
{
id: 'super-admin',
title: 'System Administrator',
description: 'Oversees entire platform operations and strategic direction',
icon: Shield,
color: 'from-red-500 to-red-600',
category: 'Administration',
responsibilities: [
'Oversee platform strategy',
'Manage system architecture',
'Ensure platform security',
'Coordinate all operations',
'Drive platform development'
],
requirements: [
'Advanced technical skills',
'Strategic leadership',
'System architecture knowledge',
'Security expertise',
'Legal platform understanding'
],
benefits: [
'Full system access',
'Strategic planning tools',
'Advanced analytics',
'Development resources',
'Executive oversight'
],
hierarchy: 999
}
];
const categories = ['Judicial', 'Legal Practice', 'ADR', 'Specialized', 'Support', 'Education', 'Administration'];
return (
<LayoutWithSidebar>
<Head>
<title>Justice Field Roles - Legal Platform</title>
<meta name="description" content="Comprehensive overview of all roles in the legal justice ecosystem" />
</Head>
<div className="min-h-screen bg-gradient-to-br from-blue-50 to-indigo-100">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
{/* Header */}
<motion.div
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.6 }}
className="text-center mb-12"
>
<h1 className="text-4xl font-bold text-gray-900 mb-4">
Justice Field Roles
</h1>
<p className="text-xl text-gray-600 max-w-3xl mx-auto">
Discover your place in our comprehensive legal ecosystem. From judicial officers to support staff,
every role plays a vital part in delivering justice and legal services.
</p>
</motion.div>
{/* Role Categories */}
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6 mb-12">
{categories.map((category, index) => (
<motion.div
key={category}
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.6, delay: index * 0.1 }}
className="bg-white rounded-lg shadow-md p-6 hover:shadow-lg transition-shadow"
>
<h3 className="text-lg font-semibold text-gray-900 mb-2">{category}</h3>
<p className="text-sm text-gray-600">
{roles.filter(role => role.category === category).length} roles
</p>
</motion.div>
))}
</div>
{/* Roles Grid */}
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
{roles.map((role, index) => (
<motion.div
key={role.id}
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.6, delay: index * 0.05 }}
className="bg-white rounded-xl shadow-lg overflow-hidden hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1"
>
{/* Role Header */}
<div className={`bg-gradient-to-r ${role.color} p-6 text-white`}>
<div className="flex items-center justify-between">
<div className="flex items-center space-x-3">
<role.icon className="w-8 h-8" />
<div>
<h3 className="text-xl font-bold">{role.title}</h3>
<p className="text-sm opacity-90">{role.category}</p>
</div>
</div>
<div className="text-right">
<div className="text-sm opacity-90">Level</div>
<div className="text-2xl font-bold">{role.hierarchy}</div>
</div>
</div>
</div>
{/* Role Content */}
<div className="p-6">
<p className="text-gray-600 mb-6">{role.description}</p>
{/* Responsibilities */}
<div className="mb-6">
<h4 className="font-semibold text-gray-900 mb-3 flex items-center">
<Star className="w-4 h-4 mr-2 text-yellow-500" />
Key Responsibilities
</h4>
<ul className="space-y-2">
{role.responsibilities.map((resp, idx) => (
<li key={idx} className="text-sm text-gray-600 flex items-start">
<span className="w-1.5 h-1.5 bg-blue-500 rounded-full mt-2 mr-2 flex-shrink-0"></span>
{resp}
</li>
))}
</ul>
</div>
{/* Requirements */}
<div className="mb-6">
<h4 className="font-semibold text-gray-900 mb-3 flex items-center">
<UserCheck className="w-4 h-4 mr-2 text-green-500" />
Requirements
</h4>
<ul className="space-y-2">
{role.requirements.map((req, idx) => (
<li key={idx} className="text-sm text-gray-600 flex items-start">
<span className="w-1.5 h-1.5 bg-green-500 rounded-full mt-2 mr-2 flex-shrink-0"></span>
{req}
</li>
))}
</ul>
</div>
{/* Benefits */}
<div className="mb-6">
<h4 className="font-semibold text-gray-900 mb-3 flex items-center">
<TrendingUp className="w-4 h-4 mr-2 text-purple-500" />
Platform Benefits
</h4>
<ul className="space-y-2">
{role.benefits.map((benefit, idx) => (
<li key={idx} className="text-sm text-gray-600 flex items-start">
<span className="w-1.5 h-1.5 bg-purple-500 rounded-full mt-2 mr-2 flex-shrink-0"></span>
{benefit}
</li>
))}
</ul>
</div>
{/* Join Button */}
<div className="pt-4 border-t border-gray-200">
<button className="w-full bg-gradient-to-r from-blue-500 to-blue-600 text-white py-2 px-4 rounded-lg hover:from-blue-600 hover:to-blue-700 transition-all duration-200 font-medium">
Join as {role.title}
</button>
</div>
</div>
</motion.div>
))}
</div>
{/* Call to Action */}
<motion.div
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.6, delay: 0.8 }}
className="text-center mt-16 bg-white rounded-xl shadow-lg p-8"
>
<h2 className="text-3xl font-bold text-gray-900 mb-4">
Ready to Join Our Legal Ecosystem?
</h2>
<p className="text-lg text-gray-600 mb-6 max-w-2xl mx-auto">
Whether you're an experienced legal professional or just starting your journey,
there's a place for you in our comprehensive justice platform.
</p>
<div className="flex flex-col sm:flex-row gap-4 justify-center">
<button className="bg-gradient-to-r from-blue-500 to-blue-600 text-white py-3 px-8 rounded-lg hover:from-blue-600 hover:to-blue-700 transition-all duration-200 font-medium">
Join Our Platform
</button>
<button className="bg-gradient-to-r from-gray-500 to-gray-600 text-white py-3 px-8 rounded-lg hover:from-gray-600 hover:to-gray-700 transition-all duration-200 font-medium">
Learn More
</button>
</div>
</motion.div>
</div>
</div>
</LayoutWithSidebar>
);
};
export default JusticeRoles;