forked from jsnbuchanan/crowd-funder-for-time-pwa
Refactor notification usage and apply TypeScript/lint improvements
- Replaced direct $notify calls with notification helper utilities for consistency and reduced duplication. - Updated AccountViewView.vue, PlatformServiceMixin.ts, and ShareMyContactInfoView.vue to use notification helpers. - Added explicit TypeScript types and constants for notification patterns. - Suppressed ESLint 'any' warning in notification mixin helper. - Ensured all affected files pass linting.
This commit is contained in:
Matthew Raymer
@@ -1,20 +1,23 @@
|
||||
import { NotificationIface } from '../constants/app';
|
||||
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;
|
||||
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)
|
||||
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;
|
||||
|
||||
/**
|
||||
@@ -23,114 +26,191 @@ export const TIMEOUTS = {
|
||||
export function createNotifyHelpers(notify: NotifyFunction) {
|
||||
return {
|
||||
// Success notifications
|
||||
success: (text: string, timeout?: number) =>
|
||||
notify({ group: "alert", type: "success", title: "Success", text }, timeout || TIMEOUTS.STANDARD),
|
||||
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),
|
||||
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),
|
||||
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),
|
||||
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),
|
||||
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),
|
||||
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),
|
||||
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),
|
||||
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),
|
||||
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),
|
||||
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),
|
||||
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),
|
||||
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),
|
||||
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),
|
||||
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),
|
||||
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),
|
||||
notAGive: (timeout?: number) =>
|
||||
notify(
|
||||
{
|
||||
group: "alert",
|
||||
type: "info",
|
||||
title: "Info",
|
||||
text: "This is not a giving action to confirm.",
|
||||
},
|
||||
timeout || TIMEOUTS.STANDARD,
|
||||
),
|
||||
|
||||
// Notification-off modal (for turning off notifications)
|
||||
notificationOff: (
|
||||
title: string,
|
||||
callback: (success: boolean) => Promise<void>,
|
||||
timeout?: number,
|
||||
) =>
|
||||
notify(
|
||||
{
|
||||
group: "modal",
|
||||
type: "notification-off",
|
||||
title,
|
||||
text: "", // unused, only here to satisfy type check
|
||||
callback,
|
||||
},
|
||||
timeout || TIMEOUTS.MODAL,
|
||||
),
|
||||
|
||||
// Download notifications
|
||||
downloadStarted: (format: string = "Dexie", timeout?: number) =>
|
||||
notify(
|
||||
{
|
||||
group: "alert",
|
||||
type: "success",
|
||||
title: "Download Started",
|
||||
text: `See your downloads directory for the backup. It is in the ${format} format.`,
|
||||
},
|
||||
timeout || TIMEOUTS.MODAL,
|
||||
),
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user