(RTK) How to pass the query parameter from react to createSelector

Viewed 67

I am currently using RTK query to get the event log from the database according to the date at the end of the url:

export const extendedChartApiSlice = apiSlice.injectEndpoints({
    endpoints: builder => ({
        getChart: builder.query({
            query: (date) => `/api/eventlog/${date}`,
            transformResponse: responseData => {
                const loadedData = responseData['event_log']
                return chartAdapter.setAll(initialState, loadedData);
            },
            providesTags: (result, error, arg) => [
                { type: 'Chart', id: 'LIST' },
                ...result.ids.map(id => ({ type: 'Chart', id }))
            ]
        }),
    })
});

For now, I am able to obtain the data with the useGetChartQuery like this:

    const {
        data: logEventByDate,
        isLoading,
        isSuccess,
        isError,
        error
    } = useGetChartQuery(date);

However, the data obtained is the complete normalized data including the ids and entities, what I am trying to achieve is to destructure the normalized data in the slice by creating a memorized selector like this:

export const selectChartResult = extendedChartApiSlice.endpoints.getChart.select();

export const selectChartData = createSelector(
    selectChartResult,
    chartResult => chartResult.data
);

However, the selectChartData returned undefined. I think I need to pass the parameter to the selectChartData first, like I did with the useGetChartQuery. Has anybody got an idea what is wrong with my code?

0 Answers
Related