Redux toolkit query slice

    0

    0

    YusifHasanov

    There are a few pieces of this code:

    import { createEntityAdapter, createSelector } from "@reduxjs/toolkit"; import { apiSlice } from "./../api/apiSlice"; const categoryAdapter = createEntityAdapter({ selectId: (category) => category.id, sortComparer: (a, b) => a.id.localeCompare(b.id), });

    const initialState = categoryAdapter.getInitialState();

    This creates an entity adapter that will handle the retrieval of categories by ID. The sort comparer will use the localeCompare function to compare the IDs of the two categories.

    export const categorySlice = apiSlice.injectEndpoints({ endpoints: (builder) => ({ getCategories: builder.query({ query: () => "/categories", transformResponse: (responseData) => { return categoryAdapter.setAll(initialState, responseData); }, transformErrorResponse: (responseData

    Library: react

    import { createEntityAdapter, createSelector } from "@reduxjs/toolkit";
    import { apiSlice } from "./../api/apiSlice";
    const categoryAdapter = createEntityAdapter({
      selectId: (category) => category.id,
      sortComparer: (a, b) => a.id.localeCompare(b.id),
    });
    
    const initialState = categoryAdapter.getInitialState();
    
    export const categorySlice = apiSlice.injectEndpoints({
      endpoints: (builder) => ({
        getCategories: builder.query({
          query: () => "/categories",
          transformResponse: (responseData) => {
            return categoryAdapter.setAll(initialState, responseData);
          },
          transformErrorResponse: (responseData) => {
            console.log(responseData);
          },
          providesTags: (result, error, arg) => [{type: 'Category', id: 'LIST'}]
        }),
        addCategory: builder.mutation({
          query: (category) => ({
            url: "/categories",
            method: "POST",
            body: category,
          }),
          transformResponse: (responseData) => {
            return categoryAdapter.addOne(initialState, responseData);
          },
          transformErrorResponse: (responseData) => {
            console.log(responseData);
          },
          invalidatesTags: (result, error, todo) => [{type: 'Category', id: 'LIST'}]
        }),
        updateCategory: builder.mutation({
          query: (category) => ({
            url: `/categories/${category.id}`,
            method: "PUT",
            body: category,
          }),
          transformResponse: (responseData) => {
            return categoryAdapter.updateOne(initialState, responseData);
          },
          transformErrorResponse: (responseData) => {
            console.log(responseData);
          },
          invalidatesTags: (result, error, todo) => [{type: 'Category', id: 'LIST'}]
        }),
        deleteCategory: builder.mutation({
          query: (category) => ({
            url: `/categories/${category.id}`,
            method: "DELETE",
            body: category,
          }),
          transformResponse: (responseData) => {
            return categoryAdapter.removeOne(initialState, responseData);
          },
          transformErrorResponse: (responseData) => {
            console.log(responseData);
          },
          invalidatesTags: (result, error, todo) => [{type: 'Category', id: 'LIST'}]
        }),
      }),
    });
    
    export const {
      useGetCategoriesQuery,
      useAdddCategoryMutation,
      useUpdateCategoryMutation,
      useDeleteCategoryMutation,
    } = categorySlice;
    
    export const selectCategoryResult = categorySlice.endpoints.getCategories.select();
    
    const selectCategoryData = createSelector(
        selectCategoryResult,
      (result) => result.data
    );
    
    export const { selectAll: selectAllCategories, selectById: selectCategoryById } =
    categoryAdapter.getSelectors(
        (state) => selectCategoryData(state) ?? initialState
      );
    
    Codiga Logo
    Codiga Hub
    • Rulesets
    • Playground
    • Snippets
    • Cookbooks
    soc-2 icon

    We are SOC-2 Compliance Certified

    G2 high performer medal

    Codiga – All rights reserved 2022.