[$150] mWeb - Attachments-Infinite preview loading when sending attachment after multiple sent

[lanitochka17]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Version Number: 9.2.13-1
Reproducible in staging?: Y
Reproducible in production?: Y
If this was caught during regression testing, add the test name, ID and link from TestRail: N/A
Issue reported by: Applause - Internal Team

Action Performed:

1. Open a new incognito window and navigate to https://staging.chat.expensify.com/,
   sign in
2. Create a chat with another account
3. Tap + button - Add attachment - Choose file or Photo library
4. Select 3 attachments (images, pdf files), send
5. Open the preview of the last sent attachment, navigate back to the chat
6. Tap + button again - Add attachment
7. Select another attachment to send
8. Observe the attachment page

Expected Result:

The attachment is displayed

Actual Result:

Infinite loading spinner is displayed

Workaround:

Unknown

Platforms:

Select the officially supported platforms where the issue was reproduced:

• Android: App
• Android: mWeb Chrome
• iOS: App
• iOS: mWeb Safari
• iOS: mWeb Chrome
• Windows: Chrome
• MacOS: Chrome / Safari
• MacOS: Desktop

Platforms Tested:

On which of our officially supported platforms was this issue tested:

• Android: App
• Android: mWeb Chrome
• iOS: App
• iOS: mWeb Safari
• iOS: mWeb Chrome
• Windows: Chrome
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Add any screenshot/video evidence

0-02-01-190fa863e676ea45afdd6127b043afd3cf3a8ae180d2c5dea4d655ddd0a56791_f015f731f233c4c7.1.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021967443883365554925
• Upwork Job ID: 1967443883365554925
• Last Price Increase: 2025-09-15

Issue Owner

Current Issue Owner: @jasperhuangg

[melvin-bot]

Triggered auto assignment to @alexpensify (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[mukhrr]

Proposal

Please re-state the problem that we are trying to solve in this issue.

Users experience an infinite loading spinner when trying to add attachments after previewing them. The specific scenario is:

• User creates a chat and adds 3 attachments
• User opens preview of the last sent attachment, then navigates back to chat
• User taps + button again to add another attachment
• Instead of showing the attachment, an infinite loading spinner appears

What is the root cause of that problem?

This is most likely coming from #70061.
The useAttachmentLoaded hook maintains attachment loading state across navigation.

App/src/hooks/useAttachmentLoaded.ts

Lines 20 to 45 in 3938e13

	function useAttachmentLoaded() {
	const [attachmentLoaded, setAttachmentLoaded] = useState<Record<string, boolean>>({});
	const setAttachmentLoadedState = useCallback((key: AttachmentSource, state = true) => {
	const url = convertSourceToString(key);
	if (!url) {
	return;
	}
	setAttachmentLoaded((prevState) => ({
	...prevState,
	[url]: state,
	}));
	}, []);
	const clearAttachmentLoaded = useCallback(() => {
	setAttachmentLoaded({});
	}, []);
	const isAttachmentLoaded = useCallback((key: AttachmentSource) => !!attachmentLoaded?.[convertSourceToString(key)], [attachmentLoaded]);
	return {
	setAttachmentLoaded: setAttachmentLoadedState,
	clearAttachmentLoaded,
	isAttachmentLoaded,
	};
	}

When users preview an attachment and navigate back, the loading state persists. When they try to add new attachments, the stale loading state causes the spinner to show indefinitely because the attachment loading state was NEVER CLEARED.

What changes do you think we should make in order to solve the problem?

We should clear the attachment loading state in the AttachmentComposerModal component:

          <Modal
                type={modalType}
                onClose={closeModal}
                isVisible={isModalOpen}
                onModalShow={() => {
                    onModalShow();
                }}
                onModalHide={() => {
                    onModalHide();
                    clearAttachmentErrors();
                    clearAttachmentLoaded();
                    setValidFilesToUpload([]);
                    setAttachments([]);
                    setCurrentAttachment(null);
                    setPage(0);
                }}
             ...

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

N/A

What alternative solutions did you explore? (Optional)

We may also modify the useAttachmentLoaded hook itself to automatically clear state on navigation.

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~021967443883365554925

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @rushatgabhane (External)

[alexpensify]

@rushatgabhane - When you get a chance, please review if this proposal will fix the issue? Thanks!

[rushatgabhane]

yes that should work

@mukhrr 's proposal LGTM
#70521 (comment)

🎀 👀 🎀

[melvin-bot]

Triggered auto assignment to @jasperhuangg, see https://stackoverflow.com/c/expensify/questions/7972 for more details.