src/pages/master/brandDevice/component/BrandForm.jsx

@@ -4,6 +4,8 @@ import { Form, Input, Row, Col, Typography, Switch } from 'antd';
 const { Text } = Typography;
 
 const BrandForm = ({ form, formData, onValuesChange, isEdit = false }) => {
+    const isActive = Form.useWatch('is_active', form) ?? formData.is_active ?? true;
+
     return (
         <Form
             layout="vertical"
@@ -15,12 +17,11 @@ const BrandForm = ({ form, formData, onValuesChange, isEdit = false }) => {
                 <div style={{ display: 'flex', alignItems: 'center' }}>
                     <Form.Item name="is_active" valuePropName="checked" noStyle>
                         <Switch
-                            checked={formData.is_active}
+                            style={{ backgroundColor: isActive ? '#23A55A' : '#bfbfbf' }}
-                            style={{ backgroundColor: formData.is_active ? '#23A55A' : '#bfbfbf' }}
                         />
                     </Form.Item>
                     <Text style={{ marginLeft: 8 }}>
-                        {formData.is_active ? 'Running' : 'Offline'}
+                        {isActive ? 'Running' : 'Offline'}
                     </Text>
                 </div>
             </Form.Item>

src/pages/master/brandDevice/component/ErrorCodeForm.jsx

@@ -112,6 +112,7 @@ const ErrorCodeForm = ({
 
                 const solutionName = values[`solution_name_${fieldId}`];
                 const textSolution = values[`text_solution_${fieldId}`];
+                const solutionStatus = values[`solution_status_${fieldId}`];
                 const filesForSolution = fileList.filter((file) => file.solutionId === fieldId);
                 const solutionType = values[`solution_type_${fieldId}`] || solutionTypes[fieldId];
 
@@ -122,7 +123,7 @@ const ErrorCodeForm = ({
                             type_solution: 'text',
                             text_solution: textSolution.trim(),
                             path_solution: '',
-                            is_active: solutionStatuses[fieldId] !== false,
+                            is_active: solutionStatus !== undefined ? solutionStatus : true,
                         };
 
                         if (window.currentSolutionData && window.currentSolutionData[fieldId]) {
@@ -145,7 +146,7 @@ const ErrorCodeForm = ({
                                 (file.type.startsWith('image/') ? 'image' : 'pdf'),
                             text_solution: '',
                             path_solution: file.uploadPath,
-                            is_active: solutionStatuses[fieldId] !== false,
+                            is_active: solutionStatus !== undefined ? solutionStatus : true,
                         };
 
                         if (window.currentSolutionData && window.currentSolutionData[fieldId]) {

src/pages/master/brandDevice/component/ListBrandDevice.jsx

@@ -67,7 +67,7 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
         ),
     },
     {
-        title: 'Aksi',
+        title: 'Action',
         key: 'action',
         align: 'center',
         width: '15%',
@@ -251,7 +251,7 @@ const ListBrandDevice = memo(function ListBrandDevice(props) {
                                             }}
                                             size="large"
                                         >
-                                            Tambah Brand Device
+                                            Add Brand Device
                                         </Button>
                                     </ConfigProvider>
                                 </Space>

src/pages/master/brandDevice/component/SolutionField.jsx

@@ -20,6 +20,8 @@ const SolutionField = ({
     onFileView,
     errorCodeForm,
 }) => {
+    // Watch the solution status from the form
+    const watchedStatus = Form.useWatch(`solution_status_${fieldId}`, errorCodeForm);
     useEffect(() => {
         if (currentSolutionData && errorCodeForm) {
             if (currentSolutionData.solution_name) {
@@ -146,34 +148,22 @@ const SolutionField = ({
             </Form.Item>
 
             <Form.Item label="Status">
-                <Form.Item
-                    shouldUpdate={(prevValues, currentValues) =>
-                        prevValues[`solution_status_${fieldId}`] !==
-                        currentValues[`solution_status_${fieldId}`]
-                    }
-                    noStyle
-                >
-                    {({ getFieldValue, setFieldValue }) => {
-                        const currentStatus = getFieldValue(`solution_status_${fieldId}`);
-                        return (
                 <div style={{ display: 'flex', alignItems: 'center' }}>
+                    <Form.Item name={`solution_status_${fieldId}`} valuePropName="checked" noStyle>
                         <Switch
-                                    checked={currentStatus === true}
-                                    onChange={(checked) => {
-                                        setFieldValue(`solution_status_${fieldId}`, checked);
-                                    }}
                             disabled={isReadOnly}
+                            onChange={(checked) => {
+                                onSolutionStatusChange(fieldId, checked);
+                            }}
                             style={{
-                                        backgroundColor: solutionStatus ? '#23A55A' : '#bfbfbf',
+                                backgroundColor: (watchedStatus ?? true) ? '#23A55A' : '#bfbfbf',
                             }}
                         />
+                    </Form.Item>
                     <Text style={{ marginLeft: 8 }}>
-                                    {currentStatus === true ? 'Active' : 'Non Active'}
+                        {(watchedStatus ?? true) ? 'Active' : 'Non Active'}
                     </Text>
                 </div>
-                        );
-                    }}
-                </Form.Item>
             </Form.Item>
 
             <Form.Item label="Solution Type">

src/pages/master/brandDevice/hooks/errorCode.js

@@ -194,9 +194,7 @@ export const useErrorCodeLogic = (errorCodeForm, fileList) => {
     };
 
     const handleSolutionStatusChange = (fieldId, status) => {
-        // Update form immediately
+        // Only update local state - form is already updated by Form.Item
-        errorCodeForm.setFieldValue(`solution_status_${fieldId}`, status);
-        // Then update local state
         setSolutionStatuses(prev => ({
             ...prev,
             [fieldId]: status

src/pages/master/device/component/ListDevice.jsx

@@ -81,7 +81,7 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
         ),
     },
     {
-        title: 'Aksi',
+        title: 'Action',
         key: 'aksi',
         align: 'center',
         width: '15%',
@@ -249,7 +249,7 @@ const ListDevice = memo(function ListDevice(props) {
                                             onClick={() => showAddModal()}
                                             size="large"
                                         >
-                                            Tambah Data
+                                            Add data
                                         </Button>
                                     </ConfigProvider>
                                 </Space>

src/pages/master/plantSubSection/component/ListPlantSubSection.jsx

@@ -62,7 +62,7 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
         ),
     },
     {
-        title: 'Aksi',
+        title: 'Action',
         key: 'aksi',
         align: 'center',
         width: '15%',
@@ -226,7 +226,7 @@ const ListPlantSubSection = memo(function ListPlantSubSection(props) {
                                             onClick={() => showAddModal()}
                                             size="large"
                                         >
-                                            Tambah Data
+                                            Add data
                                         </Button>
                                     </ConfigProvider>
                                 </Space>

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

@@ -78,7 +78,7 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
         ),
     },
     {
-        title: 'Aksi',
+        title: 'Action',
         key: 'aksi',
         align: 'center',
         width: '25%',
@@ -239,7 +239,7 @@ const ListShift = memo(function ListShift(props) {
                                             onClick={() => showAddModal()}
                                             size="large"
                                         >
-                                            Tambah Data
+                                            Add data
                                         </Button>
                                     </ConfigProvider>
                                 </Space>

src/pages/master/status/component/DetailStatus.jsx

@@ -128,7 +128,7 @@ const DetailStatus = (props) => {
             title={
                 <Text style={{ fontSize: '18px' }}>
                     {props.actionMode === 'add'
-                        ? 'Tambah Data'
+                        ? 'Add data'
                         : props.actionMode === 'preview'
                         ? 'Preview Status'
                         : 'Edit Status'}

src/pages/master/status/component/ListStatus.jsx

@@ -43,7 +43,7 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
         width: '40%',
     },
     {
-        title: 'Aksi',
+        title: 'Action',
         key: 'aksi',
         align: 'center',
         width: '20%',
@@ -198,7 +198,7 @@ const ListStatus = memo(function ListStatus(props) {
                         }}
                     >
                         <Button icon={<PlusOutlined />} onClick={showAddModal} size="large">
-                            Tambah Data
+                            Add data
                         </Button>
                     </ConfigProvider>
                 </Col>

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

@@ -98,7 +98,7 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
         ),
     },
     {
-        title: 'Aksi',
+        title: 'Action',
         key: 'aksi',
         align: 'center',
         width: '15%',
@@ -289,7 +289,7 @@ const ListTag = memo(function ListTag(props) {
                                             onClick={() => showAddModal()}
                                             size="large"
                                         >
-                                            Tambah Data
+                                            Add data
                                         </Button>
                                     </ConfigProvider>
                                 </Space>

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

@@ -61,7 +61,7 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
         ),
     },
     {
-        title: 'Aksi',
+        title: 'Action',
         key: 'aksi',
         align: 'center',
         width: '20%',
@@ -258,7 +258,7 @@ const ListUnit = memo(function ListUnit(props) {
                                             onClick={() => showAddModal()}
                                             size="large"
                                         >
-                                            Tambah Data
+                                            Add Data
                                         </Button>
                                     </ConfigProvider>
                                 </Space>

src/pages/notification/IndexNotification.jsx

@@ -23,7 +23,7 @@ const IndexNotification = memo(function IndexNotification() {
                 {
                     title: (
                         <Text strong style={{ fontSize: '14px' }}>
-                            • Notifikasi
+                            • Notification
                         </Text>
                     ),
                 },

src/pages/notification/component/ListNotification.jsx

@@ -168,7 +168,7 @@ const ListNotification = memo(function ListNotification(props) {
                                 color: '#262626',
                             }}
                         >
-                            Notifikasi
+                            Notification
                         </h2>
                         <p style={{ margin: '0 0 24px 0', color: '#8c8c8c', fontSize: '14px' }}>
                             Riwayat notifikasi yang dikirim ke engineer
@@ -181,7 +181,7 @@ const ListNotification = memo(function ListNotification(props) {
                                     onClick={() => setActiveTab('all')}
                                     style={tabButtonStyle(activeTab === 'all')}
                                 >
-                                    Semua
+                                    All
                                 </button>
                                 <button
                                     onClick={() => setActiveTab('unread')}
@@ -192,7 +192,7 @@ const ListNotification = memo(function ListNotification(props) {
                                         gap: '8px',
                                     }}
                                 >
-                                    Belum Dibaca
+                                    Not read yet
                                     {getUnreadCount() > 0 && (
                                         <Badge
                                             count={getUnreadCount()}
@@ -206,7 +206,7 @@ const ListNotification = memo(function ListNotification(props) {
                                     onClick={() => setActiveTab('read')}
                                     style={tabButtonStyle(activeTab === 'read')}
                                 >
-                                    Sudah Dibaca
+                                    Already read
                                 </button>
                             </div>
                         </div>
@@ -381,7 +381,7 @@ const ListNotification = memo(function ListNotification(props) {
                                                         fontWeight: 500,
                                                     }}
                                                 >
-                                                    Lihat Detail
+                                                    View Detail
                                                 </Button>
                                             </div>
                                         </div>
@@ -397,3 +397,5 @@ const ListNotification = memo(function ListNotification(props) {
 });
 
 export default ListNotification;
+
+

src/pages/report/report/component/ListReport.jsx

@@ -186,7 +186,7 @@ const ListReport = memo(function ListReport(props) {
                                     icon={<FileTextOutlined />}
                                     onClick={handleSearch}
                                 >
-                                    Tampilkan
+                                    Show
                                 </Button>
                             </Col>
                             <Col>

src/pages/report/trending/ReportTrending.jsx

@@ -174,7 +174,7 @@ const ReportTrending = memo(function ReportTrending(props) {
                                     icon={<FileTextOutlined />}
                                     onClick={handleSearch}
                                 >
-                                    Tampilkan
+                                    Show
                                 </Button>
                             </Col>
                             <Col>

src/pages/role/component/DetailRole.jsx

@@ -42,7 +42,7 @@ const DetailRole = (props) => {
         setConfirmLoading(true);
 
         const validationRules = [
-            { field: 'role_name', label: 'Nama Role', required: true },
+            { field: 'role_name', label: 'Role name', required: true },
             { field: 'role_level', label: 'Level', required: true },
         ];
 
@@ -169,7 +169,7 @@ const DetailRole = (props) => {
             <Row gutter={16}>
                 <Col span={12}>
                     <div style={{ marginBottom: 12 }}>
-                        <Text strong>Nama Role</Text>
+                        <Text strong>Role name</Text>
                         <Text style={{ color: 'red' }}> *</Text>
                         <Input
                             name="role_name"
@@ -196,7 +196,7 @@ const DetailRole = (props) => {
                 </Col>
             </Row>
             <div style={{ marginBottom: 12 }}>
-                <Text strong>Deskripsi Role</Text>
+                <Text strong>Role Description</Text>
                 <TextArea
                     name="role_description"
                     value={formData.role_description}

src/pages/role/component/ListRole.jsx

@@ -28,7 +28,7 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
         hidden: true,
     },
     {
-        title: 'Nama Role',
+        title: 'Role Name',
         dataIndex: 'role_name',
         key: 'role_name',
         width: '25%',
@@ -41,7 +41,7 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
         align: 'center',
     },
     {
-        title: 'Deskripsi',
+        title: 'Description',
         dataIndex: 'role_description',
         key: 'role_description',
         width: '35%',
@@ -67,7 +67,7 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
         ),
     },
     {
-        title: 'Aksi',
+        title: 'Action',
         key: 'aksi',
         align: 'center',
         width: '15%',
@@ -229,7 +229,7 @@ const ListRole = memo(function ListRole(props) {
                                             onClick={() => showAddModal()}
                                             size="large"
                                         >
-                                            Tambah Data
+                                            Add Data
                                         </Button>
                                     </ConfigProvider>
                                 </Space>