Add notification utility helpers and update PlatformServiceMixin

Created notification utility approaches to consolidate verbose $notify calls:
- Simple function utility (src/utils/notify.ts) - recommended approach
- Vue 3 composable (src/composables/useNotifications.ts)
- Utility class with mixin (src/utils/notificationUtils.ts)

Updated ClaimView.vue to demonstrate usage, reducing notification code by ~70%.
Enhanced PlatformServiceMixin with improved caching and database methods.
Updated ShareMyContactInfoView.vue with mixin improvements.
Provides consistent timeouts, standardized patterns, and type safety.
Ready for migration alongside mixin updates.
This commit is contained in:
Matthew Raymer
2025-07-05 11:37:20 +00:00
parent ddee99cb0b
commit b2a2387f1a
6 changed files with 683 additions and 188 deletions

136
src/utils/notify.ts Normal file
View File

@@ -0,0 +1,136 @@
import { NotificationIface } from '../constants/app';
/**
* Simple notification utility functions
* Provides the most concise API for common notification patterns
*/
export type NotifyFunction = (notification: NotificationIface, timeout?: number) => void;
// Standard timeouts
export const TIMEOUTS = {
BRIEF: 1000, // Very brief toasts ("Sent..." messages)
SHORT: 2000, // Short notifications (clipboard copies, quick confirmations)
STANDARD: 3000, // Standard notifications (success messages, general info)
LONG: 5000, // Longer notifications (errors, warnings, important info)
VERY_LONG: 7000, // Very long notifications (complex operations)
MODAL: -1, // Modal confirmations (no auto-dismiss)
} as const;
/**
* Create notification helpers for a given notify function
*/
export function createNotifyHelpers(notify: NotifyFunction) {
return {
// Success notifications
success: (text: string, timeout?: number) =>
notify({ group: "alert", type: "success", title: "Success", text }, timeout || TIMEOUTS.STANDARD),
// Error notifications
error: (text: string, timeout?: number) =>
notify({ group: "alert", type: "danger", title: "Error", text }, timeout || TIMEOUTS.LONG),
// Warning notifications
warning: (text: string, timeout?: number) =>
notify({ group: "alert", type: "warning", title: "Warning", text }, timeout || TIMEOUTS.LONG),
// Info notifications
info: (text: string, timeout?: number) =>
notify({ group: "alert", type: "info", title: "Info", text }, timeout || TIMEOUTS.STANDARD),
// Toast notifications (brief)
toast: (title: string, text?: string, timeout?: number) =>
notify({ group: "alert", type: "toast", title, text }, timeout || TIMEOUTS.BRIEF),
// Clipboard copy notifications
copied: (item: string, timeout?: number) =>
notify({
group: "alert",
type: "toast",
title: "Copied",
text: `${item} was copied to the clipboard.`
}, timeout || TIMEOUTS.SHORT),
// Sent brief notification
sent: (timeout?: number) =>
notify({ group: "alert", type: "toast", title: "Sent..." }, timeout || TIMEOUTS.BRIEF),
// Confirmation modal
confirm: (text: string, onYes: () => Promise<void>, timeout?: number) =>
notify({
group: "modal",
type: "confirm",
title: "Confirm",
text,
onYes
}, timeout || TIMEOUTS.MODAL),
// Standard confirmation messages
confirmationSubmitted: (timeout?: number) =>
notify({
group: "alert",
type: "success",
title: "Success",
text: "Confirmation submitted."
}, timeout || TIMEOUTS.STANDARD),
// Common error patterns
genericError: (timeout?: number) =>
notify({
group: "alert",
type: "danger",
title: "Error",
text: "Something went wrong."
}, timeout || TIMEOUTS.LONG),
// Common success patterns
genericSuccess: (timeout?: number) =>
notify({
group: "alert",
type: "success",
title: "Success",
text: "Operation completed successfully."
}, timeout || TIMEOUTS.STANDARD),
// Common confirmation patterns
alreadyConfirmed: (timeout?: number) =>
notify({
group: "alert",
type: "info",
title: "Already Confirmed",
text: "You already confirmed this claim."
}, timeout || TIMEOUTS.STANDARD),
cannotConfirmIssuer: (timeout?: number) =>
notify({
group: "alert",
type: "info",
title: "Cannot Confirm",
text: "You cannot confirm this because you issued this claim."
}, timeout || TIMEOUTS.STANDARD),
cannotConfirmHidden: (timeout?: number) =>
notify({
group: "alert",
type: "info",
title: "Cannot Confirm",
text: "You cannot confirm this because some people are hidden."
}, timeout || TIMEOUTS.STANDARD),
notRegistered: (timeout?: number) =>
notify({
group: "alert",
type: "info",
title: "Not Registered",
text: "Someone needs to register you before you can confirm."
}, timeout || TIMEOUTS.STANDARD),
notAGive: (timeout?: number) =>
notify({
group: "alert",
type: "info",
title: "Info",
text: "This is not a giving action to confirm."
}, timeout || TIMEOUTS.STANDARD),
};
}