Migrate ClaimCertificateView.vue to Enhanced Triple Migration Pattern

- Replaced all databaseUtil and direct PlatformServiceFactory usage with PlatformServiceMixin methods
- Removed all raw SQL queries from the component
- Centralized notification message in src/constants/notifications.ts
- Replaced direct $notify call with notification helper and TIMEOUTS constant
- Updated migration documentation and security audit
- Ran lint-fix; no migration-specific errors remain

Ready for human testing and validation.

src/constants/notifications.ts

@@ -1039,3 +1039,10 @@ export const NOTIFY_DISCOVER_MAP_SEARCH_ERROR = {
   title: "Error",
   message: "There was an error with the map search.",
 };
+
+// ClaimCertificateView.vue specific constants
+// Used in: ClaimCertificateView.vue (fetchClaim method - claim loading error)
+export const NOTIFY_CLAIM_CERTIFICATE_LOAD_ERROR = {
+  title: "Error",
+  message: "There was a problem loading the claim.",
+};

src/views/ClaimCertificateView.vue

@@ -15,16 +15,20 @@ import { Component, Vue } from "vue-facing-decorator";
 import { nextTick } from "vue";
 import QRCode from "qrcode";
 import { APP_SERVER, NotificationIface } from "../constants/app";
-import * as databaseUtil from "../db/databaseUtil";
 import * as serverUtil from "../libs/endorserServer";
 import { GenericCredWrapper, GenericVerifiableCredential } from "../interfaces";
 import { logger } from "../utils/logger";
-import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
-import { Contact } from "@/db/tables/contacts";
-@Component
+import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
+import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
+import { NOTIFY_CLAIM_CERTIFICATE_LOAD_ERROR } from "@/constants/notifications";
+@Component({
+  mixins: [PlatformServiceMixin],
+})
 export default class ClaimCertificateView extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
 
+  notify!: ReturnType<typeof createNotifyHelpers>;
+
   activeDid = "";
   allMyDids: Array<string> = [];
   apiServer = "";
@@ -34,7 +38,8 @@ export default class ClaimCertificateView extends Vue {
   serverUtil = serverUtil;
 
   async created() {
-    const settings = await databaseUtil.retrieveSettingsForActiveAccount();
+    this.notify = createNotifyHelpers(this.$notify);
+    const settings = await this.$accountSettings();
     this.activeDid = settings.activeDid || "";
     this.apiServer = settings.apiServer || "";
     const pathParams = window.location.pathname.substring(
@@ -73,12 +78,10 @@ export default class ClaimCertificateView extends Vue {
       }
     } catch (error) {
       logger.error("Failed to load claim:", error);
-      this.$notify({
-        group: "alert",
-        type: "danger",
-        title: "Error",
-        text: "There was a problem loading the claim.",
-      });
+      this.notify.error(
+        NOTIFY_CLAIM_CERTIFICATE_LOAD_ERROR.message,
+        TIMEOUTS.LONG,
+      );
     }
   }
 
@@ -86,13 +89,7 @@ export default class ClaimCertificateView extends Vue {
     claimData: GenericCredWrapper<GenericVerifiableCredential>,
     confirmerIds: Array<string>,
   ) {
-    const platformService = PlatformServiceFactory.getInstance();
-    const dbAllContacts = await platformService.dbQuery(
-      "SELECT * FROM contacts",
-    );
-    const allContacts = databaseUtil.mapQueryResultToValues(
-      dbAllContacts,
-    ) as unknown as Contact[];
+    const allContacts = await this.$getAllContacts();
 
     const canvas = this.$refs.claimCanvas as HTMLCanvasElement;
     if (canvas) {