Not getting the updated value in Ag grid cell render when value changes after API call

Hi i am using react query and fetching data below const { data: projectStatusList } = GetAllProjectQueryStatus();

i am passing this projectStatusList as a prop to component whIch is inside Ag Grid cellRenderer

but the updated value of projectStatusList not reflected in cellRenderer . Also if i console projectStatusList outside the cellRendrer

i can see the updated value

I’m using react-query to fetch a list of project statuses and pass it as a prop to a component that is rendered inside an ag-Grid cellRenderer. However, I'm facing an issue where the updated value of projectStatusList is not reflected within the cellRenderer. Interestingly, if I log projectStatusList outside the cellRenderer, I can see the updated values. But inside the cellRenderer, the value remains stale.

Here is the data fetching and how it's passed to the cellRenderer:

const { data: projectStatusList } = GetAllProjectQueryStatus();

This projectStatusList is passed as a prop to the component in the cellRenderer:

cellRenderer: ({ data }) => { return ( <div className={classNames(styles.ColumnLeftPadding, 'mx-auto position-relative')}> <Popper title={data?.status_label} type={fomatTextCapitalize(data?.status)} options={optionsProjects} onSelect={(item) => { if (isRestrictActions(screenEnum.project, screenActionEnum.update)) { changeTableData(data, item?.type, item?.label, item?.color); } }} onAdd={(dataItem) => { addProjectStatusMutate(dataItem); }} onUpdate={(dataItem) => { updateStatusMutate(dataItem); }} onDelete={(dataItem) => { DeStatuslMutate(dataItem); }} isLoadingDel={DelStatusLoading} data={projectStatusList} // Passing projectStatusList here buttonID={PopperButton_${data?.status_label}${data.index}} color={data?.status_color} /> </div> ); }

The issue is:

projectStatusList is passed as a prop, but when the value changes, it doesn't update within the cellRenderer. The projectStatusList logs the correct value outside the cellRenderer, but the change is not reflected inside it.

Continue reading...