优化Java通知类代码

import React from 'react';

const App = () => {
  return (
    <div className="min-h-screen bg-gray-100 p-8">
      <header className="bg-blue-500 text-white p-4 rounded-lg shadow-md">
        <h1 className="text-3xl font-bold">Notification Dashboard</h1>
      </header>
      <main className="mt-8 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
        <NotificationCard
          title="New Event Alert"
          description="A new event has been triggered in the system."
          timestamp="2025-10-01 14:30"
        />
        <NotificationCard
          title="System Update"
          description="The system will be updated tonight at 2 AM."
          timestamp="2025-10-01 12:45"
        />
        <NotificationCard
          title="Security Alert"
          description="Unauthorized access detected in the server."
          timestamp="2025-10-01 10:15"
        />
        <NotificationCard
          title="Maintenance Reminder"
          description="Scheduled maintenance will start in 1 hour."
          timestamp="2025-10-01 08:00"
        />
        <NotificationCard
          title="New Message"
          description="You have received a new message from admin."
          timestamp="2025-10-01 07:20"
        />
        <NotificationCard
          title="Data Backup Completed"
          description="Nightly data backup has been successfully completed."
          timestamp="2025-10-01 06:00"
        />
      </main>
      <footer className="mt-8 text-center text-gray-600">
        © 2025 Notification System. All rights reserved.
      </footer>
    </div>
  );
};

const NotificationCard = ({ title, description, timestamp }) => (
  <div className="bg-white p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300">
    <h2 className="text-xl font-semibold mb-2">{title}</h2>
    <p className="text-gray-700 mb-4">{description}</p>
    <p className="text-sm text-gray-500">{timestamp}</p>
  </div>
);

export default App;