From c822181c239229a768ce6152900660d46edd23fc Mon Sep 17 00:00:00 2001 From: Mikkel Jakobsen Date: Tue, 16 Apr 2024 09:52:30 +0200 Subject: [PATCH] Move getUrl functionality to separate helper file To keep the component a bit more tidy --- src/components/cover/cover.tsx | 50 ++-------------------------------- src/components/cover/helper.ts | 50 ++++++++++++++++++++++++++++++++++ 2 files changed, 52 insertions(+), 48 deletions(-) create mode 100644 src/components/cover/helper.ts diff --git a/src/components/cover/cover.tsx b/src/components/cover/cover.tsx index d6babb569a..717fdb0e82 100644 --- a/src/components/cover/cover.tsx +++ b/src/components/cover/cover.tsx @@ -1,18 +1,12 @@ import React, { useCallback, useState } from "react"; import clsx from "clsx"; -import { first } from "lodash"; import { useGetCoverCollection } from "../../core/cover-service-api/cover-service"; -import { - Cover as CoverType, - CoverImageUrls, - GetCoverCollectionType -} from "../../core/cover-service-api/model"; +import { GetCoverCollectionType } from "../../core/cover-service-api/model"; import { Pid } from "../../core/utils/types/ids"; import LinkNoStyle from "../atoms/links/LinkNoStyle"; import CoverImage from "./cover-image"; import { Manifestation } from "../../core/utils/types/entities"; - -type CoverServiceSizes = keyof CoverImageUrls; +import { getCoverUrl } from "./helper"; export type CoverProps = { animate: boolean; @@ -27,46 +21,6 @@ export type CoverProps = { linkAriaLabelledBy?: string; }; -const getUrl = (cover: CoverType, size: CoverServiceSizes) => - cover.imageUrls?.[size]?.url; - -const getCoverUrl = ({ - coverData, - bestRepresentation, - size -}: { - coverData: CoverType[] | null | undefined; - bestRepresentation: CoverProps["bestRepresentation"]; - size: CoverServiceSizes; -}) => { - if (!coverData) { - return null; - } - - const firstCover = first(coverData); - - if (!bestRepresentation && firstCover && getUrl(firstCover, size)) { - return getUrl(firstCover, size); - } - - const bestRepresentationCover = first( - coverData.filter( - (item: CoverType) => - bestRepresentation && item.id === bestRepresentation.pid - ) - ); - - if (bestRepresentationCover && getUrl(bestRepresentationCover, size)) { - return getUrl(bestRepresentationCover, size); - } - - if (firstCover && getUrl(firstCover, size)) { - return getUrl(firstCover, size); - } - - return null; -}; - export const Cover = ({ url, alt, diff --git a/src/components/cover/helper.ts b/src/components/cover/helper.ts new file mode 100644 index 0000000000..566de95fce --- /dev/null +++ b/src/components/cover/helper.ts @@ -0,0 +1,50 @@ +import { first } from "lodash"; +import { + CoverImageUrls, + Cover as CoverType +} from "../../core/cover-service-api/model"; +import { CoverProps } from "./cover"; + +type CoverServiceSizes = keyof CoverImageUrls; + +const getUrl = (cover: CoverType, size: CoverServiceSizes) => + cover.imageUrls?.[size]?.url; + +export const getCoverUrl = ({ + coverData, + bestRepresentation, + size +}: { + coverData: CoverType[] | null | undefined; + bestRepresentation: CoverProps["bestRepresentation"]; + size: CoverServiceSizes; +}) => { + if (!coverData) { + return null; + } + + const firstCover = first(coverData); + + if (!bestRepresentation && firstCover && getUrl(firstCover, size)) { + return getUrl(firstCover, size); + } + + const bestRepresentationCover = first( + coverData.filter( + (item: CoverType) => + bestRepresentation && item.id === bestRepresentation.pid + ) + ); + + if (bestRepresentationCover && getUrl(bestRepresentationCover, size)) { + return getUrl(bestRepresentationCover, size); + } + + if (firstCover && getUrl(firstCover, size)) { + return getUrl(firstCover, size); + } + + return null; +}; + +export default {};