diff --git a/front/apps/mobile/app/_layout.tsx b/front/apps/mobile/app/_layout.tsx index ebda9b9f..7498b818 100644 --- a/front/apps/mobile/app/_layout.tsx +++ b/front/apps/mobile/app/_layout.tsx @@ -21,7 +21,7 @@ import "react-native-reanimated"; import { PortalProvider } from "@gorhom/portal"; -import { ThemeSelector } from "@kyoo/primitives"; +import { SnackbarProvider, ThemeSelector } from "@kyoo/primitives"; import { DownloadProvider } from "@kyoo/ui"; import { AccountProvider, createQueryClient, storage, useUserTheme } from "@kyoo/models"; import { PersistQueryClientProvider } from "@tanstack/react-query-persist-client"; @@ -144,7 +144,9 @@ export default function Root() { - + + + diff --git a/front/apps/web/src/pages/_app.tsx b/front/apps/web/src/pages/_app.tsx index f59ad22a..21631c51 100755 --- a/front/apps/web/src/pages/_app.tsx +++ b/front/apps/web/src/pages/_app.tsx @@ -22,7 +22,13 @@ import "../polyfill"; import { HydrationBoundary, QueryClientProvider } from "@tanstack/react-query"; import { ReactQueryDevtools } from "@tanstack/react-query-devtools"; -import { HiddenIfNoJs, TouchOnlyCss, SkeletonCss, ThemeSelector } from "@kyoo/primitives"; +import { + HiddenIfNoJs, + TouchOnlyCss, + SkeletonCss, + ThemeSelector, + SnackbarProvider, +} from "@kyoo/primitives"; import { WebTooltip } from "@kyoo/primitives/src/tooltip.web"; import { AccountP, @@ -138,21 +144,23 @@ const App = ({ Component, pageProps }: AppProps) => { - - - } - randomItems={[]} - {...layoutProps} - /> - + + + + } + randomItems={[]} + {...layoutProps} + /> + + diff --git a/front/packages/primitives/src/index.ts b/front/packages/primitives/src/index.ts index 38c4c41d..daec9bd5 100644 --- a/front/packages/primitives/src/index.ts +++ b/front/packages/primitives/src/index.ts @@ -31,6 +31,7 @@ export * from "./container"; export * from "./divider"; export * from "./progress"; export * from "./slider"; +export * from "./snackbar"; export * from "./alert"; export * from "./menu"; export * from "./popup"; diff --git a/front/packages/ui/src/player/state.tsx b/front/packages/ui/src/player/state.tsx index b8c4ee02..d388101d 100644 --- a/front/packages/ui/src/player/state.tsx +++ b/front/packages/ui/src/player/state.tsx @@ -24,6 +24,8 @@ import { useAtomCallback } from "jotai/utils"; import { ElementRef, memo, useEffect, useLayoutEffect, useRef, useState, useCallback } from "react"; import NativeVideo, { VideoProps } from "./video"; import { Platform } from "react-native"; +import { useSnackbar } from "@kyoo/primitives"; +import { useTranslation } from "react-i18next"; export const playAtom = atom(true); export const loadAtom = atom(false); @@ -188,6 +190,9 @@ export const Video = memo(function Video({ return () => document.removeEventListener("fullscreenchange", handler); }); + const createSnackbar = useSnackbar(); + const { t } = useTranslation(); + if (!source || !links) return null; return ( { + createSnackbar({ + key: "unsuported", + label: t("player.unsupportedError"), + duration: 3, + }); if (mode == PlayMode.Direct) setPlayMode(PlayMode.Hls); }} /> diff --git a/front/translations/en.json b/front/translations/en.json index b4b9a8ce..1f45e157 100644 --- a/front/translations/en.json +++ b/front/translations/en.json @@ -151,7 +151,8 @@ "direct": "Pristine", "transmux": "Original", "auto": "Auto", - "notInPristine": "Unavailable in pristine" + "notInPristine": "Unavailable in pristine", + "unsupportedError": "Video codec not supported, transcoding in progress..." }, "search": { "empty": "No result found. Try a different query." diff --git a/front/translations/fr.json b/front/translations/fr.json index 8ab30aa8..9126c481 100644 --- a/front/translations/fr.json +++ b/front/translations/fr.json @@ -150,7 +150,9 @@ "fullscreen": "Plein-écran", "direct": "Pristine", "transmux": "Original", - "auto": "Auto" + "auto": "Auto", + "notInPristine": "Non disponible en pristine", + "unsupportedError": "Video codec not supported, transcoding in progress..." }, "search": { "empty": "Aucun résultat trouvé. Essayer avec une autre recherche."