Added required props to component

WordPress · Apr 27, 2023 · b751e38 · b751e38
1 parent 2e9888d
commit b751e38
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 6 deletions.
diff --git a/frontend/src/components/VBackToSearchResultsLink.vue b/frontend/src/components/VBackToSearchResultsLink.vue
@@ -3,7 +3,7 @@
   <VLink
     class="time inline-flex flex-row items-center gap-2 rounded-sm p-2 pe-3 text-xs font-semibold text-dark-charcoal-70 hover:text-dark-charcoal"
     v-bind="$attrs"
-    @click="handleClick()"
+    @click="handleClick"
   >
     <VIcon name="chevron-left" :rtl-flip="true" />
     {{ $t("single-result.back") }}
@@ -28,6 +28,7 @@ export default defineComponent({
     VIcon,
     VLink,
   },
+  inheritAttrs: false,
   props: {
     /**
      * The unique ID of the media
@@ -39,12 +40,11 @@ export default defineComponent({
     /**
      * The media type being searched
      */
-     mediaType: {
+    mediaType: {
       type: String as PropType<SupportedMediaType>,
       required: true,
     },
   },
-  inheritAttrs: false,
   setup(props) {
     const { sendCustomEvent } = useAnalytics()
     const handleClick = () => {

diff --git a/frontend/src/components/meta/VBackToSearchResultsLink.stories.mdx b/frontend/src/components/meta/VBackToSearchResultsLink.stories.mdx
@@ -8,7 +8,7 @@ import VBackToSearchResultsLink from "~/components/VBackToSearchResultsLink.vue"
 />
 
 export const Template = (args) => ({
-  template: `<VBackToSearchResultsLink v-bind="args"/>`,
+  template: `<VBackToSearchResultsLink v-bind="args" :id="id" :media-type="mediaType" />`,
   components: { VBackToSearchResultsLink },
   setup() {
     return { args }

diff --git a/frontend/src/pages/audio/_id/index.vue b/frontend/src/pages/audio/_id/index.vue
@@ -1,7 +1,11 @@
 <template>
   <VSkipToContentContainer as="main">
     <div v-if="backToSearchPath" class="w-full px-2 py-2 md:px-6">
-      <VBackToSearchResultsLink :href="backToSearchPath" />
+      <VBackToSearchResultsLink
+        :id="audio.id"
+        :href="backToSearchPath"
+        :media-type="audio.frontendMediaType"
+      />
     </div>
 
     <VAudioTrack layout="full" :audio="audio" class="main-track" />

diff --git a/frontend/src/pages/image/_id/index.vue b/frontend/src/pages/image/_id/index.vue
@@ -1,7 +1,11 @@
 <template>
   <VSkipToContentContainer as="main">
     <div v-if="backToSearchPath" class="w-full px-2 py-2 md:px-6">
-      <VBackToSearchResultsLink :href="backToSearchPath" />
+      <VBackToSearchResultsLink
+        :id="image.id"
+        :href="backToSearchPath"
+        :media-type="image.frontendMediaType"
+      />
     </div>
 
     <figure class="relative mb-4 border-b border-dark-charcoal-20 px-6">