fix: remove useCallback on ImageDecode components for React and Next

Author: felixindrawan

hello-world/next/components/ImageCapture/ImageCapture.tsx

@@ -11,7 +11,7 @@ function ImageCapture() {
   let pCvRouter: MutableRefObject<Promise<CaptureVisionRouter> | null> = useRef(null);
   let isDestroyed = useRef(false);
 
-  const decodeImg = useCallback(async (e: React.ChangeEvent<HTMLInputElement>) => {
+  const decodeImg = async (e: React.ChangeEvent<HTMLInputElement>) => {
     let files = [...(e.target.files as any as File[])];
     e.target.value = ""; // reset input
     resultsContainer.current!.innerText = "";
@@ -46,7 +46,7 @@ function ImageCapture() {
       console.error(errMsg);
       alert(errMsg);
     }
-  }, []);
+  };
 
   useEffect((): any => {
     // In 'development', React runs setup and cleanup one extra time before the actual setup in Strict Mode.

hello-world/react-hooks/src/components/ImageCapture/ImageCapture.tsx

@@ -1,4 +1,4 @@
-import React, { useRef, useEffect, MutableRefObject, useCallback } from "react";
+import React, { useRef, useEffect, MutableRefObject } from "react";
 import "../../dynamsoft.config"; // import side effects. The license, engineResourcePath, so on.
 import { EnumCapturedResultItemType } from "dynamsoft-core";
 import { BarcodeResultItem } from "dynamsoft-barcode-reader";
@@ -11,7 +11,7 @@ function ImageCapture() {
   let pCvRouter: MutableRefObject<Promise<CaptureVisionRouter> | null> = useRef(null);
   let isDestroyed = useRef(false);
 
-  const captureImage = useCallback(async (e: React.ChangeEvent<HTMLInputElement>) => {
+  const captureImage = async (e: React.ChangeEvent<HTMLInputElement>) => {
     let files = [...(e.target.files as any as File[])];
     e.target.value = ""; // reset input
     resultsContainer.current!.innerText = "";
@@ -46,7 +46,7 @@ function ImageCapture() {
       console.error(errMsg);
       alert(errMsg);
     }
-  }, []);
+  };
 
   useEffect((): any => {
     // In 'development', React runs setup and cleanup one extra time before the actual setup in Strict Mode.
@@ -56,9 +56,11 @@ function ImageCapture() {
     return () => {
       isDestroyed.current = true;
       if (pCvRouter.current) {
-        pCvRouter.current.then((cvRouter) => {
-          cvRouter.dispose();
-        }).catch((_) => { })
+        pCvRouter.current
+          .then((cvRouter) => {
+            cvRouter.dispose();
+          })
+          .catch((_) => {});
       }
     };
   }, []);