outlook office adins are not able to read email during reply

Question

I need to read the email when I am in the reply (compose) mode in outlook adins using javascript so that I can analyze the email that I am replying to and populate the reply based on the content of email.

I have added a taskpane button that triggers a javascript function with tries to populate it as prescribed above. However, as far as I have found, in draft mode, there is no way I can read the email that I am replying to. So, I have tried the following way:

1. save the draft message to get an id
2. use that id to get the conversation from graph api
3. use the conversation response to populate reply

However, I am stuck on the step 2. As the message that I am saving, aren't being retrieve from graph api. Instead it shows, 401. Here is my code:

 function handleReply(){
  // Save the draft and then call populateReply
  Office.context.mailbox.item.saveAsync(function(result) {
    if (result.status === Office.AsyncResultStatus.Succeeded) {
        let itemId = result.value; // This is the valid itemId after saving
        pops(itemId);     // Call the function to populate the reply using this itemId
    } else {
        console.error("Error saving item: " + result.error.message);
    }
  });
}

function pops(itemId) {
  console.log(itemId)
  // Get the access token and fetch the conversation thread manually
    Office.context.mailbox.getCallbackTokenAsync({ isRest: true }, function (result) {
      if (result.status === Office.AsyncResultStatus.Succeeded) {
          let accessToken = result.value;
          // let itemId = Office.context.mailbox.item.itemId;

          // Build the API URL to get the conversation thread
          let getMessageUrl = 'https://graph.microsoft.com/v1.0/me/messages/' + itemId;

          // Use fetch to get the message thread
          fetch(getMessageUrl, {
              method: 'GET',
              headers: {
                  'Authorization': 'Bearer ' + accessToken,
                  'Accept': 'application/json'
              }
          })
          .then(response => response.json())
          .then(data => {
              // Process the conversation thread from the API response
              let conversationBody = data.body.content; // HTML or plain text depending on response format
              prepopulateReply(conversationBody); // Use the thread in your reply
          })
          .catch(error => {
              console.error("Error fetching conversation thread: " + error);
              prepopulateDefaultReply(); // Use a default reply if thread is missing
          });
      } else {
          console.error("Error retrieving access token: " + result.error.message);
      }
  });
}

I am getting the itemId which is a hash value and on subsequent call to fetch the message fetch(getMessageUrl it throws 401 even though I am using same mechanism to retrieve token and token is attached in the header as it should be.

Can anyone help on finding the cause of it? Thanks for any kind of help.