diff --git a/front/packages/primitives/src/button.tsx b/front/packages/primitives/src/button.tsx
new file mode 100644
index 00000000..f0590d9a
--- /dev/null
+++ b/front/packages/primitives/src/button.tsx
@@ -0,0 +1,45 @@
+/*
+ * Kyoo - A portable and vast media library solution.
+ * Copyright (c) Kyoo.
+ *
+ * See AUTHORS.md and LICENSE file in the project root for full license information.
+ *
+ * Kyoo is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * any later version.
+ *
+ * Kyoo is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with Kyoo. If not, see .
+ */
+
+import { Theme, useYoshiki } from "yoshiki/native";
+import { PressableFeedback } from "./links";
+import { P } from "./text";
+import { ts } from "./utils";
+
+export const Button = ({ text, onPress }: { text: string; onPress?: () => void }) => {
+ const { css } = useYoshiki();
+
+ return (
+ theme.accent },
+ text: { color: (theme: Theme) => theme.colors.white },
+ },
+ })}
+ >
+
{text}
+
+ );
+};
diff --git a/front/packages/primitives/src/index.ts b/front/packages/primitives/src/index.ts
index 69f3d97b..dfad49fb 100644
--- a/front/packages/primitives/src/index.ts
+++ b/front/packages/primitives/src/index.ts
@@ -33,6 +33,7 @@ export * from "./progress";
export * from "./slider";
export * from "./menu";
export * from "./input";
+export * from "./button";
export * from "./animated";
export * from "./utils";
diff --git a/front/packages/ui/src/details/episode.tsx b/front/packages/ui/src/details/episode.tsx
index fd8651eb..f9a360ee 100644
--- a/front/packages/ui/src/details/episode.tsx
+++ b/front/packages/ui/src/details/episode.tsx
@@ -18,7 +18,7 @@
* along with Kyoo. If not, see .
*/
-import { H6, Image, Link, P, Skeleton, ts } from "@kyoo/primitives";
+import { focusReset, H6, Image, Link, P, Skeleton, ts } from "@kyoo/primitives";
import { useTranslation } from "react-i18next";
import { View } from "react-native";
import { Layout, WithLoading } from "../fetch";
@@ -95,6 +95,7 @@ export const EpisodeLine = ({
},
},
focus: {
+ self: focusReset,
poster: {
transform: [{ scale: 1.1 }],
borderColor: (theme: Theme) => theme.accent,
diff --git a/front/packages/ui/src/details/header.tsx b/front/packages/ui/src/details/header.tsx
index c2bf0dd8..bc5745c5 100644
--- a/front/packages/ui/src/details/header.tsx
+++ b/front/packages/ui/src/details/header.tsx
@@ -37,18 +37,11 @@ import {
LI,
A,
ts,
+ Button,
} from "@kyoo/primitives";
import { Fragment } from "react";
import { useTranslation } from "react-i18next";
-import {
- FlatList,
- NativeSyntheticEvent,
- Platform,
- Pressable,
- PressableProps,
- TargetedEvent,
- View,
-} from "react-native";
+import { Platform, Pressable, PressableProps, View } from "react-native";
import {
Theme,
md,
@@ -225,7 +218,7 @@ const TitleLine = ({
};
const TvPressable = ({ children, ...props }: PressableProps) => {
- if (!Platform.isTV) return <>children>;
+ if (!Platform.isTV) return <>{children}>;
return {children};
};
@@ -243,7 +236,15 @@ const Description = ({
const { css } = useYoshiki();
return (
-
+
{!Platform.isTV && (