wcz-layout/skills/notifications/SKILL.md

---

name: notifications
description: "Use when: displaying success, error, warning, or informational feedback with snackbars or async user actions."
---


## Rules

- Use `useNotification()` for lightweight non-blocking user feedback.
- Always use translation; add new keys for feature-specific messages.
- Notifications are automatically queued and stacked by the provider.
- Always set `autoHideDuration` between 5000 and 10000 ms to prevent stale messages.
- Use `severity: "success" | "info" | "warning" | "error"` consistently with the outcome.
- Use notifications for lightweight feedback; dialogs when the user must decide or acknowledge.

## File Placement

```txt
wcz-layout/hooks                       — useNotification hook, useTranslation
src/lib/locales/                       — translation keys
```

## Examples

```ts
// basic usage
const { notify } = useNotification();
const { t } = useTranslation();

notify(t("Feature.Created"), {
  severity: "success",
  autoHideDuration: 6000,
});

// error handling
try {
  await deleteFeature({ data: id });
} catch (error) {
  notify(error instanceof Error ? error.message : t("DeleteFailed"), {
    severity: "error",
    autoHideDuration: 10000,
  });
}
```