Untitled
import Table from '@components/Table' import useOrderColumnDefs from '@hooks/useOrderColumnDefs' import type { Order } from '@models/order' import { getCoreRowModel, getSortedRowModel, useReactTable, } from '@tanstack/react-table' import { isEqual } from 'lodash' import { memo, useEffect } from 'react' export interface OrdersTableData extends Order { partnerName?: string orderExternalPartnerId?: string } interface OrdersTableProps { data: OrdersTableData[] rowRef: React.Ref<HTMLTableRowElement> isSimplifiedOrdersCompany: boolean onClickRow: (orderId: string) => void onClickCancelOrder: (orderId: string) => void } const OrdersTable = ({ data, rowRef, isSimplifiedOrdersCompany, onClickRow, onClickCancelOrder, }: OrdersTableProps) => { const { columnDefs, loadColumnVisibility } = useOrderColumnDefs({ onClickCancelOrder, }) const table = useReactTable({ columns: columnDefs, data, getCoreRowModel: getCoreRowModel(), getSortedRowModel: getSortedRowModel(), columnResizeMode: 'onChange', initialState: { columnVisibility: { proofDelivery: !isSimplifiedOrdersCompany, paymentMethod: !isSimplifiedOrdersCompany, cost: !isSimplifiedOrdersCompany, }, }, }) useEffect(() => { loadColumnVisibility(table.getAllColumns()) }, []) return ( <Table rowRef={rowRef} table={table} onClickRow={row => onClickRow(row.id)} /> ) } export default memo(OrdersTable, (prevProps, nextProps) => { return isEqual(prevProps.data, nextProps.data) })
Leave a Comment