,
@@ -101,25 +123,20 @@ export default defineComponent({
},
},
setup(props) {
- const { sendCustomEvent } = useAnalytics()
-
const isSmall = computed(() => props.size === "s")
- const sendGetMediaEvent = () => {
- sendCustomEvent("GET_MEDIA", {
- id: props.audio.id,
- provider: props.audio.provider,
- mediaType: AUDIO,
- })
- }
+ const featureFlagStore = useFeatureFlagStore()
+
+ const additionalSearchViews = computed(() => {
+ return featureFlagStore.isOn("additional_search_views")
+ })
return {
timeFmt,
isSmall,
audioFeatures,
-
- sendGetMediaEvent,
+ additionalSearchViews,
}
},
})
diff --git a/frontend/src/components/VMediaInfo/VGetMediaButton.vue b/frontend/src/components/VMediaInfo/VGetMediaButton.vue
new file mode 100644
index 00000000000..d503e6d6544
--- /dev/null
+++ b/frontend/src/components/VMediaInfo/VGetMediaButton.vue
@@ -0,0 +1,54 @@
+
+
+ {{ $t(`${mediaType}Details.weblink`) }}
+
+
+
diff --git a/frontend/src/pages/audio/_id/index.vue b/frontend/src/pages/audio/_id/index.vue
index 8091a2b9dfc..e117a3f8a85 100644
--- a/frontend/src/pages/audio/_id/index.vue
+++ b/frontend/src/pages/audio/_id/index.vue
@@ -65,10 +65,12 @@ import VMediaDetails from "~/components/VMediaInfo/VMediaDetails.vue"
import VSafetyWall from "~/components/VSafetyWall/VSafetyWall.vue"
import VSingleResultControls from "~/components/VSingleResultControls.vue"
import VAudioThumbnail from "~/components/VAudioThumbnail/VAudioThumbnail.vue"
+import VErrorSection from "~/components/VErrorSection/VErrorSection.vue"
export default defineComponent({
name: "AudioDetailPage",
components: {
+ VErrorSection,
VAudioThumbnail,
VSingleResultControls,
VSafetyWall,
diff --git a/frontend/src/pages/image/_id/index.vue b/frontend/src/pages/image/_id/index.vue
index 2fd1ec93394..a37ee200824 100644
--- a/frontend/src/pages/image/_id/index.vue
+++ b/frontend/src/pages/image/_id/index.vue
@@ -45,20 +45,11 @@
id="title-button"
class="flex flex-row flex-wrap justify-between gap-x-6 md:mt-6 md:flex-row-reverse"
>
-
- {{ $t("imageDetails.weblink") }}
-
+
{{ image.title }}
@@ -124,7 +115,6 @@ import { useSingleResultStore } from "~/stores/media/single-result"
import { singleResultMiddleware } from "~/middleware/single-result"
import VBone from "~/components/VSkeleton/VBone.vue"
-import VButton from "~/components/VButton.vue"
import VLink from "~/components/VLink.vue"
import VMediaReuse from "~/components/VMediaInfo/VMediaReuse.vue"
import VRelatedImages from "~/components/VImageDetails/VRelatedImages.vue"
@@ -132,17 +122,18 @@ import VSketchFabViewer from "~/components/VSketchFabViewer.vue"
import VSafetyWall from "~/components/VSafetyWall/VSafetyWall.vue"
import VSingleResultControls from "~/components/VSingleResultControls.vue"
import VMediaDetails from "~/components/VMediaInfo/VMediaDetails.vue"
+import VGetMediaButton from "~/components/VMediaInfo/VGetMediaButton.vue"
import errorImage from "~/assets/image_not_available_placeholder.png"
export default defineComponent({
name: "VImageDetailsPage",
components: {
+ VGetMediaButton,
VMediaDetails,
VSingleResultControls,
VSafetyWall,
VBone,
- VButton,
VLink,
VMediaReuse,
VRelatedImages,
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts
index 6c71bacaaaa..9b01828e545 100644
--- a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts
+++ b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts
@@ -7,45 +7,53 @@ import {
openFirstResult,
pathWithDir,
preparePageForTests,
+ setCookies,
} from "~~/test/playwright/utils/navigation"
import { supportedMediaTypes } from "~/constants/media"
test.describe.configure({ mode: "parallel" })
-for (const mediaType of supportedMediaTypes) {
- for (const dir of languageDirections) {
- breakpoints.describeEvery(({ breakpoint, expectSnapshot }) => {
- test(`${mediaType} ${dir} single-result page snapshots from search results`, async ({
- page,
- }) => {
- await preparePageForTests(page, breakpoint)
- await page.route("**", (route) => {
- const url = route.request().url()
- // For audio, use the generated image instead of requesting the
- // thumbnail.
- if (
- url.endsWith(".jpg") ||
- (url.endsWith("/thumb/") && url.includes("/audio/"))
- ) {
- route.abort()
- } else {
- route.continue()
- }
- })
+for (const isOn of [true, false]) {
+ for (const mediaType of supportedMediaTypes) {
+ for (const dir of languageDirections) {
+ breakpoints.describeEvery(({ breakpoint, expectSnapshot }) => {
+ test(`${mediaType} ${dir} single-result page snapshots from search results, additional search views: ${isOn}`, async ({
+ page,
+ }) => {
+ await setCookies(page.context(), {
+ features: { additional_search_views: isOn ? "on" : "off" },
+ })
+ await preparePageForTests(page, breakpoint)
+ await page.route("**", (route) => {
+ const url = route.request().url()
+ // For audio, use the generated image instead of requesting the
+ // thumbnail.
+ if (
+ url.endsWith(".jpg") ||
+ (url.endsWith("/thumb/") && url.includes("/audio/"))
+ ) {
+ route.abort()
+ } else {
+ route.continue()
+ }
+ })
- await goToSearchTerm(page, "birds", { dir, mode: "SSR" })
+ await goToSearchTerm(page, "birds", { dir, mode: "SSR" })
- // This will include the "Back to results" link.
- await openFirstResult(page, mediaType)
- await expectSnapshot(
- `${mediaType}-${dir}-from-search-results`,
- page,
- { fullPage: true },
- { maxDiffPixelRatio: 0.01 }
- )
+ // This will include the "Back to results" link.
+ await openFirstResult(page, mediaType)
+ await expectSnapshot(
+ `${mediaType}-${dir}-from-search-results${
+ isOn ? "-with-additional-search-views" : ""
+ }`,
+ page,
+ { fullPage: true },
+ { maxDiffPixelRatio: 0.01 }
+ )
+ })
})
- })
+ }
}
}
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-2xl-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-2xl-linux.png
new file mode 100644
index 00000000000..3480746bf29
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-2xl-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-lg-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-lg-linux.png
new file mode 100644
index 00000000000..64372ca28a5
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-lg-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-md-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-md-linux.png
new file mode 100644
index 00000000000..4ff9a56889c
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-md-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-sm-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-sm-linux.png
new file mode 100644
index 00000000000..28fc41d8147
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-sm-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-xl-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-xl-linux.png
new file mode 100644
index 00000000000..dcd66a8956f
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-xl-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-xs-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-xs-linux.png
new file mode 100644
index 00000000000..00ab4a4ceb3
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-ltr-from-search-results-with-additional-search-views-xs-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-2xl-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-2xl-linux.png
new file mode 100644
index 00000000000..6da9234df46
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-2xl-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-lg-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-lg-linux.png
new file mode 100644
index 00000000000..9bda0cc7736
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-lg-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-md-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-md-linux.png
new file mode 100644
index 00000000000..04e7241e6e1
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-md-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-sm-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-sm-linux.png
new file mode 100644
index 00000000000..1ceb14bde43
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-sm-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-xl-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-xl-linux.png
new file mode 100644
index 00000000000..6b59deb4340
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-xl-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-xs-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-xs-linux.png
new file mode 100644
index 00000000000..97b29779da8
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/audio-rtl-from-search-results-with-additional-search-views-xs-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-2xl-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-2xl-linux.png
new file mode 100644
index 00000000000..f972137c6df
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-2xl-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-lg-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-lg-linux.png
new file mode 100644
index 00000000000..99fb443f0ae
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-lg-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-md-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-md-linux.png
new file mode 100644
index 00000000000..5626548c438
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-md-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-sm-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-sm-linux.png
new file mode 100644
index 00000000000..427fbf93ae8
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-sm-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-xl-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-xl-linux.png
new file mode 100644
index 00000000000..b0814bc2ed2
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-xl-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-xs-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-xs-linux.png
new file mode 100644
index 00000000000..85f88537772
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-ltr-from-search-results-with-additional-search-views-xs-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-2xl-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-2xl-linux.png
new file mode 100644
index 00000000000..e6476946617
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-2xl-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-lg-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-lg-linux.png
new file mode 100644
index 00000000000..3ac0480fde5
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-lg-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-md-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-md-linux.png
new file mode 100644
index 00000000000..f19bf1598d4
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-md-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-sm-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-sm-linux.png
new file mode 100644
index 00000000000..3586ff43fd9
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-sm-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-xl-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-xl-linux.png
new file mode 100644
index 00000000000..ebbe90f2545
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-xl-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-xs-linux.png b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-xs-linux.png
new file mode 100644
index 00000000000..cb49a01f594
Binary files /dev/null and b/frontend/test/playwright/visual-regression/pages/pages-single-result.spec.ts-snapshots/image-rtl-from-search-results-with-additional-search-views-xs-linux.png differ
diff --git a/frontend/test/playwright/visual-regression/pages/pages.spec.ts b/frontend/test/playwright/visual-regression/pages/pages.spec.ts
index 7646121ea7a..9b1393e71cc 100644
--- a/frontend/test/playwright/visual-regression/pages/pages.spec.ts
+++ b/frontend/test/playwright/visual-regression/pages/pages.spec.ts
@@ -59,8 +59,8 @@ test.describe("Layout color is set correctly", () => {
await page.getByPlaceholder("البحث عن محتوى").fill("cat")
await page.getByRole("button", { name: "يبحث" }).click()
- await page.waitForURL(/ar\/search/)
await expect(page.getByRole("heading", { name: "Cat" })).toBeVisible()
+ await page.waitForURL(/ar\/search/)
expect(await page.screenshot()).toMatchSnapshot("search-page-rtl-lg.png")
})