I have a useCallback function and a snackbar state, each time deleteRow function called, snackbar state will be updated, but setSnackbar function not update the first value that we pass, so when we log from snackbar, snackbar doesn’t have the all value that we pass into it
const deleteRow = useCallback(async (item: ICheckoutItem, ppid: number, isLastOne = false) => {
let newItems = [...checkoutItems];
newItems = newItems.map(((item) => {
item.properties = item.properties.filter((property) => property.id !== ppid);
return item;
}));
newItems = newItems.filter((item) => item.properties.length > 0);
setCheckoutItems(newItems);
await server_axios.delete(endpoints.orderProductProperties.delete(ppid) + (orderId ? `?order_id=${orderId}` : ''));
await new Promise((resolve) => setTimeout(resolve, 500));
if (isLastOne && type === 'edit') {
enqueueSnackbar(
`تمامی کالاهای پروفیل ${item.product.name} با موفقیت حذف شدند.nهمچنین وضعیت سفارش شما به «حذفشده» تغییر داده شد.`,
{
variant: 'multiline',
color: 'info',
}
);
console.log(snackbar)
snackbar.forEach((id) => {
closeSnackbar(id)
})
setSnackbar([])
} else if (!isLastOne) {
const esId: SnackbarKey = enqueueSnackbar('کالای مورد نظر با موفقیت حذف شد.', {
color: 'info',
variant: 'myCustomVariant',
showTimer: true,
showButton: true,
autoHideDuration: 10 * 1000,
onClick: async () => {
await server_axios.patch(endpoints.orderProductProperties.cancel_delete(ppid))
if (onRefresh) onRefresh();
}
})
setSnackbar(currentSnackbar => {
console.log('Previous snackbar state:', currentSnackbar);
console.log('New snackbar ID:', esId);
const newState = [...currentSnackbar, esId];
console.log('New snackbar state:', newState);
return newState;
});
// updateSnack(esId)
// console.log(esId)
// let newSnackbar = snackbar.length ? [...snackbar, esId] : [esId]
// console.log(newSnackbar)
// setSnackbar([...newSnackbar])
}
if (afterUpdate) afterUpdate((newItems.length === 0));
}, [checkoutItems, orderId, type, snackbar]);