Cutlery/Kyoo
1
0
Fork 0
mirror of https://github.com/zoriya/Kyoo.git synced 2025-06-03 05:34:23 -04:00
Code Issues Packages Projects Releases Wiki Activity

Fix player poster always errored

Browse Source
This commit is contained in:
Zoe Roux 2023-11-27 15:58:39 +01:00
parent fa6deb7f82
commit 3c959ff532
3 changed files with 17 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
front/apps/web/src/router.tsx
View File

@ -34,5 +34,10 @@ export const withRoute = <Props,>(
const { ...all } = Component; const { ...all } = Component;
Object.assign(WithUseRoute, { ...all }); Object.assign(WithUseRoute, { ...all });
if ("getFetchUrls" in Component) {
const oldGet = Component.getFetchUrls as (obj: object) => object;
WithUseRoute.getFetchUrls = (props: object) => oldGet({ ...defaultProps, ...props });
}
return WithUseRoute; return WithUseRoute;
}; };

2
front/packages/primitives/src/image/image.web.tsx
View File

@ -37,7 +37,7 @@ export const Image = ({
}: Props & { style?: ImageStyle } & { layout: ImageLayout }) => { }: Props & { style?: ImageStyle } & { layout: ImageLayout }) => {
const { css } = useYoshiki(); const { css } = useYoshiki();
const [state, setState] = useState<"loading" | "errored" | "finished">( const [state, setState] = useState<"loading" | "errored" | "finished">(
src ? (typeof window === "undefined" ? "finished" : "loading") : "errored", typeof window === "undefined" ? "finished" : "loading",
); );
const border = { borderRadius: 6 } satisfies ViewStyle; const border = { borderRadius: 6 } satisfies ViewStyle;

13
front/packages/ui/src/player/components/hover.tsx
View File

@ -105,7 +105,7 @@ export const Hover = ({
props, props,
)} )}
> >
<VideoPoster poster={poster} alt={showName} /> <VideoPoster poster={poster} alt={showName} isLoading={isLoading} />
<View <View
{...css({ {...css({
marginLeft: { xs: ts(0.5), sm: ts(3) }, marginLeft: { xs: ts(0.5), sm: ts(3) },
@ -217,7 +217,15 @@ export const Back = ({
); );
}; };
const VideoPoster = ({ poster, alt }: { poster?: KyooImage | null; alt?: string }) => { const VideoPoster = ({
poster,
alt,
isLoading,
}: {
poster?: KyooImage | null;
alt?: string;
isLoading: boolean;
}) => {
const { css } = useYoshiki(); const { css } = useYoshiki();
return ( return (
@ -232,6 +240,7 @@ const VideoPoster = ({ poster, alt }: { poster?: KyooImage | null; alt?: string
src={poster} src={poster}
quality="low" quality="low"
alt={alt} alt={alt}
forcedLoading={isLoading}
layout={{ width: percent(100) }} layout={{ width: percent(100) }}
{...(css({ position: "absolute", bottom: 0 }) as { style: ImageStyle })} {...(css({ position: "absolute", bottom: 0 }) as { style: ImageStyle })}
/> />