Error and Success Notifications Triggering Incorrectly Based on Interaction Order, Despite Correct "When" conditions Setup

Issues
1

This is a follow up issue to a past fixed issue Error notifications not invoked in published mode after the changes of HTTP error message from the data source in studio environment now matching the production environment.

I’m facing an issue where notifications work but only based on the order in which they are set up in the interaction list, rather than the “when” conditions. Here’s a breakdown:

Here is the project it only contains the component and form with the issue. Plasmic

Project Context: A login page using Supabase for authentication.
Success Case: Supabase returns statusCode 200.
Error Case: Supabase returns statusCode 400.

If the user enters a wrong email or password, you get a response from Supabase with an error object having statusCode 400 as below ( You can just enter any email and password e.g email@example.com and pass: 12345678)

  1. {error: Object}
  2. :arrow_forward:error: Object
    1. :arrow_forward:error: Object
    1. :arrow_forward:details: Object
    2. statusCode: 400
    3. __plasmicIgnoreError: true
    4. message: “”

Here is my notification setup for this error. (It has a when condition $state.userSignIn.error.statusCode == 400)

Screenshot 2024-09-14 at 3.30.26 AM
Screenshot 2024-09-14 at 3.30.26 AM542×1670 56.3 KB

When its a success you get a response from Supabase with the data and a statusCode 200 as below: ( You can use email: email@example.com and Pass: 87654321, I have prepared that user for you in the database to get a success status)

  1. {data: Object}
  2. :arrow_forward:data: Object
    1. :arrow_forward:response: Object
    2. statusCode: 200
    3. :arrow_forward:headers: Object

Here is my notification setup for this success with a when condition $state.userSignIn.data.statusCode == 200

Screenshot 2024-09-14 at 3.31.00 AM
Screenshot 2024-09-14 at 3.31.00 AM544×1444 46.5 KB

OK now THE PROBLEM
Even though I’ve set up the “when” conditions properly (i.e., $state.userSignIn.error.statusCode == 400 for errors and $state.userSignIn.data.statusCode == 200 for success), the behavior changes depending on whether I place the error notification before the success notification, or vice versa.

  1. When error notification is placed first in the interactions list, it works, but the success notification doesn’t.

Screenshot 2024-09-14 at 3.29.21 AM
Screenshot 2024-09-14 at 3.29.21 AM544×790 23.3 KB

  1. When success notification is placed first, it works, but the error notification doesn’t.

Screenshot 2024-09-14 at 3.30.02 AM
Screenshot 2024-09-14 at 3.30.02 AM540×788 23.2 KB

Shouldn’t the “when” statements be sufficient to handle this behavior regardless of the interaction order?

This used to work fine before the changes to the HTTP error message format. Could this be a bug related to how interactions are processed, or is there something I’m missing?

2

Hello @ahmed_makki, thank you for the detailed explanation of your issue!

The issue appears to be in the code expressions added inside the “when” conditions. Here’s what you can do to fix these:

  1. In Error? Stop submit interaction, fix the “when” condition: $state.userSignIn.data?.statusCode !== 200
  2. In Error 400 invalid login interaction as well, use the aforementioned expression in the “when” condition : $state.userSignIn.data?.statusCode !== 200
  3. In Error 400 invalid login interaction, also fix the expression in the message field. Use $state.userSignIn.error?.details?.msg
  4. In 200 success notification interaction, fix the “when” condition: $state.userSignIn.data?.statusCode == 200
1 Like
3

Thank you @sarah_ahmed, Worked like a charm. I’m guessing this should be in studio questions instead of issues, since its from my side.

1 Like