🐛 fix: support form image bug and telegram bot returns undefined

[greatsamist]

😵 Post-Mortem 😵

Summary

1. Support form creates some super weird interaction when you click on the delete image icon, which is caused by the delete confirmation dialog been hidden behind the support form dialog.
2. Fix Telegram bot returning undefined in the support channel due to wrong form data sent to the backend

Impact

• Services Affected: Support form, Telegram bot integration
• User Impact: Users experienced issues with deleting images in the support form, and Telegram bot messages were not being sent correctly, leading to communication gaps in the support channel.

Root Cause Analysis

1. Hidden Delete Confirmation Dialog: The delete confirmation dialog was hidden behind the support form dialog. This was due to incorrect z-index settings in the CSS, causing the dialog to be non-interactive and confusing users.
2. Telegram Bot Returning Undefined: The Telegram bot was returning undefined due to incorrect form data being sent from the frontend. The form data lacked proper validation and structure, causing the bot to fail in sending the correct messages.

Resolution and Recovery

1. Fix Hidden Delete Confirmation Dialog: Adjusted the CSS z-index values to ensure the delete confirmation dialog appears above the support form dialog. This allows users to interact with the confirmation dialog as expected.
2. Fix Telegram Bot Integration: Corrected the form data sent from the frontend to the backend. Ensured proper validation and structure of the form data, and awaited the Telegram bot message sending operation to handle it asynchronously.

Lessons Learned

1. Always verify the layering of interactive elements in the UI to avoid hidden dialogs and ensure a smooth user experience.
2. Ensure proper validation and structure of form data before sending it to the backend to avoid integration issues with external services like Telegram.
3. Implement thorough error handling and logging to quickly identify and resolve issues in asynchronous operations.

Attachments

Reviewer Checklist:

• Incident details are complete
• Root cause is clearly defined
• Resolution steps are clearly detailed

closes #815

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
streameth-platform	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Aug 8, 2024 0:43am

[Mario-SO]

It is a bit confusing, it says to sign in to send a message but I'm already signed in...

In fact, when I disconnect from privy/walletconnect it is when I can see the old form for submitting a photo and stuff...

[greatsamist]

It is a bit confusing, it says to sign in to send a message but I'm already signed in...

In fact, when I disconnect from privy/walletconnect it is when I can see the old form for submitting a photo and stuff...

Issure resolved.

[Mario-SO]

LGTM