pinLastColumn and pinFirstColumn not work!

[ashkankiani]

my code:
<MantineProvider defaultColorScheme="light"> <Stack> <DataTable borderRadius="md" shadow="xs" striped highlightOnHover horizontalSpacing="xs" verticalSpacing="xs" fz="sm" pinLastColumn pinFirstColumn fetching={!loading} verticalAlign="center" records={recordsData} withTableBorder={withTableBorder} withColumnBorders={withColumnBorders} storeColumnsKey={key} columns={effectiveColumns} totalRecords={initialRecords.length} recordsPerPage={pageSize} page={page} onPageChange={(p) => setPage(p)} recordsPerPageOptions={PAGE_SIZES} onRecordsPerPageChange={setPageSize} paginationSize="sm" paginationActiveBackgroundColor="green" paginationActiveTextColor="#e6e348" sortStatus={sortStatus} onSortStatusChange={setSortStatus} minHeight={400} /> <Group grow justify="space-between"> <Group justify="left"> <Button size="compact-xs" onClick={resetColumnsWidth}>reset </Button> <Button size="compact-xs" onClick={resetColumnsOrder}>reset </Button> <Button size="compact-xs" onClick={resetColumnsToggle}>reset </Button> </Group> </Group> </Stack> </MantineProvider>

`import { ToastContainer } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';

import '@mantine/core/styles.layer.css';
import 'mantine-datatable/styles.layer.css';
import '../styles/layout.css';`
all method good work, but only pinLastColumn and pinFirstColumn not work,