Skip to content

Commit

Permalink
fix: text and loading fixed
Browse files Browse the repository at this point in the history
  • Loading branch information
martines3000 committed Jan 12, 2025
1 parent 5948ff5 commit be96ddd
Show file tree
Hide file tree
Showing 2 changed files with 18 additions and 26 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,6 @@ import {
useApr,
useBalance,
useBorrowCapacity,
useBorrowRate,
useMarketConfiguration,
usePrice,
useUserRole,
Expand All @@ -51,12 +50,7 @@ import {
selectChangeTokenAmount,
useMarketStore,
} from '@/stores';
import {
SYMBOL_TO_ICON,
formatUnits,
getBorrowApr,
getFormattedNumber,
} from '@/utils';
import { SYMBOL_TO_ICON, formatUnits, getFormattedNumber } from '@/utils';
import { useAccount, useIsConnected } from '@fuels/react';
import * as VisuallyHidden from '@radix-ui/react-visually-hidden';
import BigNumber from 'bignumber.js';
Expand Down Expand Up @@ -136,7 +130,6 @@ export const BorrowTable = () => {
);
const changeInputDialogOpen = useMarketStore(selectChangeInputDialogOpen);

const { data: borrowRate, isPending: isBorrowRatePending } = useBorrowRate();
const { data: userSupplyBorrow } = useUserSupplyBorrow();
const { data: priceData } = usePrice();
const { data: marketConfiguration, isPending: isPendingMarketConfiguration } =
Expand Down Expand Up @@ -215,7 +208,7 @@ export const BorrowTable = () => {
Net APY
<InfoIcon
text={
'Net APY shows combined Borrow APY and Reward APY (Net APY = Borrow APY+ Reward APY).'
'Net APY shows combined Borrow APY and Reward APY (Net APY = Borrow APY - Reward APY).'
}
/>
</div>
Expand All @@ -234,7 +227,7 @@ export const BorrowTable = () => {
</TableRow>
</TableHeader>
<TableBody>
{isPendingMarketConfiguration ? (
{isPendingMarketConfiguration || isAprPending ? (
SkeletonRow
) : (
<TableRow>
Expand Down Expand Up @@ -286,7 +279,7 @@ export const BorrowTable = () => {
</TableCell>
<TableCell
className={cn(
isBorrowRatePending && 'animate-pulse',
isAprPending && 'animate-pulse',
'text-white text-md font-medium'
)}
>
Expand All @@ -295,7 +288,7 @@ export const BorrowTable = () => {
<TableCell>{borrowedBalance}</TableCell>
<TableCell
className={cn(
isBorrowRatePending && 'animate-pulse',
isAprPending && 'animate-pulse',
'text-white text-md font-medium'
)}
>
Expand All @@ -306,7 +299,7 @@ export const BorrowTable = () => {
</TableCell>
<TableCell
className={cn(
isBorrowRatePending && 'animate-pulse',
isAprPending && 'animate-pulse',
'text-white text-md font-medium'
)}
>
Expand Down Expand Up @@ -415,7 +408,7 @@ export const BorrowTable = () => {
<CardDescription>Card Description</CardDescription>
</CardHeader>
</VisuallyHidden.Root>
{isPendingMarketConfiguration ? (
{isPendingMarketConfiguration || isAprPending ? (
SkeletonCardContent
) : (
<CardContent>
Expand Down Expand Up @@ -473,7 +466,7 @@ export const BorrowTable = () => {
<div
className={cn(
'text-white text-md font-medium',
isBorrowRatePending && 'animate-pulse'
isAprPending && 'animate-pulse'
)}
>
{aprData?.borrowBaseApr.times(100).toFixed(2)}%
Expand All @@ -492,7 +485,7 @@ export const BorrowTable = () => {
<div
className={cn(
'text-white text-md font-medium',
isBorrowRatePending && 'animate-pulse'
isAprPending && 'animate-pulse'
)}
>
<div className="flex gap-x-2 items-center">
Expand All @@ -508,7 +501,7 @@ export const BorrowTable = () => {
<div
className={cn(
'text-white text-md font-medium',
isBorrowRatePending && 'animate-pulse'
isAprPending && 'animate-pulse'
)}
>
{aprData?.netBorrowApr.times(100).toFixed(2)}%
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -130,7 +130,6 @@ export const LendTable = () => {
);
const changeInputDialogOpen = useMarketStore(selectChangeInputDialogOpen);

const { data: supplyRate, isPending: isSupplyRatePending } = useSupplyRate();
const { data: userSupplyBorrow } = useUserSupplyBorrow();
const { data: marketConfiguration, isPending: isPendingMarketConfiguration } =
useMarketConfiguration();
Expand Down Expand Up @@ -199,7 +198,7 @@ export const LendTable = () => {
</TableRow>
</TableHeader>
<TableBody>
{isPendingMarketConfiguration ? (
{isPendingMarketConfiguration || isAprPending ? (
SkeletonRow
) : (
<TableRow>
Expand Down Expand Up @@ -249,7 +248,7 @@ export const LendTable = () => {
</TableCell>
<TableCell
className={cn(
isSupplyRatePending && 'animate-pulse',
isAprPending && 'animate-pulse',
'text-white text-md font-medium'
)}
>
Expand All @@ -266,7 +265,7 @@ export const LendTable = () => {
</TableCell>
<TableCell
className={cn(
isSupplyRatePending && 'animate-pulse',
isAprPending && 'animate-pulse',
'text-white text-md font-medium'
)}
>
Expand All @@ -277,7 +276,7 @@ export const LendTable = () => {
</TableCell>
<TableCell
className={cn(
isSupplyRatePending && 'animate-pulse',
isAprPending && 'animate-pulse',
'text-white text-md font-medium'
)}
>
Expand Down Expand Up @@ -384,7 +383,7 @@ export const LendTable = () => {
<CardDescription>Card Description</CardDescription>
</CardHeader>
</VisuallyHidden.Root>
{isPendingMarketConfiguration ? (
{isPendingMarketConfiguration || isAprPending ? (
SkeletonCardContent
) : (
<CardContent>
Expand Down Expand Up @@ -436,7 +435,7 @@ export const LendTable = () => {
<div
className={cn(
'text-white',
isSupplyRatePending && 'animate-pulse'
isAprPending && 'animate-pulse'
)}
>
{aprData?.supplyBaseApr.times(100).toFixed(2)}%
Expand Down Expand Up @@ -465,7 +464,7 @@ export const LendTable = () => {
<div
className={cn(
'text-white',
isSupplyRatePending && 'animate-pulse'
isAprPending && 'animate-pulse'
)}
>
<div className="flex gap-x-2 items-center">
Expand All @@ -479,7 +478,7 @@ export const LendTable = () => {
<div
className={cn(
'text-white',
isSupplyRatePending && 'animate-pulse'
isAprPending && 'animate-pulse'
)}
>
{aprData?.netSupplyApr.times(100).toFixed(2)}%
Expand Down

0 comments on commit be96ddd

Please sign in to comment.