diff --git a/src/components/EntitySummaryButton.vue b/src/components/EntitySummaryButton.vue index 50f25078..96dae340 100644 --- a/src/components/EntitySummaryButton.vue +++ b/src/components/EntitySummaryButton.vue @@ -42,8 +42,8 @@ computed CSS properties * * @author Matthew Raymer */

{{ label }}

-

- {{ entity?.name || "Unnamed" }} +

+ {{ displayName }}

@@ -138,6 +138,38 @@ export default class EntitySummaryButton extends Vue { return this.editable ? "text-blue-500" : "text-slate-400"; } + /** + * Computed CSS classes for the entity name + */ + get nameClasses(): string { + const baseClasses = "font-semibold truncate"; + + // Add italic styling for special "Unnamed" or entities without set names + if (!this.entity?.name || this.entity?.did === "") { + return `${baseClasses} italic text-slate-500`; + } + + return baseClasses; + } + + /** + * Computed display name for the entity + */ + get displayName(): string { + // If the entity has a set name, use that name + if (this.entity?.name) { + return this.entity.name; + } + + // If the entity is the special "Unnamed", use "Unnamed" + if (this.entity?.did === "") { + return "Unnamed"; + } + + // If the entity does not have a set name, but is not the special "Unnamed", use their DID + return this.entity?.did; + } + /** * Handle click event - only call function prop if editable * Allows parent to control edit behavior and validation diff --git a/src/components/GiftedDialog.vue b/src/components/GiftedDialog.vue index a2ee61df..6979db74 100644 --- a/src/components/GiftedDialog.vue +++ b/src/components/GiftedDialog.vue @@ -226,14 +226,7 @@ export default class GiftedDialog extends Vue { this.allMyDids = await retrieveAccountDids(); - if (this.giver && !this.giver.name) { - this.giver.name = didInfo( - this.giver.did, - this.activeDid, - this.allMyDids, - this.allContacts, - ); - } + if ( this.giverEntityType === "project" || @@ -457,7 +450,7 @@ export default class GiftedDialog extends Vue { if (contact) { this.giver = { did: contact.did, - name: contact.name || contact.did, + name: contact.name, }; } else { // Only set to "Unnamed" if no giver is currently set @@ -519,7 +512,7 @@ export default class GiftedDialog extends Vue { if (contact) { this.receiver = { did: contact.did, - name: contact.name || contact.did, + name: contact.name, }; } else { // Only set to "Unnamed" if no receiver is currently set diff --git a/src/components/PersonCard.vue b/src/components/PersonCard.vue index 1f3bf595..2c6f439a 100644 --- a/src/components/PersonCard.vue +++ b/src/components/PersonCard.vue @@ -25,7 +25,7 @@ conflict detection. * * @author Matthew Raymer */

- {{ person.name || person.did || "Unnamed" }} + {{ displayName }}

@@ -98,9 +98,27 @@ export default class PersonCard extends Vue { return `${baseClasses} text-slate-400`; } + // Add italic styling for entities without set names + if (!this.person.name) { + return `${baseClasses} italic text-slate-500`; + } + return baseClasses; } + /** + * Computed display name for the person + */ + get displayName(): string { + // If the entity has a set name, use that name + if (this.person.name) { + return this.person.name; + } + + // If the entity does not have a set name + return this.person.did; + } + /** * Handle card click - emit if selectable and not conflicted, show warning if conflicted */ @@ -114,7 +132,7 @@ export default class PersonCard extends Vue { group: "alert", type: "warning", title: "Cannot Select", - text: `You cannot select "${this.person.name || this.person.did || "Unnamed"}" because they are already selected as the ${this.conflictContext}.`, + text: `You cannot select "${this.displayName}" because they are already selected as the ${this.conflictContext}.`, }, 3000, ); diff --git a/src/views/ContactGiftingView.vue b/src/views/ContactGiftingView.vue index 9ebee31a..2534f551 100644 --- a/src/views/ContactGiftingView.vue +++ b/src/views/ContactGiftingView.vue @@ -21,8 +21,8 @@
  • - - You + + You