import { formatJalaliDateTime } from '../utils/date';
import PwaBottomSheet from './PwaBottomSheet';
import { getPwaNotificationMessage, getPwaNotificationTitle } from './pwaNotificationUtils';

export default function PwaNotificationDetailSheet({ notification, onClose, onNavigate }) {
  return (
    <PwaBottomSheet open={Boolean(notification)} title="جزئیات اعلان" onClose={onClose}>
      {notification && (
        <div className="pwa-notification-detail">
          <span>مدیریت پروژه</span>
          <h2>{getPwaNotificationTitle(notification)}</h2>
          <p>{getPwaNotificationMessage(notification)}</p>
          <small>{formatJalaliDateTime(notification.created_at)}</small>
          <button type="button" className="pwa-primary-button" onClick={onNavigate}>رفتن به بخش مربوطه</button>
        </div>
      )}
    </PwaBottomSheet>
  );
}