performance-optimizations-testing #159
@@ -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>
|
||||
@@ -272,13 +271,6 @@ export default class ActivityListItem extends Vue {
|
||||
@Prop() isRegistered!: boolean;
|
||||
@Prop() activeDid!: 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;
|
||||
@@ -295,14 +287,6 @@ 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;
|
||||
|
||||
@@ -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();
|
||||
|
||||
@@ -53,6 +53,7 @@ import {
|
||||
DeepLinkRoute,
|
||||
} 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(
|
||||
@@ -204,9 +205,8 @@ export class DeepLinkHandler {
|
||||
validatedParams = await schema.parseAsync(params);
|
||||
} catch (error) {
|
||||
// For parameter validation errors, provide specific error feedback
|
||||
logConsoleAndDb(
|
||||
logger.error(
|
||||
`[DeepLink] Invalid parameters for route name ${routeName} for path: ${path}: ${JSON.stringify(error)} ... with params: ${JSON.stringify(params)} ... and query: ${JSON.stringify(query)}`,
|
||||
true,
|
||||
);
|
||||
await this.router.replace({
|
||||
name: "deep-link-error",
|
||||
@@ -229,9 +229,8 @@ export class DeepLinkHandler {
|
||||
params: validatedParams,
|
||||
});
|
||||
} catch (error) {
|
||||
logConsoleAndDb(
|
||||
logger.error(
|
||||
`[DeepLink] Error routing to route name ${routeName} for path: ${path}: ${JSON.stringify(error)} ... with validated params: ${JSON.stringify(validatedParams)}`,
|
||||
true,
|
||||
);
|
||||
// For parameter validation errors, provide specific error feedback
|
||||
await this.router.replace({
|
||||
@@ -263,9 +262,8 @@ export class DeepLinkHandler {
|
||||
await this.validateAndRoute(path, sanitizedParams, query);
|
||||
} catch (error) {
|
||||
const deepLinkError = error as DeepLinkError;
|
||||
logConsoleAndDb(
|
||||
logger.error(
|
||||
`[DeepLink] Error (${deepLinkError.code}): ${deepLinkError.details}`,
|
||||
true,
|
||||
);
|
||||
|
||||
throw {
|
||||
|
||||
@@ -234,7 +234,6 @@ Raymer * @version 1.0.0 */
|
||||
:last-viewed-claim-id="feedLastViewedClaimId"
|
||||
:is-registered="isRegistered"
|
||||
:active-did="activeDid"
|
||||
:on-image-cache="cacheImageData"
|
||||
@load-claim="onClickLoadClaim"
|
||||
@view-image="openImageViewer"
|
||||
/>
|
||||
@@ -255,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">
|
||||
@@ -434,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;
|
||||
|
||||
/**
|
||||
@@ -1614,23 +1607,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
|
||||
*
|
||||
@@ -1639,7 +1615,6 @@ 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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user