Getting We had some trouble connecting. Try again? when trying to update modals

Need some urgent help on slack bolt JS.
I am developing a slack application where user can approve/reject tasks.

I am trying to open a new modal (After one API call) which will confirm if the task is completed or not and this is giving me the error.

Please note I will need this aprovalresponse to compare the status received from api so I cannot make this api async.

**Below is the code I am using to open a modal to provide comment for the action.
**

// Handle selection of a pending task in the static select
app.action(
  { type: "block_actions", action_id: /^pending_task_action_(d+)$/ },
  async ({ ack, body, client }) => {
    await ack();

    const selectedOption = body.actions[0].selected_option.value;
    const selectedApplicationId = body.actions[0].block_id;
    const userEmail = body.user.name + "@mdsol.com";

    try { 
      const selectedCategory = body.view.private_metadata;

      // Open a modal with a text input for reasonm
      await client.views.open({
        trigger_id: body.trigger_id,
        view: {
          type: "modal",
          callback_id: "reason_modal",
          private_metadata: JSON.stringify({
            selectedOption,
            selectedApplicationId,
            selectedCategory,
            userEmail,
          }),
          title: {
            type: "plain_text",
            text: ":wave: Please comment",
          },
          blocks: [
            {
              type: "input",
              block_id: "reason_input",
              element: {
                type: "plain_text_input",
                action_id: "reason",
                multiline: true,
              },
              label: {
                type: "plain_text",
                text: "Please provide comment for your action:",
              },
            },
          ],
          submit: {
            type: "plain_text",
            text: "Submit",
          },
        },
      });
    } catch (error) {
      console.error("Error handling pending task action:", error);
    }
  }
);

And to handle this comment I wrote below code and here i am receiving the error.

// Handle submission of the reason modal
app.view('reason_modal', async ({ ack, body, view, client }) => {

  await ack()
  const viewId = view.id;
   // Open a quick loading modal
   await client.views.update({
    view_id: viewId,
    "response_action": "update",
    view: {
      type: "modal",
      title: {
        type: "plain_text",
        text: ":man-biking:Processing..",
      },
      blocks: [
        {
          type: "section",
          text: {
            type: "plain_text",
            text: ":hourglass_flowing_sand: Processing your request... ",
          },
        },
      ], 
    },
  });
  
  **//Making One api call here**
  
    const approvalResponse = await axios.post(approvalUrl, payload, {
      headers: {
        "Content-Type": "application/json",
        "x-api-key": process.env.X_API_KEY,
      },
    });
    
    **//Below Modal is returning same error.**
    
    if (approvalResponse.status == 200) {
    // Update the modal with the final content
    await client.views.update({
      view_id: viewId,
      "response_action": "update",
      view: {
        type: "modal",
        callback_id: "modal-1",
        title: {
          type: "plain_text",
          text: "Action Update!",
        },
        blocks: [
          {
            type: "section",
            block_id: "section-1",
            text: {
              type: "mrkdwn",
              text:"task is completed",
            },
          },
        ],
      },
    });
    }

Tried various approaches like opening a view pushing a view but still getting same error.