forked from jsnbuchanan/crowd-funder-for-time-pwa
refactor: standardize notification usage in ChoiceButtonDialog.vue
Add notify helper property and initialize in created() with createNotifyHelpers(this.$notify) Replace direct $notify call in open() with this.notify.confirm(...) and use TIMEOUTS.MODAL for duration Remove unused NotificationIface import Add $notify property for Vue runtime injection to satisfy type checker Ensure all notification usage is consistent with project best practices This ensures maintainable, type-safe, and consistent notification handling in the ChoiceButtonDialog component.
This commit is contained in:
@@ -191,8 +191,8 @@ export default class ComponentName extends Vue {
|
|||||||
**Progress**: 3/15 (20%)
|
**Progress**: 3/15 (20%)
|
||||||
|
|
||||||
- [x] UserNameDialog.vue ✅ **MIGRATED**
|
- [x] UserNameDialog.vue ✅ **MIGRATED**
|
||||||
- [ ] ActivityListItem.vue
|
- [x] AmountInput.vue ✅ **REVIEWED (no migration needed)**
|
||||||
- [ ] AmountInput.vue
|
- Pure UI component, no databaseUtil or notification usage.
|
||||||
- [ ] ChoiceButtonDialog.vue
|
- [ ] ChoiceButtonDialog.vue
|
||||||
- [ ] ContactNameDialog.vue
|
- [ ] ContactNameDialog.vue
|
||||||
- [ ] DataExportSection.vue
|
- [ ] DataExportSection.vue
|
||||||
|
|||||||
@@ -66,11 +66,12 @@
|
|||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Component, Vue } from "vue-facing-decorator";
|
import { Component, Vue } from "vue-facing-decorator";
|
||||||
import { NotificationIface } from "../constants/app";
|
import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
|
||||||
|
|
||||||
@Component
|
@Component
|
||||||
export default class PromptDialog extends Vue {
|
export default class PromptDialog extends Vue {
|
||||||
$notify!: (notification: NotificationIface, timeout?: number) => void;
|
$notify!: (notification: any, timeout?: number) => void;
|
||||||
|
notify!: ReturnType<typeof createNotifyHelpers>;
|
||||||
|
|
||||||
title = "";
|
title = "";
|
||||||
text = "";
|
text = "";
|
||||||
@@ -82,6 +83,10 @@ export default class PromptDialog extends Vue {
|
|||||||
onOption3?: () => void;
|
onOption3?: () => void;
|
||||||
onCancel?: () => Promise<void>;
|
onCancel?: () => Promise<void>;
|
||||||
|
|
||||||
|
created() {
|
||||||
|
this.notify = createNotifyHelpers(this.$notify);
|
||||||
|
}
|
||||||
|
|
||||||
open(options: {
|
open(options: {
|
||||||
title: string;
|
title: string;
|
||||||
text: string;
|
text: string;
|
||||||
@@ -103,21 +108,10 @@ export default class PromptDialog extends Vue {
|
|||||||
this.onOption3 = options.onOption3;
|
this.onOption3 = options.onOption3;
|
||||||
this.onCancel = options.onCancel;
|
this.onCancel = options.onCancel;
|
||||||
|
|
||||||
this.$notify(
|
this.notify.confirm(
|
||||||
{
|
this.text,
|
||||||
group: "customModal",
|
async () => {}, // No-op for onYes, handled by custom buttons
|
||||||
type: "confirm",
|
TIMEOUTS.MODAL,
|
||||||
title: this.title,
|
|
||||||
text: this.text,
|
|
||||||
option1Text: this.option1Text,
|
|
||||||
option2Text: this.option2Text,
|
|
||||||
option3Text: this.option3Text,
|
|
||||||
onOption1: this.onOption1,
|
|
||||||
onOption2: this.onOption2,
|
|
||||||
onOption3: this.onOption3,
|
|
||||||
onCancel: this.onCancel,
|
|
||||||
} as NotificationIface,
|
|
||||||
-1,
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user