Browse Source

add code to display profiles in feed, but deactivate it for now

kb/add-usage-guide
Trent Larson 7 months ago
parent
commit
676882978a
  1. 5
      src/components/EntityIcon.vue
  2. 14
      src/libs/endorserServer.ts
  3. 2
      src/main.ts
  4. 2
      src/views/AccountViewView.vue
  5. 2
      src/views/ContactGiftingView.vue
  6. 37
      src/views/HomeView.vue
  7. 2
      src/views/ProjectViewView.vue

5
src/components/EntityIcon.vue

@ -17,9 +17,12 @@ export default class EntityIcon extends Vue {
generateIcon() { generateIcon() {
const imageUrl = this.contact?.profileImageUrl || this.profileImageUrl; const imageUrl = this.contact?.profileImageUrl || this.profileImageUrl;
if (imageUrl) { if (imageUrl) {
return `<img src="${imageUrl}" alt="avatar" width="${this.iconSize}" height="${this.iconSize}" />`; return `<img src="${imageUrl}" class="rounded" width="${this.iconSize}" height="${this.iconSize}" />`;
} else { } else {
const identifier = this.contact?.did || this.entityId; const identifier = this.contact?.did || this.entityId;
if (!identifier) {
return `<img src="../src/assets/blank-square.svg" class="rounded" width="${this.iconSize}" height="${this.iconSize}" />`;
}
const options: StyleOptions<object> = { const options: StyleOptions<object> = {
seed: (identifier as string) || "", seed: (identifier as string) || "",
size: this.iconSize, size: this.iconSize,

14
src/libs/endorserServer.ts

@ -394,7 +394,8 @@ export function contactForDid(
* @param activeDid * @param activeDid
* @param contact * @param contact
* @param allMyDids * @param allMyDids
* @return { known: boolean, displayName: string } where known is true if the display name is some easily-recogizable name, false if it's a generic name like "Someone Anonymous" * @return { known: boolean, displayName: string, profileImageUrl?: string }
* where 'known' is true if the display name is some easily-recogizable name, false if it's a generic name like "Someone Unnamed"
*/ */
export function didInfoForContact( export function didInfoForContact(
did: string | undefined, did: string | undefined,
@ -402,15 +403,16 @@ export function didInfoForContact(
contact?: Contact, contact?: Contact,
allMyDids: string[] = [], allMyDids: string[] = [],
// eslint-disable-next-line @typescript-eslint/no-explicit-any // eslint-disable-next-line @typescript-eslint/no-explicit-any
): { known: boolean; displayName: string } { ): { known: boolean; displayName: string; profileImageUrl?: string } {
if (!did) return { displayName: "Someone Anonymous", known: false }; if (!did) return { displayName: "Someone Unnamed/Unknown", known: false };
if (contact) { if (did === activeDid) {
return { displayName: "You", known: true };
} else if (contact) {
return { return {
displayName: contact.name || "Contact With No Name", displayName: contact.name || "Contact With No Name",
known: !!contact.name, known: !!contact.name,
profileImageUrl: contact.profileImageUrl,
}; };
} else if (did === activeDid) {
return { displayName: "You", known: true };
} else { } else {
const myId = R.find(R.equals(did), allMyDids); const myId = R.find(R.equals(did), allMyDids);
return myId return myId

2
src/main.ts

@ -34,6 +34,7 @@ import {
faComment, faComment,
faCopy, faCopy,
faDollar, faDollar,
faEllipsis,
faEllipsisVertical, faEllipsisVertical,
faEye, faEye,
faEyeSlash, faEyeSlash,
@ -97,6 +98,7 @@ library.add(
faComment, faComment,
faCopy, faCopy,
faDollar, faDollar,
faEllipsis,
faEllipsisVertical, faEllipsisVertical,
faEye, faEye,
faEyeSlash, faEyeSlash,

2
src/views/AccountViewView.vue

@ -104,7 +104,7 @@
</div> </div>
<div class="mt-4"> <div class="mt-4">
<div class="flex justify-center"> <div class="flex justify-center">
... and those without your image see this: ... and those without your image see this (if you let them see your activity):
</div> </div>
<div class="flex justify-center"> <div class="flex justify-center">
<EntityIcon <EntityIcon

2
src/views/ContactGiftingView.vue

@ -26,7 +26,7 @@
width="32" width="32"
class="inline-block align-middle border border-slate-300 rounded-md mr-1" class="inline-block align-middle border border-slate-300 rounded-md mr-1"
/> />
Anonymous/Unnamed Unnamed/Unknown
</span> </span>
<span class="text-right"> <span class="text-right">
<button <button

37
src/views/HomeView.vue

@ -129,7 +129,7 @@
<h3 <h3
class="text-xs italic font-medium text-ellipsis whitespace-nowrap overflow-hidden" class="text-xs italic font-medium text-ellipsis whitespace-nowrap overflow-hidden"
> >
Anonymous/Unnamed Unnamed/Unknown
</h3> </h3>
</li> </li>
<li <li
@ -223,6 +223,39 @@
</span> </span>
</span> </span>
<span class="col-span-10 justify-self-stretch"> <span class="col-span-10 justify-self-stretch">
<!-- show giver and/or receiver profiles... which seemed like a good idea but actually adds clutter
<span
v-if="
record.giver.profileImageUrl ||
record.receiver.profileImageUrl
"
>
<EntityIcon
v-if="record.agentDid !== activeDid"
:icon-size="32"
:profile-image-url="record.giver.profileImageUrl"
class="inline-block align-middle border border-slate-300 rounded-md mr-1"
/>
<fa
v-if="
record.agentDid !== activeDid &&
record.recipientDid !== activeDid &&
!record.fulfillsPlanHandleId
"
icon="ellipsis"
class="text-slate"
/>
<EntityIcon
v-if="
record.recipientDid !== activeDid &&
!record.fulfillsPlanHandleId
"
:iconSize="32"
:profile-image-url="record.receiver.profileImageUrl"
class="inline-block align-middle border border-slate-300 rounded-md ml-1"
/>
</span>
-->
<span class="pl-2"> <span class="pl-2">
{{ giveDescription(record) }} {{ giveDescription(record) }}
</span> </span>
@ -304,12 +337,14 @@ interface GiveRecordWithContactInfo extends GiveSummaryRecord {
giver: { giver: {
displayName: string; displayName: string;
known: boolean; known: boolean;
profileImageUrl?: string;
}; };
image?: string; image?: string;
recipientProjectName?: string; recipientProjectName?: string;
receiver: { receiver: {
displayName: string; displayName: string;
known: boolean; known: boolean;
profileImageUrl?: string;
}; };
} }

2
src/views/ProjectViewView.vue

@ -153,7 +153,7 @@
<h3 <h3
class="text-xs italic font-medium text-ellipsis whitespace-nowrap overflow-hidden" class="text-xs italic font-medium text-ellipsis whitespace-nowrap overflow-hidden"
> >
Anonymous/Unnamed Unnamed/Unknown
</h3> </h3>
</li> </li>
<li <li

Loading…
Cancel
Save