diff --git a/Seasoned.Frontend/app/pages/recipe/[id].vue b/Seasoned.Frontend/app/pages/recipe/[id].vue index f41e54c..286439d 100644 --- a/Seasoned.Frontend/app/pages/recipe/[id].vue +++ b/Seasoned.Frontend/app/pages/recipe/[id].vue @@ -22,9 +22,11 @@ const route = useRoute(); const config = useRuntimeConfig(); const imageUrl = normalizedRecipe.value.imageUrl; -const absoluteOgImage = imageUrl?.startsWith('http') - ? imageUrl - : `${config.public.apiBase}${imageUrl || '/images/seasoned-logo.png'}`; +const absoluteImageUrl = computed(() => { + const img = normalizedRecipe.value?.imageUrl; + if (!img) return `${config.public.apiBase}/images/seasoned-logo.png`; + return img.startsWith('http') ? img : `${config.public.apiBase}${img}`; +}); const { data: rawRecipe, error } = await useAsyncData(`recipe-${route.params.id}`, () => { const baseUrl = config.public.apiBase.endsWith('/') @@ -55,7 +57,7 @@ useSeoMeta({ title: `${normalizedRecipe.value.title} | Seasoned`, ogTitle: `Chef's Choice: ${normalizedRecipe.value.title}`, description: `Check out this delicious recipe for ${normalizedRecipe.value.title} on Seasoned.`, - ogImage: absoluteOgImage, + ogImage: absoluteImageUrl.value, twitterCard: 'summary_large_image', ogType: 'article', })