Search code examples
reactjsreact-hookselectronelectron-builderelectron-forge

Electron-Forge react custom hook not invoking API


I am trying to build a desktop application to download courses from one of the online e-learning portals. I am using electron forge with React and Webpack to create UI. I am able to download the courses in my local development environment. But, my custom hook is not getting executed when I try to download the course from Mac executable file (dmg) which was created using npm run make.

import React, { useState, useEffect, useContext } from "react";
import { Context } from "../context/context";

export default function useFetchCourseData(courseId) {
  console.log("useFetchCourseData");
  const [courseData, setCourseData] = useState([]);
  const [lectureCount, setLectureCount] = useState([]);
  let { token } = useContext(Context);

  const fetchCourseData = async () => {
    console.log("fetchCourseData API CAll");
    await fetch(
      'URL',
      {
        headers: {
          Authorization: `Bearer ${token}`,
        },
      }
    )
      .then((res) => res.json())
      .then(({ results }) => {
        const courseData = {};
        let current;
        let lectureCount = 0;
        results.forEach((item, index) => {
          if (item._class === "chapter") {
            current = index;
            courseData[index] = {};
            courseData[index]["meta"] = item;
          } else if (item._class === "lecture") {
            lectureCount += 1;
            if (courseData[current]["lectures"] === undefined)
              courseData[current]["lectures"] = {};
            courseData[current]["lectures"][index] = item;
          }
        });
        setCourseData(courseData);
        setLectureCount(lectureCount);
      });
  };

  useEffect(() => fetchCourseData,[]);

  return [courseData, lectureCount];
}

Here useEffect is not invoking the fetchCourseData method which is working fine in development mode.


Solution

  • Try changing your useEffect from

      useEffect(() => fetchCourseData,[]);
    

    to

      useEffect(() => { fetchCourseData() },[]);