fix: consistent sgho on banner and reserve values

Author: foodaka

src/modules/markets/Gho/GhoBanner.tsx

@@ -33,7 +33,7 @@ export const SavingsGhoBanner = ({ reserve }: GhoBannerProps) => {
     Stake.gho
   );
 
-  const totalStakedUsd = stakeGeneralResult?.[0]?.totalSupplyUSDFormatted;
+  const stakeData = stakeGeneralResult?.[0];
 
   if (downToSm) {
     return <GhoSavingsBannerMobile reserve={reserve} />;
@@ -113,15 +113,15 @@ export const SavingsGhoBanner = ({ reserve }: GhoBannerProps) => {
             }}
           />
           <Stack direction="column" alignItems="flex-start">
-            {stakeDataLoading ? (
+            {stakeDataLoading || !stakeData ? (
               <Skeleton width={70} height={25} />
             ) : (
               <Stack direction="row" gap={1} alignItems="center">
                 <FormattedNumber
                   symbol="USD"
                   compact
                   variant={isCustomBreakpoint ? 'h3' : isMd ? 'secondary16' : 'secondary14'}
-                  value={totalStakedUsd || 0}
+                  value={stakeData.totalSupplyFormatted || 0}
                 />
               </Stack>
             )}

src/modules/reserve-overview/Gho/SavingsGho.tsx

@@ -86,7 +86,11 @@ export const SavingsGho = () => {
           {stakeDataLoading && <Skeleton variant="text" width={145} height={24} />}
           {!stakeDataLoading && stakeData && (
             <Stack direction="row" alignItems="center" gap={1}>
-              <FormattedNumber value={stakeData.totalSupplyFormatted} variant="main16" compact />
+              <FormattedNumber
+                value={stakeData.totalSupplyFormatted || 0}
+                variant="main16"
+                compact
+              />
               <Box sx={{ display: { xs: 'none', sm: 'block' } }}>
                 {' ('}
                 <FormattedNumber