Fix: Confirm Modal Missing When Creating Report

by ADMIN 48 views

Hey guys! Let's dive into a tricky issue we've been tackling: the missing confirmation modal when creating a report from the empty state in the Reports section. This article will walk you through the problem, the steps to reproduce it, and the affected platforms. We'll also touch on the expected and actual results, and whether there's a workaround. So, buckle up, and let's get started!

The Issue: Missing Confirmation Modal

Our main keyword here is the missing confirmation modal. When creating a report from the empty state in the Reports section, a confirmation modal should pop up to ensure you're on the right track. However, in certain scenarios, this modal isn't showing up, which can lead to confusion and a less-than-ideal user experience. This is a pretty crucial part of the workflow, so let's get into the specifics.

The absence of the confirmation modal disrupts the user flow, making it less intuitive. Users might wonder if their action was registered, leading to unnecessary clicks or confusion. A well-placed confirmation modal serves as a checkpoint, ensuring users are aware of their actions and reducing potential errors. For example, imagine you're creating an expense report and accidentally click the 'Create report' button. The confirmation modal acts as a safety net, giving you a chance to review and confirm your action before proceeding.

This issue was caught during regression testing, specifically under this BrowserStack link: https://github.com/Expensify/App/pull/71609. This means our awesome testing team flagged it, ensuring we catch these glitches before they impact our users. Knowing the context of how and where an issue was identified helps us prioritize and address it efficiently.

Reproducing the Issue: Step-by-Step

To really understand the problem, let's walk through the exact steps to reproduce it. This way, you can see the issue firsthand and grasp the context.

  1. Go to staging.new.expensify.com: First things first, head over to our staging environment. This is where we test new features and bug fixes before they go live.
  2. Log in with a new account: Create a fresh account or use a test account. This ensures we're starting from a clean slate.
  3. Go to workspace chat: Navigate to your workspace chat within the app.
  4. Create two reports: Generate a couple of reports. This sets the stage for triggering the empty state.
  5. Go to Reports > Submit: Head over to the Reports section and click on Submit. This is where the magic happens.
  6. Click Create report on the empty state: If there are no reports to display, you'll see an empty state with a button to create a new report. Click that button.

If you follow these steps, you should see the issue we're talking about. The confirmation modal, which should appear at this point, doesn't show up.

Expected vs. Actual Result

So, what should happen, and what's actually happening? Let's break it down.

Expected Result:

The expected result is that a confirmation modal should pop up when you click the 'Create report' button from the empty state in the Reports section. This modal would typically ask something like, "Are you sure you want to create a new report?" or provide options to review before proceeding. It's a standard UI element that provides reassurance and prevents accidental actions.

Actual Result:

The actual result, however, is that the confirmation modal does not show up. You click the button, and nothing seems to happen. This can be confusing for users as they might not be sure if their action was registered or if a new report was created. This lack of feedback can lead to frustration and a degraded user experience.

This discrepancy between the expected and actual results highlights the core of the problem. The absence of the confirmation modal breaks the expected user flow, potentially leading to errors and confusion. Addressing this inconsistency is crucial to ensure a smooth and intuitive experience for our users.

Affected Platforms

It's crucial to know where this issue is popping up. Here’s a breakdown of the platforms affected:

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

As you can see, the issue is pretty widespread, affecting various platforms and devices. The good news is that Windows Chrome seems to be in the clear for now! But, for all other listed platforms, the missing confirmation modal is a problem that needs fixing. This broad impact underscores the importance of addressing this issue promptly to ensure a consistent experience across all devices.

Workaround (or Lack Thereof)

Currently, there's no known workaround for this issue. That means users are stuck without a proper confirmation when creating reports from the empty state. This makes it even more critical to get this bug squashed ASAP! Without a workaround, users have no alternative but to proceed without the added security and clarity of a confirmation modal.

The absence of a workaround also highlights the importance of preventative measures like thorough testing. Catching such issues early in the development cycle can prevent widespread disruptions and ensure a smoother user experience. In this case, the issue was caught during regression testing, which is a testament to the effectiveness of our testing processes. However, the need for a workaround emphasizes the continuous effort required to maintain a bug-free environment.

Visual Evidence: Screenshots/Videos

Visual evidence is super helpful in understanding the issue. Here's a link to a video showcasing the problem:

https://github.com/user-attachments/assets/e645b842-088a-46e7-ac6b-486fad432540

Seeing the issue in action makes it much clearer and helps developers pinpoint the root cause more efficiently. It's one thing to read about a bug, but it's another to see it happening in real-time. The video provides a clear and concise demonstration of the missing confirmation modal, leaving no room for ambiguity.

Conclusion: Let's Fix This!

So, there you have it, guys! The missing confirmation modal is a real issue affecting multiple platforms, and it needs our attention. By understanding the steps to reproduce the bug, the expected versus actual results, and the affected platforms, we're better equipped to tackle this problem head-on. Let's get this fixed and ensure a smooth experience for our users!

Remember, every bug fix contributes to a better user experience. By addressing issues like the missing confirmation modal, we build trust and confidence in our product. This collaborative effort, from identifying the problem to implementing the solution, is what drives innovation and excellence in software development.