Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove the additional search views flag #4222

Merged
merged 1 commit into from
Apr 30, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 0 additions & 5 deletions frontend/feat/feature-flags.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,11 +9,6 @@
"defaultState": "off",
"storage": "cookie"
},
"additional_search_views": {
"status": "enabled",
"description": "Toggle additional search views for tag/creator/source.",
"storage": "cookie"
},
"additional_search_types": {
"status": {
"staging": "switchable",
Expand Down
67 changes: 3 additions & 64 deletions frontend/src/components/VAudioTrack/layouts/VFullLayout.vue
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,6 @@
</div>
</div>
<div
v-if="additionalSearchViews"
class="mx-auto grid grid-cols-1 grid-rows-[auto,1fr] gap-y-6 p-6 pb-0 sm:grid-cols-[1fr,auto] sm:grid-rows-1 sm:gap-x-6 lg:mb-6 lg:max-w-5xl"
>
<div
Expand All @@ -31,60 +30,21 @@
</div>
<VMediaInfo :media="audio" class="min-w-0" />
</div>
<div
v-else
class="mx-auto grid grid-cols-1 grid-rows-[auto,auto] gap-6 p-6 pb-0 lg:mb-6 lg:max-w-5xl lg:flex-nowrap"
>
<div class="row-start-1 flex justify-between gap-x-6 sm:col-start-2">
<slot name="audio-control" layout="full" size="medium" />
<VGetMediaButton
:media="audio"
media-type="audio"
class="col-start-2 !w-full px-0 sm:!w-auto sm:flex-shrink-0"
/>
</div>

<div
class="audio-info row-start-2 flex w-full flex-col justify-center sm:col-start-1 sm:row-start-1 lg:w-auto"
>
<h1 class="heading-6 lg:line-clamp-2">{{ audio.title }}</h1>
<div
class="subtitle mt-1 flex flex-col gap-2 text-base leading-snug lg:flex-row lg:items-center"
>
<i18n as="span" path="audioTrack.creator" class="font-semibold">
<template #creator>
<VLink
class="rounded-sm p-px focus-visible:outline-none focus-visible:ring focus-visible:ring-pink"
:href="audio.creator_url"
:send-external-link-click-event="false"
>
{{ audio.creator }}
</VLink>
</template>
</i18n>
</div>
</div>
</div>
</div>
</template>

<script lang="ts">
import { computed, defineComponent, PropType } from "vue"
import { defineComponent, PropType } from "vue"

import type { AudioDetail } from "~/types/media"
import { timeFmt } from "~/utils/time-fmt"
import { audioFeatures, AudioSize, AudioStatus } from "~/constants/audio"

import { useFeatureFlagStore } from "~/stores/feature-flag"
import { useProviderStore } from "~/stores/provider"

import VLink from "~/components/VLink.vue"
import VGetMediaButton from "~/components/VMediaInfo/VGetMediaButton.vue"
import VMediaInfo from "~/components/VMediaInfo/VMediaInfo.vue"

export default defineComponent({
name: "VFullLayout",
components: { VMediaInfo, VGetMediaButton, VLink },
components: { VMediaInfo, VGetMediaButton },
props: {
audio: {
type: Object as PropType<AudioDetail>,
Expand All @@ -101,30 +61,9 @@ export default defineComponent({
required: true,
},
},
setup(props) {
const isSmall = computed(() => props.size === "s")

const featureFlagStore = useFeatureFlagStore()
const additionalSearchViews = computed(() =>
featureFlagStore.isOn("additional_search_views")
)

const providerStore = useProviderStore()
const sourceName = computed(() => {
return providerStore.getProviderName(
props.audio.source ?? props.audio.provider,
"audio"
)
})

setup() {
return {
timeFmt,

isSmall,
audioFeatures,
sourceName,

additionalSearchViews,
}
},
})
Expand Down
22 changes: 2 additions & 20 deletions frontend/src/components/VMediaInfo/VMediaTags.vue
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<template>
<div v-if="normalizedTags.length && additionalSearchViews" class="-my-1.5px">
<div v-if="normalizedTags.length" class="-my-1.5px">
<ul
ref="tagsContainerRef"
:aria-label="$t('mediaDetails.tags.title').toString()"
Expand Down Expand Up @@ -30,16 +30,6 @@
:class="{ '-scale-y-100 transform': buttonStatus === 'hide' }"
/></VButton>
</div>

<ul
v-else
class="flex flex-wrap gap-2"
:aria-label="$t('mediaDetails.tags').toString()"
>
<VMediaTag v-for="(tag, index) in normalizedTags" :key="index" tag="li">{{
tag
}}</VMediaTag>
</ul>
</template>
<script lang="ts">
import {
Expand All @@ -56,13 +46,11 @@ import { useResizeObserver, watchDebounced } from "@vueuse/core"

import type { Tag } from "~/types/media"
import type { SupportedMediaType } from "~/constants/media"
import { useFeatureFlagStore } from "~/stores/feature-flag"
import { useSearchStore } from "~/stores/search"
import { useI18n } from "~/composables/use-i18n"

import { focusElement } from "~/utils/focus-management"

import VMediaTag from "~/components/VMediaTag/VMediaTag.vue"
import VTag from "~/components/VTag/VTag.vue"
import VButton from "~/components/VButton.vue"
import VIcon from "~/components/VIcon/VIcon.vue"
Expand All @@ -72,7 +60,7 @@ const ROWS_TO_DISPLAY = 3

export default defineComponent({
name: "VMediaTags",
components: { VIcon, VButton, VMediaTag, VTag },
components: { VIcon, VButton, VTag },
props: {
tags: {
type: Array as PropType<Tag[]>,
Expand All @@ -87,14 +75,9 @@ export default defineComponent({
const tagsContainerRef = ref<HTMLElement>()

const searchStore = useSearchStore()
const featureFlagStore = useFeatureFlagStore()
const { $sendCustomEvent } = useContext()
const i18n = useI18n()

const additionalSearchViews = computed(() =>
featureFlagStore.isOn("additional_search_views")
)

const localizedTagPath = (tag: string) => {
return searchStore.getCollectionPath({
type: props.mediaType,
Expand Down Expand Up @@ -231,7 +214,6 @@ export default defineComponent({
return {
tagsContainerRef,

additionalSearchViews,
localizedTagPath,

normalizedTags,
Expand Down
32 changes: 0 additions & 32 deletions frontend/src/components/VMediaTag/VMediaTag.vue

This file was deleted.

47 changes: 0 additions & 47 deletions frontend/src/components/VMediaTag/meta/VMediaTag.stories.mdx

This file was deleted.

10 changes: 1 addition & 9 deletions frontend/src/components/VSourcesTable.vue
Original file line number Diff line number Diff line change
Expand Up @@ -40,12 +40,11 @@
</thead>
<tbody>
<tr v-for="provider in sortedProviders" :key="provider.display_name">
<td v-if="additionalSearchViews">
<td>
<VLink :href="providerViewUrl(provider)">{{
provider.display_name
}}</VLink>
</td>
<td v-else>{{ provider.display_name }}</td>
<td class="truncate font-semibold">
<VLink :href="provider.source_url">
{{ cleanSourceUrlForPresentation(provider.source_url) }}
Expand All @@ -68,7 +67,6 @@ import { useGetLocaleFormattedNumber } from "~/composables/use-get-locale-format
import type { SupportedMediaType } from "~/constants/media"
import type { MediaProvider } from "~/types/media-provider"

import { useFeatureFlagStore } from "~/stores/feature-flag"
import { useSearchStore } from "~/stores/search"

import TableSortIcon from "~/components/TableSortIcon.vue"
Expand Down Expand Up @@ -141,11 +139,6 @@ export default defineComponent({
return sorting.direction === "asc" ? providers : providers.reverse()
})

const featureFlagStore = useFeatureFlagStore()
const additionalSearchViews = computed(() => {
return featureFlagStore.isOn("additional_search_views")
})

const searchStore = useSearchStore()
const providerViewUrl = (provider: MediaProvider) => {
return searchStore.getCollectionPath({
Expand All @@ -163,7 +156,6 @@ export default defineComponent({
sortTable,
cleanSourceUrlForPresentation,
providerViewUrl,
additionalSearchViews,
}
},
})
Expand Down
9 changes: 0 additions & 9 deletions frontend/src/middleware/collection.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import { isShallowEqualObjects } from "@wordpress/is-shallow-equal"

import { useFeatureFlagStore } from "~/stores/feature-flag"
import { useProviderStore } from "~/stores/provider"
import { useSearchStore } from "~/stores/search"

Expand Down Expand Up @@ -66,14 +65,6 @@ export const collectionMiddleware: Middleware = async ({
error: nuxtError,
route,
}) => {
if (!useFeatureFlagStore($pinia).isOn("additional_search_views")) {
nuxtError({
statusCode: 404,
message: "Additional search views are not enabled",
})
return
}

const searchStore = useSearchStore($pinia)
// Route name has the locale in it, e.g. `audio-collection__en`
const mediaType = routeNameToMediaType(route)
Expand Down
Loading
Loading