fix(provider): added missing types and added error handling

apps/provider-console/src/components/become-provider/ProviderPricing.tsx

@@ -22,6 +22,7 @@ import { z } from "zod";
 
 import { useControlMachine } from "@src/context/ControlMachineProvider";
 import providerProcessStore from "@src/store/providerProcessStore";
+import { ProviderDetails } from "@src/types/provider";
 import restClient from "@src/utils/restClient";
 import { sanitizeMachineAccess } from "@src/utils/sanityUtils";
 import { ResetProviderForm } from "./ResetProviderProcess";
@@ -37,7 +38,7 @@ interface ProviderPricingProps {
   editMode?: boolean;
   existingPricing?: ProviderPricingValues;
   disabled?: boolean;
-  providerDetails?: any;
+  providerDetails?: ProviderDetails;
   onComplete?: () => void;
 }
 
@@ -206,7 +207,7 @@ export const ProviderPricing: React.FC<ProviderPricingProps> = ({ onComplete, ed
 
   const competitiveEarnings = calculateDefaultEarnings();
 
-  const updateProviderPricingAndProceed = async (data: any) => {
+  const updateProviderPricingAndProceed = async (data: ProviderPricingValues) => {
     setIsLoading(true);
     if (!editMode) {
       setProviderProcess(prev => ({

apps/provider-console/src/components/layout/Layout.tsx

@@ -53,7 +53,7 @@ const LayoutApp: React.FC<Props> = ({ children, isLoading, disableContainer, con
     if (_isNavOpen !== null && !smallScreen) {
       setIsNavOpen(_isNavOpen === "true");
     }
-  });
+  }, [smallScreen]);
 
   const onOpenMenuClick = () => {
     setIsNavOpen(prev => {
@@ -69,7 +69,6 @@ const LayoutApp: React.FC<Props> = ({ children, isLoading, disableContainer, con
     setIsMobileOpen(!isMobileOpen);
   };
 
-  console.log(isLoading);
   return (
     <>
       <div className="bg-card min-h-full">

apps/provider-console/src/components/shared/ActivityLogDetails.tsx

@@ -21,8 +21,8 @@ export const ActivityLogDetails: React.FC<{ actionId: string | null }> = ({ acti
 
   useEffect(() => {
     if (actionDetails) {
-      const initialAccordions = actionDetails.tasks.map(task => task.status === "in_progress");
-      setOpenAccordions(initialAccordions);
+      const initialAccordions = actionDetails.tasks?.map(task => task.status === "in_progress");
+      setOpenAccordions(initialAccordions ?? []);
     }
   }, [actionDetails]);
 
@@ -194,7 +194,7 @@ export const ActivityLogDetails: React.FC<{ actionId: string | null }> = ({ acti
 
         <div className="space-y-4">
           <div className="rounded-md border">
-            {actionDetails?.tasks.map((task, index) => (
+            {actionDetails?.tasks?.map((task, index) => (
               <div key={index}>
                 <div
                   className="flex cursor-pointer items-center justify-between p-4 hover:bg-gray-50 dark:hover:bg-gray-600/50"
@@ -229,7 +229,7 @@ export const ActivityLogDetails: React.FC<{ actionId: string | null }> = ({ acti
                     {renderLogs(taskLogs[task.id], task.id)}
                   </div>
                 )}
-                {index < actionDetails?.tasks.length - 1 && <div className="border-t"></div>}
+                {index < (actionDetails?.tasks?.length ?? 0) - 1 && <div className="border-t"></div>}
               </div>
             ))}
           </div>

apps/provider-console/src/pages/_app.tsx

@@ -2,7 +2,7 @@ import "@akashnetwork/ui/styles";
 import "../styles/index.css";
 
 import { QueryClientProvider } from "react-query";
-import { TooltipProvider } from "@akashnetwork/ui/components";
+import { Toaster, TooltipProvider } from "@akashnetwork/ui/components";
 import { GeistSans } from "geist/font/sans";
 import { Provider } from "jotai";
 import type { AppProps } from "next/app";
@@ -23,6 +23,7 @@ export default function App({ Component, pageProps }: AppProps) {
       <QueryClientProvider client={queryClient}>
         <Provider>
           <ThemeProvider attribute="class" defaultTheme="system" storageKey="theme" enableSystem disableTransitionOnChange>
+            <Toaster />
             <ColorModeProvider>
               <PricingProvider>
                 <TooltipProvider>

apps/provider-console/src/pages/attributes/index.tsx

@@ -9,7 +9,7 @@ import consoleClient from "@src/utils/consoleClient";
 
 const Attributes: React.FunctionComponent = () => {
   const { address } = useSelectedChain();
-  const { data: providerDetails, isLoading: isLoadingProviderDetails }: { data: any; isLoading: boolean } = useQuery(
+  const { data: providerDetails, isLoading: isLoadingProviderDetails }: { data; isLoading: boolean } = useQuery(
     "providerDetails",
     () => consoleClient.get(`/v1/providers/${address}`),
     {

apps/provider-console/src/pages/pricing/index.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from "react";
+import React, { useCallback, useEffect, useState } from "react";
 import { Alert, AlertDescription, AlertTitle, Spinner } from "@akashnetwork/ui/components";
 
 import { ProviderPricing } from "@src/components/become-provider/ProviderPricing";
@@ -7,6 +7,7 @@ import { withAuth } from "@src/components/shared/withAuth";
 import { useControlMachine } from "@src/context/ControlMachineProvider";
 import { useProvider } from "@src/context/ProviderContext";
 import { ProviderPricingType } from "@src/types/provider";
+import { ProviderPricingResponse } from "@src/types/providerPricing";
 import restClient from "@src/utils/restClient";
 import { convertFromPricingAPI, sanitizeMachineAccess } from "@src/utils/sanityUtils";
 
@@ -16,13 +17,13 @@ const Pricing: React.FunctionComponent = () => {
   const [isLoading, setIsLoading] = useState(false);
   const { providerDetails } = useProvider();
 
-  const fetchPricing = async () => {
+  const fetchPricing = useCallback(async () => {
     try {
       setIsLoading(true);
       const request = {
         control_machine: sanitizeMachineAccess(activeControlMachine)
       };
-      const response: any = await restClient.post("/get-provider-pricing", request);
+      const response: ProviderPricingResponse = await restClient.post("/get-provider-pricing", request);
       if (response) {
         setExistingPricing(convertFromPricingAPI(response.pricing));
       }
@@ -31,13 +32,13 @@ const Pricing: React.FunctionComponent = () => {
     } finally {
       setIsLoading(false);
     }
-  };
+  }, [activeControlMachine]);
 
   useEffect(() => {
     if (activeControlMachine) {
       fetchPricing();
     }
-  }, [activeControlMachine]);
+  }, [activeControlMachine, fetchPricing]);
 
   return (
     <Layout>
@@ -84,7 +85,7 @@ const Pricing: React.FunctionComponent = () => {
             existingPricing={existingPricing}
             editMode={true}
             disabled={activeControlMachine && existingPricing ? false : true}
-            providerDetails={providerDetails}
+            providerDetails={providerDetails ?? undefined}
           />
         </div>
       </div>