Redux API call

 //Action

import { GetData } from "../cons";

export const Displayapidata = (items) => {

    return{

        type: GetData,

        payload : items

    }

   

  }

//const

export const GetData = "GetData";

//Reducer-displayreducer

import {  GetData } from "../cons/index"

const initialState = {

    items : []

}

export const productReducer =  (state = initialState, { type, payload }) => {

  switch (type) {

  case GetData:

    return { ...state, items: payload }

  default:

    return state

  }

}

// Reducer-main

import { combineReducers } from "redux";

import { productReducer } from '../reducer/DisplayReducer';

const rootReducer = combineReducers(

    {

    product :productReducer

}

)

export default rootReducer;

//store

import { createStore } from 'redux'

import rootReducer from '../reducer/main';

const store = createStore(rootReducer, /* preloadedState, */

window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__());

export default store;

//app.js\

import React, { useEffect } from 'react'

import { useDispatch } from 'react-redux'

import { Displayapidata } from './actions/index';

export default function Display() {

    const dispatch = useDispatch();

   

    useEffect(()=> {

       fetch("https://reqres.in/api/users")

       .then(req=>

        req.json()).then(y=>{

          console.log(y);

         dispatch(Displayapidata(y))})

       },[])

   

  return (

    <div>

   

    </div>

  )

}

//index.js

import React from 'react';

import ReactDOM from 'react-dom/client';

import './index.css';

import App from './App';

import reportWebVitals from './reportWebVitals';

//import FormData from './FormData'

import Display from './Display'

import store from './store';

import { Provider } from 'react-redux';

const root = ReactDOM.createRoot(document.getElementById('root'));

root.render(

  <React.StrictMode>

    <Provider store={store}>

    <App/>

      <Display />

    </Provider>

  </React.StrictMode>

);

// If you want to start measuring performance in your app, pass a function

// to log results (for example: reportWebVitals(console.log))

// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals

reportWebVitals();