feat: remove unused activeTab state and related props from ListBrandDevice component

This commit is contained in:
2025-10-17 15:39:34 +07:00
parent e42d1fa3ce
commit 2df7c953c7
2 changed files with 76 additions and 120 deletions

View File

@@ -12,7 +12,6 @@ const IndexBrandDevice = memo(function IndexBrandDevice() {
const navigate = useNavigate();
const { setBreadcrumbItems } = useBreadcrumb();
const [activeTab, setActiveTab] = useState('brandDevice');
const [actionMode, setActionMode] = useState('list');
const [selectedData, setSelectedData] = useState(null);
const [readOnly, setReadOnly] = useState(false);
@@ -62,8 +61,6 @@ const IndexBrandDevice = memo(function IndexBrandDevice() {
selectedData={selectedData}
setSelectedData={setSelectedData}
readOnly={readOnly}
activeTab={activeTab}
setActiveTab={setActiveTab}
/>
<DetailBrandDevice
setActionMode={setMode}

View File

@@ -1,5 +1,5 @@
import React, { memo, useState, useEffect } from 'react';
import { Button, Col, Row, Space, Input, ConfigProvider, Card, Tag, Tabs } from 'antd';
import { Button, Col, Row, Space, Input, ConfigProvider, Card, Tag } from 'antd';
import {
PlusOutlined,
EditOutlined,
@@ -10,7 +10,6 @@ import {
import { NotifAlert, NotifConfirmDialog } from '../../../../components/Global/ToastNotif';
import { useNavigate } from 'react-router-dom';
import TableList from '../../../../components/Global/TableList';
import ListErrorMaster from './ListErrorMaster';
// Dummy data
const initialBrandDeviceData = [
@@ -265,127 +264,87 @@ const ListBrandDevice = memo(function ListBrandDevice(props) {
});
};
const tabItems = [
{
key: 'brandDevice',
label: 'Brand Device',
},
{
key: 'errorMaster',
label: 'Error Master',
},
];
return (
<React.Fragment>
<Card>
<ConfigProvider
theme={{
components: {
Tabs: {
inkBarColor: '#FF8C42',
itemActiveColor: '#FF8C42',
itemHoverColor: '#FF8C42',
itemSelectedColor: '#FF8C42',
},
},
}}
>
<Tabs
activeKey={props.activeTab}
onChange={props.setActiveTab}
items={tabItems}
style={{ marginBottom: '16px' }}
/>
</ConfigProvider>
{props.activeTab === 'brandDevice' && (
<Row>
<Col xs={24}>
<Row justify="space-between" align="middle" gutter={[8, 8]}>
<Col xs={24} sm={24} md={12} lg={12}>
<Input.Search
placeholder="Search brand device..."
value={searchValue}
onChange={(e) => {
const value = e.target.value;
setSearchValue(value);
// Auto search when clearing by backspace/delete
if (value === '') {
setFormDataFilter({ search: '' });
setTrigerFilter((prev) => !prev);
}
}}
onSearch={handleSearch}
allowClear={{
clearIcon: <span onClick={handleSearchClear}></span>,
}}
enterButton={
<Button
type="primary"
icon={<SearchOutlined />}
style={{
backgroundColor: '#23A55A',
borderColor: '#23A55A',
}}
>
Search
</Button>
<Row>
<Col xs={24}>
<Row justify="space-between" align="middle" gutter={[8, 8]}>
<Col xs={24} sm={24} md={12} lg={12}>
<Input.Search
placeholder="Search brand device..."
value={searchValue}
onChange={(e) => {
const value = e.target.value;
setSearchValue(value);
// Auto search when clearing by backspace/delete
if (value === '') {
setFormDataFilter({ search: '' });
setTrigerFilter((prev) => !prev);
}
size="large"
/>
</Col>
<Col>
<Space wrap size="small">
<ConfigProvider
theme={{
token: { colorBgContainer: '#E9F6EF' },
components: {
Button: {
defaultBg: 'white',
defaultColor: '#23A55A',
defaultBorderColor: '#23A55A',
defaultHoverColor: '#23A55A',
defaultHoverBorderColor: '#23A55A',
},
},
}}
onSearch={handleSearch}
allowClear={{
clearIcon: <span onClick={handleSearchClear}></span>,
}}
enterButton={
<Button
type="primary"
icon={<SearchOutlined />}
style={{
backgroundColor: '#23A55A',
borderColor: '#23A55A',
}}
>
<Button
icon={<PlusOutlined />}
onClick={() => showAddModal()}
size="large"
>
Tambah Brand Device
</Button>
</ConfigProvider>
</Space>
</Col>
</Row>
</Col>
<Col xs={24} sm={24} md={24} lg={24} xl={24} style={{ marginTop: '16px' }}>
<TableList
mobile
cardColor={'#42AAFF'}
header={'tag_name'}
showPreviewModal={showPreviewModal}
showEditModal={showEditModal}
showDeleteDialog={showDeleteDialog}
getData={getAllBrandDevice}
queryParams={formDataFilter}
columns={columns(showPreviewModal, showEditModal, showDeleteDialog)}
triger={trigerFilter}
/>
</Col>
</Row>
)}
{props.activeTab === 'errorMaster' && (
<ListErrorMaster
actionMode={props.actionMode}
setActionMode={props.setActionMode}
selectedData={props.selectedData}
setSelectedData={props.setSelectedData}
/>
)}
Search
</Button>
}
size="large"
/>
</Col>
<Col>
<Space wrap size="small">
<ConfigProvider
theme={{
token: { colorBgContainer: '#E9F6EF' },
components: {
Button: {
defaultBg: 'white',
defaultColor: '#23A55A',
defaultBorderColor: '#23A55A',
defaultHoverColor: '#23A55A',
defaultHoverBorderColor: '#23A55A',
},
},
}}
>
<Button
icon={<PlusOutlined />}
onClick={() => showAddModal()}
size="large"
>
Tambah Brand Device
</Button>
</ConfigProvider>
</Space>
</Col>
</Row>
</Col>
<Col xs={24} sm={24} md={24} lg={24} xl={24} style={{ marginTop: '16px' }}>
<TableList
mobile
cardColor={'#42AAFF'}
header={'tag_name'}
showPreviewModal={showPreviewModal}
showEditModal={showEditModal}
showDeleteDialog={showDeleteDialog}
getData={getAllBrandDevice}
queryParams={formDataFilter}
columns={columns(showPreviewModal, showEditModal, showDeleteDialog)}
triger={trigerFilter}
/>
</Col>
</Row>
</Card>
</React.Fragment>
);