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

feat: add podcast support to WorkPageButtons component #68

Merged
merged 2 commits into from
Dec 9, 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
25 changes: 21 additions & 4 deletions components/pages/workPageLayout/WorkPageButtons.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import SmartLink from "@/components/shared/smartLink/SmartLink"
import { resolveUrl } from "@/lib/helpers/helper.routes"
import { useSelectedManifestationStore } from "@/store/selectedManifestation.store"

import { isAudioBook, isEbook } from "./helper"
import { isAudioBook, isEbook, isPodcast } from "./helper"

export type WorkPageButtonsProps = {
workId: string
Expand Down Expand Up @@ -41,7 +41,6 @@ const WorkPageButtons = ({ workId }: WorkPageButtonsProps) => {
</Button>
</>
)}

{isAudioBook(selectedManifestation) && (
<>
<Button
Expand All @@ -56,6 +55,20 @@ const WorkPageButtons = ({ workId }: WorkPageButtonsProps) => {
</Button>
</>
)}
{isPodcast(selectedManifestation) && (
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would it make sense to use the same button that we use for AudioBook here too? And then just switch the material type in the ariaLabel and the inner Button text depending on isAudioBook and isPodcast.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think I like having them separated. This is because at some point they might introduce another material type or condition to consider. Also it is more readable in this way IMO. But I understand your point, I was a bit back and forward on this one.

<>
<Button
ariaLabel="Prøv podcast"
disabled={!!!identifier}
className="mb-grid-gap-half w-full lg:min-w-72 lg:max-w-80"
onClick={() => setIsPlayerOpen(!isPlayerOpen)}>
Prøv podcast
</Button>
<Button ariaLabel="Hør podcast" className="w-full lg:min-w-72 lg:max-w-80">
Not done yet
</Button>
</>
)}

{/* Reader / Player dialog */}
{!!selectedManifestation?.identifiers[0].value && (
Expand All @@ -64,8 +77,12 @@ const WorkPageButtons = ({ workId }: WorkPageButtonsProps) => {
onOpenChange={() => {
setIsPlayerOpen(!isPlayerOpen)
}}
title="Prøv lydbog"
description="For at låne lydbogen skal du være oprettet som bruger på GO.">
title={`Prøv ${isPodcast(selectedManifestation) ? "Podcast" : "Lydbog"}`}
description={
isPodcast(selectedManifestation)
? "For at høre podcast skal du være oprettet som bruger på GO."
: "For at låne lydbogen skal du være oprettet som bruger på GO."
}>
<Player type="demo" identifier={selectedManifestation.identifiers[0].value} />
</ResponsiveDialog>
)}
Expand Down
5 changes: 5 additions & 0 deletions components/pages/workPageLayout/helper.ts
Original file line number Diff line number Diff line change
Expand Up @@ -72,6 +72,11 @@ export const isAudioBook = (manifestation: ManifestationWorkPageFragment | undef
return isOfMaterialType(manifestation, GeneralMaterialTypeCodeEnum.AudioBooks)
}

export const isPodcast = (manifestation: ManifestationWorkPageFragment | undefined | null) => {
if (!manifestation) return false
return isOfMaterialType(manifestation, GeneralMaterialTypeCodeEnum.Podcasts)
}

export const getIsbnsFromManifestation = (
manifestaion: ManifestationWorkPageFragment | undefined | null
) => {
Expand Down
Loading