forked from jsnbuchanan/crowd-funder-for-time-pwa
Refactor ActivityListItem to use function props for image caching
Replace @Emit decorator with function prop pattern for better parent control over image caching behavior. ActivityListItem now accepts onImageCache function prop that parent components can use to handle image caching with custom logic. Updated HomeView to use new function prop interface with simplified method signature.
This commit is contained in:
@@ -73,7 +73,7 @@
|
||||
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="cacheImage(record.image)"
|
||||
@load="handleImageLoad(record.image)"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
@@ -248,7 +248,7 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { Component, Prop, Vue, Emit } from "vue-facing-decorator";
|
||||
import { Component, Prop, Vue } from "vue-facing-decorator";
|
||||
import { GiveRecordWithContactInfo } from "@/interfaces/give";
|
||||
import EntityIcon from "./EntityIcon.vue";
|
||||
import { isGiveClaimType, notifyWhyCannotConfirm } from "../libs/util";
|
||||
@@ -274,6 +274,13 @@ export default class ActivityListItem extends Vue {
|
||||
@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;
|
||||
@@ -290,9 +297,12 @@ export default class ActivityListItem extends Vue {
|
||||
this.notify.warning(NOTIFY_UNKNOWN_PERSON.message, TIMEOUTS.STANDARD);
|
||||
}
|
||||
|
||||
@Emit()
|
||||
cacheImage(image: string) {
|
||||
return image;
|
||||
/**
|
||||
* 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 {
|
||||
|
||||
Reference in New Issue
Block a user