fix: improve image handling and icon support

- Fix image load event handler signature
- Add alt text for accessibility
- Add building icon to FontAwesome library

Technical Changes:
- Update cacheImage event to pass only image URL
- Add proper alt text for activity images
- Add faBuilding icon to FontAwesome library

This improves image handling and accessibility while adding
needed icon support for the activity feed interface.

src/components/ActivityListItem.vue

@@ -43,7 +43,8 @@
           <img
             class="w-full h-auto max-w-lg max-h-96 object-contain mx-auto drop-shadow-md"
             :src="record.image"
-            @load="$emit('cacheImage', $event, record.image)"
+            @load="$emit('cacheImage', record.image)"
+            alt="Activity image"
           />
         </a>
       </div>
@@ -59,35 +60,41 @@
               <EntityIcon
                 :profile-image-url="record.giver.profileImageUrl"
                 :class="[
-                  record.giver.known
+                  !record.providerPlanName
                     ? 'rounded-full size-12 sm:size-24 object-cover'
                     : 'rounded size-12 sm:size-24 object-cover'
                 ]"
               />
             </template>
             <template v-else>
+              <!-- Project Icon -->
+              <template v-if="record.providerPlanName">
+                <ProjectIcon
+                  :entityId="record.providerPlanName"
+                  :iconSize="96"
+                  class="rounded size-12 sm:size-24"
+                />
+              </template>
               <!-- Identicon for DIDs -->
+              <template v-else-if="record.giver.did">
                 <img
-                v-if="record.giver.did"
                   :src="`https://a.fsdn.com/con/app/proj/identicons/screenshots/225506.jpg`"
-                :class="[
+                  class="rounded-full size-12 sm:size-24"
-                  record.giver.known
-                    ? 'rounded-full size-12 sm:size-24'
-                    : 'rounded size-12 sm:size-24'
-                ]"
                   alt="Identicon"
                 />
-              <!-- Fallback icon for projects -->
+              </template>
+              <!-- Unknown Person -->
+              <template v-else>
                 <fa
-                v-else
                   icon="person-circle-question"
                   class="text-slate-300 text-5xl sm:text-8xl"
                 />
               </template>
+            </template>
           </div>
           <div class="text-xs mt-2 line-clamp-2">
             <fa
-              :icon="record.giver.known ? 'user' : 'hammer'"
+              :icon="record.providerPlanName ? 'building' : 'user'"
               class="fa-fw text-slate-400"
             />
             {{ record.giver.displayName }}
@@ -114,35 +121,41 @@
               <EntityIcon
                 :profile-image-url="record.receiver.profileImageUrl"
                 :class="[
-                  record.receiver.known
+                  !record.recipientProjectName
                     ? 'rounded-full size-12 sm:size-24 object-cover'
                     : 'rounded size-12 sm:size-24 object-cover'
                 ]"
               />
             </template>
             <template v-else>
+              <!-- Project Icon -->
+              <template v-if="record.recipientProjectName">
+                <ProjectIcon
+                  :entityId="record.recipientProjectName"
+                  :iconSize="96"
+                  class="rounded size-12 sm:size-24"
+                />
+              </template>
               <!-- Identicon for DIDs -->
+              <template v-else-if="record.receiver.did">
                 <img
-                v-if="record.receiver.did"
                   :src="`https://a.fsdn.com/con/app/proj/identicons/screenshots/225506.jpg`"
-                :class="[
+                  class="rounded-full size-12 sm:size-24"
-                  record.receiver.known
-                    ? 'rounded-full size-12 sm:size-24'
-                    : 'rounded size-12 sm:size-24'
-                ]"
                   alt="Identicon"
                 />
-              <!-- Fallback icon for projects -->
+              </template>
+              <!-- Unknown Person -->
+              <template v-else>
                 <fa
-                v-else
+                  icon="person-circle-question"
-                icon="image"
                   class="text-slate-300 text-5xl sm:text-8xl"
                 />
               </template>
+            </template>
           </div>
           <div class="text-xs mt-2 line-clamp-2">
             <fa
-              :icon="record.receiver.known ? 'user' : 'hammer'"
+              :icon="record.recipientProjectName ? 'building' : 'user'"
               class="fa-fw text-slate-400"
             />
             {{ record.receiver.displayName }}
@@ -187,10 +200,12 @@ import { GiveRecordWithContactInfo } from "../types";
 import EntityIcon from "./EntityIcon.vue";
 import { isGiveClaimType, notifyWhyCannotConfirm } from "../libs/util";
 import { containsHiddenDid } from "../libs/endorserServer";
+import ProjectIcon from "./ProjectIcon.vue";
 
 @Component({
   components: {
     EntityIcon,
+    ProjectIcon,
   },
 })
 export default class ActivityListItem extends Vue {

src/main.ts

@@ -88,6 +88,7 @@ import {
   faUser,
   faUsers,
   faXmark,
+  faBuilding,
 } from "@fortawesome/free-solid-svg-icons";
 
 library.add(
@@ -168,6 +169,7 @@ library.add(
   faUser,
   faUsers,
   faXmark,
+  faBuilding,
 );
 
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";