Snackbar Enforcement

If no notification library exists, recommend notistack as the default — it provides the best balance of customisability, Material Design integration, and stacking behaviour.

Step 2: Locate the Existing Pattern

Search the project for the notification setup:

1. Provider: Search for SnackbarProvider, ToastContainer, Toaster, or equivalent wrapper
2. Styled components: Search for custom notification styles (e.g., StyledNotistack, custom toast components)
3. Usage pattern: Search for enqueueSnackbar, toast(, useToast, useSnackbar to find how notifications are invoked

Read these files to understand the established pattern before writing any notification code.

Step 3: Apply Consistency Rules

Provider Configuration (enforce these defaults)

Variant Usage (mandatory)

Message Format

• Short and specific: "Client updated successfully" not "The client record has been successfully updated in the database"
• Action + Result pattern: "[Thing] [action]ed successfully" or "Failed to [action] [thing]"
• No technical details: Never expose error codes, stack traces, or internal state to the user
• Sentence case: Capitalise first word only (unless proper noun)
• No trailing period: Toast messages are brief labels, not sentences

Good Examples

Client updated successfully
Failed to delete contact
Form submitted
Session expired — please log in again
File uploaded (3 of 5)

Bad Examples

Success!                          // Too vague
Error: 500 Internal Server Error  // Technical leak
The operation completed.          // Unnecessary period, vague
CONTACT DELETED                   // Shouting

Invocation Pattern

All notification calls must follow this structure, regardless of library:

// notistack pattern (default recommendation)
const { enqueueSnackbar } = useSnackbar();

// Success
enqueueSnackbar('Client created successfully', { variant: 'success' });

// Error
enqueueSnackbar('Failed to create client', { variant: 'error' });

// Warning
enqueueSnackbar('This action cannot be undone', { variant: 'warning' });

// Info
enqueueSnackbar('Changes saved as draft', { variant: 'info' });

Styling Requirements

Regardless of library, notification styling must:

• Use the project's theme typography (not hardcoded fonts/sizes)
• Use theme palette colours for variant backgrounds/icons
• Support light and dark mode
• Include custom icons per variant (not plain text)
• Use theme border radius and shadow tokens
• Have consistent padding: icon area + message + close button

Architecture Requirements

• Single provider: One notification provider wrapping the entire app (inside ThemeProvider)
• Re-export pattern: Export the notification hook from a local components/snackbar/index (or equivalent) so the library can be swapped without touching every consumer
• No direct library imports in feature code: Features import from the project's wrapper, not directly from notistack/react-hot-toast/etc.

// components/snackbar/index.ts (or equivalent)
export * from 'notistack'; // re-export everything
export { default as SnackbarProvider } from './snackbar-provider';

This pattern means swapping the underlying library only requires changing the wrapper — not every file that shows a notification.

Step 4: Flag Violations

When violations are found:

1. State the violation with the specific rule
2. Show the current code that violates the pattern
3. Show the fix matching the project's established pattern

Example:

SNACKBAR: Inconsistent message format
Rule: Messages must follow "Action + Result" pattern (Snackbar Standards > Message Format)

Found: enqueueSnackbar('Success!', { variant: 'success' })
Fix:   enqueueSnackbar('Invoice created successfully', { variant: 'success' })

Step 5: Proactive Enforcement

When writing code alongside the user, proactively:

• Add appropriate snackbar calls after CRUD operations (create, update, delete)
• Add error notifications in catch blocks for user-facing operations
• Use the correct variant for the context (don't default everything to success)
• Follow the project's existing import path for the notification hook
• Ensure new notification messages match the tone and format of existing ones