diff --git a/front/packages/models/src/resources/show.ts b/front/packages/models/src/resources/show.ts index 2708d197..0fa3b97c 100644 --- a/front/packages/models/src/resources/show.ts +++ b/front/packages/models/src/resources/show.ts @@ -27,7 +27,7 @@ import { StudioP } from "./studio"; import { BaseEpisodeP } from "./episode.base"; import { CollectionP } from "./collection"; import { MetadataP } from "./metadata"; -import { ShowWatchStatusP, WatchStatusP } from "./watch-status"; +import { ShowWatchStatusP } from "./watch-status"; /** * The enum containing show's status. diff --git a/front/packages/ui/src/details/collection.tsx b/front/packages/ui/src/details/collection.tsx index b9463617..e31b7d9d 100644 --- a/front/packages/ui/src/details/collection.tsx +++ b/front/packages/ui/src/details/collection.tsx @@ -28,7 +28,7 @@ import { import { Container, H2, ImageBackground, Link, P, focusReset, ts } from "@kyoo/primitives"; import { useTranslation } from "react-i18next"; import { Theme, useYoshiki } from "yoshiki/native"; -import { ErrorView, Fetch } from "../fetch"; +import { ErrorView } from "../fetch"; export const PartOf = ({ name, diff --git a/front/packages/ui/src/details/header.tsx b/front/packages/ui/src/details/header.tsx index 4a4b5dec..3d4507d5 100644 --- a/front/packages/ui/src/details/header.tsx +++ b/front/packages/ui/src/details/header.tsx @@ -47,6 +47,8 @@ import { ts, Chip, DottedSeparator, + focusReset, + SwitchVariant, } from "@kyoo/primitives"; import { Fragment } from "react"; import { useTranslation } from "react-i18next"; @@ -68,9 +70,9 @@ import { Fetch } from "../fetch"; import PlayArrow from "@material-symbols/svg-400/rounded/play_arrow-fill.svg"; import Theaters from "@material-symbols/svg-400/rounded/theaters-fill.svg"; import { Rating } from "../components/rating"; -import { displayRuntime } from "./episode"; +import { EpisodeLine, displayRuntime, episodeDisplayNumber } from "./episode"; import { WatchListInfo } from "../components/watchlist-info"; -import { WatchStatusV } from "@kyoo/models/src/resources/watch-status"; +import { ShowWatchStatus, WatchStatusV } from "@kyoo/models/src/resources/watch-status"; export const TitleLine = ({ isLoading, @@ -474,6 +476,33 @@ export const Header = ({ ))} + {type === "show" && (data.watchStatus as ShowWatchStatus)?.nextEpisode && ( + + {({ css }) => ( + theme.background, + backgroundColor: (theme) => theme.background, + fover: { + self: { ...focusReset, borderColor: (theme: Theme) => theme.accent }, + }, + })} + > +

{t("show.nextUp")}

+ +
+ )} +
+ )} )} diff --git a/front/translations/en.json b/front/translations/en.json index 6ca32ae6..98c8f484 100644 --- a/front/translations/en.json +++ b/front/translations/en.json @@ -30,7 +30,8 @@ "watching": "Mark as watching", "droped": "Mark as dropped", "null": "Mark as not seen" - } + }, + "nextUp": "Next up" }, "browse": { "sortby": "Sort by {{key}}", diff --git a/front/translations/fr.json b/front/translations/fr.json index a90d9ef1..00dc0c3b 100644 --- a/front/translations/fr.json +++ b/front/translations/fr.json @@ -30,7 +30,8 @@ "watching": "Marquer en cours de visionnage", "droped": "Marquer comme abandonné", "null": "Marquer comme non vu" - } + }, + "nextUp": "Continuer" }, "browse": { "sortby": "Trier par {{key}}",