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/private_html/src/pages/messages/

Upload File : current_dir [ Writeable ] document_root [ Writeable ]

import React from 'react';
import { useRouter } from 'next/router';
import LayoutWithSidebar from '../../components/LayoutWithSidebar';
import { useRequireRole, USER_ROLES } from '../../lib/auth-utils';
import { Mail, ArrowLeft } from 'lucide-react';
import Link from 'next/link';

const mockMessages = [
  {
    id: '1',
    sender: 'Sarah Johnson',
    subject: 'Welcome to the platform!',
    date: '2024-06-28T10:00:00Z',
    body: 'Welcome! We are glad to have you on board. If you have any questions, feel free to reply to this message.'
  },
  {
    id: '2',
    sender: 'Michael Chen',
    subject: 'Case Update: Employment Discrimination',
    date: '2024-06-27T14:30:00Z',
    body: 'Your case is progressing well. The next hearing is scheduled for July 15.'
  },
  {
    id: '3',
    sender: 'Admin',
    subject: 'Your document has been verified',
    date: '2024-06-25T09:00:00Z',
    body: 'Your uploaded document has been verified. Thank you!'
  },
];

const MessageDetailPage: React.FC = () => {
  useRequireRole([
    USER_ROLES.USER,
    USER_ROLES.CLIENT,
    USER_ROLES.ADMIN,
    USER_ROLES.SUPERADMIN,
    USER_ROLES.SUPERADMIN
  ], '/');

  const router = useRouter();
  const { id } = router.query;
  const message = mockMessages.find((msg) => msg.id === id) || mockMessages[0];

  return (
    <LayoutWithSidebar>
      <div className="max-w-2xl mx-auto px-4 py-8">
        <Link href="/messages" className="inline-flex items-center text-primary hover:underline mb-4">
          <ArrowLeft className="h-4 w-4 mr-1" /> Back to Messages
        </Link>
        <div className="bg-white rounded-lg shadow-sm border border-gray-200 p-6">
          <div className="flex items-center mb-4">
            <Mail className="h-8 w-8 text-primary mr-3" />
            <div>
              <h1 className="text-2xl font-bold text-gray-900">{message.subject}</h1>
              <p className="text-gray-600 text-sm">From: {message.sender}</p>
              <p className="text-gray-500 text-xs">{new Date(message.date).toLocaleString()}</p>
            </div>
          </div>
          <div className="text-gray-800 whitespace-pre-line mt-4">
            {message.body}
          </div>
        </div>
      </div>
    </LayoutWithSidebar>
  );
};

export default MessageDetailPage;