From c82d6d39c1a0e091c41c3fe494ce6837affcaa5d Mon Sep 17 00:00:00 2001
From: Rafiafrzl <mrafiafrizal0@gmail.com>
Date: Tue, 2 Dec 2025 15:39:20 +0700
Subject: [PATCH] feat: conditionally display status field in add mode for
 DetailContact component

---
 src/pages/contact/component/DetailContact.jsx | 47 +++++++++++--------
 1 file changed, 28 insertions(+), 19 deletions(-)

diff --git a/src/pages/contact/component/DetailContact.jsx b/src/pages/contact/component/DetailContact.jsx
index d682381..ea73910 100644
--- a/src/pages/contact/component/DetailContact.jsx
+++ b/src/pages/contact/component/DetailContact.jsx
@@ -205,27 +205,36 @@ const DetailContact = memo(function DetailContact(props) {
             ]}
         >
             <div style={{ padding: '8px 0' }}>
-                <div>
-                    <div>
-                        <Text strong>Status</Text>
-                    </div>
-                    <div style={{ display: 'flex', alignItems: 'center', marginTop: '8px' }}>
-                        <div style={{ marginRight: '8px' }}>
-                            <Switch
-                                disabled={props.readOnly}
-                                style={{
-                                    backgroundColor: formData.is_active ? '#23A55A' : '#bfbfbf',
-                                }}
-                                checked={formData.is_active}
-                                onChange={handleStatusToggle}
-                            />
-                        </div>
+                {/* Status field only show in add mode*/}
+                {props.actionMode === 'add' && (
+                    <>
                         <div>
-                            <Text>{formData.is_active ? 'Active' : 'Inactive'}</Text>
+                            <div>
+                                <Text strong>Status</Text>
+                            </div>
+                            <div
+                                style={{ display: 'flex', alignItems: 'center', marginTop: '8px' }}
+                            >
+                                <div style={{ marginRight: '8px' }}>
+                                    <Switch
+                                        disabled={props.readOnly}
+                                        style={{
+                                            backgroundColor: formData.is_active
+                                                ? '#23A55A'
+                                                : '#bfbfbf',
+                                        }}
+                                        checked={formData.is_active}
+                                        onChange={handleStatusToggle}
+                                    />
+                                </div>
+                                <div>
+                                    <Text>{formData.is_active ? 'Active' : 'Inactive'}</Text>
+                                </div>
+                            </div>
                         </div>
-                    </div>
-                </div>
-                <Divider style={{ margin: '12px 0' }} />
+                        <Divider style={{ margin: '12px 0' }} />
+                    </>
+                )}
 
                 <div style={{ marginBottom: 12 }}>
                     <Text strong>Name</Text>