This is my code file where i am trying to add filters on inbox and sent items using microsoft graph api:
const GraphApiTest = ({ email }) => {
const emailsPerPage = 5;
const [inboxPage, setInboxPage] = useState(1);
const [sentPage, setSentPage] = useState(1);
const [inboxEmails, setInboxEmails] = useState([]);
const [selectedEmail, setSelectedEmail] = useState(null);
const [sentEmails, setSentEmails] = useState([]);
const [loading, setLoading] = useState("");
const [emailsData, setEmailsData] = useState({});
const msalInstance = new PublicClientApplication(msalConfig);
const users = [
"[email protected]",
"[email protected]",
"[email protected]",
]; // Add the user emails here
useEffect(() => {
if (email) {
loginAndFetchEmails();
}
}, [email]);
const loginAndFetchEmails = async () => {
try {
await msalInstance.initialize();
const accounts = msalInstance.getAllAccounts();
if (accounts.length === 0) {
await msalInstance.loginPopup({
scopes: ["Mail.Read", "Mail.Send", "User.Read"],
});
}
const account = msalInstance.getAllAccounts()[0];
let tokenResponse;
try {
tokenResponse = await msalInstance.acquireTokenSilent({
account,
scopes: ["Mail.Read", "Mail.Send", "User.Read"],
});
} catch (silentError) {
console.warn("Silent token acquisition failed, fallback to popup.");
tokenResponse = await msalInstance.acquireTokenPopup({
account,
scopes: ["Mail.Read", "Mail.Send", "User.Read"],
});
}
const accessToken = tokenResponse.accessToken;
setLoading(true);
// Fetch received emails (Inbox)
const fetchedEmails = {};
for (const user of users) {
const inboxResponse = await axios.get(
`https://graph.microsoft.com/v1.0/users/${user}/mailFolders('inbox')/messages?$filter=from/emailAddress/address eq '${email}'`,
{
headers: {
Authorization: `Bearer ${accessToken}`,
},
}
);
// Fetch sent emails
const sentResponse = await axios.get(
`https://graph.microsoft.com/v1.0/users/${user}/mailFolders('sentitems')/messages`,
{
headers: {
Authorization: `Bearer ${accessToken}`,
},
}
);
fetchedEmails[user] = {
inbox: inboxResponse.data.value,
sent: sentResponse.data.value,
};
}
// Update state with emails for all users
setEmailsData(fetchedEmails);
} catch (error) {
console.error("Error during login or fetching emails:", error);
} finally{
setLoading(false);
}
};
const paginateEmails = (emails, page) => {
const start = (page - 1) * emailsPerPage;
const end = start + emailsPerPage;
return emails.slice(start, end);
};
const inboxEmailsPaginated = paginateEmails(inboxEmails, inboxPage);
const sentEmailsPaginated = paginateEmails(sentEmails, sentPage);
const totalInboxPages = Math.ceil(inboxEmails.length / emailsPerPage);
const totalSentPages = Math.ceil(sentEmails.length / emailsPerPage);
const openModal = (email) => {
setSelectedEmail(email);
};
const closeModal = () => {
setSelectedEmail(null);
};
export default GraphApiTest;
In this code when i am adding filter on inbox folders its working fine and giving me the filtered emails from that email address but for sent items when i try this :
const sentResponse = await axios.get(
`https://graph.microsoft.com/v1.0/users/${user}/mailFolders/sentitems/messages?$filter=toRecipients/any(t:t/emailAddress/address eq '${email}')`,
{
headers: {
Authorization: `Bearer ${accessToken}`,
},
}
);
It gives the error 400 and says invalid uri,, How can i add a filter on sent items folder too?? I have tried many ways but whenever i add a filter on sent items it always gives error while for inbox it works fine.
Recognized by Microsoft Azure Collective