fix: handle empty staking information and ensure loading state is set correctly (#521)

Author: mohandast52

frontend/components/ManageStakingPage/StakingContractSection/StakingContractDetails.tsx

@@ -50,7 +50,7 @@ export const StakingContractDetails = ({
     return <Skeleton active />;
   }
 
-  if (!stakingContractInfoRecord) {
+  if (!stakingContractInfoRecord || !list || list.length === 0) {
     return (
       <Alert
         message="No staking information available."
@@ -61,6 +61,6 @@ export const StakingContractDetails = ({
   }
 
   return (
-    <InfoBreakdownList list={list!} parentStyle={{ gap: 12 }} color="primary" />
+    <InfoBreakdownList list={list} parentStyle={{ gap: 12 }} color="primary" />
   );
 };

frontend/context/StakingContractInfoProvider.tsx

@@ -79,9 +79,11 @@ export const StakingContractInfoProvider = ({
     AutonolasService.getStakingContractInfoByServiceIdStakingProgram(
       serviceId,
       activeStakingProgramId,
-    ).then(setActiveStakingContractInfo);
-
-    setIsActiveStakingContractInfoLoaded(true);
+    )
+      .then(setActiveStakingContractInfo)
+      .finally(() => {
+        setIsActiveStakingContractInfoLoaded(true);
+      });
   }, [activeStakingProgramId, serviceId]);
 
   /** Updates general staking contract information, not user or service specific */