fixing minor issues

src/widgets/GoogleAnalyticsWidget/GoogleAnalyticsWidget.tsx

@@ -1,11 +1,25 @@
-"use client"
-import React, { useEffect, useState } from 'react';
+'use client'
+import React, { useEffect, useState, useCallback } from 'react';
 import { apiInstance } from "@/shared/config/apiConfig";
 import { AxiosError } from "axios";
 
-const GoogleAnalyticsWidget = async () => {
+const GoogleAnalyticsWidget = () => {
 
-    const getAnalytics = async () => {
+  const [visitors, setVisitors] = useState<string>("");
+
+   /* const getAnalytics = async () => {
+        try {
+          const response = await apiInstance.get("/report/google_analytics/");
+          return response.data;
+        } catch (error: unknown) {
+          if (error instanceof AxiosError) console.log(error.message);
+        }
+      };*/
+    
+    //const data = await getAnalytics();
+
+    const fetchMyAPI = useCallback(async () => {
+      const getAnalytics = async () => {
         try {
           const response = await apiInstance.get("/report/google_analytics/");
           return response.data;
@@ -13,11 +27,16 @@ const GoogleAnalyticsWidget = async () => {
           if (error instanceof AxiosError) console.log(error.message);
         }
       };
+      const data = await getAnalytics();
+      setVisitors(data.visitors);
+    }, [visitors])
 
-    const data = await getAnalytics();
+    useEffect(() => {
+      fetchMyAPI();
+    }, []);
 
   return (
-    <div><p>Total cummulative visitors: {data.visitors}</p></div>
+    <div><p>Total cummulative visitors: {visitors}</p></div>
 )
 
 };