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

Merge branch 'master' into units-mocking

Browse Source
This commit is contained in:
Matthew Raymer
2025-08-21 06:58:53 +00:00
parent ceb63e3e61 6afe1c4c13
commit 552002b9a2
340 changed files with 15252 additions and 32367 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
src/App.vue
View File

@@ -27,9 +27,13 @@
v-if="notification.type === 'toast'"
class="w-full max-w-sm mx-auto mb-3 overflow-hidden bg-slate-900/90 text-white rounded-lg shadow-md"
>
<div class="w-full px-4 py-3">
<span class="font-semibold">{{ notification.title }}</span>
<p class="text-sm">{{ notification.text }}</p>
<div class="w-full px-4 py-3 overflow-hidden">
<h4 class="font-semibold text-ellipsis overflow-hidden">
{{ notification.title }}
</h4>
<p class="text-sm text-ellipsis overflow-hidden">
{{ notification.text }}
</p>
</div>
</div>
@@ -46,9 +50,15 @@
></font-awesome>
</div>
<div class="relative w-full pl-4 pr-8 py-2 text-slate-900">
<span class="font-semibold">{{ notification.title }}</span>
<p class="text-sm">{{ truncateLongWords(notification.text) }}</p>
<div
class="relative w-full pl-4 pr-8 py-2 text-slate-900 overflow-hidden"
>
<h4 class="font-semibold text-ellipsis overflow-hidden">
{{ notification.title }}
</h4>
<p class="text-sm text-ellipsis overflow-hidden">
{{ notification.text }}
</p>
<button
class="absolute top-2 right-2 px-0.5 py-0 rounded-full bg-slate-200 text-slate-600"
@@ -72,9 +82,15 @@
></font-awesome>
</div>
<div class="relative w-full pl-4 pr-8 py-2 text-emerald-900">
<span class="font-semibold">{{ notification.title }}</span>
<p class="text-sm">{{ truncateLongWords(notification.text) }}</p>
<div
class="relative w-full pl-4 pr-8 py-2 text-emerald-900 overflow-hidden"
>
<h4 class="font-semibold text-ellipsis overflow-hidden">
{{ notification.title }}
</h4>
<p class="text-sm text-ellipsis overflow-hidden">
{{ notification.text }}
</p>
<button
class="absolute top-2 right-2 px-0.5 py-0 rounded-full bg-emerald-200 text-emerald-600"
@@ -98,9 +114,15 @@
></font-awesome>
</div>
<div class="relative w-full pl-4 pr-8 py-2 text-amber-900">
<span class="font-semibold">{{ notification.title }}</span>
<p class="text-sm">{{ truncateLongWords(notification.text) }}</p>
<div
class="relative w-full pl-4 pr-8 py-2 text-amber-900 overflow-hidden"
>
<h4 class="font-semibold text-ellipsis overflow-hidden">
{{ notification.title }}
</h4>
<p class="text-sm text-ellipsis overflow-hidden">
{{ notification.text }}
</p>
<button
class="absolute top-2 right-2 px-0.5 py-0 rounded-full bg-amber-200 text-amber-600"
@@ -124,9 +146,15 @@
></font-awesome>
</div>
<div class="relative w-full pl-4 pr-8 py-2 text-rose-900">
<span class="font-semibold">{{ notification.title }}</span>
<p class="text-sm">{{ truncateLongWords(notification.text) }}</p>
<div
class="relative w-full pl-4 pr-8 py-2 text-rose-900 overflow-hidden"
>
<h4 class="font-semibold text-ellipsis overflow-hidden">
{{ notification.title }}
</h4>
<p class="text-sm text-ellipsis overflow-hidden">
{{ notification.text }}
</p>
<button
class="absolute top-2 right-2 px-0.5 py-0 rounded-full bg-rose-200 text-rose-600"
@@ -349,13 +377,6 @@ export default class App extends Vue {
stopAsking = false;
truncateLongWords(sentence: string) {
return sentence
.split(" ")
.map((word) => (word.length > 30 ? word.slice(0, 30) + "..." : word))
.join(" ");
}
async turnOffNotifications(
notification: NotificationIface,
): Promise<boolean> {

75
src/assets/icons.json
View File

@@ -1,75 +0,0 @@
{
"warning": {
"fillRule": "evenodd",
"d": "M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z",
"clipRule": "evenodd"
},
"spinner": {
"d": "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
},
"chart": {
"strokeLinecap": "round",
"strokeLinejoin": "round",
"strokeWidth": "2",
"d": "M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"
},
"plus": {
"strokeLinecap": "round",
"strokeLinejoin": "round",
"strokeWidth": "2",
"d": "M12 4v16m8-8H4"
},
"settings": {
"strokeLinecap": "round",
"strokeLinejoin": "round",
"strokeWidth": "2",
"d": "M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z"
},
"settingsDot": {
"strokeLinecap": "round",
"strokeLinejoin": "round",
"strokeWidth": "2",
"d": "M15 12a3 3 0 11-6 0 3 3 0 016 0z"
},
"lock": {
"strokeLinecap": "round",
"strokeLinejoin": "round",
"strokeWidth": "2",
"d": "M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"
},
"download": {
"strokeLinecap": "round",
"strokeLinejoin": "round",
"strokeWidth": "2",
"d": "M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"
},
"check": {
"strokeLinecap": "round",
"strokeLinejoin": "round",
"strokeWidth": "2",
"d": "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"
},
"edit": {
"strokeLinecap": "round",
"strokeLinejoin": "round",
"strokeWidth": "2",
"d": "M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"
},
"trash": {
"strokeLinecap": "round",
"strokeLinejoin": "round",
"strokeWidth": "2",
"d": "M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
},
"plusCircle": {
"strokeLinecap": "round",
"strokeLinejoin": "round",
"strokeWidth": "2",
"d": "M12 6v6m0 0v6m0-6h6m-6 0H6"
},
"info": {
"fillRule": "evenodd",
"d": "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z",
"clipRule": "evenodd"
}
}

59
src/components/ActivityListItem.vue
View File

@@ -73,7 +73,6 @@
class="w-full h-auto max-w-lg max-h-96 object-contain mx-auto drop-shadow-md"
:src="record.image"
alt="Activity image"
@load="handleImageLoad(record.image)"
/>
</a>
</div>
@@ -251,10 +250,9 @@
import { Component, Prop, Vue, Emit } from "vue-facing-decorator";
import { GiveRecordWithContactInfo } from "@/interfaces/give";
import EntityIcon from "./EntityIcon.vue";
import { isGiveClaimType, notifyWhyCannotConfirm } from "../libs/util";
import { containsHiddenDid, isHiddenDid } from "../libs/endorserServer";
import { isHiddenDid } from "../libs/endorserServer";
import ProjectIcon from "./ProjectIcon.vue";
import { createNotifyHelpers } from "@/utils/notify";
import { createNotifyHelpers, NotifyFunction } from "@/utils/notify";
import {
NOTIFY_PERSON_HIDDEN,
NOTIFY_UNKNOWN_PERSON,
@@ -272,18 +270,10 @@ export default class ActivityListItem extends Vue {
@Prop() lastViewedClaimId?: string;
@Prop() isRegistered!: boolean;
@Prop() activeDid!: string;
@Prop() confirmerIdList?: string[];
/**
* Function prop for handling image caching
* Called when an image loads successfully, allowing parent to control caching behavior
*/
@Prop({ type: Function, default: () => {} })
onImageCache!: (imageUrl: string) => void | Promise<void>;
isHiddenDid = isHiddenDid;
notify!: ReturnType<typeof createNotifyHelpers>;
$notify!: (notification: any, timeout?: number) => void;
$notify!: NotifyFunction;
created() {
this.notify = createNotifyHelpers(this.$notify);
@@ -297,17 +287,8 @@ export default class ActivityListItem extends Vue {
this.notify.warning(NOTIFY_UNKNOWN_PERSON.message, TIMEOUTS.STANDARD);
}
/**
* Handle image load event - call function prop for caching
* Allows parent to control caching behavior and validation
*/
handleImageLoad(imageUrl: string): void {
this.onImageCache(imageUrl);
}
get fetchAmount(): string {
const claim =
(this.record.fullClaim as any)?.claim || this.record.fullClaim;
const claim = this.record.fullClaim;
const amount = claim.object?.amountOfThisGood
? this.displayAmount(claim.object.unitCode, claim.object.amountOfThisGood)
@@ -317,8 +298,7 @@ export default class ActivityListItem extends Vue {
}
get description(): string {
const claim =
(this.record.fullClaim as any)?.claim || this.record.fullClaim;
const claim = this.record.fullClaim;
return `${claim?.description || ""}`;
}
@@ -331,15 +311,6 @@ export default class ActivityListItem extends Vue {
return unitCode === "HUR" ? (single ? "hour" : "hours") : unitCode;
}
get canConfirm(): boolean {
if (!this.isRegistered) return false;
if (!isGiveClaimType(this.record.fullClaim?.["@type"])) return false;
if (this.confirmerIdList?.includes(this.activeDid)) return false;
if (this.record.issuerDid === this.activeDid) return false;
if (containsHiddenDid(this.record.fullClaim)) return false;
return true;
}
// Emit methods using @Emit decorator
@Emit("viewImage")
emitViewImage(imageUrl: string) {
@@ -351,26 +322,6 @@ export default class ActivityListItem extends Vue {
return jwtId;
}
@Emit("confirmClaim")
emitConfirmClaim() {
if (!this.canConfirm) {
notifyWhyCannotConfirm(
(msg, timeout) => this.notify.info(msg.text ?? "", timeout),
this.isRegistered,
this.record.fullClaim?.["@type"],
this.record,
this.activeDid,
this.confirmerIdList,
);
return;
}
return this.record;
}
handleConfirmClick() {
this.emitConfirmClaim();
}
get friendlyDate(): string {
const date = new Date(this.record.issuedAt);
return date.toLocaleDateString(undefined, {

2
src/components/ContactInputForm.vue
View File

@@ -167,7 +167,7 @@ export default class ContactInputForm extends Vue {
*/
@Emit("qr-scan")
private handleQRScan(): void {
console.log("[ContactInputForm] QR scan button clicked");
// QR scan button clicked - event emitted for parent handling
}
}
</script>

12
src/components/ContactListItem.vue
View File

@@ -121,6 +121,12 @@ import { AppString } from "../constants/app";
components: {
EntityIcon,
},
emits: [
"toggle-selection",
"show-identicon",
"show-gifted-dialog",
"open-offer-dialog",
],
})
export default class ContactListItem extends Vue {
@Prop({ required: true }) contact!: Contact;
@@ -151,14 +157,12 @@ export default class ContactListItem extends Vue {
return contact;
}
@Emit("show-gifted-dialog")
emitShowGiftedDialog(fromDid: string, toDid: string) {
return { fromDid, toDid };
this.$emit("show-gifted-dialog", fromDid, toDid);
}
@Emit("open-offer-dialog")
emitOpenOfferDialog(did: string, name: string | undefined) {
return [did, name];
this.$emit("open-offer-dialog", did, name);
}
/**

20
src/components/DataExportSection.vue
View File

@@ -54,7 +54,10 @@ messages * - Conditional UI based on platform capabilities * * @component *
<script lang="ts">
import { Component, Prop, Vue } from "vue-facing-decorator";
import * as R from "ramda";
import { AppString, NotificationIface } from "../constants/app";
import { Contact } from "../db/tables/contacts";
import { logger } from "../utils/logger";
import { contactsToExportJson } from "../libs/util";
@@ -168,6 +171,8 @@ export default class DataExportSection extends Vue {
* @throws {Error} If export fails
*/
public async exportDatabase(): Promise<void> {
// Note that similar code is in ContactsView.vue exportContactData()
if (this.isExporting) {
return; // Prevent multiple simultaneous exports
}
@@ -179,7 +184,20 @@ export default class DataExportSection extends Vue {
const allContacts = await this.$contacts();
// Convert contacts to export format
const exportData = contactsToExportJson(allContacts);
const processedContacts: Contact[] = allContacts.map((contact) => {
// first remove the contactMethods field, mostly to cast to a clear type (that will end up with JSON objects)
const exContact: Contact = R.omit(["contactMethods"], contact);
// now add contactMethods as a true array of ContactMethod objects
exContact.contactMethods = contact.contactMethods
? typeof contact.contactMethods === "string" &&
contact.contactMethods.trim() !== ""
? JSON.parse(contact.contactMethods)
: []
: [];
return exContact;
});
const exportData = contactsToExportJson(processedContacts);
const jsonStr = JSON.stringify(exportData, null, 2);
// Use platform service to handle export (no platform-specific logic here!)

61
src/components/EntitySelectionStep.vue
View File

@@ -136,6 +136,20 @@ export default class EntitySelectionStep extends Vue {
@Prop()
receiver?: EntityData | null;
/** Form field values to preserve when navigating to "Show All" */
@Prop({ default: "" })
description!: string;
@Prop({ default: "0" })
amountInput!: string;
@Prop({ default: "HUR" })
unitCode!: string;
/** Offer ID for context when fulfilling an offer */
@Prop({ default: "" })
offerId!: string;
/** Notification function from parent component */
@Prop()
notify?: (notification: NotificationIface, timeout?: number) => void;
@@ -220,34 +234,41 @@ export default class EntitySelectionStep extends Vue {
* Query parameters for "Show All" navigation
*/
get showAllQueryParams(): Record<string, string> {
if (this.shouldShowProjects) {
return {};
}
return {
const baseParams = {
stepType: this.stepType,
giverEntityType: this.giverEntityType,
recipientEntityType: this.recipientEntityType,
...(this.stepType === "giver"
? {
recipientProjectId: this.toProjectId || "",
recipientProjectName: this.receiver?.name || "",
recipientProjectImage: this.receiver?.image || "",
recipientProjectHandleId: this.receiver?.handleId || "",
recipientDid: this.receiver?.did || "",
}
: {
giverProjectId: this.fromProjectId || "",
giverProjectName: this.giver?.name || "",
giverProjectImage: this.giver?.image || "",
giverProjectHandleId: this.giver?.handleId || "",
giverDid: this.giver?.did || "",
}),
// Form field values to preserve
description: this.description,
amountInput: this.amountInput,
unitCode: this.unitCode,
offerId: this.offerId,
fromProjectId: this.fromProjectId,
toProjectId: this.toProjectId,
showProjects: this.showProjects.toString(),
isFromProjectView: this.isFromProjectView.toString(),
};
if (this.shouldShowProjects) {
// For project contexts, still pass entity type information
return baseParams;
}
return {
...baseParams,
// Always pass both giver and recipient info for context preservation
giverProjectId: this.fromProjectId || "",
giverProjectName: this.giver?.name || "",
giverProjectImage: this.giver?.image || "",
giverProjectHandleId: this.giver?.handleId || "",
giverDid: this.giverEntityType === "person" ? this.giver?.did || "" : "",
recipientProjectId: this.toProjectId || "",
recipientProjectName: this.receiver?.name || "",
recipientProjectImage: this.receiver?.image || "",
recipientProjectHandleId: this.receiver?.handleId || "",
recipientDid:
this.recipientEntityType === "person" ? this.receiver?.did || "" : "",
};
}
/**

24
src/components/FeedFilters.vue
View File

@@ -101,6 +101,7 @@ import {
import { Router } from "vue-router";
import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
import { logger } from "@/utils/logger";
@Component({
components: {
@@ -119,11 +120,13 @@ export default class FeedFilters extends Vue {
isNearby = false;
settingChanged = false;
visible = false;
activeDid = "";
async open(onCloseIfChanged: () => void) {
async open(onCloseIfChanged: () => void, activeDid: string) {
this.onCloseIfChanged = onCloseIfChanged;
this.activeDid = activeDid;
const settings = await this.$settings();
const settings = await this.$accountSettings(activeDid);
this.hasVisibleDid = !!settings.filterFeedByVisible;
this.isNearby = !!settings.filterFeedByNearby;
if (settings.searchBoxes && settings.searchBoxes.length > 0) {
@@ -137,6 +140,7 @@ export default class FeedFilters extends Vue {
async toggleHasVisibleDid() {
this.settingChanged = true;
this.hasVisibleDid = !this.hasVisibleDid;
await this.$updateSettings({
filterFeedByVisible: this.hasVisibleDid,
});
@@ -145,9 +149,18 @@ export default class FeedFilters extends Vue {
async toggleNearby() {
this.settingChanged = true;
this.isNearby = !this.isNearby;
logger.debug("[FeedFilters] 🔄 Toggling nearby filter:", {
newValue: this.isNearby,
settingChanged: this.settingChanged,
activeDid: this.activeDid,
});
await this.$updateSettings({
filterFeedByNearby: this.isNearby,
});
logger.debug("[FeedFilters] ✅ Nearby filter updated in settings");
}
async clearAll() {
@@ -179,13 +192,20 @@ export default class FeedFilters extends Vue {
}
close() {
logger.debug("[FeedFilters] 🚪 Closing dialog:", {
settingChanged: this.settingChanged,
hasCallback: !!this.onCloseIfChanged,
});
if (this.settingChanged) {
logger.debug("[FeedFilters] 🔄 Settings changed, calling callback");
this.onCloseIfChanged();
}
this.visible = false;
}
done() {
logger.debug("[FeedFilters] ✅ Done button clicked");
this.close();
}
}

13
src/components/GiftDetailsStep.vue
View File

@@ -315,16 +315,15 @@ export default class GiftDetailsStep extends Vue {
giverName: this.giver?.name,
offerId: this.offerId,
fulfillsProjectId:
this.giverEntityType === "person" &&
this.recipientEntityType === "project"
? this.toProjectId
: undefined,
this.recipientEntityType === "project" ? this.toProjectId : undefined,
providerProjectId:
this.giverEntityType === "project" &&
this.recipientEntityType === "person"
this.giverEntityType === "project"
? this.giver?.handleId
: this.fromProjectId,
recipientDid: this.receiver?.did,
recipientDid:
this.recipientEntityType === "person"
? this.receiver?.did
: undefined,
recipientName: this.receiver?.name,
unitCode: this.localUnitCode,
},

159
src/components/GiftedDialog.vue
View File

@@ -1,13 +1,19 @@
<template>
<div v-if="visible" class="dialog-overlay">
<div class="dialog">
<div
class="dialog"
data-testid="gifted-dialog"
:data-recipient-entity-type="recipientEntityType"
>
<!-- Step 1: Entity Selection -->
<EntitySelectionStep
v-show="firstStep"
:step-type="stepType"
:giver-entity-type="giverEntityType"
:recipient-entity-type="recipientEntityType"
:show-projects="showProjects"
:show-projects="
giverEntityType === 'project' || recipientEntityType === 'project'
"
:is-from-project-view="isFromProjectView"
:projects="projects"
:all-contacts="allContacts"
@@ -18,6 +24,10 @@
:to-project-id="toProjectId"
:giver="giver"
:receiver="receiver"
:description="description"
:amount-input="amountInput"
:unit-code="unitCode"
:offer-id="offerId"
:notify="$notify"
@entity-selected="handleEntitySelected"
@cancel="cancel"
@@ -52,7 +62,7 @@
</template>
<script lang="ts">
import { Vue, Component, Prop, Watch } from "vue-facing-decorator";
import { Vue, Component, Prop } from "vue-facing-decorator";
import {
createAndSubmitGive,
@@ -70,7 +80,13 @@ import EntitySelectionStep from "../components/EntitySelectionStep.vue";
import GiftDetailsStep from "../components/GiftDetailsStep.vue";
import { PlanData } from "../interfaces/records";
import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
import { createNotifyHelpers, TIMEOUTS, NotifyFunction } from "@/utils/notify";
import {
NOTIFY_GIFT_ERROR_NEGATIVE_AMOUNT,
NOTIFY_GIFT_ERROR_NO_DESCRIPTION,
NOTIFY_GIFTED_DETAILS_NO_IDENTIFIER,
NOTIFY_GIFTED_DETAILS_RECORDING_GIVE,
} from "@/constants/notifications";
@Component({
components: {
@@ -82,7 +98,7 @@ import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
mixins: [PlatformServiceMixin],
})
export default class GiftedDialog extends Vue {
$notify!: (notification: any, timeout?: number) => void;
$notify!: NotifyFunction;
notify!: ReturnType<typeof createNotifyHelpers>;
/**
@@ -97,23 +113,13 @@ export default class GiftedDialog extends Vue {
@Prop() fromProjectId = "";
@Prop() toProjectId = "";
@Prop({ default: false }) showProjects = false;
@Prop() isFromProjectView = false;
@Watch("showProjects")
onShowProjectsChange() {
this.updateEntityTypes();
}
@Watch("fromProjectId")
onFromProjectIdChange() {
this.updateEntityTypes();
}
@Watch("toProjectId")
onToProjectIdChange() {
this.updateEntityTypes();
}
@Prop({ default: "person" }) giverEntityType = "person" as
| "person"
| "project";
@Prop({ default: "person" }) recipientEntityType = "person" as
| "person"
| "project";
activeDid = "";
allContacts: Array<Contact> = [];
@@ -122,20 +128,19 @@ export default class GiftedDialog extends Vue {
amountInput = "0";
callbackOnSuccess?: (amount: number) => void = () => {};
customTitle?: string;
description = "";
firstStep = true; // true = Step 1 (giver/recipient selection), false = Step 2 (amount/description)
giver?: libsUtil.GiverReceiverInputInfo; // undefined means no identified giver agent
offerId = "";
projects: PlanData[] = [];
prompt = "";
receiver?: libsUtil.GiverReceiverInputInfo;
stepType = "giver";
unitCode = "HUR";
visible = false;
libsUtil = libsUtil;
projects: PlanData[] = [];
didInfo = didInfo;
// Computed property to help debug template logic
@@ -189,56 +194,27 @@ export default class GiftedDialog extends Vue {
return false;
}
stepType = "giver";
giverEntityType = "person" as "person" | "project";
recipientEntityType = "person" as "person" | "project";
updateEntityTypes() {
// Reset and set entity types based on current context
this.giverEntityType = "person";
this.recipientEntityType = "person";
// Determine entity types based on current context
if (this.showProjects) {
// HomeView "Project" button or ProjectViewView "Given by This"
this.giverEntityType = "project";
this.recipientEntityType = "person";
} else if (this.fromProjectId) {
// ProjectViewView "Given by This" button (project is giver)
this.giverEntityType = "project";
this.recipientEntityType = "person";
} else if (this.toProjectId) {
// ProjectViewView "Given to This" button (project is recipient)
this.giverEntityType = "person";
this.recipientEntityType = "project";
} else {
// HomeView "Person" button
this.giverEntityType = "person";
this.recipientEntityType = "person";
}
}
async open(
giver?: libsUtil.GiverReceiverInputInfo,
receiver?: libsUtil.GiverReceiverInputInfo,
offerId?: string,
customTitle?: string,
prompt?: string,
description?: string,
amountInput?: string,
unitCode?: string,
callbackOnSuccess: (amount: number) => void = () => {},
) {
this.customTitle = customTitle;
this.giver = giver;
this.prompt = prompt || "";
this.receiver = receiver;
this.amountInput = "0";
this.callbackOnSuccess = callbackOnSuccess;
this.offerId = offerId || "";
this.prompt = prompt || "";
this.description = description || "";
this.amountInput = amountInput || "0";
this.unitCode = unitCode || "HUR";
this.callbackOnSuccess = callbackOnSuccess;
this.firstStep = !giver;
this.stepType = "giver";
// Update entity types based on current props
this.updateEntityTypes();
try {
const settings = await this.$settings();
this.apiServer = settings.apiServer || "";
@@ -318,23 +294,24 @@ export default class GiftedDialog extends Vue {
async confirm() {
if (!this.activeDid) {
this.safeNotify.error(
"You must select an identifier before you can record a give.",
TIMEOUTS.STANDARD,
NOTIFY_GIFTED_DETAILS_NO_IDENTIFIER.message,
TIMEOUTS.SHORT,
);
return;
}
if (parseFloat(this.amountInput) < 0) {
this.safeNotify.error(
"You may not send a negative number.",
NOTIFY_GIFT_ERROR_NEGATIVE_AMOUNT.message,
TIMEOUTS.SHORT,
);
return;
}
if (!this.description && !parseFloat(this.amountInput)) {
this.safeNotify.error(
`You must enter a description or some number of ${
this.libsUtil.UNIT_LONG[this.unitCode]
}.`,
NOTIFY_GIFT_ERROR_NO_DESCRIPTION.message.replace(
"{unit}",
this.libsUtil.UNIT_SHORT[this.unitCode] || this.unitCode,
),
TIMEOUTS.SHORT,
);
return;
@@ -350,7 +327,11 @@ export default class GiftedDialog extends Vue {
}
this.close();
this.safeNotify.toast("Recording the give...", undefined, TIMEOUTS.BRIEF);
this.safeNotify.toast(
NOTIFY_GIFTED_DETAILS_RECORDING_GIVE.message,
undefined,
TIMEOUTS.BRIEF,
);
// this is asynchronous, but we don't need to wait for it to complete
await this.recordGive(
(this.giver?.did as string) || null,
@@ -477,10 +458,13 @@ export default class GiftedDialog extends Vue {
name: contact.name || contact.did,
};
} else {
this.giver = {
did: "",
name: "Unnamed",
};
// Only set to "Unnamed" if no giver is currently set
if (!this.giver || !this.giver.did) {
this.giver = {
did: "",
name: "Unnamed",
};
}
}
this.firstStep = false;
}
@@ -490,6 +474,10 @@ export default class GiftedDialog extends Vue {
this.firstStep = true;
}
moveToStep2() {
this.firstStep = false;
}
async loadProjects() {
try {
const response = await fetch(this.apiServer + "/api/v2/report/plans", {
@@ -532,10 +520,13 @@ export default class GiftedDialog extends Vue {
name: contact.name || contact.did,
};
} else {
this.receiver = {
did: "",
name: "Unnamed",
};
// Only set to "Unnamed" if no receiver is currently set
if (!this.receiver || !this.receiver.did) {
this.receiver = {
did: "",
name: "Unnamed",
};
}
}
this.firstStep = false;
}
@@ -559,16 +550,13 @@ export default class GiftedDialog extends Vue {
giverName: this.giver?.name,
offerId: this.offerId,
fulfillsProjectId:
this.giverEntityType === "person" &&
this.recipientEntityType === "project"
? this.toProjectId
: undefined,
this.recipientEntityType === "project" ? this.toProjectId : undefined,
providerProjectId:
this.giverEntityType === "project" &&
this.recipientEntityType === "person"
this.giverEntityType === "project"
? this.giver?.handleId
: this.fromProjectId,
recipientDid: this.receiver?.did,
recipientDid:
this.recipientEntityType === "person" ? this.receiver?.did : undefined,
recipientName: this.receiver?.name,
unitCode: this.unitCode,
};
@@ -634,7 +622,10 @@ export default class GiftedDialog extends Vue {
* Handle edit entity request from GiftDetailsStep
* @param data - Object containing entityType and currentEntity
*/
handleEditEntity(data: { entityType: string; currentEntity: any }) {
handleEditEntity(data: {
entityType: string;
currentEntity: { did: string; name: string };
}) {
this.goBackToStep1(data.entityType);
}

90
src/components/IconRenderer.vue
View File

@@ -1,90 +0,0 @@
<template>
<svg
v-if="iconData"
:class="svgClass"
:fill="fill"
:stroke="stroke"
:viewBox="viewBox"
xmlns="http://www.w3.org/2000/svg"
>
<path v-for="(path, index) in iconData.paths" :key="index" v-bind="path" />
</svg>
</template>
<script lang="ts">
import { Component, Prop, Vue } from "vue-facing-decorator";
import icons from "../assets/icons.json";
import { logger } from "../utils/logger";
/**
* Icon path interface
*/
interface IconPath {
d: string;
fillRule?: string;
clipRule?: string;
strokeLinecap?: string;
strokeLinejoin?: string;
strokeWidth?: string | number;
fill?: string;
stroke?: string;
}
/**
* Icon data interface
*/
interface IconData {
paths: IconPath[];
}
/**
* Icons JSON structure
*/
interface IconsJson {
[key: string]: IconPath | IconData;
}
/**
* Icon Renderer Component
*
* This component loads SVG icon definitions from a JSON file and renders them
* as SVG elements. It provides a clean way to use icons without cluttering
* templates with long SVG path definitions.
*
* @author Matthew Raymer
* @version 1.0.0
* @since 2024
*/
@Component({
name: "IconRenderer",
})
export default class IconRenderer extends Vue {
@Prop({ required: true }) readonly iconName!: string;
@Prop({ default: "h-5 w-5" }) readonly svgClass!: string;
@Prop({ default: "none" }) readonly fill!: string;
@Prop({ default: "currentColor" }) readonly stroke!: string;
@Prop({ default: "0 0 24 24" }) readonly viewBox!: string;
/**
* Get the icon data for the specified icon name
*
* @returns {IconData | null} The icon data object or null if not found
*/
get iconData(): IconData | null {
const icon = (icons as IconsJson)[this.iconName];
if (!icon) {
logger.warn(`Icon "${this.iconName}" not found in icons.json`);
return null;
}
// Convert single path to array format for consistency
if ("d" in icon) {
return {
paths: [icon as IconPath],
};
}
return icon as IconData;
}
}
</script>

4
src/components/ImageMethodDialog.vue
View File

@@ -282,7 +282,7 @@ import {
NOTIFY_IMAGE_DIALOG_UNSUPPORTED_FORMAT,
createImageDialogCameraErrorMessage,
} from "../constants/notifications";
import { createNotifyHelpers, TIMEOUTS } from "../utils/notify";
import { createNotifyHelpers, TIMEOUTS, NotifyFunction } from "../utils/notify";
const inputImageFileNameRef = ref<Blob>();
@@ -291,7 +291,7 @@ const inputImageFileNameRef = ref<Blob>();
mixins: [PlatformServiceMixin],
})
export default class ImageMethodDialog extends Vue {
$notify!: (notification: any, timeout?: number) => void;
$notify!: NotifyFunction;
$router!: Router;
notify = createNotifyHelpers(this.$notify);

1
src/components/ImageViewer.vue
View File

@@ -45,7 +45,6 @@ import { logger } from "../utils/logger";
@Component({ emits: ["update:isOpen"] })
export default class ImageViewer extends Vue {
@Prop() imageUrl!: string;
@Prop() imageData!: Blob | null;
@Prop() isOpen!: boolean;
userAgent = new UAParser();

19
src/components/MembersList.vue
View File

@@ -159,25 +159,6 @@
</template>
<script lang="ts">
/* TODO: Human Testing Required - PlatformServiceMixin Migration */
// Priority: High | Migrated: 2025-07-06 | Author: Matthew Raymer
//
// TESTING NEEDED: Component migrated from legacy logConsoleAndDb to PlatformServiceMixin
// but requires human validation due to meeting component accessibility limitations.
//
// Test Scenarios Required:
// 1. Load members list with valid meeting password
// 2. Test member admission toggle (organizer role)
// 3. Test adding member as contact
// 4. Test error scenarios: network failure, invalid password, server errors
// 5. Verify error logging appears in console and database
// 6. Cross-platform testing: web, mobile, desktop
//
// Reference: docs/migration-testing/migration-checklist-MembersList.md
// Migration Details: Replaced 3 logConsoleAndDb() calls with this.$logAndConsole()
// Validation: Passes lint checks and TypeScript compilation
// Navigation: Contacts → Chair Icon → Start/Join Meeting → Members List
import { Component, Vue, Prop, Emit } from "vue-facing-decorator";
import {

143
src/components/OfferDialog.vue
View File

@@ -15,26 +15,25 @@ Raymer */
class="block w-full rounded border border-slate-400 mb-2 px-3 py-2"
placeholder="Description of what is offered"
/>
<div class="flex flex-row mt-2">
<span :class="unitCodeDisplayClasses" @click="changeUnitCode()">
{{ libsUtil.UNIT_SHORT[amountUnitCode] }}
</span>
<div
v-if="showDecrementButton"
:class="controlButtonClasses"
@click="decrement()"
>
<font-awesome icon="chevron-left" />
</div>
<input
v-model="amountInput"
<div class="flex mb-4">
<AmountInput
:value="parseFloat(amountInput) || 0"
:on-update-value="handleAmountUpdate"
data-testId="inputOfferAmount"
type="number"
:class="amountInputClasses"
/>
<div :class="incrementButtonClasses" @click="increment()">
<font-awesome icon="chevron-right" />
</div>
<select
v-model="amountUnitCode"
class="flex-1 rounded border border-slate-400 ms-2 px-3 py-2"
>
<option
v-for="(displayName, code) in unitOptions"
:key="code"
:value="code"
>
{{ displayName }}
</option>
</select>
</div>
<div class="mt-4 flex justify-center">
<span>
@@ -73,10 +72,15 @@ import {
NOTIFY_OFFER_CREATION_ERROR,
NOTIFY_OFFER_SUCCESS,
NOTIFY_OFFER_SUBMISSION_ERROR,
NOTIFY_OFFER_ERROR_NEGATIVE_AMOUNT,
} from "@/constants/notifications";
import AmountInput from "./AmountInput.vue";
@Component({
mixins: [PlatformServiceMixin],
components: {
AmountInput,
},
})
export default class OfferDialog extends Vue {
@Prop projectId?: string;
@@ -122,35 +126,10 @@ export default class OfferDialog extends Vue {
}
/**
* CSS classes for unit code selector and increment/decrement buttons
* Reduces template complexity for repeated border and styling patterns
* Computed property to get unit options for the select dropdown
*/
get controlButtonClasses(): string {
return "border border-r-0 border-slate-400 bg-slate-200 px-4 py-2";
}
/**
* CSS classes for unit code display span
* Reduces template complexity for unit code button styling
*/
get unitCodeDisplayClasses(): string {
return "rounded-l border border-r-0 border-slate-400 bg-slate-200 w-1/3 text-center text-blue-500 px-2 py-2";
}
/**
* CSS classes for amount input field
* Reduces template complexity for input styling
*/
get amountInputClasses(): string {
return "w-full border border-r-0 border-slate-400 px-2 py-2 text-center";
}
/**
* CSS classes for the right-most increment button
* Reduces template complexity for border styling
*/
get incrementButtonClasses(): string {
return "rounded-r border border-slate-400 bg-slate-200 px-4 py-2";
get unitOptions() {
return this.libsUtil.UNIT_SHORT;
}
/**
@@ -173,14 +152,6 @@ export default class OfferDialog extends Vue {
};
}
/**
* Whether the decrement button should be visible
* Encapsulates conditional logic from template
*/
get showDecrementButton(): boolean {
return this.amountInput !== "0";
}
// =================================================
// COMPONENT METHODS
// =================================================
@@ -227,29 +198,11 @@ export default class OfferDialog extends Vue {
}
/**
* Cycle through available unit codes
* Handle amount updates from AmountInput component
* @param value - New amount value
*/
changeUnitCode() {
const units = Object.keys(this.libsUtil.UNIT_SHORT);
const index = units.indexOf(this.amountUnitCode);
this.amountUnitCode = units[(index + 1) % units.length];
}
/**
* Increment the amount input
*/
increment() {
this.amountInput = `${(parseFloat(this.amountInput) || 0) + 1}`;
}
/**
* Decrement the amount input
*/
decrement() {
this.amountInput = `${Math.max(
0,
(parseFloat(this.amountInput) || 1) - 1,
)}`;
handleAmountUpdate(value: number) {
this.amountInput = value.toString();
}
/**
@@ -273,6 +226,28 @@ export default class OfferDialog extends Vue {
* Confirm and submit the offer
*/
async confirm() {
if (!this.activeDid) {
this.notify.error(NOTIFY_OFFER_IDENTITY_REQUIRED.message, TIMEOUTS.LONG);
return;
}
if (parseFloat(this.amountInput) < 0) {
this.notify.error(
NOTIFY_OFFER_ERROR_NEGATIVE_AMOUNT.message,
TIMEOUTS.SHORT,
);
return;
}
if (!this.description && !parseFloat(this.amountInput)) {
const message = NOTIFY_OFFER_DESCRIPTION_REQUIRED.message.replace(
"{unit}",
this.libsUtil.UNIT_LONG[this.amountUnitCode],
);
this.notify.error(message, TIMEOUTS.SHORT);
return;
}
this.close();
this.notify.toast(NOTIFY_OFFER_RECORDING.text, undefined, TIMEOUTS.BRIEF);
@@ -301,20 +276,6 @@ export default class OfferDialog extends Vue {
unitCode: string = "HUR",
expirationDateInput?: string,
) {
if (!this.activeDid) {
this.notify.error(NOTIFY_OFFER_IDENTITY_REQUIRED.message, TIMEOUTS.LONG);
return;
}
if (!description && !amount) {
const message = NOTIFY_OFFER_DESCRIPTION_REQUIRED.message.replace(
"{unit}",
this.libsUtil.UNIT_LONG[unitCode],
);
this.notify.error(message, TIMEOUTS.MODAL);
return;
}
try {
const result = await createAndSubmitOffer(
this.axios,
@@ -363,7 +324,7 @@ export default class OfferDialog extends Vue {
display: flex;
justify-content: center;
align-items: center;
z-index: 1000;
z-index: 50;
}
.dialog {

5
src/components/UsageLimitsSection.vue
View File

@@ -83,6 +83,7 @@
<script lang="ts">
import { Component, Vue, Prop } from "vue-facing-decorator";
import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
import { EndorserRateLimits, ImageRateLimits } from "@/interfaces/limits";
@Component({
name: "UsageLimitsSection",
@@ -94,8 +95,8 @@ export default class UsageLimitsSection extends Vue {
@Prop({ required: true }) loadingLimits!: boolean;
@Prop({ required: true }) limitsMessage!: string;
@Prop({ required: false }) activeDid?: string;
@Prop({ required: false }) endorserLimits?: any;
@Prop({ required: false }) imageLimits?: any;
@Prop({ required: false }) endorserLimits?: EndorserRateLimits;
@Prop({ required: false }) imageLimits?: ImageRateLimits;
@Prop({ required: true }) onRecheckLimits!: () => void;
mounted() {

6
src/constants/app.ts
View File

@@ -19,7 +19,8 @@ export enum AppString {
PROD_PARTNER_API_SERVER = "https://partner-api.endorser.ch",
TEST_PARTNER_API_SERVER = "https://test-partner-api.endorser.ch",
LOCAL_PARTNER_API_SERVER = "http://127.0.0.1:3002",
// eslint-disable-next-line @typescript-eslint/no-duplicate-enum-values
LOCAL_PARTNER_API_SERVER = "http://127.0.0.1:3000",
PROD_PUSH_SERVER = "https://timesafari.app",
TEST1_PUSH_SERVER = "https://test.timesafari.app",
@@ -46,9 +47,6 @@ export const DEFAULT_PARTNER_API_SERVER =
export const DEFAULT_PUSH_SERVER =
import.meta.env.VITE_DEFAULT_PUSH_SERVER || AppString.PROD_PUSH_SERVER;
// Production domain for sharing links (always use production URL for sharing)
export const PROD_SHARE_DOMAIN = AppString.PROD_PUSH_SERVER;
export const IMAGE_TYPE_PROFILE = "profile";
export const PASSKEYS_ENABLED =

19
src/constants/notifications.ts
View File

@@ -846,6 +846,12 @@ export const NOTIFY_CONTACTS_ADDED = {
message: "They were added.",
};
// Used in: ContactsView.vue (addContact method - export data prompt after contact addition)
export const NOTIFY_EXPORT_DATA_PROMPT = {
title: "Export Your Data",
message: "Would you like to export your contact data as a backup?",
};
// Used in: ContactsView.vue (showCopySelectionsInfo method - info about copying contacts)
export const NOTIFY_CONTACT_INFO_COPY = {
title: "Info",
@@ -1191,17 +1197,6 @@ export const NOTIFY_GIFTED_DETAILS_NO_IDENTIFIER = {
message: "You must select an identifier before you can record a give.",
};
export const NOTIFY_GIFTED_DETAILS_PROJECT_PROVIDER_INFO = {
title: "Project Provider Info",
message:
"To select a project as a provider, you must open this page through a project.",
};
export const NOTIFY_GIFTED_DETAILS_BOTH_PROVIDER_SELECTED = {
title: "Invalid Selection",
message: "You cannot select both a giving project and person.",
};
export const NOTIFY_GIFTED_DETAILS_RECORDING_GIVE = {
title: "",
message: "Recording the give...",
@@ -1599,7 +1594,7 @@ export function createImageDialogCameraErrorMessage(error: Error): string {
// Helper function for dynamic upload error messages
// Used in: ImageMethodDialog.vue (uploadImage method - dynamic upload error message)
export function createImageDialogUploadErrorMessage(error: any): string {
export function createImageDialogUploadErrorMessage(error: unknown): string {
if (axios.isAxiosError(error)) {
const status = error.response?.status;
const data = error.response?.data;

2
src/db-sql/migration.ts
View File

@@ -131,7 +131,7 @@ const MIGRATIONS = [
* @param extractMigrationNames - A function that extracts the names (string array) from "select name from migrations"
*/
export async function runMigrations<T>(
sqlExec: (sql: string, params?: unknown[]) => Promise<unknown>,
sqlExec: (sql: string, params?: unknown[]) => Promise<void>,
sqlQuery: (sql: string, params?: unknown[]) => Promise<T>,
extractMigrationNames: (result: T) => Set<string>,
): Promise<void> {

11
src/db/tables/contacts.ts
View File

@@ -32,6 +32,17 @@ export type ContactWithJsonStrings = Omit<Contact, "contactMethods"> & {
contactMethods?: string;
};
/**
* This is for those cases (eg. with a DB) where field values may be all primitives or may be JSON values.
* See src/db/databaseUtil.ts parseJsonField for more details.
*
* This is so that we can reuse most of the type and don't have to maintain another copy.
* Another approach uses typescript conditionals: https://chatgpt.com/share/6855cdc3-ab5c-8007-8525-726612016eb2
*/
export type ContactMaybeWithJsonStrings = Omit<Contact, "contactMethods"> & {
contactMethods?: string | Array<ContactMethod>;
};
export const ContactSchema = {
contacts: "&did, name", // no need to key by other things
};

2
src/db/tables/settings.ts
View File

@@ -10,6 +10,8 @@ export type BoundingBox = {
/**
* Settings type encompasses user-specific configuration details.
*
* New entries that are boolean should also be added to PlatformServiceMixin._mapColumnsToValues
*/
export type Settings = {
// default entry is keyed with MASTER_SETTINGS_KEY; other entries are linked to an account with account ID

94
src/interfaces/common.ts
View File

@@ -1,10 +1,7 @@
// similar to VerifiableCredentialSubject... maybe rename this
export interface GenericVerifiableCredential {
"@context"?: string;
"@type": string;
name?: string;
description?: string;
agent?: string | { identifier: string };
"@type"?: string;
[key: string]: unknown;
}
@@ -47,7 +44,7 @@ export interface KeyMetaWithPrivate extends KeyMeta {
}
export interface QuantitativeValue extends GenericVerifiableCredential {
"@type": "QuantitativeValue";
"@type"?: "QuantitativeValue";
"@context"?: string;
amountOfThisGood: number;
unitCode: string;
@@ -63,9 +60,13 @@ export interface AxiosErrorResponse {
[key: string]: unknown;
};
status?: number;
statusText?: string;
config?: unknown;
};
config?: unknown;
config?: {
url?: string;
[key: string]: unknown;
};
[key: string]: unknown;
}
@@ -97,8 +98,85 @@ export interface ClaimObject {
export interface VerifiableCredentialClaim {
"@context"?: string;
"@type": string;
type: string[];
"@type"?: string;
credentialSubject: ClaimObject;
[key: string]: unknown;
}
/**
* Database constraint error types for consistent error handling
*/
export interface DatabaseConstraintError extends Error {
name: "ConstraintError";
message: string;
constraint?: string;
}
/**
* Database storage error types for IndexedDB/SQLite operations
*/
export interface DatabaseStorageError extends Error {
name: "StorageError";
message: string;
code?: string;
constraint?: string;
}
/**
* Legacy Dexie error types for migration compatibility
*/
export interface DexieError extends Error {
name: string;
message: string;
inner?: unknown;
stack?: string;
}
/**
* Type guard for database constraint errors
*/
export function isDatabaseConstraintError(
error: unknown,
): error is DatabaseConstraintError {
return error instanceof Error && error.name === "ConstraintError";
}
/**
* Type guard for database storage errors
*/
export function isDatabaseStorageError(
error: unknown,
): error is DatabaseStorageError {
return error instanceof Error && error.name === "StorageError";
}
/**
* Type guard for legacy Dexie errors
*/
export function isDexieError(error: unknown): error is DexieError {
return (
error instanceof Error &&
(error.name === "DexieError" ||
error.message.includes("Key already exists in the object store") ||
error.message.includes("ConstraintError"))
);
}
/**
* Unified error type for database operations
*/
export type DatabaseError =
| DatabaseConstraintError
| DatabaseStorageError
| DexieError;
/**
* Type guard for any database error
*/
export function isDatabaseError(error: unknown): error is DatabaseError {
return (
isDatabaseConstraintError(error) ||
isDatabaseStorageError(error) ||
isDexieError(error)
);
}

29
src/interfaces/deepLinks.ts
View File

@@ -28,12 +28,11 @@
import { z } from "zod";
// Parameter validation schemas for each route type
export const deepLinkSchemas = {
export const deepLinkPathSchemas = {
claim: z.object({
id: z.string(),
}),
"claim-add-raw": z.object({
id: z.string(),
claim: z.string().optional(),
claimJwtId: z.string().optional(),
}),
@@ -61,7 +60,7 @@ export const deepLinkSchemas = {
jwt: z.string().optional(),
}),
"onboard-meeting-members": z.object({
id: z.string(),
groupId: z.string(),
}),
project: z.object({
id: z.string(),
@@ -71,6 +70,17 @@ export const deepLinkSchemas = {
}),
};
export const deepLinkQuerySchemas = {
"onboard-meeting-members": z.object({
password: z.string(),
}),
};
// Add a union type of all valid route paths
export const VALID_DEEP_LINK_ROUTES = Object.keys(
deepLinkPathSchemas,
) as readonly (keyof typeof deepLinkPathSchemas)[];
// Create a type from the array
export type DeepLinkRoute = (typeof VALID_DEEP_LINK_ROUTES)[number];
@@ -81,14 +91,13 @@ export const baseUrlSchema = z.object({
queryParams: z.record(z.string()).optional(),
});
// Add a union type of all valid route paths
export const VALID_DEEP_LINK_ROUTES = Object.keys(
deepLinkSchemas,
) as readonly (keyof typeof deepLinkSchemas)[];
// export type DeepLinkPathParams = {
// [K in keyof typeof deepLinkPathSchemas]: z.infer<(typeof deepLinkPathSchemas)[K]>;
// };
export type DeepLinkParams = {
[K in keyof typeof deepLinkSchemas]: z.infer<(typeof deepLinkSchemas)[K]>;
};
// export type DeepLinkQueryParams = {
// [K in keyof typeof deepLinkQuerySchemas]: z.infer<(typeof deepLinkQuerySchemas)[K]>;
// };
export interface DeepLinkError extends Error {
code: string;

17
src/libs/endorserServer.ts
View File

@@ -212,13 +212,13 @@ const testRecursivelyOnStrings = (
// eslint-disable-next-line @typescript-eslint/no-explicit-any
export function containsHiddenDid(obj: any) {
return testRecursivelyOnStrings(isHiddenDid, obj);
return testRecursivelyOnStrings(obj, isHiddenDid);
}
// eslint-disable-next-line @typescript-eslint/no-explicit-any
export const containsNonHiddenDid = (obj: any) => {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
return testRecursivelyOnStrings((s: any) => isDid(s) && !isHiddenDid(s), obj);
return testRecursivelyOnStrings(obj, (s: any) => isDid(s) && !isHiddenDid(s));
};
export function stripEndorserPrefix(claimId: string) {
@@ -697,7 +697,6 @@ export function hydrateGive(
if (amount && !isNaN(amount)) {
const quantitativeValue: QuantitativeValue = {
"@type": "QuantitativeValue",
amountOfThisGood: amount,
unitCode: unitCode || "HUR",
};
@@ -1342,7 +1341,6 @@ export async function createEndorserJwtVcFromClaim(
vc: {
"@context": "https://www.w3.org/2018/credentials/v1",
"@type": "VerifiableCredential",
type: ["VerifiableCredential"],
credentialSubject: claim,
},
};
@@ -1350,12 +1348,12 @@ export async function createEndorserJwtVcFromClaim(
}
/**
* Create a JWT for a RegisterAction claim.
* Create a JWT for a RegisterAction claim, used for registrations & invites.
*
* @param activeDid - The DID of the user creating the invite
* @param contact - The contact to register, with a 'did' field (all optional for invites)
* @param identifier - The identifier for the invite, usually random
* @param expiresIn - The number of seconds until the invite expires
* @param contact - Optional - The contact to register, with a 'did' field (all optional for invites)
* @param identifier - Optional - The identifier for the invite, usually random
* @param expiresIn - Optional - The number of seconds until the invite expires
* @returns The JWT for the RegisterAction claim
*/
export async function createInviteJwt(
@@ -1369,7 +1367,7 @@ export async function createInviteJwt(
"@type": "RegisterAction",
agent: { identifier: activeDid },
object: SERVICE_ID,
identifier: identifier,
identifier: identifier, // not sent if undefined
};
if (contact?.did) {
vcClaim.participant = { identifier: contact.did };
@@ -1380,7 +1378,6 @@ export async function createInviteJwt(
vc: {
"@context": "https://www.w3.org/2018/credentials/v1",
"@type": "VerifiableCredential",
type: ["VerifiableCredential"],
credentialSubject: vcClaim as unknown as ClaimObject, // Type assertion needed due to object being string
},
};

10
src/libs/fontawesome.ts
View File

@@ -20,6 +20,7 @@ import {
faCameraRotate,
faCaretDown,
faChair,
faChartLine,
faCheck,
faChevronDown,
faChevronLeft,
@@ -28,6 +29,7 @@ import {
faCircle,
faCircleCheck,
faCircleInfo,
faCirclePlus,
faCircleQuestion,
faCircleRight,
faCircleUser,
@@ -49,6 +51,7 @@ import {
faFloppyDisk,
faFolderOpen,
faForward,
faGear,
faGift,
faGlobe,
faHammer,
@@ -58,6 +61,7 @@ import {
faHouseChimney,
faImage,
faImagePortrait,
faInfo,
faLeftRight,
faLightbulb,
faLink,
@@ -72,8 +76,8 @@ import {
faPersonCircleCheck,
faPersonCircleQuestion,
faPlus,
faQuestion,
faQrcode,
faQuestion,
faRightFromBracket,
faRotate,
faShareNodes,
@@ -106,6 +110,7 @@ library.add(
faCameraRotate,
faCaretDown,
faChair,
faChartLine,
faCheck,
faChevronDown,
faChevronLeft,
@@ -114,6 +119,7 @@ library.add(
faCircle,
faCircleCheck,
faCircleInfo,
faCirclePlus,
faCircleQuestion,
faCircleRight,
faCircleUser,
@@ -135,6 +141,7 @@ library.add(
faFloppyDisk,
faFolderOpen,
faForward,
faGear,
faGift,
faGlobe,
faHammer,
@@ -144,6 +151,7 @@ library.add(
faHouseChimney,
faImage,
faImagePortrait,
faInfo,
faLeftRight,
faLightbulb,
faLink,

2
src/libs/partnerServer.ts
View File

@@ -4,6 +4,6 @@ export interface UserProfile {
locLon?: number;
locLat2?: number;
locLon2?: number;
issuerDid?: string;
issuerDid: string;
rowId?: string; // set on profile retrieved from server
}

41
src/libs/util.ts
View File

@@ -7,7 +7,7 @@ import { useClipboard } from "@vueuse/core";
import { DEFAULT_PUSH_SERVER, NotificationIface } from "../constants/app";
import { Account, AccountEncrypted } from "../db/tables/accounts";
import { Contact, ContactWithJsonStrings } from "../db/tables/contacts";
import { Contact } from "../db/tables/contacts";
import { DEFAULT_PASSKEY_EXPIRATION_MINUTES } from "../db/tables/settings";
import {
arrayBufferToBase64,
@@ -34,18 +34,7 @@ import { PlatformServiceFactory } from "../services/PlatformServiceFactory";
import { IIdentifier } from "@veramo/core";
import { DEFAULT_ROOT_DERIVATION_PATH } from "./crypto";
// Consolidate this with src/utils/PlatformServiceMixin._parseJsonField
function parseJsonField<T>(value: unknown, defaultValue: T): T {
if (typeof value === "string") {
try {
return JSON.parse(value);
} catch {
return defaultValue;
}
}
return (value as T) || defaultValue;
}
// Consolidate this with src/utils/PlatformServiceMixin.mapQueryResultToValues
function mapQueryResultToValues(
record: { columns: string[]; values: unknown[][] } | undefined,
): Array<Record<string, unknown>> {
@@ -68,10 +57,10 @@ async function getPlatformService() {
}
export interface GiverReceiverInputInfo {
did?: string;
did?: string; // only for people
name?: string;
image?: string;
handleId?: string;
handleId?: string; // only for projects
}
export enum OnboardPage {
@@ -191,9 +180,9 @@ export const nameForDid = (
did: string,
): string => {
if (did === activeDid) {
return "you";
return "You";
}
const contact = R.find((con) => con.did == did, contacts);
const contact = R.find((con) => con.did === did, contacts);
return nameForContact(contact);
};
@@ -806,7 +795,7 @@ export const contactToCsvLine = (contact: Contact): string => {
// Handle contactMethods array by stringifying it
const contactMethodsStr = contact.contactMethods
? escapeField(JSON.stringify(parseJsonField(contact.contactMethods, [])))
? escapeField(JSON.stringify(contact.contactMethods))
: "";
const fields = [
@@ -904,31 +893,19 @@ export interface DatabaseExport {
}
/**
* Converts an array of contacts to the standardized database export JSON format.
* Converts an array of contacts to the export JSON format.
* This format is used for data migration and backup purposes.
*
* @param contacts - Array of Contact objects to convert
* @returns DatabaseExport object in the standardized format
*/
export const contactsToExportJson = (contacts: Contact[]): DatabaseExport => {
// Convert each contact to a plain object and ensure all fields are included
const rows = contacts.map((contact) => {
const exContact: ContactWithJsonStrings = R.omit(
["contactMethods"],
contact,
);
exContact.contactMethods = contact.contactMethods
? JSON.stringify(parseJsonField(contact.contactMethods, []))
: undefined;
return exContact;
});
return {
data: {
data: [
{
tableName: "contacts",
rows,
rows: contacts,
},
],
},

120
src/main.capacitor.ts
View File

@@ -29,14 +29,14 @@
*/
import { initializeApp } from "./main.common";
import { App } from "./libs/capacitor/app";
import { App as CapacitorApp } from "@capacitor/app";
import router from "./router";
import { handleApiError } from "./services/api";
import { AxiosError } from "axios";
import { DeepLinkHandler } from "./services/deepLinks";
import { logger, safeStringify } from "./utils/logger";
logger.log("[Capacitor] Starting initialization");
logger.log("[Capacitor] 🚀 Starting initialization");
logger.log("[Capacitor] Platform:", process.env.VITE_PLATFORM);
const app = initializeApp();
@@ -67,23 +67,123 @@ const deepLinkHandler = new DeepLinkHandler(router);
* @throws {Error} If URL format is invalid
*/
const handleDeepLink = async (data: { url: string }) => {
const { url } = data;
logger.info(`[Main] 🌐 Deeplink received from Capacitor: ${url}`);
try {
// Wait for router to be ready
logger.info(`[Main] ⏳ Waiting for router to be ready...`);
await router.isReady();
await deepLinkHandler.handleDeepLink(data.url);
logger.info(`[Main] ✅ Router is ready, processing deeplink`);
// Process the deeplink
logger.info(`[Main] 🚀 Starting deeplink processing`);
await deepLinkHandler.handleDeepLink(url);
logger.info(`[Main] ✅ Deeplink processed successfully`);
} catch (error) {
logger.error("[DeepLink] Error handling deep link: ", error);
logger.error(`[Main] ❌ Deeplink processing failed:`, {
url,
error: error instanceof Error ? error.message : String(error),
stack: error instanceof Error ? error.stack : undefined,
timestamp: new Date().toISOString(),
});
// Log additional context for debugging
logger.error(`[Main] 🔍 Debug context:`, {
routerReady: router.isReady(),
currentRoute: router.currentRoute.value,
appMounted: app._instance?.isMounted,
timestamp: new Date().toISOString(),
});
// Fallback to original error handling
let message: string =
error instanceof Error ? error.message : safeStringify(error);
if (data.url) {
message += `\nURL: ${data.url}`;
if (url) {
message += `\nURL: ${url}`;
}
handleApiError({ message } as AxiosError, "deep-link");
}
};
// Register deep link handler with Capacitor
App.addListener("appUrlOpen", handleDeepLink);
// Function to register the deeplink listener
const registerDeepLinkListener = async () => {
try {
logger.info(
`[Main] 🔗 Attempting to register deeplink handler with Capacitor`,
);
logger.log("[Capacitor] Mounting app");
// Check if Capacitor App plugin is available
logger.info(`[Main] 🔍 Checking Capacitor App plugin availability...`);
if (!CapacitorApp) {
throw new Error("Capacitor App plugin not available");
}
logger.info(`[Main] ✅ Capacitor App plugin is available`);
// Check available methods on CapacitorApp
logger.info(
`[Main] 🔍 Capacitor App plugin methods:`,
Object.getOwnPropertyNames(CapacitorApp),
);
logger.info(
`[Main] 🔍 Capacitor App plugin addListener method:`,
typeof CapacitorApp.addListener,
);
// Wait for router to be ready first
await router.isReady();
logger.info(
`[Main] ✅ Router is ready, proceeding with listener registration`,
);
// Try to register the listener
logger.info(`[Main] 🧪 Attempting to register appUrlOpen listener...`);
const listenerHandle = await CapacitorApp.addListener(
"appUrlOpen",
handleDeepLink,
);
logger.info(
`[Main] ✅ appUrlOpen listener registered successfully with handle:`,
listenerHandle,
);
// Test the listener registration by checking if it's actually registered
logger.info(`[Main] 🧪 Verifying listener registration...`);
return listenerHandle;
} catch (error) {
logger.error(`[Main] ❌ Failed to register deeplink listener:`, {
error: error instanceof Error ? error.message : String(error),
stack: error instanceof Error ? error.stack : undefined,
timestamp: new Date().toISOString(),
});
throw error;
}
};
logger.log("[Capacitor] 🚀 Mounting app");
app.mount("#app");
logger.log("[Capacitor] App mounted");
logger.info(`[Main] ✅ App mounted successfully`);
// Register deeplink listener after app is mounted
setTimeout(async () => {
try {
logger.info(
`[Main] ⏳ Delaying listener registration to ensure Capacitor is ready...`,
);
await registerDeepLinkListener();
logger.info(`[Main] 🎉 Deep link system fully initialized!`);
} catch (error) {
logger.error(`[Main] ❌ Deep link system initialization failed:`, error);
}
}, 2000); // 2 second delay to ensure Capacitor is fully ready
// Log app initialization status
setTimeout(() => {
logger.info(`[Main] 📊 App initialization status:`, {
routerReady: router.isReady(),
currentRoute: router.currentRoute.value,
appMounted: app._instance?.isMounted,
timestamp: new Date().toISOString(),
});
}, 1000);

2
src/main.electron.ts
View File

@@ -79,7 +79,7 @@ window.addEventListener("unhandledrejection", (event) => {
});
// Electron-specific initialization
if (typeof window !== "undefined" && window.require) {
if (typeof window !== "undefined" && typeof window.require === "function") {
// We're in an Electron renderer process
logger.log("[Electron] Detected Electron renderer process");

26
src/main.ts Normal file
View File

@@ -0,0 +1,26 @@
/**
* @file Dynamic Main Entry Point
* @author Matthew Raymer
*
* This file dynamically loads the appropriate platform-specific main entry point
* based on the current environment and build configuration.
*/
import { logger } from "./utils/logger";
// Check the platform from environment variables
const platform = process.env.VITE_PLATFORM || "web";
logger.info(`[Main] 🚀 Loading TimeSafari for platform: ${platform}`);
// Dynamically import the appropriate main entry point
if (platform === "capacitor") {
logger.info(`[Main] 📱 Loading Capacitor-specific entry point`);
import("./main.capacitor");
} else if (platform === "electron") {
logger.info(`[Main] 💻 Loading Electron-specific entry point`);
import("./main.electron");
} else {
logger.info(`[Main] 🌐 Loading Web-specific entry point`);
import("./main.web");
}

92
src/router/index.ts
View File

@@ -82,6 +82,15 @@ const routes: Array<RouteRecordRaw> = [
name: "database-migration",
component: () => import("../views/DatabaseMigration.vue"),
},
{
path: "/deep-link-error",
name: "deep-link-error",
component: () => import("../views/DeepLinkErrorView.vue"),
meta: {
title: "Invalid Deep Link",
requiresAuth: false,
},
},
{
path: "/did/:did?",
name: "did",
@@ -276,15 +285,6 @@ const routes: Array<RouteRecordRaw> = [
name: "user-profile",
component: () => import("../views/UserProfileView.vue"),
},
{
path: "/deep-link-error",
name: "deep-link-error",
component: () => import("../views/DeepLinkErrorView.vue"),
meta: {
title: "Invalid Deep Link",
requiresAuth: false,
},
},
];
const isElectron = window.location.protocol === "file:";
@@ -321,24 +321,21 @@ const errorHandler = (
router.onError(errorHandler); // Assign the error handler to the router instance
/**
* Global navigation guard to ensure user identity exists
*
* This guard checks if the user has any identities before navigating to most routes.
* If no identity exists, it automatically creates one using the default seed-based method.
*
* Routes that are excluded from this check:
* - /start - Manual identity creation selection
* - /new-identifier - Manual seed-based creation
* - /import-account - Manual import flow
* - /import-derive - Manual derivation flow
* - /database-migration - Migration utilities
* - /deep-link-error - Error page
*
* Navigation guard to ensure user has an identity before accessing protected routes
* @param to - Target route
* @param from - Source route
* @param _from - Source route (unused)
* @param next - Navigation function
*/
router.beforeEach(async (to, from, next) => {
router.beforeEach(async (to, _from, next) => {
logger.info(`[Router] 🧭 Navigation guard triggered:`, {
from: _from?.path || "none",
to: to.path,
name: to.name,
params: to.params,
query: to.query,
timestamp: new Date().toISOString(),
});
try {
// Skip identity check for routes that handle identity creation manually
const skipIdentityRoutes = [
@@ -351,32 +348,67 @@ router.beforeEach(async (to, from, next) => {
];
if (skipIdentityRoutes.includes(to.path)) {
logger.debug(`[Router] ⏭️ Skipping identity check for route: ${to.path}`);
return next();
}
logger.info(`[Router] 🔍 Checking user identity for route: ${to.path}`);
// Check if user has any identities
const allMyDids = await retrieveAccountDids();
logger.info(`[Router] 📋 Found ${allMyDids.length} user identities`);
if (allMyDids.length === 0) {
logger.info("[Router] No identities found, creating default identity");
logger.info("[Router] ⚠️ No identities found, creating default identity");
// Create identity automatically using seed-based method
await generateSaveAndActivateIdentity();
logger.info("[Router] Default identity created successfully");
logger.info("[Router] ✅ Default identity created successfully");
} else {
logger.info(
`[Router] ✅ User has ${allMyDids.length} identities, proceeding`,
);
}
logger.info(`[Router] ✅ Navigation guard passed for: ${to.path}`);
next();
} catch (error) {
logger.error(
"[Router] Identity creation failed in navigation guard:",
error,
);
logger.error("[Router] ❌ Identity creation failed in navigation guard:", {
error: error instanceof Error ? error.message : String(error),
stack: error instanceof Error ? error.stack : undefined,
route: to.path,
timestamp: new Date().toISOString(),
});
// Redirect to start page if identity creation fails
// This allows users to manually create an identity or troubleshoot
logger.info(
`[Router] 🔄 Redirecting to /start due to identity creation failure`,
);
next("/start");
}
});
// Add navigation success logging
router.afterEach((to, from) => {
logger.info(`[Router] ✅ Navigation completed:`, {
from: from?.path || "none",
to: to.path,
name: to.name,
params: to.params,
query: to.query,
timestamp: new Date().toISOString(),
});
});
// Add error logging
router.onError((error) => {
logger.error(`[Router] ❌ Navigation error:`, {
error: error instanceof Error ? error.message : String(error),
stack: error instanceof Error ? error.stack : undefined,
timestamp: new Date().toISOString(),
});
});
export default router;

19
src/services/AbsurdSqlDatabaseService.ts
View File

@@ -1,7 +1,9 @@
// **WORKER-COMPATIBLE CRYPTO POLYFILL**: Must be at the very top
// This prevents "crypto is not defined" errors when running in worker context
if (typeof window === "undefined" && typeof crypto === "undefined") {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
(globalThis as any).crypto = {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
getRandomValues: (array: any) => {
// Simple fallback for worker context
for (let i = 0; i < array.length; i++) {
@@ -134,7 +136,11 @@ class AbsurdSqlDatabaseService implements DatabaseService {
// An error is thrown without this pragma: "File has invalid page size. (the first block of a new file must be written first)"
await this.db.exec(`PRAGMA journal_mode=MEMORY;`);
const sqlExec = this.db.run.bind(this.db);
// Create wrapper functions that match the expected signatures
const sqlExec = async (sql: string, params?: unknown[]): Promise<void> => {
await this.db!.run(sql, params);
};
const sqlQuery = this.db.exec.bind(this.db);
// Extract the migration names for the absurd-sql format
@@ -178,14 +184,6 @@ class AbsurdSqlDatabaseService implements DatabaseService {
}
operation.resolve(result);
} catch (error) {
// logger.error( // DISABLED
// "Error while processing SQL queue:",
// error,
// " ... for sql:",
// operation.sql,
// " ... with params:",
// operation.params,
// );
logger.error(
"Error while processing SQL queue:",
error,
@@ -238,9 +236,6 @@ class AbsurdSqlDatabaseService implements DatabaseService {
// If initialized but no db, something went wrong
if (!this.db) {
// logger.error( // DISABLED
// `Database not properly initialized after await waitForInitialization() - initialized flag is true but db is null`,
// );
logger.error(
`Database not properly initialized after await waitForInitialization() - initialized flag is true but db is null`,
);

104
src/services/ProfileService.ts
View File

@@ -103,9 +103,10 @@ export class ProfileService {
{ headers },
);
if (response.status === 200) {
if (response.status === 201) {
return true;
} else {
logger.error("Error saving profile:", response);
throw new Error(ACCOUNT_VIEW_CONSTANTS.ERRORS.PROFILE_NOT_SAVED);
}
} catch (error) {
@@ -123,17 +124,55 @@ export class ProfileService {
async deleteProfile(activeDid: string): Promise<boolean> {
try {
const headers = await getHeaders(activeDid);
const response = await this.axios.delete(
`${this.partnerApiServer}/api/partner/userProfile`,
{ headers },
);
const url = `${this.partnerApiServer}/api/partner/userProfile`;
const response = await this.axios.delete(url, { headers });
if (response.status === 200) {
if (response.status === 204 || response.status === 200) {
logger.info("Profile deleted successfully");
return true;
} else {
throw new Error(ACCOUNT_VIEW_CONSTANTS.ERRORS.PROFILE_NOT_DELETED);
logger.error("Unexpected response status when deleting profile:", {
status: response.status,
statusText: response.statusText,
data: response.data,
});
throw new Error(
`Profile not deleted - HTTP ${response.status}: ${response.statusText}`,
);
}
} catch (error) {
if (this.isApiError(error) && error.response) {
const response = error.response;
logger.error("API error deleting profile:", {
status: response.status,
statusText: response.statusText,
data: response.data,
url: this.getErrorUrl(error),
});
// Handle specific HTTP status codes
if (response.status === 204) {
logger.debug("Profile deleted successfully (204 No Content)");
return true; // 204 is success for DELETE operations
} else if (response.status === 404) {
logger.warn("Profile not found - may already be deleted");
return true; // Consider this a success if profile doesn't exist
} else if (response.status === 400) {
logger.error("Bad request when deleting profile:", response.data);
const errorMessage =
typeof response.data === "string"
? response.data
: response.data?.message || "Bad request";
throw new Error(`Profile deletion failed: ${errorMessage}`);
} else if (response.status === 401) {
logger.error("Unauthorized to delete profile");
throw new Error("You are not authorized to delete this profile");
} else if (response.status === 403) {
logger.error("Forbidden to delete profile");
throw new Error("You are not allowed to delete this profile");
}
}
logger.error("Error deleting profile:", errorStringForLog(error));
handleApiError(error as AxiosError, "/api/partner/userProfile");
return false;
@@ -203,13 +242,56 @@ export class ProfileService {
}
/**
* Type guard for API errors
* Type guard for API errors with proper typing
*/
private isApiError(
error: unknown,
): error is { response?: { status?: number } } {
private isApiError(error: unknown): error is {
response?: {
status?: number;
statusText?: string;
data?: { message?: string } | string;
};
} {
return typeof error === "object" && error !== null && "response" in error;
}
/**
* Extract error URL safely from error object
*/
private getErrorUrl(error: unknown): string | undefined {
if (this.isAxiosError(error)) {
return error.config?.url;
}
if (this.isApiError(error) && this.hasConfigProperty(error)) {
const config = this.getConfigProperty(error);
return config?.url;
}
return undefined;
}
/**
* Type guard to check if error has config property
*/
private hasConfigProperty(
error: unknown,
): error is { config?: { url?: string } } {
return typeof error === "object" && error !== null && "config" in error;
}
/**
* Safely extract config property from error
*/
private getConfigProperty(error: {
config?: { url?: string };
}): { url?: string } | undefined {
return error.config;
}
/**
* Type guard for AxiosError
*/
private isAxiosError(error: unknown): error is AxiosError {
return error instanceof AxiosError;
}
}
/**

99
src/services/QRNavigationService.ts Normal file
View File

@@ -0,0 +1,99 @@
import { PlatformServiceFactory } from "./PlatformServiceFactory";
import { PlatformService } from "./PlatformService";
import { logger } from "@/utils/logger";
/**
* QR Navigation Service
*
* Handles platform-specific routing logic for QR scanning operations.
* Removes coupling between views and routing logic by centralizing
* navigation decisions based on platform capabilities.
*
* @author Matthew Raymer
*/
export class QRNavigationService {
private static instance: QRNavigationService | null = null;
private platformService: PlatformService;
private constructor() {
this.platformService = PlatformServiceFactory.getInstance();
}
/**
* Get singleton instance of QRNavigationService
*/
public static getInstance(): QRNavigationService {
if (!QRNavigationService.instance) {
QRNavigationService.instance = new QRNavigationService();
}
return QRNavigationService.instance;
}
/**
* Get the appropriate QR scanner route based on platform
*
* @returns Object with route name and parameters for QR scanning
*/
public getQRScannerRoute(): {
name: string;
params?: Record<string, string | number>;
} {
const isCapacitor = this.platformService.isCapacitor();
logger.debug("QR Navigation - Platform detection:", {
isCapacitor,
platform: this.platformService.getCapabilities(),
});
if (isCapacitor) {
// Use native scanner on mobile platforms
return { name: "contact-qr-scan-full" };
} else {
// Use web scanner on other platforms
return { name: "contact-qr" };
}
}
/**
* Get the appropriate QR display route based on platform
*
* @returns Object with route name and parameters for QR display
*/
public getQRDisplayRoute(): {
name: string;
params?: Record<string, string | number>;
} {
const isCapacitor = this.platformService.isCapacitor();
logger.debug("QR Navigation - Display route detection:", {
isCapacitor,
platform: this.platformService.getCapabilities(),
});
if (isCapacitor) {
// Use dedicated display view on mobile
return { name: "contact-qr-scan-show" };
} else {
// Use combined view on web
return { name: "contact-qr" };
}
}
/**
* Check if native QR scanning is available on current platform
*
* @returns true if native scanning is available, false otherwise
*/
public isNativeScanningAvailable(): boolean {
return this.platformService.isCapacitor();
}
/**
* Get platform capabilities for QR operations
*
* @returns Platform capabilities object
*/
public getPlatformCapabilities() {
return this.platformService.getCapabilities();
}
}

360
src/services/deepLinks.ts
View File

@@ -1,58 +1,25 @@
/**
* @file Deep Link Handler Service
* DeepLinks Service
*
* Handles deep link processing and routing for the TimeSafari application.
* Supports both path parameters and query parameters with comprehensive validation.
*
* @author Matthew Raymer
*
* This service handles the processing and routing of deep links in the TimeSafari app.
* It provides a type-safe interface between the raw deep links and the application router.
*
* Architecture:
* 1. DeepLinkHandler class encapsulates all deep link processing logic
* 2. Uses Zod schemas from interfaces/deepLinks for parameter validation
* 3. Provides consistent error handling and logging
* 4. Maps validated parameters to Vue router calls
*
* Error Handling Strategy:
* - All errors are wrapped in DeepLinkError interface
* - Errors include error codes for systematic handling
* - Detailed error information is logged for debugging
* - Errors are propagated to the global error handler
*
* Validation Strategy:
* - URL structure validation
* - Route-specific parameter validation using Zod schemas
* - Query parameter validation and sanitization
* - Type-safe parameter passing to router
*
* Deep Link Format:
* timesafari://<route>[/<param>][?queryParam1=value1&queryParam2=value2]
*
* Supported Routes:
* - claim: View claim
* - claim-add-raw: Add raw claim
* - claim-cert: View claim certificate
* - confirm-gift
* - contact-import: Import contacts
* - did: View DID
* - invite-one-accept: Accept invitation
* - onboard-meeting-members
* - project: View project details
* - user-profile: View user profile
*
* @example
* const handler = new DeepLinkHandler(router);
* await handler.handleDeepLink("timesafari://claim/123?view=details");
* @version 2.0.0
* @since 2025-01-25
*/
import { Router } from "vue-router";
import { z } from "zod";
import {
deepLinkSchemas,
baseUrlSchema,
deepLinkPathSchemas,
routeSchema,
DeepLinkRoute,
deepLinkQuerySchemas,
} from "../interfaces/deepLinks";
import type { DeepLinkError } from "../interfaces/deepLinks";
import { logger } from "../utils/logger";
// Helper function to extract the first key from a Zod object schema
function getFirstKeyFromZodObject(
@@ -73,7 +40,7 @@ function getFirstKeyFromZodObject(
* because "router.replace" expects the right parameter name for the route.
*/
export const ROUTE_MAP: Record<string, { name: string; paramKey?: string }> =
Object.entries(deepLinkSchemas).reduce(
Object.entries(deepLinkPathSchemas).reduce(
(acc, [routeName, schema]) => {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const paramKey = getFirstKeyFromZodObject(schema as z.ZodObject<any>);
@@ -102,79 +69,152 @@ export class DeepLinkHandler {
}
/**
* Parses deep link URL into path, params and query components.
* Validates URL structure using Zod schemas.
*
* @param url - The deep link URL to parse (format: scheme://path[?query])
* @throws {DeepLinkError} If URL format is invalid
* @returns Parsed URL components (path: string, params: {KEY: string}, query: {KEY: string})
* Main entry point for processing deep links
* @param url - The deep link URL to process
* @throws {DeepLinkError} If validation fails or route is invalid
*/
private parseDeepLink(url: string) {
const parts = url.split("://");
if (parts.length !== 2) {
throw { code: "INVALID_URL", message: "Invalid URL format" };
}
async handleDeepLink(url: string): Promise<void> {
logger.info(`[DeepLink] 🚀 Starting deeplink processing for URL: ${url}`);
// Validate base URL structure
baseUrlSchema.parse({
scheme: parts[0],
path: parts[1],
queryParams: {}, // Will be populated below
});
try {
logger.info(`[DeepLink] 📍 Parsing URL: ${url}`);
const { path, params, query } = this.parseDeepLink(url);
const [path, queryString] = parts[1].split("?");
const [routePath, ...pathParams] = path.split("/");
// Validate route exists before proceeding
if (!ROUTE_MAP[routePath]) {
throw {
code: "INVALID_ROUTE",
message: `Invalid route path: ${routePath}`,
details: { routePath },
};
}
const query: Record<string, string> = {};
if (queryString) {
new URLSearchParams(queryString).forEach((value, key) => {
query[key] = value;
logger.info(`[DeepLink] ✅ URL parsed successfully:`, {
path,
params: Object.keys(params),
query: Object.keys(query),
fullParams: params,
fullQuery: query,
});
}
const params: Record<string, string> = {};
if (pathParams) {
// Now we know routePath exists in ROUTE_MAP
const routeConfig = ROUTE_MAP[routePath];
params[routeConfig.paramKey ?? "id"] = pathParams.join("/");
}
// Sanitize parameters (remove undefined values)
const sanitizedParams = Object.fromEntries(
Object.entries(params).map(([key, value]) => [key, value ?? ""]),
);
return { path: routePath, params, query };
logger.info(`[DeepLink] 🧹 Parameters sanitized:`, sanitizedParams);
await this.validateAndRoute(path, sanitizedParams, query);
logger.info(`[DeepLink] 🎯 Deeplink processing completed successfully`);
} catch (error) {
logger.error(`[DeepLink] ❌ Deeplink processing failed:`, {
url,
error: error instanceof Error ? error.message : String(error),
stack: error instanceof Error ? error.stack : undefined,
});
const deepLinkError = error as DeepLinkError;
throw deepLinkError;
}
}
/**
* Routes the deep link to appropriate view with validated parameters.
* Validates route and parameters using Zod schemas before routing.
*
* @param path - The route path from the deep link
* @param params - URL parameters
* @param query - Query string parameters
* @throws {DeepLinkError} If validation fails or route is invalid
* Parse a deep link URL into its components
* @param url - The deep link URL
* @returns Parsed components
*/
private parseDeepLink(url: string): {
path: string;
params: Record<string, string>;
query: Record<string, string>;
} {
logger.debug(`[DeepLink] 🔍 Parsing deep link: ${url}`);
try {
const parts = url.split("://");
if (parts.length !== 2) {
throw new Error("Invalid URL format");
}
const [path, queryString] = parts[1].split("?");
const [routePath, ...pathParams] = path.split("/");
// Parse path parameters using route-specific configuration
const params: Record<string, string> = {};
if (pathParams.length > 0) {
// Get the correct parameter key for this route
const routeConfig = ROUTE_MAP[routePath];
if (routeConfig?.paramKey) {
params[routeConfig.paramKey] = pathParams[0];
logger.debug(
`[DeepLink] 📍 Path parameter extracted: ${routeConfig.paramKey}=${pathParams[0]}`,
);
} else {
// Fallback to 'id' for backward compatibility
params.id = pathParams[0];
logger.debug(
`[DeepLink] 📍 Path parameter extracted: id=${pathParams[0]} (fallback)`,
);
}
}
// Parse query parameters
const query: Record<string, string> = {};
if (queryString) {
const queryParams = new URLSearchParams(queryString);
for (const [key, value] of queryParams.entries()) {
query[key] = value;
}
logger.debug(`[DeepLink] 🔗 Query parameters extracted:`, query);
}
logger.info(`[DeepLink] ✅ Parse completed:`, {
routePath,
pathParams: pathParams.length,
queryParams: Object.keys(query).length,
});
return { path: routePath, params, query };
} catch (error) {
logger.error(`[DeepLink] ❌ Parse failed:`, {
url,
error: error instanceof Error ? error.message : String(error),
});
throw error;
}
}
/**
* Validate and route the deep link
* @param path - The route path
* @param params - Path parameters
* @param query - Query parameters
*/
private async validateAndRoute(
path: string,
params: Record<string, string>,
query: Record<string, string>,
): Promise<void> {
logger.info(
`[DeepLink] 🎯 Starting validation and routing for path: ${path}`,
);
// First try to validate the route path
let routeName: string;
try {
logger.debug(`[DeepLink] 🔍 Validating route path: ${path}`);
// Validate route exists
const validRoute = routeSchema.parse(path) as DeepLinkRoute;
routeName = ROUTE_MAP[validRoute].name;
logger.info(`[DeepLink] ✅ Route validation passed: ${validRoute}`);
// Get route configuration
const routeConfig = ROUTE_MAP[validRoute];
logger.info(`[DeepLink] 📋 Route config retrieved:`, routeConfig);
if (!routeConfig) {
logger.error(`[DeepLink] ❌ No route config found for: ${validRoute}`);
throw new Error(`Route configuration missing for: ${validRoute}`);
}
routeName = routeConfig.name;
logger.info(`[DeepLink] 🎯 Route name resolved: ${routeName}`);
} catch (error) {
console.error(`[DeepLink] Invalid route path: ${path}`);
logger.error(`[DeepLink] ❌ Route validation failed:`, {
path,
error: error instanceof Error ? error.message : String(error),
});
// Redirect to error page with information about the invalid link
await this.router.replace({
@@ -188,22 +228,66 @@ export class DeepLinkHandler {
},
});
// This previously threw an error but we're redirecting so there's no need.
logger.info(
`[DeepLink] 🔄 Redirected to error page for invalid route: ${path}`,
);
return;
}
// Continue with parameter validation as before...
const schema = deepLinkSchemas[path as keyof typeof deepLinkSchemas];
// Continue with parameter validation
logger.info(
`[DeepLink] 🔍 Starting parameter validation for route: ${routeName}`,
);
const pathSchema =
deepLinkPathSchemas[path as keyof typeof deepLinkPathSchemas];
const querySchema =
deepLinkQuerySchemas[path as keyof typeof deepLinkQuerySchemas];
logger.debug(`[DeepLink] 📋 Schemas found:`, {
hasPathSchema: !!pathSchema,
hasQuerySchema: !!querySchema,
pathSchemaType: pathSchema ? typeof pathSchema : "none",
querySchemaType: querySchema ? typeof querySchema : "none",
});
let validatedPathParams: Record<string, string> = {};
let validatedQueryParams: Record<string, string> = {};
let validatedParams, validatedQuery;
try {
validatedParams = await schema.parseAsync(params);
validatedQuery = await schema.parseAsync(query);
if (pathSchema) {
logger.debug(`[DeepLink] 🔍 Validating path parameters:`, params);
validatedPathParams = await pathSchema.parseAsync(params);
logger.info(
`[DeepLink] ✅ Path parameters validated:`,
validatedPathParams,
);
} else {
logger.debug(`[DeepLink] ⚠️ No path schema found for: ${path}`);
validatedPathParams = params;
}
if (querySchema) {
logger.debug(`[DeepLink] 🔍 Validating query parameters:`, query);
validatedQueryParams = await querySchema.parseAsync(query);
logger.info(
`[DeepLink] ✅ Query parameters validated:`,
validatedQueryParams,
);
} else {
logger.debug(`[DeepLink] ⚠️ No query schema found for: ${path}`);
validatedQueryParams = query;
}
} catch (error) {
// For parameter validation errors, provide specific error feedback
console.error(
`[DeepLink] Invalid parameters for route name ${routeName} for path: ${path}: ${JSON.stringify(error)} ... with params: ${JSON.stringify(params)} ... and query: ${JSON.stringify(query)}`,
);
logger.error(`[DeepLink] ❌ Parameter validation failed:`, {
routeName,
path,
params,
query,
error: error instanceof Error ? error.message : String(error),
errorDetails: JSON.stringify(error),
});
await this.router.replace({
name: "deep-link-error",
params,
@@ -215,60 +299,52 @@ export class DeepLinkHandler {
},
});
// This previously threw an error but we're redirecting so there's no need.
logger.info(
`[DeepLink] 🔄 Redirected to error page for invalid parameters`,
);
return;
}
// Attempt navigation
try {
logger.info(`[DeepLink] 🚀 Attempting navigation:`, {
routeName,
pathParams: validatedPathParams,
queryParams: validatedQueryParams,
});
await this.router.replace({
name: routeName,
params: validatedParams,
query: validatedQuery,
params: validatedPathParams,
query: validatedQueryParams,
});
logger.info(`[DeepLink] ✅ Navigation successful to: ${routeName}`);
} catch (error) {
console.error(
`[DeepLink] Error routing to route name ${routeName} for path: ${path}: ${JSON.stringify(error)} ... with validated params: ${JSON.stringify(validatedParams)} ... and validated query: ${JSON.stringify(validatedQuery)}`,
);
// For parameter validation errors, provide specific error feedback
logger.error(`[DeepLink] ❌ Navigation failed:`, {
routeName,
path,
validatedPathParams,
validatedQueryParams,
error: error instanceof Error ? error.message : String(error),
errorDetails: JSON.stringify(error),
});
// Redirect to error page for navigation failures
await this.router.replace({
name: "deep-link-error",
params: validatedParams,
params: validatedPathParams,
query: {
originalPath: path,
errorCode: "ROUTING_ERROR",
errorMessage: `Error routing to ${routeName}: ${JSON.stringify(error)}`,
...validatedQuery,
errorMessage: `Error routing to ${routeName}: ${(error as Error).message}`,
...validatedQueryParams,
},
});
}
}
/**
* Processes incoming deep links and routes them appropriately.
* Handles validation, error handling, and routing to the correct view.
*
* @param url - The deep link URL to process
* @throws {DeepLinkError} If URL processing fails
*/
async handleDeepLink(url: string): Promise<void> {
try {
const { path, params, query } = this.parseDeepLink(url);
// Ensure params is always a Record<string,string> by converting undefined to empty string
const sanitizedParams = Object.fromEntries(
Object.entries(params).map(([key, value]) => [key, value ?? ""]),
logger.info(
`[DeepLink] 🔄 Redirected to error page for navigation failure`,
);
await this.validateAndRoute(path, sanitizedParams, query);
} catch (error) {
const deepLinkError = error as DeepLinkError;
console.error(
`[DeepLink] Error (${deepLinkError.code}): ${deepLinkError.details}`,
);
throw {
code: deepLinkError.code || "UNKNOWN_ERROR",
message: deepLinkError.message,
details: deepLinkError.details,
};
}
}
}

12
src/services/platforms/CapacitorPlatformService.ts
View File

@@ -11,7 +11,6 @@ import {
SQLiteConnection,
SQLiteDBConnection,
CapacitorSQLite,
capSQLiteChanges,
DBSQLiteValues,
} from "@capacitor-community/sqlite";
@@ -493,22 +492,17 @@ export class CapacitorPlatformService implements PlatformService {
* @param params - Optional parameters for prepared statements
* @returns Promise resolving to execution results
*/
const sqlExec = async (
sql: string,
params?: unknown[],
): Promise<capSQLiteChanges> => {
const sqlExec = async (sql: string, params?: unknown[]): Promise<void> => {
logger.debug(`🔧 [CapacitorMigration] Executing SQL:`, sql);
if (params && params.length > 0) {
// Use run method for parameterized queries (prepared statements)
// This is essential for proper parameter binding and SQL injection prevention
const result = await this.db!.run(sql, params);
return result;
await this.db!.run(sql, params);
} else {
// Use execute method for non-parameterized queries
// This is more efficient for simple DDL statements
const result = await this.db!.execute(sql);
return result;
await this.db!.execute(sql);
}
};

3
src/services/platforms/WebPlatformService.ts
View File

@@ -693,7 +693,8 @@ export class WebPlatformService implements PlatformService {
const setClause = keys.map((key) => `${key} = ?`).join(", ");
const sql = `UPDATE settings SET ${setClause} WHERE accountDid = ?`;
const params = [...keys.map((key) => settings[key]), did];
console.log(
// Log update operation for debugging
logger.debug(
"[WebPlatformService] updateDidSpecificSettings",
sql,
JSON.stringify(params, null, 2),

203
src/test/PlatformServiceMixinTest.vue
View File

@@ -1,11 +1,63 @@
<template>
<div>
<h2>PlatformServiceMixin Test</h2>
<button @click="testInsert">Test Insert</button>
<button @click="testUpdate">Test Update</button>
<button :class="primaryButtonClasses" @click="testUserZeroSettings">
Test User #0 Settings
</button>
<div class="space-y-2">
<button
:class="
activeTest === 'insert'
? 'bg-green-500 text-white'
: 'bg-gray-200 hover:bg-gray-300'
"
class="px-4 py-2 rounded mr-2 transition-colors"
@click="testInsert"
>
Test Contact Insert
</button>
<button
:class="
activeTest === 'update'
? 'bg-green-500 text-white'
: 'bg-gray-200 hover:bg-gray-300'
"
class="px-4 py-2 rounded mr-2 transition-colors"
@click="testUpdate"
>
Test Contact Update
</button>
<button
:class="
activeTest === 'searchBoxes'
? 'bg-green-500 text-white'
: 'bg-gray-200 hover:bg-gray-300'
"
class="px-4 py-2 rounded mr-2 transition-colors"
@click="testSearchBoxesConversion"
>
Test SearchBoxes Conversion
</button>
<button
:class="
activeTest === 'database'
? 'bg-green-500 text-white'
: 'bg-gray-200 hover:bg-gray-300'
"
class="px-4 py-2 rounded mr-2 transition-colors"
@click="testDatabaseStorage"
>
Test SearchBox Database Storage -- Beware: Changes Your Search Box
</button>
<button
:class="
activeTest === 'userZero'
? 'bg-green-500 text-white'
: primaryButtonClasses
"
class="transition-colors"
@click="testUserZeroSettings"
>
Test User #0 Settings
</button>
</div>
<div
v-if="userZeroTestResult"
@@ -16,22 +68,41 @@
JSON.stringify(userZeroTestResult, null, 2)
}}</pre>
</div>
<pre>{{ result }}</pre>
<div v-if="result" class="mt-4">
<div class="p-4 border border-blue-300 rounded-md bg-blue-50">
<h4 class="font-semibold mb-2 text-blue-800">Test Results:</h4>
<div
class="whitespace-pre-wrap text-sm font-mono bg-white p-3 rounded border"
>
{{ result }}
</div>
</div>
</div>
</div>
</template>
<script lang="ts">
import { Component, Vue } from "vue-facing-decorator";
import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
@Component({
mixins: [PlatformServiceMixin],
})
export default class PlatformServiceMixinTest extends Vue {
result: string = "";
// eslint-disable-next-line @typescript-eslint/no-explicit-any
userZeroTestResult: any = null;
activeTest: string = ""; // Track which test is currently active
// Add the missing computed property
get primaryButtonClasses() {
return "bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded";
}
testInsert() {
this.activeTest = "insert";
const contact = {
name: "Alice",
age: 30,
@@ -43,6 +114,7 @@ export default class PlatformServiceMixinTest extends Vue {
}
testUpdate() {
this.activeTest = "update";
const changes = { name: "Bob", isActive: false };
const { sql, params } = this.$generateUpdateStatement(
changes,
@@ -53,7 +125,125 @@ export default class PlatformServiceMixinTest extends Vue {
this.result = `SQL: ${sql}\nParams: ${JSON.stringify(params)}`;
}
testSearchBoxesConversion() {
this.activeTest = "searchBoxes";
// Test the _convertSettingsForStorage helper method
const testSettings = {
firstName: "John",
searchBoxes: [
{
name: "Test Area",
bbox: {
eastLong: 1.0,
maxLat: 1.0,
minLat: 0.0,
westLong: 0.0,
},
},
],
};
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const converted = (this as any)._convertSettingsForStorage(testSettings);
this.result = `# 🔄 SearchBoxes Conversion Test (Helper Method)
## 📥 Input Settings
\`\`\`json
{
"firstName": "John",
"searchBoxes": ${JSON.stringify(testSettings.searchBoxes, null, 2)}
}
\`\`\`
## 🔧 After _convertSettingsForStorage()
\`\`\`json
{
"firstName": "John",
"searchBoxes": "${converted.searchBoxes}"
}
\`\`\`
## ✅ Conversion Results
- **Original Type**: \`${typeof testSettings.searchBoxes}\`
- **Converted Type**: \`${typeof converted.searchBoxes}\`
- **Conversion**: Array → JSON String ✅
## 📝 Note
This tests the helper method only - no database interaction`;
}
async testDatabaseStorage() {
this.activeTest = "database";
try {
this.result = "🔄 Testing database storage format...";
// Create test settings with searchBoxes array
const testSettings = {
searchBoxes: [
{
name: "Test Area",
bbox: {
eastLong: 1.0,
maxLat: 1.0,
minLat: 0.0,
westLong: 0.0,
},
},
],
};
// Save to database using our fixed method
const success = await this.$saveSettings(testSettings);
if (success) {
// Now query the raw database to see how it's actually stored
const rawResult = await this.$dbQuery(
"SELECT searchBoxes FROM settings WHERE id = ?",
[MASTER_SETTINGS_KEY],
);
if (rawResult?.values?.length) {
const rawSearchBoxes = rawResult.values[0][0]; // First column of first row
this.result = `# 🔧 Database Storage Format Test (Full Database Cycle)
## 📥 Input (JavaScript Array)
\`\`\`json
${JSON.stringify(testSettings.searchBoxes, null, 2)}
\`\`\`
## 💾 Database Storage (JSON String)
\`\`\`sql
"${rawSearchBoxes}"
\`\`\`
## ✅ Verification
- **Type**: \`${typeof rawSearchBoxes}\`
- **Is JSON String**: \`${typeof rawSearchBoxes === "string" && rawSearchBoxes.startsWith("[")}\`
- **Conversion Working**: ✅ **YES** - Array converted to JSON string for database storage
## 🔄 Process Flow
1. **Input**: JavaScript array with bounding box coordinates
2. **Conversion**: \`_convertSettingsForStorage()\` converts array to JSON string
3. **Storage**: JSON string saved to database using \`$saveSettings()\`
4. **Retrieval**: JSON string parsed back to array for application use
## 📝 Note
This tests the complete save → retrieve cycle with actual database interaction`;
} else {
this.result = "❌ No data found in database";
}
} else {
this.result = "❌ Failed to save settings";
}
} catch (error) {
this.result = `❌ Error: ${error}`;
}
}
async testUserZeroSettings() {
this.activeTest = "userZero";
try {
// User #0's DID
const userZeroDid = "did:ethr:0x0000694B58C2cC69658993A90D3840C560f2F51F";
@@ -78,6 +268,7 @@ export default class PlatformServiceMixinTest extends Vue {
this.result = `User #0 settings test completed. isRegistered: ${accountSettings.isRegistered}`;
} catch (error) {
this.result = `Error testing User #0 settings: ${error}`;
// eslint-disable-next-line no-console
console.error("Error testing User #0 settings:", error);
}
}

38
src/test/index.ts
View File

@@ -1,9 +1,34 @@
import axios from "axios";
import * as didJwt from "did-jwt";
import { SERVICE_ID } from "../libs/endorserServer";
import { deriveAddress, newIdentifier } from "../libs/crypto";
import {
DEFAULT_ROOT_DERIVATION_PATH,
deriveAddress,
newIdentifier,
} from "../libs/crypto";
import { logger } from "../utils/logger";
import { AppString } from "../constants/app";
import { saveNewIdentity } from "@/libs/util";
import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
const TEST_USER_0_MNEMONIC =
"rigid shrug mobile smart veteran half all pond toilet brave review universe ship congress found yard skate elite apology jar uniform subway slender luggage";
export async function testBecomeUser0() {
const [addr, privateHex, publicHex, deriPath] =
deriveAddress(TEST_USER_0_MNEMONIC);
const identity0 = newIdentifier(addr, publicHex, privateHex, deriPath);
await saveNewIdentity(
identity0,
TEST_USER_0_MNEMONIC,
DEFAULT_ROOT_DERIVATION_PATH,
);
const platformService = await PlatformServiceFactory.getInstance();
await platformService.updateDidSpecificSettings(identity0.did, {
isRegistered: true,
});
}
/**
* Get User #0 to sign & submit a RegisterAction for the user's activeDid.
@@ -15,10 +40,8 @@ import { AppString } from "../constants/app";
* @throws Error if registration fails or database access fails
*/
export async function testServerRegisterUser() {
const testUser0Mnem =
"seminar accuse mystery assist delay law thing deal image undo guard initial shallow wrestle list fragile borrow velvet tomorrow awake explain test offer control";
const [addr, privateHex, publicHex, deriPath] = deriveAddress(testUser0Mnem);
const [addr, privateHex, publicHex, deriPath] =
deriveAddress(TEST_USER_0_MNEMONIC);
const identity0 = newIdentifier(addr, publicHex, privateHex, deriPath);
@@ -32,9 +55,9 @@ export async function testServerRegisterUser() {
const vcClaim = {
"@context": "https://schema.org",
"@type": "RegisterAction",
agent: { did: identity0.did },
agent: { identifier: identity0.did },
object: SERVICE_ID,
participant: { did: settings.activeDid },
participant: { identifier: settings.activeDid },
};
// Make a payload for the claim
@@ -71,4 +94,5 @@ export async function testServerRegisterUser() {
const resp = await axios.post(url, payload, { headers });
logger.log("User registration result:", resp);
return resp;
}

13
src/types/electron.d.ts vendored Normal file
View File

@@ -0,0 +1,13 @@
declare global {
interface Window {
electronAPI?: {
exportData: (fileName: string, content: string) => Promise<{
success: boolean;
path?: string;
error?: string;
}>;
};
}
}
export {};

83
src/types/global.d.ts vendored
View File

@@ -1,83 +0,0 @@
import type { QueryExecResult, SqlValue } from "./database";
declare module '@jlongster/sql.js' {
interface SQL {
Database: new (path: string, options?: { filename: boolean }) => Database;
FS: {
mkdir: (path: string) => void;
mount: (fs: any, options: any, path: string) => void;
open: (path: string, flags: string) => any;
close: (stream: any) => void;
};
register_for_idb: (fs: any) => void;
}
interface Database {
exec: (sql: string, params?: unknown[]) => Promise<QueryExecResult[]>;
run: (sql: string, params?: unknown[]) => Promise<{ changes: number; lastId?: number }>;
get: (sql: string, params?: unknown[]) => Promise<SqlValue[]>;
all: (sql: string, params?: unknown[]) => Promise<SqlValue[][]>;
prepare: (sql: string) => Promise<Statement>;
close: () => void;
}
interface Statement {
run: (params?: unknown[]) => Promise<{ changes: number; lastId?: number }>;
get: (params?: unknown[]) => Promise<SqlValue[]>;
all: (params?: unknown[]) => Promise<SqlValue[][]>;
finalize: () => void;
}
const initSqlJs: (options?: {
locateFile?: (file: string) => string;
}) => Promise<SQL>;
export default initSqlJs;
}
/**
* Electron API types for the main world context bridge.
*
* These types define the secure IPC APIs exposed by the preload script
* to the renderer process for native Electron functionality.
*/
interface ElectronAPI {
/**
* Export data to the user's Downloads folder.
*
* @param fileName - The name of the file to save (e.g., 'backup-2025-07-06.json')
* @param data - The content to write to the file (string)
* @returns Promise with success status, file path, or error message
*/
exportData: (fileName: string, data: string) => Promise<{
success: boolean;
path?: string;
error?: string;
}>;
}
/**
* Global window interface extension for Electron APIs.
*
* This makes the electronAPI available on the window object
* in TypeScript without type errors.
*/
declare global {
interface Window {
electronAPI: ElectronAPI;
}
}
/**
* Vue instance interface extension for global properties.
*
* This makes global properties available on Vue instances
* in TypeScript without type errors.
*/
declare module 'vue' {
interface ComponentCustomProperties {
$notify: (notification: any, timeout?: number) => void;
$route: import('vue-router').RouteLocationNormalizedLoaded;
$router: import('vue-router').Router;
}
}

67
src/types/modules.d.ts vendored
View File

@@ -1,67 +0,0 @@
import type { QueryExecResult, SqlValue } from "./database";
declare module '@jlongster/sql.js' {
interface SQL {
Database: new (path: string, options?: { filename: boolean }) => Database;
FS: {
mkdir: (path: string) => void;
mount: (fs: any, options: any, path: string) => void;
open: (path: string, flags: string) => any;
close: (stream: any) => void;
};
register_for_idb: (fs: any) => void;
}
interface Database {
exec: (sql: string, params?: unknown[]) => Promise<QueryExecResult[]>;
run: (sql: string, params?: unknown[]) => Promise<{ changes: number; lastId?: number }>;
get: (sql: string, params?: unknown[]) => Promise<SqlValue[]>;
all: (sql: string, params?: unknown[]) => Promise<SqlValue[][]>;
prepare: (sql: string) => Promise<Statement>;
close: () => void;
}
interface Statement {
run: (params?: unknown[]) => Promise<{ changes: number; lastId?: number }>;
get: (params?: unknown[]) => Promise<SqlValue[]>;
all: (params?: unknown[]) => Promise<SqlValue[][]>;
finalize: () => void;
}
const initSqlJs: (options?: {
locateFile?: (file: string) => string;
}) => Promise<SQL>;
export default initSqlJs;
}
declare module 'absurd-sql' {
import type { SQL } from '@jlongster/sql.js';
export class SQLiteFS {
constructor(fs: any, backend: any);
}
}
declare module 'absurd-sql/dist/indexeddb-backend' {
export default class IndexedDBBackend {
constructor();
}
}
declare module 'absurd-sql/dist/indexeddb-main-thread' {
import type { QueryExecResult } from './database';
export interface SQLiteOptions {
filename?: string;
autoLoad?: boolean;
debug?: boolean;
}
export interface SQLiteDatabase {
exec: (sql: string, params?: unknown[]) => Promise<QueryExecResult[]>;
close: () => Promise<void>;
}
export function initSqlJs(options?: any): Promise<any>;
export function createDatabase(options?: SQLiteOptions): Promise<SQLiteDatabase>;
export function openDatabase(options?: SQLiteOptions): Promise<SQLiteDatabase>;
}

239
src/utils/PlatformServiceMixin.ts
View File

@@ -44,9 +44,13 @@ import type {
PlatformService,
PlatformCapabilities,
} from "@/services/PlatformService";
import { MASTER_SETTINGS_KEY, type Settings } from "@/db/tables/settings";
import {
MASTER_SETTINGS_KEY,
type Settings,
type SettingsWithJsonStrings,
} from "@/db/tables/settings";
import { logger } from "@/utils/logger";
import { Contact } from "@/db/tables/contacts";
import { Contact, ContactMaybeWithJsonStrings } from "@/db/tables/contacts";
import { Account } from "@/db/tables/accounts";
import { Temp } from "@/db/tables/temp";
import { QueryExecResult, DatabaseExecResult } from "@/interfaces/database";
@@ -129,6 +133,7 @@ export const PlatformServiceMixin = {
* Used for change detection and component updates
*/
currentActiveDid(): string | null {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
return (this as any)._currentActiveDid;
},
@@ -196,7 +201,9 @@ export const PlatformServiceMixin = {
* This method should be called when the user switches identities
*/
async $updateActiveDid(newDid: string | null): Promise<void> {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const oldDid = (this as any)._currentActiveDid;
// eslint-disable-next-line @typescript-eslint/no-explicit-any
(this as any)._currentActiveDid = newDid;
if (newDid !== oldDid) {
@@ -242,6 +249,15 @@ export const PlatformServiceMixin = {
// Keep null values as null
}
// Handle JSON fields like contactMethods
if (column === "contactMethods" && typeof value === "string") {
try {
value = JSON.parse(value);
} catch {
value = [];
}
}
obj[column] = value;
});
return obj;
@@ -265,6 +281,28 @@ export const PlatformServiceMixin = {
return (value as T) || defaultValue;
},
/**
* Convert Settings object to SettingsWithJsonStrings for database storage
* Handles conversion of complex objects like searchBoxes to JSON strings
* @param settings Settings object to convert
* @returns SettingsWithJsonStrings object ready for database storage
*/
_convertSettingsForStorage(
settings: Partial<Settings>,
): Partial<SettingsWithJsonStrings> {
const converted = { ...settings } as Partial<SettingsWithJsonStrings>;
// Convert searchBoxes array to JSON string if present
if (settings.searchBoxes !== undefined) {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
(converted as any).searchBoxes = Array.isArray(settings.searchBoxes)
? JSON.stringify(settings.searchBoxes)
: String(settings.searchBoxes);
}
return converted;
},
// // =================================================
// // CACHING UTILITY METHODS
// // =================================================
@@ -434,13 +472,10 @@ export const PlatformServiceMixin = {
return settings;
} catch (error) {
logger.error(
`[${(this as unknown as VueComponentWithMixin).$options.name}] Failed to get settings:`,
{
key,
error,
},
);
logger.error(`[Settings Trace] ❌ Failed to get settings:`, {
key,
error,
});
return fallback;
}
},
@@ -508,14 +543,11 @@ export const PlatformServiceMixin = {
return mergedSettings;
} catch (error) {
logger.error(
`[${(this as unknown as VueComponentWithMixin).$options.name}] Failed to get merged settings:`,
{
defaultKey,
accountDid,
error,
},
);
logger.error(`[Settings Trace] ❌ Failed to get merged settings:`, {
defaultKey,
accountDid,
error,
});
return defaultFallback;
}
},
@@ -623,15 +655,82 @@ export const PlatformServiceMixin = {
// CACHED SPECIALIZED SHORTCUTS (massive performance boost)
// =================================================
/**
* Normalize contact data by parsing JSON strings into proper objects
* Handles the contactMethods field which can be either a JSON string or an array
* @param rawContacts Raw contact data from database
* @returns Normalized Contact[] array
*/
$normalizeContacts(rawContacts: ContactMaybeWithJsonStrings[]): Contact[] {
return rawContacts.map((contact) => {
// Create a new contact object with proper typing
const normalizedContact: Contact = {
did: contact.did,
iViewContent: contact.iViewContent,
name: contact.name,
nextPubKeyHashB64: contact.nextPubKeyHashB64,
notes: contact.notes,
profileImageUrl: contact.profileImageUrl,
publicKeyBase64: contact.publicKeyBase64,
seesMe: contact.seesMe,
registered: contact.registered,
};
// Handle contactMethods field which can be a JSON string or an array
if (contact.contactMethods !== undefined) {
if (typeof contact.contactMethods === "string") {
// Parse JSON string into array
normalizedContact.contactMethods = this._parseJsonField(
contact.contactMethods,
[],
);
} else if (Array.isArray(contact.contactMethods)) {
// Validate that each item in the array is a proper ContactMethod object
normalizedContact.contactMethods = contact.contactMethods.filter(
(method) => {
const isValid =
method &&
typeof method === "object" &&
typeof method.label === "string" &&
typeof method.type === "string" &&
typeof method.value === "string";
if (!isValid && method !== undefined) {
// eslint-disable-next-line no-console
console.warn(
"[ContactNormalization] Invalid contact method:",
method,
);
}
return isValid;
},
);
} else {
// Invalid data, use empty array
normalizedContact.contactMethods = [];
}
} else {
// No contactMethods, use empty array
normalizedContact.contactMethods = [];
}
return normalizedContact;
});
},
/**
* Load all contacts (always fresh) - $contacts()
* Always fetches fresh data from database for consistency
* @returns Promise<Contact[]> Array of contact objects
* Handles JSON string/object duality for contactMethods field
* @returns Promise<Contact[]> Array of normalized contact objects
*/
async $contacts(): Promise<Contact[]> {
return (await this.$query(
const rawContacts = (await this.$query(
"SELECT * FROM contacts ORDER BY name",
)) as Contact[];
)) as ContactMaybeWithJsonStrings[];
return this.$normalizeContacts(rawContacts);
},
/**
@@ -723,25 +822,20 @@ export const PlatformServiceMixin = {
);
mergedSettings.apiServer = DEFAULT_ENDORSER_API_SERVER;
logger.debug(
`[Electron Settings] Forced API server to: ${DEFAULT_ENDORSER_API_SERVER}`,
);
}
// Merge with any provided defaults (these take highest precedence)
const finalSettings = { ...mergedSettings, ...defaults };
console.log(
"[PlatformServiceMixin] $accountSettings",
JSON.stringify(finalSettings, null, 2),
// Filter out undefined and empty string values to prevent overriding real settings
const filteredDefaults = Object.fromEntries(
Object.entries(defaults).filter(
([_, value]) => value !== undefined && value !== "",
),
);
const finalSettings = { ...mergedSettings, ...filteredDefaults };
return finalSettings;
} catch (error) {
logger.error(
"[PlatformServiceMixin] Error in $accountSettings:",
error,
);
logger.error("[Settings Trace] ❌ Error in $accountSettings:", error);
// Fallback to defaults on error
return defaults;
@@ -755,6 +849,9 @@ export const PlatformServiceMixin = {
/**
* Save default settings - $saveSettings()
* Ultra-concise shortcut for updateDefaultSettings
*
* ✅ KEEP: This method will be the primary settings save method after consolidation
*
* @param changes Settings changes to save
* @returns Promise<boolean> Success status
*/
@@ -769,10 +866,13 @@ export const PlatformServiceMixin = {
if (Object.keys(safeChanges).length === 0) return true;
// Convert settings for database storage (handles searchBoxes conversion)
const convertedChanges = this._convertSettingsForStorage(safeChanges);
const setParts: string[] = [];
const params: unknown[] = [];
Object.entries(safeChanges).forEach(([key, value]) => {
Object.entries(convertedChanges).forEach(([key, value]) => {
if (value !== undefined) {
setParts.push(`${key} = ?`);
params.push(value);
@@ -819,10 +919,13 @@ export const PlatformServiceMixin = {
if (Object.keys(safeChanges).length === 0) return true;
// Convert settings for database storage (handles searchBoxes conversion)
const convertedChanges = this._convertSettingsForStorage(safeChanges);
const setParts: string[] = [];
const params: unknown[] = [];
Object.entries(safeChanges).forEach(([key, value]) => {
Object.entries(convertedChanges).forEach(([key, value]) => {
if (value !== undefined) {
setParts.push(`${key} = ?`);
params.push(value);
@@ -962,12 +1065,18 @@ export const PlatformServiceMixin = {
contact.profileImageUrl !== undefined
? contact.profileImageUrl
: null,
contactMethods:
contact.contactMethods !== undefined
? Array.isArray(contact.contactMethods)
? JSON.stringify(contact.contactMethods)
: contact.contactMethods
: null,
};
await this.$dbExec(
`INSERT OR REPLACE INTO contacts
(did, name, publicKeyBase64, seesMe, registered, nextPubKeyHashB64, profileImageUrl)
VALUES (?, ?, ?, ?, ?, ?, ?)`,
(did, name, publicKeyBase64, seesMe, registered, nextPubKeyHashB64, profileImageUrl, contactMethods)
VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,
[
safeContact.did,
safeContact.name,
@@ -976,6 +1085,7 @@ export const PlatformServiceMixin = {
safeContact.registered,
safeContact.nextPubKeyHashB64,
safeContact.profileImageUrl,
safeContact.contactMethods,
],
);
return true;
@@ -1003,7 +1113,13 @@ export const PlatformServiceMixin = {
Object.entries(changes).forEach(([key, value]) => {
if (value !== undefined) {
setParts.push(`${key} = ?`);
params.push(value);
// Handle contactMethods field - convert array to JSON string
if (key === "contactMethods" && Array.isArray(value)) {
params.push(JSON.stringify(value));
} else {
params.push(value);
}
}
});
@@ -1025,45 +1141,36 @@ export const PlatformServiceMixin = {
/**
* Get all contacts as typed objects - $getAllContacts()
* Eliminates verbose query + mapping patterns
* @returns Promise<Contact[]> Array of contact objects
* Handles JSON string/object duality for contactMethods field
* @returns Promise<Contact[]> Array of normalized contact objects
*/
async $getAllContacts(): Promise<Contact[]> {
const results = await this.$dbQuery(
"SELECT did, name, publicKeyBase64, seesMe, registered, nextPubKeyHashB64, profileImageUrl FROM contacts ORDER BY name",
);
const rawContacts = (await this.$query(
"SELECT * FROM contacts ORDER BY name",
)) as ContactMaybeWithJsonStrings[];
return this.$mapResults(results, (row: unknown[]) => ({
did: row[0] as string,
name: row[1] as string,
publicKeyBase64: row[2] as string,
seesMe: Boolean(row[3]),
registered: Boolean(row[4]),
nextPubKeyHashB64: row[5] as string,
profileImageUrl: row[6] as string,
}));
return this.$normalizeContacts(rawContacts);
},
/**
* Get single contact by DID - $getContact()
* Eliminates verbose single contact query patterns
* Handles JSON string/object duality for contactMethods field
* @param did Contact DID to retrieve
* @returns Promise<Contact | null> Contact object or null if not found
* @returns Promise<Contact | null> Normalized contact object or null if not found
*/
async $getContact(did: string): Promise<Contact | null> {
const results = await this.$dbQuery(
const rawContacts = (await this.$query(
"SELECT * FROM contacts WHERE did = ?",
[did],
);
)) as ContactMaybeWithJsonStrings[];
if (!results || !results.values || results.values.length === 0) {
if (rawContacts.length === 0) {
return null;
}
const contactData = this._mapColumnsToValues(
results.columns,
results.values,
);
return contactData.length > 0 ? (contactData[0] as Contact) : null;
const normalizedContacts = this.$normalizeContacts(rawContacts);
return normalizedContacts[0];
},
/**
@@ -1193,6 +1300,17 @@ export const PlatformServiceMixin = {
* @param did Optional DID for user-specific settings
* @returns Promise<boolean> Success status
*/
/**
* Update settings - $updateSettings()
* Ultra-concise shortcut for updating settings (default or user-specific)
*
* ⚠️ DEPRECATED: This method will be removed in favor of $saveSettings()
* Use $saveSettings(changes, did?) instead for better consistency
*
* @param changes Settings changes to save
* @param did Optional DID for user-specific settings
* @returns Promise<boolean> Success status
*/
async $updateSettings(
changes: Partial<Settings>,
did?: string,
@@ -1647,6 +1765,7 @@ declare module "@vue/runtime-core" {
$contactCount(): Promise<number>;
$settings(defaults?: Settings): Promise<Settings>;
$accountSettings(did?: string, defaults?: Settings): Promise<Settings>;
$normalizeContacts(rawContacts: ContactMaybeWithJsonStrings[]): Contact[];
// Settings update shortcuts (eliminate 90% boilerplate)
$saveSettings(changes: Partial<Settings>): Promise<boolean>;

80
src/utils/logger.ts
View File

@@ -2,9 +2,10 @@
* Enhanced logger with self-contained database logging
*
* Provides comprehensive logging with console and database output.
* Supports configurable log levels via VITE_LOG_LEVEL environment variable.
*
* @author Matthew Raymer
* @version 2.0.0
* @version 2.1.0
* @since 2025-01-25
*/
@@ -46,6 +47,42 @@ export function safeStringify(obj: unknown) {
const isElectron = process.env.VITE_PLATFORM === "electron";
const isProduction = process.env.NODE_ENV === "production";
// Log level configuration via environment variable
const LOG_LEVELS = {
error: 0,
warn: 1,
info: 2,
debug: 3,
} as const;
type LogLevel = keyof typeof LOG_LEVELS;
// Parse VITE_LOG_LEVEL environment variable
const getLogLevel = (): LogLevel => {
const envLogLevel = process.env.VITE_LOG_LEVEL?.toLowerCase();
if (envLogLevel && envLogLevel in LOG_LEVELS) {
return envLogLevel as LogLevel;
}
// Default log levels based on environment
if (isProduction && !isElectron) {
return "warn"; // Production web: warnings and errors only
} else if (isElectron) {
return "error"; // Electron: errors only
} else {
return "info"; // Development/Capacitor: info and above
}
};
const currentLogLevel = getLogLevel();
const currentLevelValue = LOG_LEVELS[currentLogLevel];
// Helper function to check if a log level should be displayed
const shouldLog = (level: LogLevel): boolean => {
return LOG_LEVELS[level] <= currentLevelValue;
};
// Track initialization state to prevent circular dependencies
let isInitializing = true;
@@ -105,11 +142,11 @@ async function logToDatabase(
}
}
// Enhanced logger with self-contained database methods
// Enhanced logger with self-contained database methods and log level control
export const logger = {
debug: (message: string, ...args: unknown[]) => {
// Debug logs are very verbose - only show in development mode for web
if (!isProduction && !isElectron) {
// Debug logs only show if VITE_LOG_LEVEL allows it
if (shouldLog("debug")) {
// eslint-disable-next-line no-console
console.debug(message, ...args);
}
@@ -117,11 +154,8 @@ export const logger = {
},
log: (message: string, ...args: unknown[]) => {
// Regular logs - show in development or for capacitor, but quiet for Electron
if (
(!isProduction && !isElectron) ||
process.env.VITE_PLATFORM === "capacitor"
) {
// Regular logs - show if VITE_LOG_LEVEL allows info level
if (shouldLog("info")) {
// eslint-disable-next-line no-console
console.log(message, ...args);
}
@@ -132,11 +166,7 @@ export const logger = {
},
info: (message: string, ...args: unknown[]) => {
if (
process.env.NODE_ENV !== "production" ||
process.env.VITE_PLATFORM === "capacitor" ||
process.env.VITE_PLATFORM === "electron"
) {
if (shouldLog("info")) {
// eslint-disable-next-line no-console
console.info(message, ...args);
}
@@ -147,8 +177,7 @@ export const logger = {
},
warn: (message: string, ...args: unknown[]) => {
// Always show warnings, but for Electron, suppress routine database warnings
if (!isElectron || !message.includes("[CapacitorPlatformService]")) {
if (shouldLog("warn")) {
// eslint-disable-next-line no-console
console.warn(message, ...args);
}
@@ -159,9 +188,10 @@ export const logger = {
},
error: (message: string, ...args: unknown[]) => {
// Errors will always be logged to console
// eslint-disable-next-line no-console
console.error(message, ...args);
if (shouldLog("error")) {
// eslint-disable-next-line no-console
console.error(message, ...args);
}
// Database logging
const messageString = safeStringify(message);
@@ -175,11 +205,11 @@ export const logger = {
},
toConsoleAndDb: async (message: string, isError = false): Promise<void> => {
// Console output
if (isError) {
// Console output based on log level
if (isError && shouldLog("error")) {
// eslint-disable-next-line no-console
console.error(message);
} else {
} else if (!isError && shouldLog("info")) {
// eslint-disable-next-line no-console
console.log(message);
}
@@ -194,6 +224,12 @@ export const logger = {
error: (message: string) =>
logToDatabase(`[${componentName}] ${message}`, "error"),
}),
// Log level information methods
getCurrentLevel: (): LogLevel => currentLogLevel,
getCurrentLevelValue: (): number => currentLevelValue,
isLevelEnabled: (level: LogLevel): boolean => shouldLog(level),
getAvailableLevels: (): LogLevel[] => Object.keys(LOG_LEVELS) as LogLevel[],
};
// Function to manually mark initialization as complete

194
src/views/AccountViewView.vue
View File

@@ -60,8 +60,11 @@
@share-info="onShareInfo"
/>
<!-- Notifications -->
<!-- Currently disabled because it doesn't work, even on Chrome.
If restored, make sure it works or doesn't show on mobile/electron. -->
<section
v-if="isRegistered"
v-if="false"
id="sectionNotifications"
class="bg-slate-100 rounded-md overflow-hidden px-4 py-4 mt-8 mb-8"
aria-labelledby="notificationsHeading"
@@ -171,11 +174,12 @@
:aria-busy="loadingProfile || savingProfile"
></textarea>
<div class="flex items-center mb-4" @click="toggleUserProfileLocation">
<div class="flex items-center mb-4">
<input
v-model="includeUserProfileLocation"
type="checkbox"
class="mr-2"
@change="onLocationCheckboxChange"
/>
<label for="includeUserProfileLocation">Include Location</label>
</div>
@@ -191,6 +195,7 @@
class="!z-40 rounded-md"
@click="onProfileMapClick"
@ready="onMapReady"
@mounted="onMapMounted"
>
<l-tile-layer
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
@@ -748,6 +753,7 @@ import "dexie-export-import";
// @ts-expect-error - they aren't exporting it but it's there
import { ImportProgress } from "dexie-export-import";
import { LeafletMouseEvent } from "leaflet";
import * as L from "leaflet";
import * as R from "ramda";
import { IIdentifier } from "@veramo/core";
import { ref } from "vue";
@@ -899,6 +905,7 @@ export default class AccountViewView extends Vue {
warnIfProdServer: boolean = false;
warnIfTestServer: boolean = false;
zoom: number = 2;
isMapReady: boolean = false;
// Limits and validation properties
endorserLimits: EndorserRateLimits | null = null;
@@ -910,6 +917,23 @@ export default class AccountViewView extends Vue {
created() {
this.notify = createNotifyHelpers(this.$notify);
// Fix Leaflet icon issues in modern bundlers
// This prevents the "Cannot read properties of undefined (reading 'Default')" error
if (L.Icon.Default) {
// Type-safe way to handle Leaflet icon prototype
const iconDefault = L.Icon.Default.prototype as Record<string, unknown>;
if ("_getIconUrl" in iconDefault) {
delete iconDefault._getIconUrl;
}
L.Icon.Default.mergeOptions({
iconRetinaUrl:
"https://unpkg.com/leaflet@1.7.1/dist/images/marker-icon-2x.png",
iconUrl: "https://unpkg.com/leaflet@1.7.1/dist/images/marker-icon.png",
shadowUrl:
"https://unpkg.com/leaflet@1.7.1/dist/images/marker-shadow.png",
});
}
}
/**
@@ -936,10 +960,16 @@ export default class AccountViewView extends Vue {
this.userProfileLatitude = profile.latitude;
this.userProfileLongitude = profile.longitude;
this.includeUserProfileLocation = profile.includeLocation;
// Initialize map ready state if location is included
if (profile.includeLocation) {
this.isMapReady = false; // Will be set to true when map is ready
}
} else {
// Profile not created yet; leave defaults
}
} catch (error) {
logger.error("Error loading profile:", error);
this.notify.error(
ACCOUNT_VIEW_CONSTANTS.ERRORS.PROFILE_NOT_AVAILABLE,
);
@@ -1515,9 +1545,51 @@ export default class AccountViewView extends Vue {
}
onMapReady(map: L.Map): void {
// doing this here instead of on the l-map element avoids a recentering after a drag then zoom at startup
const zoom = this.userProfileLatitude && this.userProfileLongitude ? 12 : 2;
map.setView([this.userProfileLatitude, this.userProfileLongitude], zoom);
try {
logger.debug("Map ready event fired, map object:", map);
// doing this here instead of on the l-map element avoids a recentering after a drag then zoom at startup
const zoom =
this.userProfileLatitude && this.userProfileLongitude ? 12 : 2;
const lat = this.userProfileLatitude || 0;
const lng = this.userProfileLongitude || 0;
map.setView([lat, lng], zoom);
this.isMapReady = true;
logger.debug(
"Map ready state set to true, coordinates:",
[lat, lng],
"zoom:",
zoom,
);
} catch (error) {
logger.error("Error in onMapReady:", error);
this.isMapReady = true; // Set to true even on error to prevent infinite loading
}
}
onMapMounted(): void {
logger.debug("Map component mounted");
// Check if map ref is available
const mapRef = this.$refs.profileMap;
logger.debug("Map ref:", mapRef);
// Try to set map ready after component is mounted
setTimeout(() => {
this.isMapReady = true;
logger.debug("Map ready set to true after mounted");
}, 500);
}
// Fallback method to handle map initialization failures
private handleMapInitFailure(): void {
logger.debug("Starting map initialization timeout (5 seconds)");
setTimeout(() => {
if (!this.isMapReady) {
logger.warn("Map failed to initialize, forcing ready state");
this.isMapReady = true;
} else {
logger.debug("Map initialized successfully, timeout not needed");
}
}, 5000); // 5 second timeout
}
showProfileInfo(): void {
@@ -1529,13 +1601,16 @@ export default class AccountViewView extends Vue {
async saveProfile(): Promise<void> {
this.savingProfile = true;
const profileData: ProfileData = {
description: this.userProfileDesc,
latitude: this.userProfileLatitude,
longitude: this.userProfileLongitude,
includeLocation: this.includeUserProfileLocation,
};
try {
const profileData: ProfileData = {
description: this.userProfileDesc,
latitude: this.userProfileLatitude,
longitude: this.userProfileLongitude,
includeLocation: this.includeUserProfileLocation,
};
logger.debug("Saving profile data:", profileData);
const success = await this.profileService.saveProfile(
this.activeDid,
profileData,
@@ -1546,6 +1621,7 @@ export default class AccountViewView extends Vue {
this.notify.error(ACCOUNT_VIEW_CONSTANTS.ERRORS.PROFILE_SAVE_ERROR);
}
} catch (error) {
logger.error("Error saving profile:", error);
this.notify.error(ACCOUNT_VIEW_CONSTANTS.ERRORS.PROFILE_SAVE_ERROR);
} finally {
this.savingProfile = false;
@@ -1553,15 +1629,25 @@ export default class AccountViewView extends Vue {
}
toggleUserProfileLocation(): void {
const updated = this.profileService.toggleProfileLocation({
description: this.userProfileDesc,
latitude: this.userProfileLatitude,
longitude: this.userProfileLongitude,
includeLocation: this.includeUserProfileLocation,
});
this.userProfileLatitude = updated.latitude;
this.userProfileLongitude = updated.longitude;
this.includeUserProfileLocation = updated.includeLocation;
try {
const updated = this.profileService.toggleProfileLocation({
description: this.userProfileDesc,
latitude: this.userProfileLatitude,
longitude: this.userProfileLongitude,
includeLocation: this.includeUserProfileLocation,
});
this.userProfileLatitude = updated.latitude;
this.userProfileLongitude = updated.longitude;
this.includeUserProfileLocation = updated.includeLocation;
// Reset map ready state when toggling location
if (!updated.includeLocation) {
this.isMapReady = false;
}
} catch (error) {
logger.error("Error in toggleUserProfileLocation:", error);
this.notify.error("Failed to toggle location setting");
}
}
confirmEraseLatLong(): void {
@@ -1589,6 +1675,7 @@ export default class AccountViewView extends Vue {
async deleteProfile(): Promise<void> {
try {
logger.debug("Attempting to delete profile for DID:", this.activeDid);
const success = await this.profileService.deleteProfile(this.activeDid);
if (success) {
this.notify.success(ACCOUNT_VIEW_CONSTANTS.SUCCESS.PROFILE_DELETED);
@@ -1596,11 +1683,20 @@ export default class AccountViewView extends Vue {
this.userProfileLatitude = 0;
this.userProfileLongitude = 0;
this.includeUserProfileLocation = false;
this.isMapReady = false; // Reset map state
logger.debug("Profile deleted successfully, UI state reset");
} else {
this.notify.error(ACCOUNT_VIEW_CONSTANTS.ERRORS.PROFILE_DELETE_ERROR);
}
} catch (error) {
this.notify.error(ACCOUNT_VIEW_CONSTANTS.ERRORS.PROFILE_DELETE_ERROR);
logger.error("Error in deleteProfile component method:", error);
// Show more specific error message if available
if (error instanceof Error) {
this.notify.error(error.message);
} else {
this.notify.error(ACCOUNT_VIEW_CONSTANTS.ERRORS.PROFILE_DELETE_ERROR);
}
}
}
@@ -1613,8 +1709,46 @@ export default class AccountViewView extends Vue {
}
onProfileMapClick(event: LeafletMouseEvent) {
this.userProfileLatitude = event.latlng.lat;
this.userProfileLongitude = event.latlng.lng;
try {
if (event && event.latlng) {
this.userProfileLatitude = event.latlng.lat;
this.userProfileLongitude = event.latlng.lng;
}
} catch (error) {
logger.error("Error in onProfileMapClick:", error);
}
}
onLocationCheckboxChange(): void {
try {
logger.debug(
"Location checkbox changed, new value:",
this.includeUserProfileLocation,
);
if (!this.includeUserProfileLocation) {
// Location checkbox was unchecked, clean up map state
this.isMapReady = false;
this.userProfileLatitude = 0;
this.userProfileLongitude = 0;
logger.debug("Location unchecked, map state reset");
} else {
// Location checkbox was checked, start map initialization timeout
this.isMapReady = false;
logger.debug("Location checked, starting map initialization timeout");
// Try to set map ready after a short delay to allow Vue to render
setTimeout(() => {
if (!this.isMapReady) {
logger.debug("Setting map ready after timeout");
this.isMapReady = true;
}
}, 1000); // 1 second delay
this.handleMapInitFailure();
}
} catch (error) {
logger.error("Error in onLocationCheckboxChange:", error);
}
}
// IdentitySection event handlers
@@ -1661,14 +1795,12 @@ export default class AccountViewView extends Vue {
}
onShareInfo() {
// Call the existing logic for sharing info, e.g., open the share dialog
this.openShareDialog();
}
// Placeholder for share dialog logic
openShareDialog() {
// TODO: Implement share dialog logic
this.notify.info("Share dialog not yet implemented.");
// Navigate to QR code sharing page - mobile uses full scan, web uses basic
if (Capacitor.isNativePlatform()) {
this.$router.push({ name: "contact-qr-scan-full" });
} else {
this.$router.push({ name: "contact-qr" });
}
}
onRecheckLimits() {

1
src/views/ClaimAddRawView.vue
View File

@@ -52,7 +52,6 @@ function isApiResponse(response: unknown): response is AxiosResponse {
);
}
// TODO: Testing Required - Database Operations + Logging Migration to PlatformServiceMixin
// Priority: High | Migrated: 2025-07-06 | Author: Matthew Raymer
//
// MIGRATION DETAILS: Migrated from legacy database utilities + logging to PlatformServiceMixin

102
src/views/ClaimView.vue
View File

@@ -199,7 +199,16 @@
/>
</button>
</div>
<GiftedDialog ref="customGiveDialog" />
<GiftedDialog
ref="customGiveDialog"
:giver-entity-type="'person'"
:recipient-entity-type="projectInfo ? 'project' : 'person'"
:to-project-id="
detailsForGive?.fulfillsPlanHandleId ||
detailsForOffer?.fulfillsPlanHandleId ||
''
"
/>
<div v-if="libsUtil.isGiveAction(veriClaim)">
<div class="flex columns-3">
@@ -549,6 +558,12 @@ export default class ClaimView extends Vue {
fulfillsHandleId?: string;
} | null = null;
detailsForOffer: { fulfillsPlanHandleId?: string } | null = null;
// Project information for fulfillsPlanHandleId
projectInfo: {
name: string;
imageUrl?: string;
issuer: string;
} | null = null;
fullClaim = null;
fullClaimDump = "";
fullClaimMessage = "";
@@ -674,6 +689,7 @@ export default class ClaimView extends Vue {
this.confsVisibleToIdList = [];
this.detailsForGive = null;
this.detailsForOffer = null;
this.projectInfo = null;
this.fullClaim = null;
this.fullClaimDump = "";
this.fullClaimMessage = "";
@@ -708,6 +724,8 @@ export default class ClaimView extends Vue {
}
async created() {
this.notify = createNotifyHelpers(this.$notify);
const settings = await this.$accountSettings();
this.activeDid = settings.activeDid || "";
@@ -738,8 +756,6 @@ export default class ClaimView extends Vue {
this.windowDeepLink = `${APP_SERVER}/deep-link/claim/${claimId}`;
this.canShare = !!navigator.share;
this.notify = createNotifyHelpers(this.$notify);
}
// insert a space before any capital letters except the initial letter
@@ -851,6 +867,14 @@ export default class ClaimView extends Vue {
}
}
// Load project information if there's a fulfillsPlanHandleId
const planHandleId =
this.detailsForGive?.fulfillsPlanHandleId ||
this.detailsForOffer?.fulfillsPlanHandleId;
if (planHandleId) {
await this.loadProjectInfo(planHandleId, userDid);
}
// retrieve the list of confirmers
const confirmerInfo = await libsUtil.retrieveConfirmerIdList(
this.apiServer,
@@ -878,6 +902,33 @@ export default class ClaimView extends Vue {
}
}
async loadProjectInfo(planHandleId: string, userDid: string) {
const url =
this.apiServer +
"/api/claim/byHandle/" +
encodeURIComponent(planHandleId);
const headers = await serverUtil.getHeaders(userDid);
try {
const resp = await this.axios.get(url, { headers });
if (resp.status === 200) {
this.projectInfo = {
name: resp.data.claim?.name || "(no name)",
imageUrl: resp.data.claim?.image,
issuer: resp.data.issuer,
};
} else {
await this.$logError(
"Error getting project info: " + JSON.stringify(resp),
);
}
} catch (error: unknown) {
await this.$logError(
"Error retrieving project info: " + JSON.stringify(error),
);
}
}
async showFullClaim(claimId: string) {
const url =
this.apiServer + "/api/claim/full/" + encodeURIComponent(claimId);
@@ -997,11 +1048,52 @@ export default class ClaimView extends Vue {
this.veriClaim as GenericCredWrapper<OfferClaim>,
),
};
// Determine recipient based on whether it's a project or person
let recipient: libsUtil.GiverReceiverInputInfo | undefined;
if (this.projectInfo) {
// Recipient is a project
recipient = {
name: this.projectInfo.name,
handleId: this.detailsForOffer?.fulfillsPlanHandleId,
image: this.projectInfo.imageUrl,
};
} else {
// Recipient is a person - we need to determine who that person is
// For offers, the recipient is typically the person who made the offer
const offerClaim = this.veriClaim.claim as OfferClaim;
const recipientDid =
offerClaim.recipient?.identifier || this.veriClaim.issuer;
if (recipientDid) {
const recipientContact = serverUtil.contactForDid(
recipientDid,
this.allContacts,
);
recipient = {
did: recipientDid,
name: recipientContact?.name || recipientDid,
};
}
}
// Extract offer information from the claim
const offerClaim = this.veriClaim.claim as OfferClaim;
const description =
offerClaim.itemOffered?.description || offerClaim.description;
const amount =
offerClaim.includesObject?.amountOfThisGood?.toString() || "0";
const unitCode = offerClaim.includesObject?.unitCode || "HUR";
(this.$refs.customGiveDialog as GiftedDialog).open(
giver,
undefined,
recipient,
this.veriClaim.handleId,
"Offer fulfilled by " + (giver?.name || "someone not named"),
undefined, // prompt
description,
amount,
unitCode,
);
}

172
src/views/ContactGiftingView.vue
View File

@@ -66,10 +66,11 @@
</ul>
<GiftedDialog
ref="customDialog"
ref="giftedDialog"
:giver-entity-type="giverEntityType"
:recipient-entity-type="recipientEntityType"
:from-project-id="fromProjectId"
:to-project-id="toProjectId"
:show-projects="showProjects"
:is-from-project-view="isFromProjectView"
/>
</section>
@@ -102,9 +103,11 @@ export default class ContactGiftingView extends Vue {
activeDid = "";
allContacts: Array<Contact> = [];
apiServer = "";
description = "";
projectId = "";
prompt = "";
description = "";
amountInput = "0";
unitCode = "HUR";
recipientProjectName = "";
recipientProjectImage = "";
recipientProjectHandleId = "";
@@ -123,6 +126,7 @@ export default class ContactGiftingView extends Vue {
toProjectId = "";
showProjects = false;
isFromProjectView = false;
offerId = "";
async created() {
this.notify = createNotifyHelpers(this.$notify);
@@ -143,6 +147,9 @@ export default class ContactGiftingView extends Vue {
this.recipientProjectHandleId =
(this.$route.query["recipientProjectHandleId"] as string) || "";
this.prompt = (this.$route.query["prompt"] as string) ?? this.prompt;
this.description = (this.$route.query["description"] as string) || "";
this.amountInput = (this.$route.query["amountInput"] as string) || "0";
this.unitCode = (this.$route.query["unitCode"] as string) || "HUR";
// Read new context parameters
this.stepType = (this.$route.query["stepType"] as string) || "giver";
@@ -168,6 +175,7 @@ export default class ContactGiftingView extends Vue {
(this.$route.query["showProjects"] as string) === "true";
this.isFromProjectView =
(this.$route.query["isFromProjectView"] as string) === "true";
this.offerId = (this.$route.query["offerId"] as string) || "";
// eslint-disable-next-line @typescript-eslint/no-explicit-any
} catch (err: any) {
@@ -182,12 +190,12 @@ export default class ContactGiftingView extends Vue {
openDialog(contact?: GiverReceiverInputInfo | "Unnamed") {
if (contact === "Unnamed") {
// Special case: Pass undefined to trigger Step 1, but with "Unnamed" pre-selected
// Special case: Handle "Unnamed" contacts for both givers and recipients
let recipient: GiverReceiverInputInfo;
let giver: GiverReceiverInputInfo | undefined;
if (this.stepType === "giver") {
// We're selecting a giver, so recipient is either a project or the current user
// We're selecting a giver, so preserve the existing recipient from context
if (this.recipientEntityType === "project") {
recipient = {
did: this.recipientProjectHandleId,
@@ -196,64 +204,26 @@ export default class ContactGiftingView extends Vue {
handleId: this.recipientProjectHandleId,
};
} else {
recipient = { did: this.activeDid, name: "You" };
// Preserve the existing recipient from context
if (this.recipientDid === this.activeDid) {
// Recipient was "You"
recipient = { did: this.activeDid, name: "You" };
} else if (this.recipientDid) {
// Recipient was a regular contact
recipient = {
did: this.recipientDid,
name: this.recipientProjectName || "Someone",
};
} else {
// Fallback to "You" if no recipient was previously selected
recipient = { did: this.activeDid, name: "You" };
}
}
giver = undefined; // Will be set to "Unnamed" in GiftedDialog
} else {
// We're selecting a recipient, so recipient is "Unnamed" and giver is preserved from context
recipient = { did: "", name: "Unnamed" };
// Preserve the existing giver from the context
if (this.giverEntityType === "project") {
giver = {
// no did, because it's a project
name: this.giverProjectName,
image: this.giverProjectImage,
handleId: this.giverProjectHandleId,
};
} else if (this.giverDid) {
giver = {
did: this.giverDid,
name: this.giverProjectName || "Someone",
};
} else {
giver = { did: this.activeDid, name: "You" };
}
}
(this.$refs.customDialog as GiftedDialog).open(
giver,
recipient,
undefined,
this.stepType === "giver" ? "Given by Unnamed" : "Given to Unnamed",
this.prompt,
);
// Immediately select "Unnamed" and move to Step 2
(this.$refs.customDialog as GiftedDialog).selectGiver();
} else {
// Regular case: contact is a GiverReceiverInputInfo
let giver: GiverReceiverInputInfo;
let recipient: GiverReceiverInputInfo;
if (this.stepType === "giver") {
// We're selecting a giver, so the contact becomes the giver
giver = contact as GiverReceiverInputInfo; // Safe because we know contact is not "Unnamed" or undefined
// Recipient is either a project or the current user
if (this.recipientEntityType === "project") {
recipient = {
did: this.recipientProjectHandleId,
name: this.recipientProjectName,
image: this.recipientProjectImage,
handleId: this.recipientProjectHandleId,
};
} else {
recipient = { did: this.activeDid, name: "You" };
}
} else {
// We're selecting a recipient, so the contact becomes the recipient
recipient = contact as GiverReceiverInputInfo; // Safe because we know contact is not "Unnamed" or undefined
// Preserve the existing giver from the context
if (this.giverEntityType === "project") {
giver = {
@@ -272,15 +242,93 @@ export default class ContactGiftingView extends Vue {
}
}
(this.$refs.customDialog as GiftedDialog).open(
(this.$refs.giftedDialog as GiftedDialog).open(
giver,
recipient,
undefined,
this.stepType === "giver"
? "Given by " + (contact?.name || "someone not named")
: "Given to " + (contact?.name || "someone not named"),
this.offerId,
this.prompt,
this.description,
this.amountInput,
this.unitCode,
);
// Move to Step 2 - entities are already set by the open() call
(this.$refs.giftedDialog as GiftedDialog).moveToStep2();
} else {
// Regular case: contact is a GiverReceiverInputInfo
let giver: GiverReceiverInputInfo;
let recipient: GiverReceiverInputInfo;
if (this.stepType === "giver") {
// We're selecting a giver, so the contact becomes the giver
giver = contact as GiverReceiverInputInfo; // Safe because we know contact is not "Unnamed" or undefined
// Preserve the existing recipient from the context
if (this.recipientEntityType === "project") {
recipient = {
did: this.recipientProjectHandleId,
name: this.recipientProjectName,
image: this.recipientProjectImage,
handleId: this.recipientProjectHandleId,
};
} else {
// Check if the preserved recipient was "You" or a regular contact
if (this.recipientDid === this.activeDid) {
// Recipient was "You"
recipient = { did: this.activeDid, name: "You" };
} else if (this.recipientDid) {
// Recipient was a regular contact
recipient = {
did: this.recipientDid,
name: this.recipientProjectName || "Someone",
};
} else {
// Fallback to "Unnamed"
recipient = { did: "", name: "Unnamed" };
}
}
} else {
// We're selecting a recipient, so the contact becomes the recipient
recipient = contact as GiverReceiverInputInfo; // Safe because we know contact is not "Unnamed" or undefined
// Preserve the existing giver from the context
if (this.giverEntityType === "project") {
giver = {
did: this.giverProjectHandleId,
name: this.giverProjectName,
image: this.giverProjectImage,
handleId: this.giverProjectHandleId,
};
} else {
// Check if the preserved giver was "You" or a regular contact
if (this.giverDid === this.activeDid) {
// Giver was "You"
giver = { did: this.activeDid, name: "You" };
} else if (this.giverDid) {
// Giver was a regular contact
giver = {
did: this.giverDid,
name: this.giverProjectName || "Someone",
};
} else {
// Fallback to "Unnamed"
giver = { did: "", name: "Unnamed" };
}
}
}
(this.$refs.giftedDialog as GiftedDialog).open(
giver,
recipient,
this.offerId,
this.prompt,
this.description,
this.amountInput,
this.unitCode,
);
// Move to Step 2 - entities are already set by the open() call
(this.$refs.giftedDialog as GiftedDialog).moveToStep2();
}
}
}

16
src/views/ContactImportView.vue
View File

@@ -253,22 +253,6 @@ import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
*
* @component
*/
// TODO: Testing Required - Database Operations + Logging Migration to PlatformServiceMixin
// Priority: Medium | Migrated: 2025-07-06 | Author: Matthew Raymer
//
//
// TESTING NEEDED: Contact import functionality
// 1. Test contact import via URL: /contact-import?contacts=[{"did":"did:example:123","name":"Alice"}]
// 2. Test JWT import via URL path: /contact-import/[JWT_TOKEN]
// 3. Test manual JWT input via textarea
// 4. Test duplicate contact detection and field comparison
// 5. Test error scenarios: invalid JWT, malformed data, network issues
// 6. Verify error logging appears correctly
//
// Test URLs:
// /contact-import (manual input)
// /contact-import?contacts=[{"did":"did:test:123","name":"Test User"}]
@Component({
components: { EntityIcon, OfferDialog, QuickNav },
mixins: [PlatformServiceMixin],

9
src/views/ContactQRScanFullView.vue
View File

@@ -143,7 +143,7 @@ import {
QR_TIMEOUT_STANDARD,
QR_TIMEOUT_LONG,
} from "@/constants/notifications";
import { createNotifyHelpers } from "../utils/notify";
import { createNotifyHelpers, NotifyFunction } from "../utils/notify";
interface QRScanResult {
rawValue?: string;
@@ -191,7 +191,7 @@ interface IUserNameDialog {
* @since 2024
*/
export default class ContactQRScanFull extends Vue {
$notify!: (notification: any, timeout?: number) => void;
$notify!: NotifyFunction;
$router!: Router;
// Notification helper system
@@ -553,11 +553,6 @@ export default class ContactQRScanFull extends Vue {
return;
}
// Add new contact
// @ts-expect-error because we're just using the value to store to the DB
contact.contactMethods = JSON.stringify(
(this as any)._parseJsonField(contact.contactMethods, []),
);
await this.$insertContact(contact);
if (this.activeDid) {

65
src/views/ContactQRScanShowView.vue
View File

@@ -151,9 +151,9 @@ import { getContactJwtFromJwtUrl } from "../libs/crypto";
import {
CONTACT_CSV_HEADER,
CONTACT_IMPORT_CONFIRM_URL_PATH_TIME_SAFARI,
generateEndorserJwtUrlForAccount,
register,
setVisibilityUtil,
generateEndorserJwtUrlForAccount,
} from "../libs/endorserServer";
import { decodeEndorserJwt, ETHR_DID_PREFIX } from "../libs/crypto/vc";
import * as libsUtil from "../libs/util";
@@ -162,7 +162,6 @@ import { logger } from "../utils/logger";
import { QRScannerFactory } from "@/services/QRScanner/QRScannerFactory";
import { CameraState } from "@/services/QRScanner/types";
import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
import { Account } from "@/db/tables/accounts";
import { createNotifyHelpers } from "@/utils/notify";
import {
NOTIFY_QR_INITIALIZATION_ERROR,
@@ -189,6 +188,7 @@ import {
QR_TIMEOUT_STANDARD,
QR_TIMEOUT_LONG,
} from "@/constants/notifications";
import { Account } from "@/db/tables/accounts";
interface QRScanResult {
rawValue?: string;
@@ -213,15 +213,11 @@ export default class ContactQRScanShow extends Vue {
$router!: Router;
// Notification helper system
private notify = createNotifyHelpers(this.$notify);
notify!: ReturnType<typeof createNotifyHelpers>;
activeDid = "";
apiServer = "";
// Axios instance for API calls
get axios() {
return (this as any).$platformService.axios;
}
givenName = "";
hideRegisterPromptOnNewContact = false;
isRegistered = false;
@@ -288,6 +284,8 @@ export default class ContactQRScanShow extends Vue {
}
async created() {
this.notify = createNotifyHelpers(this.$notify);
try {
const settings = await this.$accountSettings();
this.activeDid = settings.activeDid || "";
@@ -547,6 +545,7 @@ export default class ContactQRScanShow extends Vue {
name: contact.name,
});
this.notify.toast(
"Submitted",
NOTIFY_QR_REGISTRATION_SUBMITTED.message,
QR_TIMEOUT_SHORT,
);
@@ -611,21 +610,33 @@ export default class ContactQRScanShow extends Vue {
}
async onCopyUrlToClipboard() {
const account = (await libsUtil.retrieveFullyDecryptedAccount(
this.activeDid,
)) as Account;
const jwtUrl = await generateEndorserJwtUrlForAccount(
account,
this.isRegistered,
this.givenName,
this.profileImageUrl,
true,
);
useClipboard()
.copy(jwtUrl)
.then(() => {
this.notify.toast(NOTIFY_QR_URL_COPIED.message, QR_TIMEOUT_MEDIUM);
});
try {
// Generate URL for sharing
const account = (await libsUtil.retrieveFullyDecryptedAccount(
this.activeDid,
)) as Account;
const jwtUrl = await generateEndorserJwtUrlForAccount(
account,
this.isRegistered,
this.givenName,
this.profileImageUrl,
true,
);
// Copy the URL to clipboard
useClipboard()
.copy(jwtUrl)
.then(() => {
this.notify.toast(
"Copied",
NOTIFY_QR_URL_COPIED.message,
QR_TIMEOUT_MEDIUM,
);
});
} catch (error) {
logger.error("Failed to generate contact URL:", error);
this.notify.error("Failed to generate contact URL. Please try again.");
}
}
toastQRCodeHelp() {
@@ -703,8 +714,16 @@ export default class ContactQRScanShow extends Vue {
// Add new contact
// @ts-expect-error because we're just using the value to store to the DB
// eslint-disable-next-line @typescript-eslint/no-explicit-any
contact.contactMethods = JSON.stringify(
(this as any)._parseJsonField(contact.contactMethods, []),
(
this as {
_parseJsonField: (
value: unknown,
defaultValue: unknown[],
) => unknown[];
}
)._parseJsonField(contact.contactMethods, []),
);
await this.$insertContact(contact);

129
src/views/ContactsView.vue
View File

@@ -107,7 +107,11 @@
@copy-selected="copySelectedContacts"
/>
<GiftedDialog ref="customGivenDialog" />
<GiftedDialog
ref="customGivenDialog"
:giver-entity-type="'person'"
:recipient-entity-type="'person'"
/>
<OfferDialog ref="customOfferDialog" />
<ContactNameDialog ref="contactNameDialog" />
@@ -127,7 +131,7 @@ import * as R from "ramda";
import { Component, Vue } from "vue-facing-decorator";
import { RouteLocationNormalizedLoaded, Router } from "vue-router";
import { useClipboard } from "@vueuse/core";
import { Capacitor } from "@capacitor/core";
// Capacitor import removed - using PlatformService instead
import QuickNav from "../components/QuickNav.vue";
import EntityIcon from "../components/EntityIcon.vue";
@@ -161,13 +165,18 @@ import { GiveSummaryRecord } from "@/interfaces/records";
import { UserInfo } from "@/interfaces/common";
import { VerifiableCredential } from "@/interfaces/claims-result";
import * as libsUtil from "../libs/util";
import { generateSaveAndActivateIdentity } from "../libs/util";
import {
generateSaveAndActivateIdentity,
contactsToExportJson,
} from "../libs/util";
import { logger } from "../utils/logger";
// No longer needed - using PlatformServiceMixin methods
// import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
import { isDatabaseError } from "@/interfaces/common";
import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
import { APP_SERVER } from "@/constants/app";
import { QRNavigationService } from "@/services/QRNavigationService";
import {
NOTIFY_CONTACT_NO_INFO,
NOTIFY_CONTACTS_ADD_ERROR,
@@ -193,6 +202,7 @@ import {
NOTIFY_REGISTRATION_ERROR_FALLBACK,
NOTIFY_REGISTRATION_ERROR_GENERIC,
NOTIFY_VISIBILITY_ERROR_FALLBACK,
NOTIFY_EXPORT_DATA_PROMPT,
getRegisterPersonSuccessMessage,
getVisibilitySuccessMessage,
getGivesRetrievalErrorMessage,
@@ -372,7 +382,11 @@ export default class ContactsView extends Vue {
"",
async (name) => {
await this.addContact({
did: (registration.vc.credentialSubject.agent as any).identifier,
did: (
registration.vc.credentialSubject.agent as {
identifier: string;
}
).identifier,
name: name,
registered: true,
});
@@ -383,7 +397,11 @@ export default class ContactsView extends Vue {
async () => {
// on cancel, will still add the contact
await this.addContact({
did: (registration.vc.credentialSubject.agent as any).identifier,
did: (
registration.vc.credentialSubject.agent as {
identifier: string;
}
).identifier,
name: "(person who invited you)",
registered: true,
});
@@ -392,8 +410,7 @@ export default class ContactsView extends Vue {
this.showOnboardingInfo();
},
);
// eslint-disable-next-line @typescript-eslint/no-explicit-any
} catch (error: any) {
} catch (error: unknown) {
const fullError = "Error redeeming invite: " + errorStringForLog(error);
this.$logAndConsole(fullError, true);
let message = "Got an error sending the invite.";
@@ -780,6 +797,9 @@ export default class ContactsView extends Vue {
// Show success notification
this.notify.success(addedMessage);
// Show export data prompt after successful contact addition
await this.showExportDataPrompt();
} catch (err) {
this.handleContactAddError(err);
}
@@ -877,20 +897,21 @@ export default class ContactsView extends Vue {
/**
* Handle errors during contact addition
*/
private handleContactAddError(err: any): void {
private handleContactAddError(err: unknown): void {
const fullError =
"Error when adding contact to storage: " + errorStringForLog(err);
this.$logAndConsole(fullError, true);
let message = NOTIFY_CONTACT_IMPORT_ERROR.message;
if (
(err as any).message?.indexOf("Key already exists in the object store.") >
-1
) {
message = NOTIFY_CONTACT_IMPORT_CONFLICT.message;
}
if ((err as any).name === "ConstraintError") {
message += " " + NOTIFY_CONTACT_IMPORT_CONSTRAINT.message;
// Use type-safe error checking with our new type guards
if (isDatabaseError(err)) {
if (err.message.includes("Key already exists in the object store")) {
message = NOTIFY_CONTACT_IMPORT_CONFLICT.message;
}
if (err.name === "ConstraintError") {
message += " " + NOTIFY_CONTACT_IMPORT_CONSTRAINT.message;
}
}
this.notify.error(message, TIMEOUTS.LONG);
@@ -1049,7 +1070,6 @@ export default class ContactsView extends Vue {
}
let callback: (amount: number) => void;
let customTitle = "";
// choose whether to open dialog to user or from user
if (giverDid == this.activeDid) {
callback = (amount: number) => {
@@ -1057,7 +1077,6 @@ export default class ContactsView extends Vue {
newList[recipientDid] = (newList[recipientDid] || 0) + amount;
this.givenByMeUnconfirmed = newList;
};
customTitle = "Given to " + (receiver?.name || "Someone Unnamed");
} else {
// must be (recipientDid == this.activeDid)
callback = (amount: number) => {
@@ -1065,13 +1084,14 @@ export default class ContactsView extends Vue {
newList[giverDid] = (newList[giverDid] || 0) + amount;
this.givenToMeUnconfirmed = newList;
};
customTitle = "Received from " + (giver?.name || "Someone Unnamed");
}
(this.$refs.customGivenDialog as GiftedDialog).open(
giver,
receiver,
undefined as unknown as string,
customTitle,
undefined as unknown as string,
undefined as unknown as string,
undefined as unknown as string,
undefined as unknown as string,
callback,
);
@@ -1243,19 +1263,76 @@ export default class ContactsView extends Vue {
/**
* Handle QR code button click - route to appropriate scanner
* Uses native scanner on mobile platforms, web scanner otherwise
* Uses QRNavigationService to determine scanner type and route
*/
public handleQRCodeClick() {
this.$logAndConsole(
"[ContactsView] handleQRCodeClick method called",
false,
);
if (Capacitor.isNativePlatform()) {
this.$router.push({ name: "contact-qr-scan-full" });
} else {
this.$router.push({ name: "contact-qr" });
const qrNavigationService = QRNavigationService.getInstance();
const route = qrNavigationService.getQRScannerRoute();
this.$router.push(route);
}
/**
* Show export data prompt after adding a contact
* Prompts user to export their contact data as a backup
*/
private async showExportDataPrompt(): Promise<void> {
setTimeout(() => {
this.$notify(
{
group: "modal",
type: "confirm",
title: NOTIFY_EXPORT_DATA_PROMPT.title,
text: NOTIFY_EXPORT_DATA_PROMPT.message,
onYes: async () => {
await this.exportContactData();
},
yesText: "Export Data",
onNo: async () => {
// User chose not to export - no action needed
},
noText: "Not Now",
},
-1,
);
}, 1000); // Small delay to ensure success notification is shown first
}
/**
* Export contact data to JSON file
* Uses platform service to handle platform-specific export logic
*/
private async exportContactData(): Promise<void> {
// Note that similar code is in DataExportSection.vue exportDatabase()
try {
// Fetch all contacts from database
const allContacts = await this.$contacts();
// Convert contacts to export format
const exportData = contactsToExportJson(allContacts);
const jsonStr = JSON.stringify(exportData, null, 2);
// Generate filename with current date
const today = new Date();
const dateString = today.toISOString().split("T")[0]; // YYYY-MM-DD format
const fileName = `timesafari-backup-contacts-${dateString}.json`;
// Use platform service to handle export
await this.platformService.writeAndShareFile(fileName, jsonStr);
this.notify.success(
"Contact export completed successfully. Check your downloads or share dialog.",
);
} catch (error) {
logger.error("Export Error:", error);
this.notify.error(
`There was an error exporting the data: ${error instanceof Error ? error.message : "Unknown error"}`,
);
}
}
}

44
src/views/DIDView.vue
View File

@@ -7,13 +7,14 @@
<!-- Breadcrumb -->
<div id="ViewBreadcrumb" class="mb-8">
<h1 id="ViewHeading" class="text-lg text-center font-light relative px-7">
<!-- Back -->
<button
<!-- Go to 'contacts' instead of just 'back' because they could get here from an edit page
(and going back there is annoying). -->
<router-link
:to="{ name: 'contacts' }"
class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
@click="goBack"
>
<font-awesome icon="chevron-left" class="fa-fw"></font-awesome>
</button>
</router-link>
Identifier Details
</h1>
</div>
@@ -273,6 +274,7 @@ import {
displayAmount,
getHeaders,
register,
setVisibilityUtil,
} from "../libs/endorserServer";
import * as libsUtil from "../libs/util";
import EntityIcon from "../components/EntityIcon.vue";
@@ -324,6 +326,7 @@ export default class DIDView extends Vue {
apiServer = "";
claims: Array<GenericCredWrapper<GenericVerifiableCredential>> = [];
contactFromDid?: Contact;
contactYaml = "";
hitEnd = false;
isLoading = false;
@@ -487,6 +490,8 @@ export default class DIDView extends Vue {
message +=
" Note that they can see your activity, so if you want to hide your activity from them then you should do that first.";
}
message +=
" Note that this will also remove anyone with the same DID underneath.";
this.notify.confirm(message, async () => {
await this.deleteContact(contact);
});
@@ -722,18 +727,31 @@ export default class DIDView extends Vue {
visibility: boolean,
showSuccessAlert: boolean,
) {
// Update contact visibility using mixin method
await this.$updateContact(contact.did, { seesMe: visibility });
const result = await setVisibilityUtil(
this.activeDid,
this.apiServer,
this.axios,
contact,
visibility,
);
if (showSuccessAlert) {
if (result.success) {
if (showSuccessAlert) {
const message =
(contact.name || "That user") +
" can " +
(visibility ? "" : "not ") +
"see your activity.";
this.notify.success(message, TIMEOUTS.SHORT);
}
return true;
} else {
logger.error("Got strange result from setting visibility:", result);
const message =
(contact.name || "That user") +
" can " +
(visibility ? "" : "not ") +
"see your activity.";
this.notify.success(message, TIMEOUTS.SHORT);
(result.error as string) || "Could not set visibility on the server.";
this.notify.error(message, TIMEOUTS.LONG);
return false;
}
return true;
}
/**

206
src/views/DatabaseMigration.vue
View File

@@ -91,17 +91,12 @@
class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed"
@click="downloadAccount"
>
<IconRenderer
<font-awesome
v-if="isLoading"
icon-name="spinner"
svg-class="animate-spin -ml-1 mr-3 h-5 w-5 text-white"
fill="currentColor"
/>
<IconRenderer
v-else
icon-name="chart"
svg-class="-ml-1 mr-3 h-5 w-5"
icon="spinner"
class="animate-spin -ml-1 mr-3 h-5 w-5 text-white"
/>
<font-awesome v-else icon="chart-line" class="-ml-1 mr-3 h-5 w-5" />
Show Account Seed
</button>
@@ -110,17 +105,12 @@
class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed"
@click="downloadSettingsContacts"
>
<IconRenderer
<font-awesome
v-if="isLoading"
icon-name="spinner"
svg-class="animate-spin -ml-1 mr-3 h-5 w-5 text-white"
fill="currentColor"
/>
<IconRenderer
v-else
icon-name="chart"
svg-class="-ml-1 mr-3 h-5 w-5"
icon="spinner"
class="animate-spin -ml-1 mr-3 h-5 w-5 text-white"
/>
<font-awesome v-else icon="chart-line" class="-ml-1 mr-3 h-5 w-5" />
Download Settings &amp; Contacts
</button>
@@ -143,17 +133,12 @@
class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed"
@click="compareDatabases"
>
<IconRenderer
<font-awesome
v-if="isLoading"
icon-name="spinner"
svg-class="animate-spin -ml-1 mr-3 h-5 w-5 text-white"
fill="currentColor"
/>
<IconRenderer
v-else
icon-name="chart"
svg-class="-ml-1 mr-3 h-5 w-5"
icon="spinner"
class="animate-spin -ml-1 mr-3 h-5 w-5 text-white"
/>
<font-awesome v-else icon="chart-line" class="-ml-1 mr-3 h-5 w-5" />
Compare Databases
</button>
@@ -162,17 +147,12 @@
class="inline-flex items-center px-6 py-3 border border-transparent text-base font-medium rounded-md shadow-sm text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 disabled:opacity-50 disabled:cursor-not-allowed"
@click="migrateAll"
>
<IconRenderer
<font-awesome
v-if="isLoading"
icon-name="spinner"
svg-class="animate-spin -ml-1 mr-3 h-5 w-5 text-white"
fill="currentColor"
/>
<IconRenderer
v-else
icon-name="check"
svg-class="-ml-1 mr-3 h-5 w-5"
icon="spinner"
class="animate-spin -ml-1 mr-3 h-5 w-5 text-white"
/>
<font-awesome v-else icon="check" class="-ml-1 mr-3 h-5 w-5" />
Migrate All
</button>
@@ -185,10 +165,9 @@
>
<div class="flex">
<div class="flex-shrink-0">
<IconRenderer
icon-name="warning"
svg-class="h-5 w-5 text-red-400"
fill="currentColor"
<font-awesome
icon="triangle-exclamation"
class="h-5 w-5 text-red-400"
/>
</div>
<div class="ml-3">
@@ -207,10 +186,9 @@
>
<div class="flex">
<div class="flex-shrink-0">
<IconRenderer
icon-name="warning"
svg-class="h-5 w-5 text-red-400"
fill="currentColor"
<font-awesome
icon="triangle-exclamation"
class="h-5 w-5 text-red-400"
/>
</div>
<div class="ml-3">
@@ -229,10 +207,7 @@
>
<div class="flex">
<div class="flex-shrink-0">
<IconRenderer
icon-name="check"
svg-class="h-5 w-5 text-green-400"
/>
<font-awesome icon="check" class="h-5 w-5 text-green-400" />
</div>
<div class="ml-3">
<h3 class="text-sm font-medium text-green-800">Success</h3>
@@ -249,7 +224,7 @@
class="inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed"
@click="exportComparison"
>
<IconRenderer icon-name="download" svg-class="-ml-1 mr-3 h-5 w-5" />
<font-awesome icon="download" class="-ml-1 mr-3 h-5 w-5" />
Export Comparison
</button>
@@ -258,17 +233,12 @@
class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed"
@click="displayDatabases"
>
<IconRenderer
<font-awesome
v-if="isLoading"
icon-name="spinner"
svg-class="animate-spin -ml-1 mr-3 h-5 w-5 text-white"
fill="currentColor"
/>
<IconRenderer
v-else
icon-name="chart"
svg-class="-ml-1 mr-3 h-5 w-5"
icon="spinner"
class="animate-spin -ml-1 mr-3 h-5 w-5 text-white"
/>
<font-awesome v-else icon="chart-line" class="-ml-1 mr-3 h-5 w-5" />
Show Previous Data
</button>
@@ -277,7 +247,7 @@
class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-orange-600 hover:bg-orange-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-orange-500 disabled:opacity-50 disabled:cursor-not-allowed"
@click="migrateAccounts"
>
<IconRenderer icon-name="lock" svg-class="-ml-1 mr-3 h-5 w-5" />
<font-awesome icon="lock" class="-ml-1 mr-3 h-5 w-5" />
Migrate Accounts
</button>
@@ -286,7 +256,7 @@
class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-purple-600 hover:bg-purple-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-purple-500 disabled:opacity-50 disabled:cursor-not-allowed"
@click="migrateSettings"
>
<IconRenderer icon-name="settings" svg-class="-ml-1 mr-3 h-5 w-5" />
<font-awesome icon="gear" class="-ml-1 mr-3 h-5 w-5" />
Migrate Settings
</button>
@@ -295,7 +265,7 @@
class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 disabled:opacity-50 disabled:cursor-not-allowed"
@click="migrateContacts"
>
<IconRenderer icon-name="plus" svg-class="-ml-1 mr-3 h-5 w-5" />
<font-awesome icon="plus" class="-ml-1 mr-3 h-5 w-5" />
Migrate Contacts
</button>
</div>
@@ -316,11 +286,7 @@
>
<div class="flex">
<div class="flex-shrink-0">
<IconRenderer
icon-name="info"
svg-class="h-5 w-5 text-blue-400"
fill="currentColor"
/>
<font-awesome icon="info" class="h-5 w-5 text-blue-400" />
</div>
<div class="ml-3">
<h3 class="text-sm font-medium text-blue-800">
@@ -357,10 +323,9 @@
<div
class="inline-flex items-center px-4 py-2 font-semibold leading-6 text-sm shadow rounded-md text-white bg-blue-500 hover:bg-blue-400 transition ease-in-out duration-150 cursor-not-allowed"
>
<IconRenderer
icon-name="spinner"
svg-class="animate-spin -ml-1 mr-3 h-5 w-5 text-white"
fill="currentColor"
<font-awesome
icon="spinner"
class="animate-spin -ml-1 mr-3 h-5 w-5 text-white"
/>
{{ loadingMessage }}
</div>
@@ -375,10 +340,7 @@
<div class="p-5">
<div class="flex items-center">
<div class="flex-shrink-0">
<IconRenderer
icon-name="lock"
svg-class="h-6 w-6 text-orange-600"
/>
<font-awesome icon="lock" class="h-6 w-6 text-orange-600" />
</div>
<div class="ml-5 w-0 flex-1">
<dl>
@@ -398,10 +360,7 @@
<div class="p-5">
<div class="flex items-center">
<div class="flex-shrink-0">
<IconRenderer
icon-name="check"
svg-class="h-6 w-6 text-teal-600"
/>
<font-awesome icon="check" class="h-6 w-6 text-teal-600" />
</div>
<div class="ml-5 w-0 flex-1">
<dl>
@@ -422,10 +381,7 @@
<div class="p-5">
<div class="flex items-center">
<div class="flex-shrink-0">
<IconRenderer
icon-name="settings"
svg-class="h-6 w-6 text-purple-600"
/>
<font-awesome icon="gear" class="h-6 w-6 text-purple-600" />
</div>
<div class="ml-5 w-0 flex-1">
<dl>
@@ -445,10 +401,7 @@
<div class="p-5">
<div class="flex items-center">
<div class="flex-shrink-0">
<IconRenderer
icon-name="check"
svg-class="h-6 w-6 text-indigo-600"
/>
<font-awesome icon="check" class="h-6 w-6 text-indigo-600" />
</div>
<div class="ml-5 w-0 flex-1">
<dl>
@@ -469,9 +422,9 @@
<div class="p-5">
<div class="flex items-center">
<div class="flex-shrink-0">
<IconRenderer
icon-name="chart"
svg-class="h-6 w-6 text-blue-600"
<font-awesome
icon="chart-line"
class="h-6 w-6 text-blue-600"
/>
</div>
<div class="ml-5 w-0 flex-1">
@@ -492,10 +445,7 @@
<div class="p-5">
<div class="flex items-center">
<div class="flex-shrink-0">
<IconRenderer
icon-name="check"
svg-class="h-6 w-6 text-green-600"
/>
<font-awesome icon="check" class="h-6 w-6 text-green-600" />
</div>
<div class="ml-5 w-0 flex-1">
<dl>
@@ -526,9 +476,9 @@
class="flex items-center justify-between p-3 bg-blue-50 rounded-lg"
>
<div class="flex items-center">
<IconRenderer
icon-name="plusCircle"
svg-class="h-5 w-5 text-blue-600 mr-2"
<font-awesome
icon="circle-plus"
class="h-5 w-5 text-blue-600 mr-2"
/>
<span class="text-sm font-medium text-blue-900">Add</span>
</div>
@@ -541,9 +491,9 @@
class="flex items-center justify-between p-3 bg-yellow-50 rounded-lg"
>
<div class="flex items-center">
<IconRenderer
icon-name="check"
svg-class="h-5 w-5 text-yellow-600 mr-2"
<font-awesome
icon="check"
class="h-5 w-5 text-yellow-600 mr-2"
/>
<span class="text-sm font-medium text-yellow-900"
>Unmodified</span
@@ -558,9 +508,9 @@
class="flex items-center justify-between p-3 bg-red-50 rounded-lg"
>
<div class="flex items-center">
<IconRenderer
icon-name="trash"
svg-class="h-5 w-5 text-red-600 mr-2"
<font-awesome
icon="trash-can"
class="h-5 w-5 text-red-600 mr-2"
/>
<span class="text-sm font-medium text-red-900">Keep</span>
</div>
@@ -677,9 +627,9 @@
class="flex items-center justify-between p-3 bg-blue-50 rounded-lg"
>
<div class="flex items-center">
<IconRenderer
icon-name="plusCircle"
svg-class="h-5 w-5 text-blue-600 mr-2"
<font-awesome
icon="circle-plus"
class="h-5 w-5 text-blue-600 mr-2"
/>
<span class="text-sm font-medium text-blue-900">Add</span>
</div>
@@ -692,9 +642,9 @@
class="flex items-center justify-between p-3 bg-yellow-50 rounded-lg"
>
<div class="flex items-center">
<IconRenderer
icon-name="edit"
svg-class="h-5 w-5 text-yellow-600 mr-2"
<font-awesome
icon="pen"
class="h-5 w-5 text-yellow-600 mr-2"
/>
<span class="text-sm font-medium text-yellow-900"
>Modify</span
@@ -709,9 +659,9 @@
class="flex items-center justify-between p-3 bg-yellow-50 rounded-lg"
>
<div class="flex items-center">
<IconRenderer
icon-name="check"
svg-class="h-5 w-5 text-yellow-600 mr-2"
<font-awesome
icon="check"
class="h-5 w-5 text-yellow-600 mr-2"
/>
<span class="text-sm font-medium text-yellow-900"
>Unmodified</span
@@ -726,9 +676,9 @@
class="flex items-center justify-between p-3 bg-red-50 rounded-lg"
>
<div class="flex items-center">
<IconRenderer
icon-name="trash"
svg-class="h-5 w-5 text-red-600 mr-2"
<font-awesome
icon="trash-can"
class="h-5 w-5 text-red-600 mr-2"
/>
<span class="text-sm font-medium text-red-900">Keep</span>
</div>
@@ -868,9 +818,9 @@
class="flex items-center justify-between p-3 bg-blue-50 rounded-lg"
>
<div class="flex items-center">
<IconRenderer
icon-name="plusCircle"
svg-class="h-5 w-5 text-blue-600 mr-2"
<font-awesome
icon="circle-plus"
class="h-5 w-5 text-blue-600 mr-2"
/>
<span class="text-sm font-medium text-blue-900">Add</span>
</div>
@@ -883,9 +833,9 @@
class="flex items-center justify-between p-3 bg-yellow-50 rounded-lg"
>
<div class="flex items-center">
<IconRenderer
icon-name="edit"
svg-class="h-5 w-5 text-yellow-600 mr-2"
<font-awesome
icon="pen"
class="h-5 w-5 text-yellow-600 mr-2"
/>
<span class="text-sm font-medium text-yellow-900"
>Modify</span
@@ -900,9 +850,9 @@
class="flex items-center justify-between p-3 bg-yellow-50 rounded-lg"
>
<div class="flex items-center">
<IconRenderer
icon-name="check"
svg-class="h-5 w-5 text-yellow-600 mr-2"
<font-awesome
icon="check"
class="h-5 w-5 text-yellow-600 mr-2"
/>
<span class="text-sm font-medium text-yellow-900"
>Unmodified</span
@@ -917,9 +867,9 @@
class="flex items-center justify-between p-3 bg-red-50 rounded-lg"
>
<div class="flex items-center">
<IconRenderer
icon-name="trash"
svg-class="h-5 w-5 text-red-600 mr-2"
<font-awesome
icon="trash-can"
class="h-5 w-5 text-red-600 mr-2"
/>
<span class="text-sm font-medium text-red-900">Keep</span>
</div>
@@ -1067,7 +1017,6 @@ import { Component, Vue } from "vue-facing-decorator";
import { useClipboard } from "@vueuse/core";
import { Router } from "vue-router";
import IconRenderer from "../components/IconRenderer.vue";
import {
compareDatabases,
migrateSettings,
@@ -1104,9 +1053,6 @@ import { logger } from "../utils/logger";
*/
@Component({
name: "DatabaseMigration",
components: {
IconRenderer,
},
})
export default class DatabaseMigration extends Vue {
$router!: Router;

4
src/views/DeepLinkErrorView.vue
View File

@@ -47,7 +47,7 @@ import { computed, onMounted } from "vue";
import { useRoute, useRouter } from "vue-router";
import {
VALID_DEEP_LINK_ROUTES,
deepLinkSchemas,
deepLinkPathSchemas,
} from "../interfaces/deepLinks";
import { logConsoleAndDb } from "../db/databaseUtil";
import { logger } from "../utils/logger";
@@ -56,7 +56,7 @@ const route = useRoute();
const router = useRouter();
// an object with the route as the key and the first param name as the value
const deepLinkSchemaKeys = Object.fromEntries(
Object.entries(deepLinkSchemas).map(([route, schema]) => {
Object.entries(deepLinkPathSchemas).map(([route, schema]) => {
const param = Object.keys(schema.shape)[0];
return [route, param];
}),

10
src/views/DiscoverView.vue
View File

@@ -458,7 +458,9 @@ export default class DiscoverView extends Vue {
if (this.isLocalActive) {
await this.searchLocal();
} else if (this.isMappedActive) {
const mapRef = this.$refs.projectMap as any;
const mapRef = this.$refs.projectMap as {
leafletObject: L.Map;
};
this.requestTiles(mapRef.leafletObject); // not ideal because I found this from experimentation, not documentation
} else {
await this.searchAll();
@@ -518,11 +520,11 @@ export default class DiscoverView extends Vue {
throw JSON.stringify(results);
}
}
// eslint-disable-next-line @typescript-eslint/no-explicit-any
} catch (e: any) {
} catch (e: unknown) {
logger.error("Error with search all: " + errorStringForLog(e));
this.notify.error(
e.userMessage || NOTIFY_DISCOVER_SEARCH_ERROR.message,
(e as { userMessage?: string })?.userMessage ||
NOTIFY_DISCOVER_SEARCH_ERROR.message,
TIMEOUTS.LONG,
);
} finally {

85
src/views/GiftedDetailsView.vue
View File

@@ -48,24 +48,12 @@
placeholder="What was received"
/>
<div class="flex mb-4">
<button
class="rounded-s border border-e-0 border-slate-400 bg-slate-200 px-4 py-2"
@click="amountInput === '0' ? null : decrement()"
>
<font-awesome icon="chevron-left" />
</button>
<input
id="inputGivenAmount"
v-model="amountInput"
type="number"
class="flex-1 border border-e-0 border-slate-400 px-2 py-2 text-center w-[1px]"
<AmountInput
:value="parseFloat(amountInput) || 0"
:min="0"
input-id="inputGivenAmount"
:on-update-value="handleAmountChange"
/>
<button
class="rounded-e border border-slate-400 bg-slate-200 px-4 py-2"
@click="increment()"
>
<font-awesome icon="chevron-right" />
</button>
<select
v-model="unitCode"
@@ -189,7 +177,7 @@
{{
recipientDid
? "This was given to " + recipientName + "."
: "No individual benefitted."
: "No named individual benefitted."
}}
</label>
<font-awesome
@@ -275,6 +263,7 @@ import { RouteLocationNormalizedLoaded, Router } from "vue-router";
import ImageMethodDialog from "../components/ImageMethodDialog.vue";
import QuickNav from "../components/QuickNav.vue";
import TopMessage from "../components/TopMessage.vue";
import AmountInput from "../components/AmountInput.vue";
import { DEFAULT_IMAGE_API_SERVER, NotificationIface } from "../constants/app";
import { GenericCredWrapper, GiveActionClaim } from "../interfaces";
import {
@@ -296,11 +285,11 @@ import {
NOTIFY_GIFTED_DETAILS_DELETE_IMAGE_CONFIRM,
NOTIFY_GIFTED_DETAILS_DELETE_IMAGE_ERROR,
NOTIFY_GIFTED_DETAILS_NO_IDENTIFIER,
NOTIFY_GIFTED_DETAILS_PROJECT_PROVIDER_INFO,
NOTIFY_GIFTED_DETAILS_BOTH_PROVIDER_SELECTED,
NOTIFY_GIFT_ERROR_NEGATIVE_AMOUNT,
NOTIFY_GIFTED_DETAILS_RECORDING_GIVE,
NOTIFY_GIFTED_DETAILS_CREATE_GIVE_ERROR,
NOTIFY_GIFTED_DETAILS_GIFT_RECORDED,
NOTIFY_GIFT_ERROR_NO_DESCRIPTION,
} from "@/constants/notifications";
@Component({
@@ -308,6 +297,7 @@ import {
ImageMethodDialog,
QuickNav,
TopMessage,
AmountInput,
},
mixins: [PlatformServiceMixin],
})
@@ -530,6 +520,10 @@ export default class GiftedDetails extends Vue {
)}`;
}
handleAmountChange(value: number): void {
this.amountInput = value.toString();
}
cancel() {
this.deleteImage(); // not awaiting, so they'll go back immediately
if (this.destinationPathAfter) {
@@ -594,10 +588,20 @@ export default class GiftedDetails extends Vue {
this.imageUrl = "";
} catch (error) {
logger.error("Error deleting image:", error);
this.notify.error(
NOTIFY_GIFTED_DETAILS_DELETE_IMAGE_ERROR.message,
TIMEOUTS.LONG,
);
// eslint-disable-next-line @typescript-eslint/no-explicit-any
if ((error as any)?.response?.status === 404) {
logger.log("Weird: the image was already deleted.", error);
localStorage.removeItem("imageUrl");
this.imageUrl = "";
// it already doesn't exist so we won't say anything to the user
} else {
this.notify.error(
NOTIFY_GIFTED_DETAILS_DELETE_IMAGE_ERROR.message,
TIMEOUTS.LONG,
);
}
}
}
@@ -611,14 +615,17 @@ export default class GiftedDetails extends Vue {
}
if (parseFloat(this.amountInput) < 0) {
this.notify.error(
NOTIFY_GIFTED_DETAILS_NO_IDENTIFIER.message,
NOTIFY_GIFT_ERROR_NEGATIVE_AMOUNT.message,
TIMEOUTS.SHORT,
);
return;
}
if (!this.description && !parseFloat(this.amountInput)) {
this.notify.error(
NOTIFY_GIFTED_DETAILS_NO_IDENTIFIER.message,
NOTIFY_GIFT_ERROR_NO_DESCRIPTION.message.replace(
"{unit}",
this.libsUtil.UNIT_SHORT[this.unitCode] || this.unitCode,
),
TIMEOUTS.SHORT,
);
return;
@@ -626,7 +633,8 @@ export default class GiftedDetails extends Vue {
this.notify.toast(
NOTIFY_GIFTED_DETAILS_RECORDING_GIVE.message,
TIMEOUTS.SHORT,
undefined,
TIMEOUTS.BRIEF,
);
// this is asynchronous, but we don't need to wait for it to complete
@@ -634,29 +642,32 @@ export default class GiftedDetails extends Vue {
}
notifyUserOfGiver() {
// there's no individual giver or there's a provider project
if (!this.giverDid) {
this.notify.warning(
NOTIFY_GIFTED_DETAILS_NO_IDENTIFIER.message,
"To assign a giver, you must choose a person in a previous step.",
TIMEOUTS.SHORT,
);
} else {
// must be because providedByProject is true
this.notify.warning(
NOTIFY_GIFTED_DETAILS_BOTH_PROVIDER_SELECTED.message,
"You cannot assign both a giver and a project.",
TIMEOUTS.SHORT,
);
}
}
notifyUserOfRecipient() {
// there's no individual recipient or there's a fulfills project
if (!this.recipientDid) {
this.notify.warning(
NOTIFY_GIFTED_DETAILS_NO_IDENTIFIER.message,
"To assign a recipient, you must choose a person in a previous step.",
TIMEOUTS.SHORT,
);
} else {
// must be because givenToProject is true
this.notify.warning(
NOTIFY_GIFTED_DETAILS_BOTH_PROVIDER_SELECTED.message,
"You cannot assign both to a recipient and to a project.",
TIMEOUTS.SHORT,
);
}
@@ -666,13 +677,13 @@ export default class GiftedDetails extends Vue {
// we're here because they clicked and either there is no provider project or there is a giver chosen
if (!this.providerProjectId) {
this.notify.warning(
NOTIFY_GIFTED_DETAILS_PROJECT_PROVIDER_INFO.message,
"To select a project as a provider, you must choose a project in a previous step.",
TIMEOUTS.SHORT,
);
} else {
// no providing project was chosen
// no providing project was chosen, so there must be an individual giver
this.notify.warning(
NOTIFY_GIFTED_DETAILS_BOTH_PROVIDER_SELECTED.message,
"You cannot select both a giving project and person.",
TIMEOUTS.SHORT,
);
}
@@ -682,13 +693,13 @@ export default class GiftedDetails extends Vue {
// we're here because they clicked and either there is no fulfills project or there is a recipient chosen
if (!this.fulfillsProjectId) {
this.notify.warning(
NOTIFY_GIFTED_DETAILS_PROJECT_PROVIDER_INFO.message,
"To assign a project as a recipient, you must choose a project in a previous step.",
TIMEOUTS.SHORT,
);
} else {
// no fulfills project was chosen
// no fulfills project was chosen, so there must be an individual recipient
this.notify.warning(
NOTIFY_GIFTED_DETAILS_BOTH_PROVIDER_SELECTED.message,
"You cannot select both a receiving project and person.",
TIMEOUTS.SHORT,
);
}

128
src/views/HelpView.vue
View File

@@ -62,59 +62,6 @@
<h2 class="text-xl font-semibold">I want to know more because...</h2>
<ul class="list-disc list-outside ml-4">
<li class="p-2">
<div class="text-blue-500" @click="toggleAlpha">... I'm a member of Alpha chat.</div>
<div v-if="showAlpha">
<p>
This is a project for public benefit. You are invited to add your gratitude
and propose projects on a distributable ledger.
</p>
<p>
The underlying data is on a merkle tree with each verifiable claim, signature and all.
The chain includes individual IDs for discovery & visibility, so not all data is distributed -- yet.
The goal is to eventually distribute the data on people's devices with their chosen network,
where anyone could host their own chain of provenance if they choose.
The formats follow standard schemas (eg. schema.org) to encourage interoperability.
We're currently at the beginning phase where we're trusting the server to keep IDs private.
It's all open-source, and we expect to have a professional audit someday.
</p>
<p>
A person's network of contacts is similar: the server currently knows some of the links between people
to allow discovery and visibility. However, even that will be manageable on personal devices someday.
</p>
<p>
There are no tokens to maintain the chain: the purpose is to create software that communities
and activists can easily join and use. We're betting that this is a case where network
participants have the motivation to run the software. The protocol is meant to be lightweight enough that
non-technical people can run it on inexpensive devices they already own. There may be cases for
MPC or ZKP in the future when they are more widespread and standard,
but our preference is to engineer as simply as possible with "white-magic" cryptography
over those "black-magic" functions.
</p>
<p>
Let's make real distributed computing and shared data happen, starting with our own small networks.
</p>
<p>
... and exemplify the fun along the way.
</p>
</div>
</li>
<li class="p-2">
<div class="text-blue-500" @click="toggleGroup">... I want to find a group I'll enjoy working with.</div>
<div v-if="showGroup">
<p>
This app encourages people to offer small bits of time to one another. It's a way to
run experiments with other people... tests of working together, which can start small
and easy but build into cooperation with people who are like-minded and who work well together.
</p>
<p>
Search the projects and place an offer on an interesting one
-- or create your own project and see who offers to help.
After your first experiment, you can give and get confirmation about the work, which you might choose
to show to future contacts.
</p>
</div>
</li>
<li class="p-2">
<div class="text-blue-500" @click="toggleCommunity">... I want to participate in community projects.</div>
<div v-if="showCommunity">
@@ -188,6 +135,59 @@
</p>
</div>
</li>
<li class="p-2">
<div class="text-blue-500" @click="toggleGroup">... I want to find a group I'll enjoy working with.</div>
<div v-if="showGroup">
<p>
This app encourages people to offer small bits of time to one another. It's a way to
run experiments with other people... tests of working together, which can start small
and easy but build into cooperation with people who are like-minded and who work well together.
</p>
<p>
Search the projects and place an offer on an interesting one
-- or create your own project and see who offers to help.
After your first experiment, you can give and get confirmation about the work, which you might choose
to show to future contacts.
</p>
</div>
</li>
<li class="p-2">
<div class="text-blue-500" @click="toggleAlpha">... I'm a member of Alpha chat.</div>
<div v-if="showAlpha">
<p>
This is a project for public benefit. You are invited to add your gratitude
and propose projects on a distributable ledger.
</p>
<p>
The underlying data is on a merkle tree with each verifiable claim, signature and all.
The chain includes individual IDs for discovery & visibility, so not all data is distributed -- yet.
The goal is to eventually distribute the data on people's devices with their chosen network,
where anyone could host their own chain of provenance if they choose.
The formats follow standard schemas (eg. schema.org) to encourage interoperability.
We're currently at the beginning phase where we're trusting the server to keep IDs private.
It's all open-source, and we expect to have a professional audit someday.
</p>
<p>
A person's network of contacts is similar: the server currently knows some of the links between people
to allow discovery and visibility. However, even that will be manageable on personal devices someday.
</p>
<p>
There are no tokens to maintain the chain: the purpose is to create software that communities
and activists can easily join and use. We're betting that this is a case where network
participants have the motivation to run the software. The protocol is meant to be lightweight enough that
non-technical people can run it on inexpensive devices they already own. There may be cases for
MPC or ZKP in the future when they are more widespread and standard,
but our preference is to engineer as simply as possible with "white-magic" cryptography
over those "black-magic" functions.
</p>
<p>
Let's make real distributed computing and shared data happen, starting with our own small networks.
</p>
<p>
... and exemplify the fun along the way.
</p>
</div>
</li>
</ul>
<h2 class="text-xl font-semibold">How do I get started?</h2>
@@ -565,22 +565,22 @@
<h2 class="text-xl font-semibold">What app version is this?</h2>
<p>{{ package.version }} ({{ commitHash }})</p>
<div v-if="Capacitor.isNativePlatform()">
<div v-if="isCapacitor">
<h2 class="text-xl font-semibold">
Do I have the latest version?
</h2>
<p v-if="Capacitor.getPlatform() === 'ios'">
<p v-if="capabilities.isIOS">
<a href="https://apps.apple.com/us/app/time-safari/id6742664907" target="_blank" class="text-blue-500">
Check the App Store.
</a>
</p>
<p v-else-if="Capacitor.getPlatform() === 'android'">
<p v-else-if="!capabilities.isIOS && capabilities.isMobile">
<a href="https://play.google.com/store/apps/details?id=app.timesafari.app" target="_blank" class="text-blue-500">
Check the Play Store.
</a>
</p>
<p v-else>
Sorry, your platform of '{{ Capacitor.getPlatform() }}' is not recognized.
Sorry, your platform is not recognized.
</p>
</div>
</div>
@@ -592,12 +592,13 @@
import { Component, Vue } from "vue-facing-decorator";
import { Router } from "vue-router";
import { useClipboard } from "@vueuse/core";
import { Capacitor } from "@capacitor/core";
// Capacitor import removed - using QRNavigationService instead
import * as Package from "../../package.json";
import QuickNav from "../components/QuickNav.vue";
import { APP_SERVER } from "../constants/app";
import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
import { QRNavigationService } from "@/services/QRNavigationService";
/**
* HelpView.vue - Comprehensive Help System Component
@@ -643,7 +644,7 @@ export default class HelpView extends Vue {
showVerifiable = false;
APP_SERVER = APP_SERVER;
Capacitor = Capacitor;
// Capacitor reference removed - using QRNavigationService instead
// Ideally, we put no functionality in here, especially in the setup,
// because we never want this page to have a chance of throwing an error.
@@ -711,11 +712,10 @@ export default class HelpView extends Vue {
* @private
*/
private handleQRCodeClick(): void {
if (Capacitor.isNativePlatform()) {
this.$router.push({ name: "contact-qr-scan-full" });
} else {
this.$router.push({ name: "contact-qr" });
}
const qrNavigationService = QRNavigationService.getInstance();
const route = qrNavigationService.getQRScannerRoute();
this.$router.push(route);
}
/**

378
src/views/HomeView.vue
View File

@@ -132,7 +132,7 @@ Raymer * @version 1.0.0 */
<button
type="button"
class="text-center text-base uppercase 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-3 py-2 rounded-lg"
@click="openDialogPerson()"
@click="openPersonDialog()"
>
<font-awesome icon="user" />
Person
@@ -151,7 +151,11 @@ Raymer * @version 1.0.0 */
</div>
</div>
<GiftedDialog ref="customDialog" :show-projects="showProjectsDialog" />
<GiftedDialog
ref="giftedDialog"
:giver-entity-type="showProjectsDialog ? 'project' : 'person'"
:recipient-entity-type="'person'"
/>
<GiftedPrompts ref="giftedPrompts" />
<FeedFilters ref="feedFilters" />
@@ -230,11 +234,8 @@ Raymer * @version 1.0.0 */
:last-viewed-claim-id="feedLastViewedClaimId"
:is-registered="isRegistered"
:active-did="activeDid"
:confirmer-id-list="record.confirmerIdList"
:on-image-cache="cacheImageData"
@load-claim="onClickLoadClaim"
@view-image="openImageViewer"
@confirm-claim="confirmClaim"
/>
</ul>
</InfiniteScroll>
@@ -253,11 +254,7 @@ Raymer * @version 1.0.0 */
<ChoiceButtonDialog ref="choiceButtonDialog" />
<ImageViewer
v-model:is-open="isImageViewerOpen"
:image-url="selectedImage"
:image-data="selectedImageData"
/>
<ImageViewer v-model:is-open="isImageViewerOpen" :image-url="selectedImage" />
</template>
<script lang="ts">
@@ -302,16 +299,11 @@ import {
OnboardPage,
} from "../libs/util";
import { GiveSummaryRecord } from "../interfaces/records";
import * as serverUtil from "../libs/endorserServer";
import { logger } from "../utils/logger";
import { GiveRecordWithContactInfo } from "../interfaces/give";
import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
import {
NOTIFY_CONTACT_LOADING_ISSUE,
NOTIFY_FEED_LOADING_ISSUE,
NOTIFY_CONFIRMATION_ERROR,
} from "@/constants/notifications";
import { NOTIFY_CONTACT_LOADING_ISSUE } from "@/constants/notifications";
import * as Package from "../../package.json";
// consolidate this with GiveActionClaim in src/interfaces/claims.ts
@@ -437,9 +429,7 @@ export default class HomeView extends Vue {
showShortcutBvc = false;
userAgentInfo = new UAParser(); // see https://docs.uaparser.js.org/v2/api/ua-parser-js/get-os.html
selectedImage = "";
selectedImageData: Blob | null = null;
isImageViewerOpen = false;
imageCache: Map<string, Blob | null> = new Map();
showProjectsDialog = false;
/**
@@ -485,6 +475,10 @@ export default class HomeView extends Vue {
if (newDid !== oldDid) {
// Re-initialize identity with new settings (loads settings internally)
await this.initializeIdentity();
} else {
logger.debug(
"[HomeView Settings Trace] 📍 DID unchanged, skipping re-initialization",
);
}
}
@@ -527,11 +521,7 @@ export default class HomeView extends Vue {
// Load settings with better error context using ultra-concise mixin
let settings;
try {
settings = await this.$settings({
apiServer: "",
activeDid: "",
isRegistered: false,
});
settings = await this.$accountSettings();
} catch (error) {
this.$logAndConsole(
`[HomeView] Failed to retrieve settings: ${error}`,
@@ -599,65 +589,21 @@ export default class HomeView extends Vue {
// Ultra-concise settings update with automatic cache invalidation!
await this.$saveMySettings({ isRegistered: true });
this.isRegistered = true;
// Force Vue to re-render the template
await this.$nextTick();
}
} catch (error) {
// Consolidate logging: Only log unexpected errors, not expected 400s
const axiosError = error as any;
if (axiosError?.response?.status !== 400) {
this.$logAndConsole(
`[HomeView] Registration check failed: ${error}`,
true,
);
}
// Continue as unregistered - this is expected for new users
}
}
// Initialize feed and offers
try {
// Start feed update in background
this.updateAllFeed().catch((error) => {
this.$logAndConsole(
`[HomeView] Background feed update failed: ${error}`,
true,
logger.warn(
"[HomeView Settings Trace] ⚠️ Registration check failed",
{
error: error instanceof Error ? error.message : String(error),
},
);
});
// Load new offers if we have an active DID
if (this.activeDid) {
const [offersToUser, offersToProjects] = await Promise.all([
getNewOffersToUser(
this.axios,
this.apiServer,
this.activeDid,
this.lastAckedOfferToUserJwtId,
),
getNewOffersToUserProjects(
this.axios,
this.apiServer,
this.activeDid,
this.lastAckedOfferToUserProjectsJwtId,
),
]);
this.numNewOffersToUser = offersToUser.data.length;
this.newOffersToUserHitLimit = offersToUser.hitLimit;
this.numNewOffersToUserProjects = offersToProjects.data.length;
this.newOffersToUserProjectsHitLimit = offersToProjects.hitLimit;
}
} catch (error) {
this.$logAndConsole(
`[HomeView] Failed to initialize feed/offers: ${error}`,
true,
);
// Don't throw - we can continue with empty feed
this.notify.warning(NOTIFY_FEED_LOADING_ISSUE.message, TIMEOUTS.LONG);
}
} catch (error) {
this.handleError(error);
throw error; // Re-throw to be caught by mounted()
} catch (err: unknown) {
logger.error("[HomeView Settings Trace] ❌ initializeIdentity() failed", {
error: err instanceof Error ? err.message : String(err),
});
throw err;
}
}
@@ -681,44 +627,6 @@ export default class HomeView extends Vue {
}
}
/**
* Loads user settings from storage using ultra-concise mixin utilities
* Sets component state for:
* - API server, Active DID, Feed filters and view settings
* - Registration status, Notification acknowledgments
*
* @internal
* Called by mounted() and reloadFeedOnChange()
*/
private async loadSettings() {
// Use the current activeDid (set in initializeIdentity) to get user-specific settings
const settings = await this.$accountSettings(this.activeDid, {
apiServer: "",
activeDid: "",
filterFeedByVisible: false,
filterFeedByNearby: false,
isRegistered: false,
});
this.apiServer = settings.apiServer || "";
// **CRITICAL**: Ensure correct API server for platform
await this.ensureCorrectApiServer();
this.activeDid = settings.activeDid || "";
this.feedLastViewedClaimId = settings.lastViewedClaimId;
this.givenName = settings.firstName || "";
this.isFeedFilteredByVisible = !!settings.filterFeedByVisible;
this.isFeedFilteredByNearby = !!settings.filterFeedByNearby;
this.isRegistered = !!settings.isRegistered;
this.lastAckedOfferToUserJwtId = settings.lastAckedOfferToUserJwtId;
this.lastAckedOfferToUserProjectsJwtId =
settings.lastAckedOfferToUserProjectsJwtId;
this.searchBoxes = settings.searchBoxes || [];
this.showShortcutBvc = !!settings.showShortcutBvc;
this.isAnyFeedFilterOn = checkIsAnyFeedFilterOn(settings);
}
/**
* Loads user contacts from database using ultra-concise mixin
* Used for displaying contact info in feed and actions
@@ -733,36 +641,6 @@ export default class HomeView extends Vue {
.map((c) => c.did);
}
/**
* Verifies user registration status with endorser service
* - Checks if unregistered user can access API
* - Updates registration status if successful
* - Preserves unregistered state on failure
*
* @internal
* Called by mounted() and initializeIdentity()
*/
private async checkRegistrationStatus() {
if (!this.isRegistered && this.activeDid) {
try {
const resp = await fetchEndorserRateLimits(
this.apiServer,
this.axios,
this.activeDid,
);
if (resp.status === 200) {
// Ultra-concise settings update with automatic cache invalidation!
await this.$saveMySettings({ isRegistered: true });
this.isRegistered = true;
// Force Vue to re-render the template
await this.$nextTick();
}
} catch (e) {
// ignore the error... just keep us unregistered
}
}
}
/**
* Initializes feed data
* Triggers updateAllFeed() to populate activity feed
@@ -815,7 +693,7 @@ export default class HomeView extends Vue {
* Called by mounted()
*/
private async checkOnboarding() {
const settings = await this.$settings();
const settings = await this.$accountSettings();
if (!settings.finishedOnboarding) {
(this.$refs.onboardingDialog as OnboardingDialog).open(OnboardPage.Home);
}
@@ -878,17 +756,34 @@ export default class HomeView extends Vue {
* Called by FeedFilters component when filters change
*/
async reloadFeedOnChange() {
const settings = await this.$accountSettings(this.activeDid, {
filterFeedByVisible: false,
filterFeedByNearby: false,
logger.debug("[HomeView] 🔄 reloadFeedOnChange() called - refreshing feed");
// Get current settings without overriding with defaults
const settings = await this.$accountSettings(this.activeDid);
logger.debug("[HomeView] 📊 Current filter settings:", {
filterFeedByVisible: settings.filterFeedByVisible,
filterFeedByNearby: settings.filterFeedByNearby,
searchBoxes: settings.searchBoxes?.length || 0,
});
this.isFeedFilteredByVisible = !!settings.filterFeedByVisible;
this.isFeedFilteredByNearby = !!settings.filterFeedByNearby;
this.isAnyFeedFilterOn = checkIsAnyFeedFilterOn(settings);
logger.debug("[HomeView] 🎯 Updated filter states:", {
isFeedFilteredByVisible: this.isFeedFilteredByVisible,
isFeedFilteredByNearby: this.isFeedFilteredByNearby,
isAnyFeedFilterOn: this.isAnyFeedFilterOn,
});
this.feedData = [];
this.feedPreviousOldestId = undefined;
logger.debug("[HomeView] 🧹 Cleared feed data, calling updateAllFeed()");
await this.updateAllFeed();
logger.debug("[HomeView] ✅ Feed refresh completed");
}
/**
@@ -967,6 +862,14 @@ export default class HomeView extends Vue {
* - this.feedLastViewedClaimId (via updateFeedLastViewedId)
*/
async updateAllFeed() {
logger.debug("[HomeView] 🚀 updateAllFeed() called", {
isFeedLoading: this.isFeedLoading,
currentFeedDataLength: this.feedData.length,
isAnyFeedFilterOn: this.isAnyFeedFilterOn,
isFeedFilteredByVisible: this.isFeedFilteredByVisible,
isFeedFilteredByNearby: this.isFeedFilteredByNearby,
});
this.isFeedLoading = true;
let endOfResults = true;
@@ -975,21 +878,37 @@ export default class HomeView extends Vue {
this.apiServer,
this.feedPreviousOldestId,
);
logger.debug("[HomeView] 📡 Retrieved gives from API", {
resultsCount: results.data.length,
endOfResults,
});
if (results.data.length > 0) {
endOfResults = false;
// gather any contacts that user has blocked from view
await this.processFeedResults(results.data);
await this.updateFeedLastViewedId(results.data);
logger.debug("[HomeView] 📝 Processed feed results", {
processedCount: this.feedData.length,
});
}
} catch (e) {
logger.error("[HomeView] ❌ Error in updateAllFeed:", e);
this.handleFeedError(e);
}
if (this.feedData.length === 0 && !endOfResults) {
logger.debug("[HomeView] 🔄 No results after filtering, retrying...");
await this.updateAllFeed();
}
this.isFeedLoading = false;
logger.debug("[HomeView] ✅ updateAllFeed() completed", {
finalFeedDataLength: this.feedData.length,
isFeedLoading: this.isFeedLoading,
});
}
/**
@@ -1014,12 +933,35 @@ export default class HomeView extends Vue {
* @param records Array of feed records to process
*/
private async processFeedResults(records: GiveSummaryRecord[]) {
logger.debug("[HomeView] 📝 Processing feed results:", {
inputRecords: records.length,
currentFilters: {
isAnyFeedFilterOn: this.isAnyFeedFilterOn,
isFeedFilteredByVisible: this.isFeedFilteredByVisible,
isFeedFilteredByNearby: this.isFeedFilteredByNearby,
},
});
let processedCount = 0;
let filteredCount = 0;
for (const record of records) {
const processedRecord = await this.processRecord(record);
if (processedRecord) {
this.feedData.push(processedRecord);
processedCount++;
} else {
filteredCount++;
}
}
logger.debug("[HomeView] 📊 Feed processing results:", {
processed: processedCount,
filtered: filteredCount,
total: records.length,
finalFeedLength: this.feedData.length,
});
this.feedPreviousOldestId = records[records.length - 1].jwtId;
}
@@ -1053,7 +995,7 @@ export default class HomeView extends Vue {
* - this.feedData (via createFeedRecord)
*
* @param record The record to process
* @returns Processed record with contact info if it passes filters, null otherwise
* @returns Processed record if it passes filters, null otherwise
*/
private async processRecord(
record: GiveSummaryRecord,
@@ -1063,13 +1005,28 @@ export default class HomeView extends Vue {
const recipientDid = this.extractRecipientDid(claim);
const fulfillsPlan = await this.getFulfillsPlan(record);
// Log record details for debugging
logger.debug("[HomeView] 🔍 Processing record:", {
recordId: record.jwtId,
hasFulfillsPlan: !!fulfillsPlan,
fulfillsPlanHandleId: record.fulfillsPlanHandleId,
filters: {
isAnyFeedFilterOn: this.isAnyFeedFilterOn,
isFeedFilteredByVisible: this.isFeedFilteredByNearby,
isFeedFilteredByNearby: this.isFeedFilteredByNearby,
},
});
if (!this.shouldIncludeRecord(record, fulfillsPlan)) {
logger.debug("[HomeView] ❌ Record filtered out:", record.jwtId);
return null;
}
const provider = this.extractProvider(claim);
const providedByPlan = await this.getProvidedByPlan(provider);
logger.debug("[HomeView] ✅ Record included:", record.jwtId);
return this.createFeedRecord(
record,
claim,
@@ -1218,6 +1175,22 @@ export default class HomeView extends Vue {
}
}
// Add debug logging for nearby filter
if (this.isFeedFilteredByNearby && record.fulfillsPlanHandleId) {
logger.debug("[HomeView] 🔍 Nearby filter check:", {
recordId: record.jwtId,
hasFulfillsPlan: !!fulfillsPlan,
hasLocation: !!(fulfillsPlan?.locLat && fulfillsPlan?.locLon),
location: fulfillsPlan
? { lat: fulfillsPlan.locLat, lon: fulfillsPlan.locLon }
: null,
inSearchBox: fulfillsPlan
? this.latLongInAnySearchBox(fulfillsPlan.locLat, fulfillsPlan.locLon)
: null,
finalResult: anyMatch,
});
}
return anyMatch;
}
@@ -1591,37 +1564,35 @@ export default class HomeView extends Vue {
* openGiftedPrompts() -> openDialog()
*
* @requires
* - this.$refs.customDialog
* - this.$refs.giftedDialog
* - this.activeDid
*
* @param giver Optional contact info for giver
* @param description Optional gift description
*/
openDialog(giver?: GiverReceiverInputInfo | "Unnamed", description?: string) {
openDialog(giver?: GiverReceiverInputInfo | "Unnamed", prompt?: string) {
if (giver === "Unnamed") {
// Special case: Pass undefined to trigger Step 1, but with "Unnamed" pre-selected
(this.$refs.customDialog as GiftedDialog).open(
(this.$refs.giftedDialog as GiftedDialog).open(
undefined,
{
did: this.activeDid,
name: "You",
} as GiverReceiverInputInfo,
undefined,
"Given by Unnamed",
description,
prompt,
);
// Immediately select "Unnamed" and move to Step 2
(this.$refs.customDialog as GiftedDialog).selectGiver();
(this.$refs.giftedDialog as GiftedDialog).selectGiver();
} else {
(this.$refs.customDialog as GiftedDialog).open(
(this.$refs.giftedDialog as GiftedDialog).open(
giver,
{
did: this.activeDid,
name: "You",
} as GiverReceiverInputInfo,
undefined,
"Given by " + (giver?.name || "someone not named"),
description,
prompt,
);
}
}
@@ -1655,18 +1626,10 @@ export default class HomeView extends Vue {
* Called by template click handler
*/
openFeedFilters() {
(this.$refs.feedFilters as FeedFilters).open(this.reloadFeedOnChange);
}
/**
* Shows toast notification to user
*
* @internal
* Used for various user notifications
* @param message Message to display
*/
toastUser(message: string) {
this.notify.toast("FYI", message, TIMEOUTS.SHORT);
(this.$refs.feedFilters as FeedFilters).open(
this.reloadFeedOnChange,
this.activeDid,
);
}
/**
@@ -1742,23 +1705,6 @@ export default class HomeView extends Vue {
});
}
/**
* Caches image data for sharing
*
* @public
* Called by ActivityListItem component function prop
* @param imageUrl URL of image to cache
*/
async cacheImageData(imageUrl: string) {
try {
// For images that might fail CORS, just store the URL
// The Web Share API will handle sharing the URL appropriately
this.imageCache.set(imageUrl, null);
} catch (error) {
logger.warn("Failed to cache image:", error);
}
}
/**
* Opens image viewer dialog
*
@@ -1767,58 +1713,10 @@ export default class HomeView extends Vue {
* @param imageUrl URL of image to display
*/
async openImageViewer(imageUrl: string) {
this.selectedImageData = this.imageCache.get(imageUrl) ?? null;
this.selectedImage = imageUrl;
this.isImageViewerOpen = true;
}
/**
* Handles claim confirmation
*
* @public
* Called by ActivityListItem component
* @param record Record to confirm
*/
async confirmClaim(record: GiveRecordWithContactInfo) {
this.notify.confirm(
"Do you personally confirm that this is true?",
async () => {
const goodClaim = serverUtil.removeSchemaContext(
serverUtil.removeVisibleToDids(
serverUtil.addLastClaimOrHandleAsIdIfMissing(
record.fullClaim,
record.jwtId,
record.handleId,
),
),
);
const confirmationClaim = {
"@context": "https://schema.org",
"@type": "AgreeAction",
object: goodClaim,
};
const result = await serverUtil.createAndSubmitClaim(
confirmationClaim,
this.activeDid,
this.apiServer,
this.axios,
);
if (result.success) {
this.notify.confirmationSubmitted();
// Refresh the feed to show updated confirmation status
await this.updateAllFeed();
} else {
logger.error("Error submitting confirmation:", result);
this.notify.error(NOTIFY_CONFIRMATION_ERROR.message, TIMEOUTS.LONG);
}
},
);
}
private handleQRCodeClick() {
if (Capacitor.isNativePlatform()) {
this.$router.push({ name: "contact-qr-scan-full" });
@@ -1827,17 +1725,17 @@ export default class HomeView extends Vue {
}
}
openDialogPerson(
openPersonDialog(
giver?: GiverReceiverInputInfo | "Unnamed",
description?: string,
prompt?: string,
) {
this.showProjectsDialog = false;
this.openDialog(giver, description);
this.openDialog(giver, prompt);
}
openProjectDialog() {
this.showProjectsDialog = true;
(this.$refs.customDialog as GiftedDialog).open();
(this.$refs.giftedDialog as GiftedDialog).open();
}
/**

32
src/views/IdentitySwitcherView.vue
View File

@@ -214,7 +214,10 @@ export default class IdentitySwitcherView extends Vue {
}
} catch (err) {
this.notify.error(NOTIFY_ERROR_LOADING_ACCOUNTS.message, TIMEOUTS.LONG);
logger.error("Telling user to clear cache at page create because:", err);
logger.error(
"[IdentitySwitcher Settings Trace] ❌ Error loading accounts:",
err,
);
}
}
@@ -225,12 +228,37 @@ export default class IdentitySwitcherView extends Vue {
// Check if we need to load user-specific settings for the new DID
if (did) {
try {
await this.$accountSettings(did);
const newSettings = await this.$accountSettings(did);
logger.info(
"[IdentitySwitcher Settings Trace] ✅ New account settings loaded",
{
did,
settingsKeys: Object.keys(newSettings).filter(
(k) =>
k in newSettings &&
newSettings[k as keyof typeof newSettings] !== undefined,
),
},
);
} catch (error) {
logger.warn(
"[IdentitySwitcher Settings Trace] ⚠️ Error loading new account settings",
{
did,
error: error instanceof Error ? error.message : String(error),
},
);
// Handle error silently - user settings will be loaded when needed
}
}
logger.info(
"[IdentitySwitcher Settings Trace] 🔄 Navigating to home to trigger watcher",
{
newDid: did,
},
);
// Navigate to home page to trigger the watcher
this.$router.push({ name: "home" });
}

5
src/views/ImportAccountView.vue
View File

@@ -221,10 +221,11 @@ export default class ImportAccountView extends Vue {
this.notify.success("Account imported successfully!", TIMEOUTS.STANDARD);
this.$router.push({ name: "account" });
} catch (error: any) {
} catch (error: unknown) {
this.$logError("Import failed: " + error);
this.notify.error(
error.message || "Failed to import account.",
(error instanceof Error ? error.message : String(error)) ||
"Failed to import account.",
TIMEOUTS.LONG,
);
}

11
src/views/ImportDerivedAccountView.vue
View File

@@ -87,7 +87,7 @@ import {
import { logger } from "../utils/logger";
import { Account, AccountEncrypted } from "../db/tables/accounts";
import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
import { createNotifyHelpers, TIMEOUTS, NotifyFunction } from "@/utils/notify";
import {
NOTIFY_ACCOUNT_DERIVATION_SUCCESS,
NOTIFY_ACCOUNT_DERIVATION_ERROR,
@@ -100,7 +100,7 @@ import {
export default class ImportAccountView extends Vue {
$route!: RouteLocationNormalizedLoaded;
$router!: Router;
$notify!: (notification: any, timeout?: number) => void;
$notify!: NotifyFunction;
notify!: ReturnType<typeof createNotifyHelpers>;
@@ -166,10 +166,8 @@ export default class ImportAccountView extends Vue {
] as string;
const newDerivPath = nextDerivationPath(maxDerivPath);
const mne = selectedArray[0].mnemonic as string;
const [address, privateHex, publicHex] = deriveAddress(mne, newDerivPath);
const newId = newIdentifier(address, publicHex, privateHex, newDerivPath);
try {
@@ -187,7 +185,10 @@ export default class ImportAccountView extends Vue {
);
this.$router.push({ name: "account" });
} catch (err) {
logger.error("Error saving mnemonic & updating settings:", err);
logger.error(
"[ImportDerived Settings Trace] ❌ Error saving mnemonic & updating settings:",
err,
);
this.notify.error(NOTIFY_ACCOUNT_DERIVATION_ERROR.message, TIMEOUTS.LONG);
}
}

293
src/views/OnboardMeetingListView.vue
View File

@@ -115,6 +115,8 @@ import {
serverMessageForUser,
} from "../libs/endorserServer";
import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
import { NotificationIface } from "@/constants/app";
interface Meeting {
name: string;
@@ -129,19 +131,11 @@ interface Meeting {
mixins: [PlatformServiceMixin],
})
export default class OnboardMeetingListView extends Vue {
$notify!: (
notification: {
group: string;
type: string;
title: string;
text: string;
onYes?: () => void;
yesText?: string;
},
timeout?: number,
) => void;
$notify!: (notification: NotificationIface, timeout?: number) => void;
$router!: Router;
notify!: ReturnType<typeof createNotifyHelpers>;
activeDid = "";
apiServer = "";
attendingMeeting: Meeting | null = null;
@@ -153,30 +147,66 @@ export default class OnboardMeetingListView extends Vue {
selectedMeeting: Meeting | null = null;
showPasswordDialog = false;
/**
* Vue lifecycle hook - component initialization
*
* Initializes the component by loading user settings and fetching available
* onboarding meetings. This method is called when the component is created
* and sets up all necessary data for the meeting list interface.
*
* Workflow:
* 1. Initialize notification system using createNotifyHelpers
* 2. Load user account settings (DID, API server, registration status)
* 3. Fetch available onboarding meetings from the server
*
* Dependencies:
* - PlatformServiceMixin for settings access ($accountSettings)
* - Server API for meeting data (fetchMeetings)
*
* Error Handling:
* - Server errors during meeting fetch are handled in fetchMeetings()
*
* @author Matthew Raymer
*/
async created() {
const settings = await this.$accountSettings();
this.notify = createNotifyHelpers(this.$notify);
if (settings?.activeDid) {
try {
// Verify database settings are accessible
await this.$query("SELECT * FROM settings WHERE accountDid = ?", [
settings.activeDid,
]);
} catch (error) {
logger.error("Error checking database settings:", error);
}
}
// Load user account settings
const settings = await this.$accountSettings();
this.activeDid = settings?.activeDid || "";
this.apiServer = settings?.apiServer || "";
this.firstName = settings?.firstName || "";
this.isRegistered = !!settings?.isRegistered;
if (this.isRegistered) {
await this.fetchMeetings();
}
await this.fetchMeetings();
}
/**
* Fetches available onboarding meetings from the server
*
* This method retrieves the list of onboarding meetings that the user can join.
* It first checks if the user is already attending a meeting, and if so,
* displays that meeting instead of the full list.
*
* Workflow:
* 1. Check if user is already attending a meeting (groupOnboardMember endpoint)
* 2. If attending: Fetch meeting details and display single meeting view
* 3. If not attending: Fetch all available meetings (groupsOnboarding endpoint)
* 4. Handle loading states and error conditions
*
* API Endpoints Used:
* - GET /api/partner/groupOnboardMember - Check current attendance
* - GET /api/partner/groupOnboard/{id} - Get meeting details
* - GET /api/partner/groupsOnboarding - Get all available meetings
*
* State Management:
* - Sets isLoading flag during API calls
* - Updates attendingMeeting or meetings array
* - Handles error states with user notifications
*
* @author Matthew Raymer
*/
async fetchMeetings() {
this.isLoading = true;
try {
@@ -221,25 +251,41 @@ export default class OnboardMeetingListView extends Vue {
if (response2.data?.data) {
this.meetings = response2.data.data;
}
} catch (error: any) {
} catch (error: unknown) {
this.$logAndConsole(
"Error fetching meetings: " + errorStringForLog(error),
true,
);
this.$notify(
{
group: "alert",
type: "danger",
title: "Error",
text: serverMessageForUser(error) || "Failed to fetch meetings.",
},
5000,
this.notify.error(
serverMessageForUser(error) || "There was a problem fetching meetings.",
TIMEOUTS.LONG,
);
} finally {
this.isLoading = false;
}
}
/**
* Opens the password dialog for joining a meeting
*
* This method initiates the process of joining an onboarding meeting by
* opening a modal dialog that prompts the user for the meeting password.
* The dialog is focused and ready for input when displayed.
*
* Workflow:
* 1. Clear any previous password input
* 2. Store the selected meeting for later use
* 3. Show the password dialog modal
* 4. Focus the password input field for immediate typing
*
* UI State Changes:
* - Sets showPasswordDialog to true (shows modal)
* - Clears password field for fresh input
* - Stores selectedMeeting for password submission
*
* @param meeting - The meeting object the user wants to join
* @author Matthew Raymer
*/
promptPassword(meeting: Meeting) {
this.password = "";
this.selectedMeeting = meeting;
@@ -252,12 +298,61 @@ export default class OnboardMeetingListView extends Vue {
});
}
/**
* Cancels the password dialog and resets state
*
* This method handles the cancellation of the meeting password dialog.
* It cleans up the dialog state and resets all related variables to
* their initial state, ensuring a clean slate for future dialog interactions.
*
* State Cleanup:
* - Clears password input field
* - Removes selected meeting reference
* - Hides password dialog modal
*
* This ensures that if the user reopens the dialog, they start with
* a fresh state without any leftover data from previous attempts.
*
* @author Matthew Raymer
*/
cancelPasswordDialog() {
this.password = "";
this.selectedMeeting = null;
this.showPasswordDialog = false;
}
/**
* Submits the password and joins the selected meeting
*
* This method handles the complete workflow of joining an onboarding meeting.
* It encrypts the user's member data with the provided password and sends
* it to the server to register the user as a meeting participant.
*
* Workflow:
* 1. Validate that a meeting is selected (safety check)
* 2. Create member data object with user information
* 3. Encrypt member data using the meeting password
* 4. Send encrypted data to server via groupOnboardMember endpoint
* 5. On success: Navigate to meeting members view with credentials
* 6. On failure: Show error notification to user
*
* Data Encryption:
* - Member data includes: name, DID, registration status
* - Data is encrypted using the meeting password for security
* - Encrypted data is sent to server for verification
*
* Navigation:
* - On successful join: Redirects to onboard-meeting-members view
* - Passes groupId, password, and memberId as route parameters
* - Allows user to see other meeting participants
*
* Error Handling:
* - Invalid passwords result in server rejection
* - Network errors are caught and displayed to user
* - All errors are logged for debugging purposes
*
* @author Matthew Raymer
*/
async submitPassword() {
if (!this.selectedMeeting) {
// this should never happen
@@ -316,69 +411,95 @@ export default class OnboardMeetingListView extends Vue {
"Error joining meeting: " + errorStringForLog(error),
true,
);
this.$notify(
{
group: "alert",
type: "danger",
title: "Error",
text:
serverMessageForUser(error) || "You failed to join the meeting.",
},
5000,
this.notify.error(
serverMessageForUser(error) ||
"There was a problem joining the meeting.",
TIMEOUTS.LONG,
);
}
}
/**
* Prompts user to confirm leaving the current meeting
*
* This method initiates the process of leaving an onboarding meeting.
* It shows a confirmation dialog to prevent accidental departures,
* then handles the server-side removal and UI updates.
*
* Workflow:
* 1. Display confirmation dialog asking user to confirm departure
* 2. On confirmation: Send DELETE request to groupOnboardMember endpoint
* 3. On success: Clear attending meeting state and refresh meeting list
* 4. Show success notification to user
* 5. On failure: Show error notification with details
*
* Server Interaction:
* - DELETE /api/partner/groupOnboardMember - Removes user from meeting
* - Requires authentication headers for user verification
* - Server handles the actual removal from meeting database
*
* State Management:
* - Clears attendingMeeting when successfully left
* - Refreshes meetings list to show updated availability
* - Updates UI to show meeting list instead of single meeting
*
* User Experience:
* - Confirmation prevents accidental departures
* - Clear feedback on success/failure
* - Seamless transition back to meeting list
*
* @author Matthew Raymer
*/
async leaveMeeting() {
this.$notify(
{
group: "modal",
type: "confirm",
title: "Leave Meeting",
text: "Are you sure you want to leave this meeting?",
onYes: async () => {
try {
const headers = await getHeaders(this.activeDid);
await this.axios.delete(
this.apiServer + "/api/partner/groupOnboardMember",
{ headers },
);
this.notify.confirm(
"Are you sure you want to leave this meeting?",
async () => {
try {
const headers = await getHeaders(this.activeDid);
await this.axios.delete(
this.apiServer + "/api/partner/groupOnboardMember",
{ headers },
);
this.attendingMeeting = null;
await this.fetchMeetings();
this.attendingMeeting = null;
await this.fetchMeetings();
this.$notify(
{
group: "alert",
type: "success",
title: "Success",
text: "You left the meeting.",
},
5000,
);
} catch (error) {
this.$logAndConsole(
"Error leaving meeting: " + errorStringForLog(error),
true,
);
this.$notify(
{
group: "alert",
type: "danger",
title: "Error",
text:
serverMessageForUser(error) ||
"You failed to leave the meeting.",
},
5000,
);
}
},
this.notify.success("You left the meeting.", TIMEOUTS.LONG);
} catch (error) {
this.$logAndConsole(
"Error leaving meeting: " + errorStringForLog(error),
true,
);
this.notify.error(
serverMessageForUser(error) ||
"There was a problem leaving the meeting.",
TIMEOUTS.LONG,
);
}
},
-1,
);
}
/**
* Navigates to the meeting creation page
*
* This method handles the navigation to the meeting setup page where
* registered users can create new onboarding meetings. It's only
* available to users who are registered in the system.
*
* Navigation:
* - Routes to onboard-meeting-setup view
* - Allows user to configure new meeting settings
* - Only accessible to registered users (controlled by template)
*
* User Flow:
* - User clicks "Create Meeting" button
* - System navigates to setup page
* - User can configure meeting name, password, etc.
* - New meeting becomes available to other users
*
* @author Matthew Raymer
*/
createMeeting() {
this.$router.push({ name: "onboard-meeting-setup" });
}

2
src/views/OnboardMeetingMembersView.vue
View File

@@ -113,7 +113,7 @@ export default class OnboardMeetingMembersView extends Vue {
try {
// Identity creation should be handled by router guard, but keep as fallback for meeting setup
if (!this.activeDid) {
logger.info(
this.$logAndConsole(
"[OnboardMeetingMembersView] No active DID found, creating identity as fallback for meeting setup",
);
this.activeDid = await generateSaveAndActivateIdentity();

6
src/views/OnboardMeetingSetupView.vue
View File

@@ -345,7 +345,9 @@ export default class OnboardMeetingView extends Vue {
}
async created() {
this.notify = createNotifyHelpers(this.$notify as any);
this.notify = createNotifyHelpers(
this.$notify as Parameters<typeof createNotifyHelpers>[0],
);
const settings = await this.$accountSettings();
this.activeDid = settings?.activeDid || "";
this.apiServer = settings?.apiServer || "";
@@ -419,7 +421,7 @@ export default class OnboardMeetingView extends Vue {
} else {
this.newOrUpdatedMeetingInputs = this.blankMeeting();
}
} catch (error: any) {
} catch (error: unknown) {
this.newOrUpdatedMeetingInputs = this.blankMeeting();
}
}

20
src/views/ProjectViewView.vue
View File

@@ -216,6 +216,8 @@
<GiftedDialog
ref="giveDialogToThis"
:giver-entity-type="'person'"
:recipient-entity-type="'project'"
:to-project-id="projectId"
:is-from-project-view="true"
/>
@@ -486,8 +488,9 @@
</div>
<GiftedDialog
ref="giveDialogFromThis"
:giver-entity-type="'project'"
:recipient-entity-type="'person'"
:from-project-id="projectId"
:show-projects="true"
:is-from-project-view="true"
/>
@@ -1155,7 +1158,6 @@ export default class ProjectViewView extends Vue {
undefined,
undefined,
undefined,
"Given by Unnamed to this project",
);
// Immediately select "Unnamed" and move to Step 2
(this.$refs.giveDialogToThis as GiftedDialog).selectGiver();
@@ -1173,7 +1175,6 @@ export default class ProjectViewView extends Vue {
image: this.imageUrl,
},
undefined,
`Given to ${this.name}`,
);
}
}
@@ -1189,7 +1190,6 @@ export default class ProjectViewView extends Vue {
},
{ did: this.activeDid, name: "You" },
undefined,
`${this.name} gave to you`,
undefined,
undefined,
);
@@ -1237,9 +1237,17 @@ export default class ProjectViewView extends Vue {
};
(this.$refs.giveDialogToThis as GiftedDialog).open(
giver,
undefined,
{
did: offer.issuerDid,
name: this.name,
handleId: this.projectId,
image: this.imageUrl,
},
offer.handleId,
"Given by " + (giver?.name || "someone not named"),
undefined,
offer.objectDescription,
offer.amount.toString(),
offer.unit,
);
}

34
src/views/ProjectsView.vue
View File

@@ -264,7 +264,7 @@
import { AxiosRequestConfig } from "axios";
import { Component, Vue } from "vue-facing-decorator";
import { Router } from "vue-router";
import { Capacitor } from "@capacitor/core";
// Capacitor import removed - using QRNavigationService instead
import { NotificationIface } from "../constants/app";
import EntityIcon from "../components/EntityIcon.vue";
@@ -281,6 +281,7 @@ import { OnboardPage, iconForUnitCode } from "../libs/util";
import { logger } from "../utils/logger";
import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
import { QRNavigationService } from "@/services/QRNavigationService";
import {
NOTIFY_NO_ACCOUNT_ERROR,
NOTIFY_PROJECT_LOAD_ERROR,
@@ -464,8 +465,10 @@ export default class ProjectsView extends Vue {
);
this.notify.error(NOTIFY_PROJECT_LOAD_ERROR.message, TIMEOUTS.LONG);
}
} catch (error: any) {
logger.error("Got error loading plans:", error.message || error);
} catch (error: unknown) {
const errorMessage =
error instanceof Error ? error.message : String(error);
logger.error("Got error loading plans:", errorMessage);
this.notify.error(NOTIFY_PROJECT_LOAD_ERROR.message, TIMEOUTS.LONG);
} finally {
this.isLoading = false;
@@ -578,8 +581,10 @@ export default class ProjectsView extends Vue {
);
this.notify.error(NOTIFY_OFFERS_LOAD_ERROR.message, TIMEOUTS.LONG);
}
} catch (error: any) {
logger.error("Got error loading offers:", error.message || error);
} catch (error: unknown) {
const errorMessage =
error instanceof Error ? error.message : String(error);
logger.error("Got error loading offers:", errorMessage);
this.notify.error(NOTIFY_OFFERS_FETCH_ERROR.message, TIMEOUTS.LONG);
} finally {
this.isLoading = false;
@@ -638,16 +643,18 @@ export default class ProjectsView extends Vue {
* - Alternative sharing methods for remote users
*/
promptForShareMethod() {
this.notify.confirm(
NOTIFY_CAMERA_SHARE_METHOD.title,
NOTIFY_CAMERA_SHARE_METHOD.text,
this.$notify(
{
group: "modal",
type: "confirm",
title: NOTIFY_CAMERA_SHARE_METHOD.title,
text: NOTIFY_CAMERA_SHARE_METHOD.text,
onYes: () => this.handleQRCodeClick(),
onNo: () => this.$router.push({ name: "share-my-contact-info" }),
yesText: NOTIFY_CAMERA_SHARE_METHOD.yesText,
noText: NOTIFY_CAMERA_SHARE_METHOD.noText,
timeout: TIMEOUTS.MODAL,
},
TIMEOUTS.MODAL,
);
}
@@ -755,11 +762,10 @@ export default class ProjectsView extends Vue {
* - Web-based QR interface for browser environments
*/
private handleQRCodeClick() {
if (Capacitor.isNativePlatform()) {
this.$router.push({ name: "contact-qr-scan-full" });
} else {
this.$router.push({ name: "contact-qr" });
}
const qrNavigationService = QRNavigationService.getInstance();
const route = qrNavigationService.getQRScannerRoute();
this.$router.push(route);
}
/**

7
src/views/SearchAreaView.vue
View File

@@ -310,10 +310,9 @@ export default class SearchAreaView extends Vue {
},
};
const searchBoxes = JSON.stringify([newSearchBox]);
// Store search box configuration using platform service
await this.$updateSettings({ searchBoxes: searchBoxes as any });
// searchBoxes will be automatically converted to JSON string by $updateSettings
await this.$updateSettings({ searchBoxes: [newSearchBox] });
this.searchBox = newSearchBox;
this.isChoosingSearchBox = false;
@@ -347,7 +346,7 @@ export default class SearchAreaView extends Vue {
try {
// Clear search box settings and disable nearby filtering
await this.$updateSettings({
searchBoxes: "[]" as any,
searchBoxes: [],
filterFeedByNearby: false,
});

6
src/views/ShareMyContactInfoView.vue
View File

@@ -75,15 +75,9 @@ export default class ShareMyContactInfoView extends Vue {
isLoading = false;
async mounted() {
// Debug logging for test diagnosis
const settings = await this.$settings();
const activeDid = settings?.activeDid;
// @ts-expect-error - Debug property for testing contact sharing functionality
window.__SHARE_CONTACT_DEBUG__ = { settings, activeDid };
// eslint-disable-next-line no-console
if (!activeDid) {
// eslint-disable-next-line no-console
this.$router.push({ name: "home" });
}
}

67
src/views/TestView.vue
View File

@@ -21,7 +21,17 @@
</h1>
</div>
<div>
<div v-if="isNotProdServer">
<h2 class="text-xl font-bold mb-4">User Registration</h2>
<button :class="primaryButtonClasses" @click="registerMe()">
Register Yourself
</button>
<button :class="primaryButtonClasses" @click="becomeUser0()">
Become User 0 (who can register others)
</button>
</div>
<div class="mt-8">
<h2 class="text-xl font-bold mb-4">Notiwind Alerts</h2>
<!-- Notification test buttons using computed configuration -->
@@ -99,7 +109,7 @@
<div>
Register Passkey
<button :class="primaryButtonClasses" @click="register()">
<button :class="primaryButtonClasses" @click="registerPasskey()">
Simplewebauthn
</button>
</div>
@@ -235,6 +245,7 @@ import {
registerAndSavePasskey,
SHARED_PHOTO_BASE64_KEY,
} from "../libs/util";
import { testBecomeUser0, testServerRegisterUser } from "@/test";
import { logger } from "../utils/logger";
import { Account } from "../db/tables/accounts";
import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
@@ -300,6 +311,7 @@ export default class Help extends Vue {
// for passkeys
credIdHex?: string;
activeDid?: string;
apiServer?: string;
jwt?: string;
peerSetup?: PeerSetup;
userName?: string;
@@ -521,17 +533,6 @@ export default class Help extends Vue {
];
}
/**
* Method to trigger notification test
* Centralizes notification testing logic
*/
triggerTestNotification(config: {
notification: NotificationIface;
timeout?: number;
}) {
this.$notify(config.notification, config.timeout);
}
/**
* Component initialization
*
@@ -541,6 +542,7 @@ export default class Help extends Vue {
async mounted() {
const settings = await this.$accountSettings();
this.activeDid = settings.activeDid || "";
this.apiServer = settings.apiServer || "";
this.userName = settings.firstName;
const account = await retrieveAccountMetadata(this.activeDid);
@@ -553,6 +555,43 @@ export default class Help extends Vue {
}
}
/**
* Checks if running on production server
*
* @returns True if not on production server (enables test utilities)
*/
public isNotProdServer() {
return this.apiServer !== AppString.PROD_ENDORSER_API_SERVER;
}
async registerMe() {
const response = await testServerRegisterUser();
if (response.status === 201) {
alert("Registration successful.");
this.$router.push({ name: "home" }); // because this page checks for registered status and sets things if it detects a change
} else {
logger.error("Registration failure response:", response);
alert("Registration failed: " + (response.data.error || response.data));
}
}
async becomeUser0() {
await testBecomeUser0();
alert("You are now User 0.");
this.$router.push({ name: "home" }); // because this page checks for registered status and sets things if it detects a change
}
/**
* Method to trigger notification test
* Centralizes notification testing logic
*/
triggerTestNotification(config: {
notification: NotificationIface;
timeout?: number;
}) {
this.$notify(config.notification, config.timeout);
}
/**
* Handles file upload for image sharing tests
*
@@ -609,7 +648,7 @@ export default class Help extends Vue {
* Includes validation and user confirmation workflow
* Uses notification helpers for consistent messaging
*/
public async register() {
public async registerPasskey() {
const DEFAULT_USERNAME = AppString.APP_NAME + " Tester";
if (!this.userName) {
const modalConfig = createPasskeyNameModal(