Uncaught typeerror: cannot set property sidebar of #<object> which has only a getter

See more:

Javascript

Typescript

Hi Team

I need help, i am getting this issue basically i created a local data using localhost and helper class. When i launch this i get this exception and cant seem to solve it. the problem is on line 9 "Sidebar.js"

What I have tried:

//httpHelper.js

/**
 * This application used for simplifies  requests  component
 * @author:Gcobani Mkontwana
 * @date:15/06/2022
 */

export const httpHelper =() => {
    const customFetch = async(url, options = {})=>{
            const defaultMethod = "GET"
            const defaultHeaders = {
                "Content-Type": "application/json",
                Accept: "application/json",
            }

            const controller = new AbortController()
            options.signal = controller.signal

            
		options.method = options.method || defaultMethod
		options.headers = options.headers
			? { ...defaultHeaders, ...options.headers }
			: defaultHeaders

		options.body = JSON.stringify(options.body) || false
		if (!options.body) delete options.body

		setTimeout(() => {
			controller.abort()
		}, 3000)

		try {
			const response = await fetch(url, options)
			return await response.json()
		} catch (err) {
			return err
		}
	}

	const get = (url, options = {}) => customFetch(url, options)

	const post = (url, options) => {
		options.method = "POST"
		return customFetch(url, options)
	}
        // returning our objects here.
        return{
            get, post
        }

    }

// Sidebar.js

/**
 * Sidebar for shipping information details
 */

import { Sidebar } from '@coreui/coreui';
import React,{Component, useEffect, useState} from 'react';
import {httpHelper} from "./helpers/HttpHelper"
  
export default Sidebar =() => {
// const products
  const Products=()=>{
  const[product, setProducts] = useState(null)

  // url to pass values from the json format.

  const url = "http://localhost:3000/product"
  const api = httpHelper()


  // fetching data as json
  useEffect(()=>{
    getProducts()
  }, [])

  const postProducts = product=>{
    api 

      .post('${url}', {body:product})
      .then(response=>getProducts())
      .catch(err=>console.log(err))
  }

  // get all products information here.

  const getProducts =() =>{
    api
    .get('${url}?_expand=shipping')
    .then(response=> {
      getProducts(response)
    }).catch(err=>console.log(err))
  }

  // our products returns when nothing on json if empty.
  if(!product) return null
  }
   


}