feat: add detail notification page and update notification links

This commit is contained in:
2025-11-20 16:41:21 +07:00
parent 2d0c28bc48
commit 73b5cd6e97
3 changed files with 261 additions and 21 deletions

View File

@@ -34,10 +34,10 @@ import {
PlusOutlined,
ExclamationCircleOutlined,
} from '@ant-design/icons';
import { useNavigate } from 'react-router-dom';
import { useNavigate, Link as RouterLink } from 'react-router-dom';
import { getAllNotification } from '../../../api/notification';
const { Text, Paragraph, Link } = Typography;
const { Text, Paragraph, Link: AntdLink } = Typography;
// Transform API response to component format
const transformNotificationData = (apiData) => {
@@ -57,7 +57,7 @@ const transformNotificationData = (apiData) => {
}) + ' WIB',
location: item.device_location || 'Location not specified',
details: item.message_error_issue || 'No details available',
link: '#', // Will be updated when API provides link
link: `/verification/spare-part/${item.notification_error_id}`, // Dummy URL untuk verifikasi spare part
subsection: item.solution_name || 'N/A',
isRead: item.is_read,
status: item.is_read ? 'Resolved' : item.is_delivered ? 'Delivered' : 'Pending',
@@ -333,9 +333,9 @@ const ListNotification = memo(function ListNotification(props) {
</Space>
<Space>
<LinkOutlined />
<Link href={notification.link} target="_blank">
<AntdLink href={notification.link} target="_blank">
{notification.link}
</Link>
</AntdLink>
<Button
type="link"
icon={<SendOutlined />}
@@ -380,22 +380,22 @@ const ListNotification = memo(function ListNotification(props) {
setModalContent('user');
}}
/>
<Button
type="text"
icon={
<EyeOutlined style={{ color: '#1890ff' }} />
}
title="Details"
style={{
border: '1px solid #1890ff',
borderRadius: '4px',
}}
onClick={(e) => {
e.stopPropagation();
setModalContent('details');
setSelectedNotification(notification);
}}
/>
<RouterLink
to={`/detail-notification/${notification.id.split('-')[1]}`}
target="_blank"
rel="noopener noreferrer"
onClick={(e) => e.stopPropagation()}
>
<Button
type="text"
icon={<EyeOutlined style={{ color: '#1890ff' }} />}
title="Details"
style={{
border: '1px solid #1890ff',
borderRadius: '4px',
}}
/>
</RouterLink>
<Button
type="text"
icon={