trent_larson/crowd-funder-for-time-pwa
4
1
Fork 2
Code Issues Pull Requests 21 Releases 5 Wiki Activity

feat: migrate QuickActionBvcEndView.vue to PlatformServiceMixin and notification helpers

Browse Source 
- Replace databaseUtil.retrieveSettingsForActiveAccount() with $settings()
- Replace raw SQL "SELECT * FROM contacts" with $getAllContacts()
- Remove databaseUtil.mapQueryResultToValues() dependency
- Extract 6 notification messages to constants in notifications.ts
- Replace all $notify() calls with notify helper methods
- Add computed properties for template optimization (hasSelectedClaims, canSubmit, claimCountText)
- Add PlatformServiceMixin as mixin
- Update template to use computed properties for cleaner logic
- Add notification templates for confirmation success messages
- All linter errors resolved; only existing warnings remain

Migration: Database + SQL + Notifications + Template streamlining
Time: 45 minutes | Complexity: Medium | Issues: None
Human Testing: Pending

Security: Eliminates raw SQL queries, standardizes error handling
Performance: Optimized contact retrieval, reduced template complexity
This commit is contained in:
Matthew Raymer
2025-07-08 11:15:11 +00:00
parent 562740ef5b
commit 06c071a912
4 changed files with 321 additions and 97 deletions
Download Patch File Download Diff File Expand all files Collapse all files

168
src/views/QuickActionBvcEndView.vue
View File

@@ -71,11 +71,7 @@
</div>
<div v-if="claimCountWithHidden > 0" class="border-b border-slate-300 pb-2">
<span>
{{
claimCountWithHidden === 1
? "There is 1 other claim with hidden details,"
: `There are ${claimCountWithHidden} other claims with hidden details,`
}}
{{ claimCountWithHiddenText }}
so if you expected but do not see details from someone then ask them to
check that their activity is visible to you on their Contacts
<font-awesome icon="users" class="text-slate-500" />
@@ -84,11 +80,7 @@
</div>
<div v-if="claimCountByUser > 0" class="border-b border-slate-300 pb-2">
<span>
{{
claimCountByUser === 1
? "There is 1 other claim by you"
: `There are ${claimCountByUser} other claims by you`
}}
{{ claimCountByUserText }}
which you don't need to confirm.
</span>
</div>
@@ -114,10 +106,7 @@
</div>
</div>
<div
v-if="claimsToConfirmSelected.length || (someoneGave && description)"
class="flex justify-center mt-4"
>
<div v-if="canSubmit" class="flex justify-center mt-4">
<button
class="block text-center text-md font-bold bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-3 rounded-md w-56"
@click="record()"
@@ -145,7 +134,6 @@ import { Router } from "vue-router";
import QuickNav from "../components/QuickNav.vue";
import TopMessage from "../components/TopMessage.vue";
import { NotificationIface } from "../constants/app";
import * as databaseUtil from "../db/databaseUtil";
import { Contact } from "../db/tables/contacts";
import {
GenericCredWrapper,
@@ -161,19 +149,34 @@ import {
getHeaders,
} from "../libs/endorserServer";
import { logger } from "../utils/logger";
import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
import { retrieveAllAccountsMetadata } from "@/libs/util";
import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
import {
NOTIFY_ERROR_RETRIEVING_CLAIMS,
NOTIFY_SENDING_STATUS,
NOTIFY_CONFIRMATION_SEND_ERROR,
NOTIFY_ALL_CONFIRMATIONS_ERROR,
NOTIFY_GIVE_SEND_ERROR,
NOTIFY_CLAIMS_SEND_ERROR,
createConfirmationSuccessMessage,
createCombinedSuccessMessage,
} from "@/constants/notifications";
import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
@Component({
methods: { claimSpecialDescription },
components: {
QuickNav,
TopMessage,
},
mixins: [PlatformServiceMixin],
})
export default class QuickActionBvcEndView extends Vue {
$notify!: (notification: NotificationIface, timeout?: number) => void;
$router!: Router;
// Notification helper
notify!: ReturnType<typeof createNotifyHelpers>;
activeDid = "";
allContacts: Array<Contact> = [];
allMyDids: Array<string> = [];
@@ -190,20 +193,40 @@ export default class QuickActionBvcEndView extends Vue {
// Method used in template
claimSpecialDescription = claimSpecialDescription;
// Computed properties for template optimization
get hasSelectedClaims() {
return this.claimsToConfirmSelected.length > 0;
}
get canSubmit() {
return this.hasSelectedClaims || (this.someoneGave && this.description);
}
get claimCountWithHiddenText() {
if (this.claimCountWithHidden === 0) return "";
return this.claimCountWithHidden === 1
? "There is 1 other claim with hidden details,"
: `There are ${this.claimCountWithHidden} other claims with hidden details,`;
}
get claimCountByUserText() {
if (this.claimCountByUser === 0) return "";
return this.claimCountByUser === 1
? "There is 1 other claim by you"
: `There are ${this.claimCountByUser} other claims by you`;
}
async created() {
this.loadingConfirms = true;
const settings = await databaseUtil.retrieveSettingsForActiveAccount();
// Initialize notification helper
this.notify = createNotifyHelpers(this.$notify);
const settings = await this.$settings();
this.apiServer = settings.apiServer || "";
this.activeDid = settings.activeDid || "";
const platformService = PlatformServiceFactory.getInstance();
const contactQueryResult = await platformService.dbQuery(
"SELECT * FROM contacts",
);
this.allContacts = databaseUtil.mapQueryResultToValues(
contactQueryResult,
) as unknown as Contact[];
this.allContacts = await this.$getAllContacts();
let currentOrPreviousSat = DateTime.now().setZone("America/Denver");
if (currentOrPreviousSat.weekday < 6) {
@@ -257,15 +280,7 @@ export default class QuickActionBvcEndView extends Vue {
});
} catch (error) {
logger.error("Error:", error);
this.$notify(
{
group: "alert",
type: "danger",
title: "Error",
text: "There was an error retrieving today's claims to confirm.",
},
5000,
);
this.notify.error(NOTIFY_ERROR_RETRIEVING_CLAIMS.message, TIMEOUTS.LONG);
}
this.loadingConfirms = false;
}
@@ -280,7 +295,11 @@ export default class QuickActionBvcEndView extends Vue {
async record() {
try {
if (this.claimsToConfirmSelected.length > 0) {
this.$notify({ group: "alert", type: "toast", title: "Sent..." }, 1000);
this.notify.toast(
NOTIFY_SENDING_STATUS.title,
NOTIFY_SENDING_STATUS.message,
TIMEOUTS.SHORT,
);
}
// in parallel, make a confirmation for each selected claim and send them all to the server
@@ -310,16 +329,11 @@ export default class QuickActionBvcEndView extends Vue {
);
if (confirmsSucceeded.length < this.claimsToConfirmSelected.length) {
logger.error("Error sending confirmations:", confirmResults);
const howMany = confirmsSucceeded.length === 0 ? "all" : "some";
this.$notify(
{
group: "alert",
type: "danger",
title: "Error",
text: `There was an error sending ${howMany} of the confirmations.`,
},
5000,
);
const errorMessage =
confirmsSucceeded.length === 0
? NOTIFY_ALL_CONFIRMATIONS_ERROR.message
: NOTIFY_CONFIRMATION_SEND_ERROR.message;
this.notify.error(errorMessage, TIMEOUTS.LONG);
}
// now send the give for the description
@@ -343,35 +357,19 @@ export default class QuickActionBvcEndView extends Vue {
giveSucceeded = giveResult.success;
if (!giveSucceeded) {
logger.error("Error sending give:", giveResult);
this.$notify(
{
group: "alert",
type: "danger",
title: "Error",
text:
(giveResult as CreateAndSubmitClaimResult)?.error ||
"There was an error sending that give.",
},
5000,
);
const errorMessage =
(giveResult as CreateAndSubmitClaimResult)?.error ||
NOTIFY_GIVE_SEND_ERROR.message;
this.notify.error(errorMessage, TIMEOUTS.LONG);
}
}
if (this.someoneGave && this.supplyGiftDetails) {
// we'll give a success message for the confirmations and go to the gifted details page
if (confirmsSucceeded.length > 0) {
const actions =
confirmsSucceeded.length === 1
? `Your confirmation has been recorded.`
: `Your confirmations have been recorded.`;
this.$notify(
{
group: "alert",
type: "success",
title: "Success",
text: actions,
},
3000,
const actions = createConfirmationSuccessMessage(
confirmsSucceeded.length,
);
this.notify.success(actions, TIMEOUTS.STANDARD);
}
(this.$router as Router).push({
name: "gifted-details",
@@ -385,27 +383,11 @@ export default class QuickActionBvcEndView extends Vue {
} else {
// just go ahead and print a message for all the activity
if (confirmsSucceeded.length > 0 || giveSucceeded) {
const confirms =
confirmsSucceeded.length === 1 ? "confirmation" : "confirmations";
const actions =
confirmsSucceeded.length > 0 && giveSucceeded
? `Your ${confirms} and that give have been recorded.`
: giveSucceeded
? "That give has been recorded."
: "Your " +
confirms +
" " +
(confirmsSucceeded.length === 1 ? "has" : "have") +
" been recorded.";
this.$notify(
{
group: "alert",
type: "success",
title: "Success",
text: actions,
},
3000,
const actions = createCombinedSuccessMessage(
confirmsSucceeded.length,
giveSucceeded,
);
this.notify.success(actions, TIMEOUTS.STANDARD);
(this.$router as Router).push({ path: "/" });
} else {
// errors should have already shown
@@ -415,15 +397,9 @@ export default class QuickActionBvcEndView extends Vue {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
} catch (error: any) {
logger.error("Error sending claims.", error);
this.$notify(
{
group: "alert",
type: "danger",
title: "Error",
text: error.userMessage || "There was an error sending claims.",
},
5000,
);
const errorMessage =
error.userMessage || NOTIFY_CLAIMS_SEND_ERROR.message;
this.notify.error(errorMessage, TIMEOUTS.LONG);
}
}
}