Bug Report : Inefficient Snackbar System Causing Message Conflicts

[may-tas]

Describe the bug

• The current snackbar implementation in the canvas screen has several critical issues:

1. Message Overshadowing: The BlocConsumer listener automatically shows snackbars for any state.message using only CustomSnackbar.showInfo(), which can overshadow other snackbars triggered by user actions (like undo, redo, clear canvas operations).

2. Limited Snackbar Types: The automatic message system only uses showInfo(), preventing the use of showSuccess() or showError() snackbars for appropriate contextual feedback.

3. Inefficient State Management: The current system requires a message parameter in the state that needs to be manually cleared after each use, leading to unnecessary state updates and potential race conditions.

To Reproduce
Steps to reproduce the behavior:

• Open the canvas screen
• Perform an action that triggers a direct snackbar (e.g., click "Undo" when there's nothing to undo)
• Immediately perform a save/load operation that sets state.message
• Observe that the save/load snackbar may overshadow or conflict with the previous snackbar
• Notice that all automatic snackbars are blue "info" type, regardless of whether they should be success (green) or error (red)

Expected behavior

• Each snackbar should be displayed independently without conflicts
• Success operations (like successful save) should show green success snackbars
• Error operations (like failed save/load) should show red error snackbars
• Info operations should show blue info snackbars
• Multiple snackbars should queue properly or replace each other gracefully
• No unnecessary state updates for temporary UI feedback

Actual behavior

• Snackbars can conflict with each other
• All automatic snackbars are forced to be "info" type (blue)
• State contains a message field that requires manual clearing
• The BlocConsumer listener creates tight coupling between state and UI feedback

Current Problematic Code Location

• File: canvas_screen.dart (lines 224-229)

// Show snackbar when there's a message from save/load operations
if (state.message != null) {
  CustomSnackbar.showInfo(state.message!);
  // Clear the message after showing
  context.read<CanvasCubit>().clearMessage();
}

Suggested Solution
Replace the current message state system.

• Remove message from CanvasState - UI feedback shouldn't be part of business logic state
• Implement snackbar queuing - Ensure multiple snackbars don't conflict
• Let developers use snackbars like this, e.g CustomSnackbar.showSuccess("New page Created"); instead of listening through state changes.

Additional details
Add any other context or screenshots about the feature request here.

[github-actions]

Thank you for opening this issue! 🚀 Our team will review it soon. Please make sure you've included all relevant details and followed our Contributing Guidelines. For questions about our project, check out our README and Code of Conduct.

[may-tas]

This issue is quite simple. We need to remove the problematic code and get rid of the message parameter from the state files.

I’ve classified this as a level 2 issue to encourage contributors to carefully review the information in the description and accurately determine the appropriate level for this task.

We’re actively seeking to boost participation in this project, so I’m awarding extra points for contributions that engage more people.

As I take on this role for the first time, I am confident that it will inspire more contributors to take action and report new issues, whether for added features or fixing existing bugs in the codebase.

Thank you.

[zxnb01]

hi @may-tas ,

after saving the page, when we try to use drawing canvas, the snackbar kept repeating the same thng and the red, green and info opt in snackbar werent present.

so here is the update:

20250929-1137-10.5997818.mp4

Appropriate Colors:
Green snackbars for success (saves, loads, uploads)
Red snackbars for errors (failures, not found)
Blue snackbars for info (removals, new page creation)

my approach:

1. Removed Message from CanvasState ✅
   Removed message field from CanvasState class
   Removed clearMessage() method from CanvasCubit
   Updated constructor, copyWith, equals operator, and hashCode to exclude message

2. Updated CanvasCubit Methods ✅
   Replaced all emit(state.copyWith(message: ...)) calls with direct CustomSnackbar calls:
   Background image operations:
   CustomSnackbar.showSuccess() for successful uploads/captures
   CustomSnackbar.showError() for failures
   CustomSnackbar.showInfo() for removal

Page operations:
CustomSnackbar.showSuccess() for successful saves/loads/deletes/clears
CustomSnackbar.showError() for failures/not found
CustomSnackbar.showInfo() for new page creation

3. Updated Canvas Screen
   Replaced BlocConsumer with BlocBuilder
   Removed the problematic listener that was automatically showing snackbars
   Removed references to clearMessage()

[may-tas]

@zxnb01 assigned.

[zxnb01]

shall i raise the pr?

[zxnb01]

These are the key changes made:
Removes the message field from CanvasState and related state management.
Replaces automatic snackbar display in BlocConsumer with direct calls to CustomSnackbar.showSuccess(), showError(), and showInfo() in the relevant cubit methods.
Ensures snackbars use appropriate colors for success, error, and info feedback.
Prevents snackbar conflicts and improves UI responsiveness.
Cleans up state management for better separation of business logic and UI feedback.

and the demo is attached above