Something's gone wrong (Next JS)

Question

Hello there. I recently added the Intercom SDK to my Next JS web app. The problem is that when a user is not authenticated and opens the chat and then tries to log in.After logging in, they will receive the attached screenshot error when they try to open a new chat or read the old chat.I added logs to the useEffect and correctly sent user data to the Intercom as options.After reloading the page, it works properly. And I have to mention that if I don’t open the chat before logging in and try to log in, it works well. The problem occurs exactly when I open the chat, for example, on the Login page, and then attempt to log in.Here is my Intercom provider, which wrapped `_app.js`: import Intercom, { shutdown } from '@intercom/messenger-js-sdk';import { InitType } from '@intercom/messenger-js-sdk/dist/types';import { isEmpty } from 'lodash';import { ReactNode, useEffect, useMemo } from 'react';import { useSelector } from 'react-redux';import { selectBusiness, selectUser } from 'features/auth/authSlice';import { getTopAuthorityName } from 'utils';export const APP_ID = process.env.NEXT_PUBLIC_INTERCOM_APP_ID as string;interface Props { children: ReactNode;}type IntercomOptions = InitType & Record;export const IntercomProvider = ({ children }: Props) => { const user = useSelector(selectUser); const business = useSelector(selectBusiness); const intercomOptions = useMemo(() => { if (isEmpty(user) || !user?.intercomUserHash) { return { app_id: APP_ID }; } const options: IntercomOptions = { app_id: APP_ID, name: `${user.firstName} ${user.lastName}`, email: user.email, user_hash: user.intercomUserHash, user_status: user.status, user_role: getTopAuthorityName(user.authorities), }; if (!isEmpty(business)) { if (business?.status) { options.business_status = business.status; } if (business?.plan?.name) { options.business_plan_name = business.plan.name; } if (business?.name) { options.business_name = business.name; } } return options; }, [user, business]); useEffect(() => { shutdown(); Intercom(intercomOptions); return () => { shutdown(); }; }, [intercomOptions]); return <>{children};};

Paul Byrne · Accepted Answer

Hey ​@Amin AzimiPaul, weekend support engineer here 👋You're encountering a known issue where Intercom's Messenger fails to properly transition from an anonymous to an identified user session in single-page apps like Next.js. When a user opens the chat while unauthenticated and then logs in without a full page reload, Intercom may still retain the anonymous session internally, even if you call shutdown() and re-initialize it.This leads to errors like “Sorry, we couldn’t find your messages” because the Messenger is trying to access a conversation tied to the old session. To fix this, ensure you call shutdown() right before the login process begins, and only reinitialize Intercom after the login is complete and user data is fully available. If issues persist, a one-time window.location.reload() after login can fully reset the session and Messenger state.

Alessandro · Answer

Hey there!We had the same issue where Intercom showed “Sorry, we couldn’t find your messages” after a user opened the chat while logged out, then logged in,without reloading the page.When chat is opened before login, Intercom creates an anonymous session. Even after calling shutdown() and reinitializing, it may not fully reset the session without a reload.Our solution:We check if the user has changed (e.g., just logged in). If so, we:Shut down IntercomBoot it fresh with just the app IDAfter a short delay, update it with the logged-in user's detailsThis cleanly resets the session without needing a full page reload.Code Snippet:useEffect(() => {  const userId = user?.id || null;  const hasUserChanged = prevUserId.current && prevUserId.current !== userId;  if (hasUserChanged) {    Intercom.shutdown(); // Close previous session    Intercom.boot({ app_id: intercomAppId }); // Start fresh    setTimeout(() => {      Intercom.update({        app_id: intercomAppId,        name: user.name,        email: user.email,        user_hash: user.intercom_hash,      });    }, 100); // Delay to let Intercom reset properly    prevUserId.current = userId;  }}, [user]);This fully fixed the issue in our Next.js app. Hope it helps someone else!

Join the Intercom Community 🎉

Intercom Customers and Employees

Login to the community

Intercom Customers and Employees

Scanning file for viruses.

This file cannot be downloaded