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)
})