Merge branch 'main' into pairs-toggle-3

src/app/rewards/page.tsx

@@ -103,7 +103,7 @@ function RewardsCard() {
   );
   const account = selectedAccount?.address;
   const t = useTranslations();
-  const { rewardData, pairsList } = useAppSelector(
+  const { rewardData, pairsList, isLoading } = useAppSelector(
     (state) => state.rewardSlice
   );
   const userHasRewards = getUserHasRewards(rewardData);
@@ -150,6 +150,8 @@ function RewardsCard() {
               ? t("connect_wallet_to_claim_rewards")
               : userHasRewards
               ? t("total_rewards")
+              : isLoading
+              ? t("loading...")
               : t("no_rewards_to_claim")}
           </h4>
         </div>
@@ -216,7 +218,9 @@ function ClaimButton() {
   const t = useTranslations();
   const dispatch = useAppDispatch();
   const { isConnected } = useAppSelector((state) => state.radix);
-  const { rewardData } = useAppSelector((state) => state.rewardSlice);
+  const { rewardData, isLoading } = useAppSelector(
+    (state) => state.rewardSlice
+  );
   const userHasRewards = getUserHasRewards(rewardData);
   const disabled = !isConnected || !userHasRewards;
 
@@ -252,7 +256,7 @@ function ClaimButton() {
         );
       }}
     >
-      {t("claim_all_rewards")}
+      {isLoading ? t("loading...") : t("claim_all_rewards")}
     </button>
   );
 }

src/app/state/locales/en/rewards.json

@@ -13,5 +13,6 @@
   "rewards_claimed": "Rewards claimed",
   "continue_trading_to_earn_more": "Continue trading or staking to earn more and come back later.",
   "go_back": "Go back",
-  "no_rewards_to_claim": "No rewards to claim"
+  "no_rewards_to_claim": "No rewards to claim",
+  "loading...": "Loading..."
 }

src/app/state/locales/pt/rewards.json

@@ -13,5 +13,6 @@
   "rewards_claimed": "Recompensas resgatadas",
   "continue_trading_to_earn_more": "Continue negociando ou fazendo staking para ganhar mais e volte mais tarde.",
   "go_back": "Voltar",
-  "no_rewards_to_claim": "Sem recompensas para reivindica"
+  "no_rewards_to_claim": "Sem recompensas para reivindica",
+  "loading...": "Carregamento..."
 }

src/app/state/rewardSlice.ts

@@ -19,6 +19,7 @@ export interface RewardState {
   pairsList: adex.PairInfo[];
   config: RewardConfig;
   showSuccessUi: boolean;
+  isLoading: boolean;
 }
 
 interface RewardConfig {
@@ -69,6 +70,7 @@ const initialState: RewardState = {
     rewardVaultAddress: "",
   },
   showSuccessUi: false,
+  isLoading: false,
 };
 
 type NonFungibleResource = NonFungibleResourcesCollectionItem & {
@@ -100,6 +102,7 @@ export const rewardSlice = createSlice({
         ordersRewards: [],
       };
       state.showSuccessUi = false;
+      state.isLoading = false;
     },
     resetShowSuccessUi: (state) => {
       state.showSuccessUi = false;
@@ -109,7 +112,9 @@ export const rewardSlice = createSlice({
   extraReducers: (builder) => {
     builder
       // fetchAddresses
-      .addCase(fetchAddresses.pending, () => {})
+      .addCase(fetchAddresses.pending, (state) => {
+        state.isLoading = true;
+      })
       .addCase(
         fetchAddresses.fulfilled,
         (state, action: PayloadAction<FetchAddressesResult>) => {
@@ -120,46 +125,56 @@ export const rewardSlice = createSlice({
       )
       .addCase(fetchAddresses.rejected, (state, action) => {
         DexterToast.error("Error fetching claim component addresses");
+        state.isLoading = false;
         console.error(action.error);
       })
 
       // fetchReciepts
       .addCase(fetchReciepts.pending, (state) => {
         state.recieptIds = [];
         state.showSuccessUi = false;
+        state.isLoading = true;
       })
       .addCase(fetchReciepts.fulfilled, (state, action) => {
         state.recieptIds = action.payload;
       })
-      .addCase(fetchReciepts.rejected, (_, action) => {
+      .addCase(fetchReciepts.rejected, (state, action) => {
         DexterToast.error("Error fetching order receipts");
         console.error(action.error);
+        state.isLoading = false;
       })
 
       // fetchAccountRewards
-      .addCase(fetchAccountRewards.pending, () => {})
+      .addCase(fetchAccountRewards.pending, (state) => {
+        state.isLoading = true;
+      })
       .addCase(
         fetchAccountRewards.fulfilled,
         (state, action: PayloadAction<AccountRewards[]>) => {
           state.rewardData.accountsRewards = action.payload;
         }
       )
-      .addCase(fetchAccountRewards.rejected, (_, action) => {
+      .addCase(fetchAccountRewards.rejected, (state, action) => {
         DexterToast.error("Error fetching account rewards");
         console.error(action.error);
+        state.isLoading = false;
       })
 
       // fetchOrderRewards
-      .addCase(fetchOrderRewards.pending, () => {})
+      .addCase(fetchOrderRewards.pending, (state) => {
+        state.isLoading = true;
+      })
       .addCase(
         fetchOrderRewards.fulfilled,
         (state, action: PayloadAction<OrderRewards[]>) => {
           state.rewardData.ordersRewards = action.payload;
+          state.isLoading = false;
         }
       )
       .addCase(fetchOrderRewards.rejected, (state, action) => {
         DexterToast.error("Error fetching order rewards ");
         console.error(action.error);
+        state.isLoading = false;
       })
 
       // claimRewards