src/pages/master/plantSection/component/ListPlantSection.jsx

@@ -53,10 +53,18 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
         key: 'is_active',
         width: '10%',
         align: 'center',
-        render: (status) => (
+        render: (_, { is_active }) => (
-            <Tag color={status ? '#23A55A' : 'red'} style={{ fontSize: '12px' }}>
+            <>
-                {status ? 'Active' : 'Inactive'}
+                {is_active === true ? (
+                    <Tag color={'green'} key={'status'}>
+                        Running
                     </Tag>
+                ) : (
+                    <Tag color={'red'} key={'status'}>
+                        Offline
+                    </Tag>
+                )}
+            </>
         ),
     },
     {

src/pages/master/shift/component/ListShift.jsx

@@ -56,8 +56,18 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
         key: 'is_active',
         width: '15%',
         align: 'center',
-        render: (status) => (
+        render: (_, { is_active }) => (
-            <Tag color={status ? 'green' : 'red'}>{status ? 'Active' : 'Inactive'}</Tag>
+            <>
+                {is_active === true ? (
+                    <Tag color={'green'} key={'status'}>
+                        Running
+                    </Tag>
+                ) : (
+                    <Tag color={'red'} key={'status'}>
+                        Offline
+                    </Tag>
+                )}
+            </>
         ),
     },
     {

src/pages/master/tag/component/ListTag.jsx

@@ -80,15 +80,19 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
         key: 'is_active',
         width: '8%',
         align: 'center',
-        render: (_, { is_active }) => {
+        render: (_, { is_active }) => (
-            const color = is_active ? 'green' : 'red';
+            <>
-            const text = is_active ? 'Active' : 'Inactive';
+                {is_active === true ? (
-            return (
+                    <Tag color={'green'} key={'status'}>
-                <Tag color={color} key={'status'}>
+                        Running
-                    {text}
                     </Tag>
-            );
+                ) : (
-        },
+                    <Tag color={'red'} key={'status'}>
+                        Offline
+                    </Tag>
+                )}
+            </>
+        ),
     },
     {
         title: 'Aksi',

src/pages/master/unit/component/ListUnit.jsx

@@ -45,15 +45,19 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
         key: 'is_active',
         width: '10%',
         align: 'center',
-        render: (_, { is_active }) => {
+        render: (_, { is_active }) => (
-            const color = is_active ? 'green' : 'red';
+            <>
-            const text = is_active ? 'Active' : 'Inactive';
+                {is_active === true ? (
-            return (
+                    <Tag color={'green'} key={'status'}>
-                <Tag color={color} key={'status'}>
+                        Running
-                    {text}
                     </Tag>
-            );
+                ) : (
-        },
+                    <Tag color={'red'} key={'status'}>
+                        Offline
+                    </Tag>
+                )}
+            </>
+        ),
     },
     {
         title: 'Aksi',

src/pages/role/component/ListRole.jsx

@@ -46,9 +46,17 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
         width: '10%',
         align: 'center',
         render: (_, { is_active }) => (
-            <Tag color={is_active ? 'green' : 'red'} key={'status'}>
+            <>
-                {is_active ? 'Active' : 'Inactive'}
+                {is_active === true ? (
+                    <Tag color={'green'} key={'status'}>
+                        Active
                     </Tag>
+                ) : (
+                    <Tag color={'default'} key={'status'}>
+                        Inactive
+                    </Tag>
+                )}
+            </>
         ),
     },
     {