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

Add head details for collections

Browse Source
This commit is contained in:
Zoe Roux 2023-11-04 22:29:41 +01:00
parent 9084a78420
commit d73a37fbed
4 changed files with 9 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
front/packages/primitives/src/utils/head.tsx
View File

@ -21,9 +21,11 @@
export const Head = ({ export const Head = ({
title, title,
description, description,
image,
}: { }: {
title?: string | null; title?: string | null;
description?: string | null; description?: string | null;
image?: string | null;
}) => { }) => {
return null; return null;
}; };

3
front/packages/primitives/src/utils/head.web.tsx
View File

@ -23,14 +23,17 @@ import NextHead from "next/head";
export const Head = ({ export const Head = ({
title, title,
description, description,
image,
}: { }: {
title?: string | null; title?: string | null;
description?: string | null; description?: string | null;
image?: string | null;
}) => { }) => {
return ( return (
<NextHead> <NextHead>
{title && <title>{title + " - Kyoo"}</title>} {title && <title>{title + " - Kyoo"}</title>}
{description && <meta name="description" content={description} />} {description && <meta name="description" content={description} />}
{image && <meta property="og:image" content={image} />}
</NextHead> </NextHead>
); );
}; };

4
front/packages/ui/src/collection/index.tsx
View File

@ -29,7 +29,7 @@ import {
getDisplayDate, getDisplayDate,
} from "@kyoo/models"; } from "@kyoo/models";
import { Header as ShowHeader, TitleLine } from "../details/header"; import { Header as ShowHeader, TitleLine } from "../details/header";
import { Container, ImageBackground, P, Skeleton, ts } from "@kyoo/primitives"; import { Container, Head, ImageBackground, P, Skeleton, ts } from "@kyoo/primitives";
import { percent, px, useYoshiki } from "yoshiki/native"; import { percent, px, useYoshiki } from "yoshiki/native";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { forwardRef } from "react"; import { forwardRef } from "react";
@ -48,6 +48,8 @@ const Header = ({ slug }: { slug: string }) => {
<Fetch query={Header.query(slug)}> <Fetch query={Header.query(slug)}>
{({ isLoading, ...data }) => ( {({ isLoading, ...data }) => (
<> <>
<Head title={data?.name} description={data?.overview} image={data?.thumbnail?.high} />
<ImageBackground <ImageBackground
src={data?.thumbnail} src={data?.thumbnail}
quality="high" quality="high"

2
front/packages/ui/src/details/header.tsx
View File

@ -386,7 +386,7 @@ export const Header = ({
<Fetch query={query}> <Fetch query={query}>
{({ isLoading, ...data }) => ( {({ isLoading, ...data }) => (
<> <>
<Head title={data?.name} description={data?.overview} /> <Head title={data?.name} description={data?.overview} image={data?.thumbnail?.high} />
<ImageBackground <ImageBackground
src={data?.thumbnail} src={data?.thumbnail}
quality="high" quality="high"