From ec094b8f55e2a24ed514ac6c17687d9c9a3ea97b Mon Sep 17 00:00:00 2001
From: zain94rif <zainul94rifin@gmail.com>
Date: Mon, 5 Jan 2026 09:38:27 +0700
Subject: [PATCH] fix(text): change 'User History' to 'History User'

---
 .../component/ListNotification.jsx            |  8 +--
 .../component/UserHistoryModal.jsx            | 30 +++++++++--
 src/pages/notification/detail/UserHistory.jsx | 54 +++++++++++++++----
 3 files changed, 74 insertions(+), 18 deletions(-)

diff --git a/src/pages/notification/component/ListNotification.jsx b/src/pages/notification/component/ListNotification.jsx
index 9889007..ba3c8eb 100644
--- a/src/pages/notification/component/ListNotification.jsx
+++ b/src/pages/notification/component/ListNotification.jsx
@@ -646,7 +646,7 @@ const ListNotification = memo(function ListNotification(props) {
                         padding: '0 16px',
                         position: 'relative',
                         border: '1px solid #f0f0f0',
-                        borderRadius: '4px'
+                        borderRadius: '4px',
                     }}
                 >
                     <div style={{ position: 'relative' }}>
@@ -708,7 +708,9 @@ const ListNotification = memo(function ListNotification(props) {
                                                         </Text>
                                                     </Space>
                                                     <div>
-                                                        <Text strong>Added by: {log.addedBy.name}</Text>
+                                                        <Text strong>
+                                                            Added by: {log.addedBy.name}
+                                                        </Text>
                                                         <span
                                                             style={{
                                                                 marginLeft: '8px',
@@ -1412,7 +1414,7 @@ const ListNotification = memo(function ListNotification(props) {
                             </div>
                         ) : (
                             <Typography.Title level={4} style={{ margin: 0 }}>
-                                {modalContent === 'user' && 'User History Notification'}
+                                {modalContent === 'user' && 'History User Notification'}
                                 {modalContent === 'log' && 'Log History Notification'}
                             </Typography.Title>
                         )}
diff --git a/src/pages/notification/component/UserHistoryModal.jsx b/src/pages/notification/component/UserHistoryModal.jsx
index 9cf832e..e6c0727 100644
--- a/src/pages/notification/component/UserHistoryModal.jsx
+++ b/src/pages/notification/component/UserHistoryModal.jsx
@@ -1,6 +1,12 @@
 import React from 'react';
 import { Modal, Typography, Card, Row, Col, Avatar, Tag, Button, Space } from 'antd';
-import { UserOutlined, PhoneOutlined, CheckCircleOutlined, SyncOutlined, SendOutlined } from '@ant-design/icons';
+import {
+    UserOutlined,
+    PhoneOutlined,
+    CheckCircleOutlined,
+    SyncOutlined,
+    SendOutlined,
+} from '@ant-design/icons';
 
 const { Text } = Typography;
 
@@ -41,9 +47,17 @@ const UserHistoryModal = ({ visible, onCancel, notificationData }) => {
     const getStatusTag = (status) => {
         switch (status) {
             case 'delivered':
-                return <Tag icon={<CheckCircleOutlined />} color="success">Delivered</Tag>;
+                return (
+                    <Tag icon={<CheckCircleOutlined />} color="success">
+                        Delivered
+                    </Tag>
+                );
             case 'sent':
-                return <Tag icon={<SyncOutlined spin />} color="processing">Sent</Tag>;
+                return (
+                    <Tag icon={<SyncOutlined spin />} color="processing">
+                        Sent
+                    </Tag>
+                );
             case 'failed':
                 return <Tag color="error">Failed</Tag>;
             default:
@@ -55,7 +69,7 @@ const UserHistoryModal = ({ visible, onCancel, notificationData }) => {
         <Modal
             title={
                 <Text strong style={{ fontSize: '18px' }}>
-                    User History Notification
+                    History User Notification
                 </Text>
             }
             open={visible}
@@ -78,7 +92,13 @@ const UserHistoryModal = ({ visible, onCancel, notificationData }) => {
                                         <Avatar size="large" icon={<UserOutlined />} />
                                         <div>
                                             <Text strong>{user.name}</Text>
-                                            <div style={{ display: 'flex', alignItems: 'center', gap: '4px' }}>
+                                            <div
+                                                style={{
+                                                    display: 'flex',
+                                                    alignItems: 'center',
+                                                    gap: '4px',
+                                                }}
+                                            >
                                                 <PhoneOutlined style={{ color: '#8c8c8c' }} />
                                                 <Text type="secondary">{user.phone}</Text>
                                             </div>
diff --git a/src/pages/notification/detail/UserHistory.jsx b/src/pages/notification/detail/UserHistory.jsx
index 9ec87bb..8170ee5 100644
--- a/src/pages/notification/detail/UserHistory.jsx
+++ b/src/pages/notification/detail/UserHistory.jsx
@@ -1,14 +1,37 @@
 import React from 'react';
 import { Button, Row, Col, Card, Badge, Typography, Space, Divider } from 'antd';
-import { SendOutlined, MobileOutlined, CheckCircleFilled, ArrowLeftOutlined } from '@ant-design/icons';
+import {
+    SendOutlined,
+    MobileOutlined,
+    CheckCircleFilled,
+    ArrowLeftOutlined,
+} from '@ant-design/icons';
 
 const { Text } = Typography;
 
 // Dummy data for user history
 const userHistoryData = [
-    { id: 1, name: 'John Doe', phone: '081234567890', status: 'Delivered', timestamp: '04-11-2025 11:40 WIB' },
-    { id: 2, name: 'Jane Smith', phone: '087654321098', status: 'Delivered', timestamp: '04-11-2025 11:41 WIB' },
-    { id: 3, name: 'Peter Jones', phone: '082345678901', status: 'Delivered', timestamp: '04-11-2025 11:42 WIB' },
+    {
+        id: 1,
+        name: 'John Doe',
+        phone: '081234567890',
+        status: 'Delivered',
+        timestamp: '04-11-2025 11:40 WIB',
+    },
+    {
+        id: 2,
+        name: 'Jane Smith',
+        phone: '087654321098',
+        status: 'Delivered',
+        timestamp: '04-11-2025 11:41 WIB',
+    },
+    {
+        id: 3,
+        name: 'Peter Jones',
+        phone: '082345678901',
+        status: 'Delivered',
+        timestamp: '04-11-2025 11:42 WIB',
+    },
 ];
 
 const UserHistory = ({ notification, onBack }) => {
@@ -18,7 +41,9 @@ const UserHistory = ({ notification, onBack }) => {
                 <Col>
                     <Space align="center">
                         <Button type="text" icon={<ArrowLeftOutlined />} onClick={onBack} />
-                        <Typography.Title level={4} style={{ margin: 0 }}>User History Notification</Typography.Title>
+                        <Typography.Title level={4} style={{ margin: 0 }}>
+                            History User Notification
+                        </Typography.Title>
                     </Space>
                     <Text type="secondary" style={{ marginLeft: '40px' }}>
                         {notification.title} - {notification.issue}
@@ -27,25 +52,34 @@ const UserHistory = ({ notification, onBack }) => {
             </Row>
 
             <Space direction="vertical" size="middle" style={{ display: 'flex' }}>
-                {userHistoryData.map(user => (
-                    <Card key={user.id} style={{ backgroundColor: '#e6f7ff', borderColor: '#91d5ff' }}>
+                {userHistoryData.map((user) => (
+                    <Card
+                        key={user.id}
+                        style={{ backgroundColor: '#e6f7ff', borderColor: '#91d5ff' }}
+                    >
                         <Row align="middle" justify="space-between">
                             <Col>
                                 <Space align="center">
                                     <Text strong>{user.name}</Text>
                                     <Text>|</Text>
-                                    <Text><MobileOutlined /> {user.phone}</Text>
+                                    <Text>
+                                        <MobileOutlined /> {user.phone}
+                                    </Text>
                                     <Text>|</Text>
                                     <Badge status="success" text={user.status} />
                                 </Space>
                                 <Divider style={{ margin: '8px 0' }} />
                                 <Space align="center">
                                     <CheckCircleFilled style={{ color: '#52c41a' }} />
-                                    <Text type="secondary">Success Delivered at {user.timestamp}</Text>
+                                    <Text type="secondary">
+                                        Success Delivered at {user.timestamp}
+                                    </Text>
                                 </Space>
                             </Col>
                             <Col>
-                                <Button type="primary" ghost icon={<SendOutlined />}>Resend</Button>
+                                <Button type="primary" ghost icon={<SendOutlined />}>
+                                    Resend
+                                </Button>
                             </Col>
                         </Row>
                     </Card>