diff --git a/front/packages/models/src/utils.ts b/front/packages/models/src/utils.ts
index 508d92f4..5a22e70f 100644
--- a/front/packages/models/src/utils.ts
+++ b/front/packages/models/src/utils.ts
@@ -18,8 +18,11 @@
* along with Kyoo. If not, see .
*/
+import { Platform } from "react-native";
import { Movie, Show } from "./resources";
import { z } from "zod";
+import { useMMKVString } from "react-native-mmkv";
+import { storage } from "./account-internal";
export const zdate = z.coerce.date;
@@ -39,3 +42,15 @@ export const getDisplayDate = (data: Show | Movie) => {
return airDate.getFullYear().toString();
}
};
+
+export const useLocalSetting = (setting: string, def: string) => {
+ if (Platform.OS === "web" && typeof window === "undefined") return [def, null!] as const;
+ // eslint-disable-next-line react-hooks/rules-of-hooks
+ const [val, setter] = useMMKVString(`settings.${setting}`, storage);
+ return [val ?? def, setter] as const;
+};
+
+export const getLocalSetting = (setting: string, def: string) => {
+ if (Platform.OS === "web" && typeof window === "undefined") return def;
+ return storage.getString(`settings.${setting}`) ?? setting;
+}
diff --git a/front/packages/ui/src/player/state.tsx b/front/packages/ui/src/player/state.tsx
index d388101d..df004da6 100644
--- a/front/packages/ui/src/player/state.tsx
+++ b/front/packages/ui/src/player/state.tsx
@@ -18,7 +18,7 @@
* along with Kyoo. If not, see .
*/
-import { Audio, Episode, Subtitle, useAccount } from "@kyoo/models";
+import { Audio, Episode, Subtitle, getLocalSetting, useAccount } from "@kyoo/models";
import { atom, useAtom, useAtomValue, useSetAtom } from "jotai";
import { useAtomCallback } from "jotai/utils";
import { ElementRef, memo, useEffect, useLayoutEffect, useRef, useState, useCallback } from "react";
@@ -30,12 +30,13 @@ import { useTranslation } from "react-i18next";
export const playAtom = atom(true);
export const loadAtom = atom(false);
-// TODO: Default to auto or pristine depending on the user settings.
export enum PlayMode {
Direct,
Hls,
}
-export const playModeAtom = atom(PlayMode.Direct);
+export const playModeAtom = atom(
+ getLocalSetting("playmode", "direct") !== "auto" ? PlayMode.Direct : PlayMode.Hls,
+);
export const bufferedAtom = atom(0);
export const durationAtom = atom(undefined);
diff --git a/front/packages/ui/src/settings/base.tsx b/front/packages/ui/src/settings/base.tsx
index 8a9e3265..4ed14211 100644
--- a/front/packages/ui/src/settings/base.tsx
+++ b/front/packages/ui/src/settings/base.tsx
@@ -18,7 +18,7 @@
* along with Kyoo. If not, see .
*/
-import { Account, User, queryFn, useAccount } from "@kyoo/models";
+import { User, queryFn, useAccount } from "@kyoo/models";
import {
Container,
H1,
diff --git a/front/packages/ui/src/settings/playback.tsx b/front/packages/ui/src/settings/playback.tsx
index 12759759..83aa82e6 100644
--- a/front/packages/ui/src/settings/playback.tsx
+++ b/front/packages/ui/src/settings/playback.tsx
@@ -19,11 +19,15 @@
*/
import { Select } from "@kyoo/primitives";
+import { useLocalSetting } from "@kyoo/models";
import { useTranslation } from "react-i18next";
+import { useSetAtom } from "jotai";
import { Preference, SettingsContainer, useSetting } from "./base";
+import { PlayMode, playModeAtom } from "../player/state";
-import SubtitleLanguage from "@material-symbols/svg-400/rounded/closed_caption-fill.svg";
+import PlayModeI from "@material-symbols/svg-400/rounded/display_settings-fill.svg";
import AudioLanguage from "@material-symbols/svg-400/rounded/music_note-fill.svg";
+import SubtitleLanguage from "@material-symbols/svg-400/rounded/closed_caption-fill.svg";
// I gave up on finding a way to retrive this using the Intl api (probably does not exist)
// Simply copy pasted the list of languages from https://www.localeplanet.com/api/codelist.json
@@ -32,6 +36,8 @@ const allLanguages = ["af", "agq", "ak", "am", "ar", "as", "asa", "ast", "az", "
export const PlaybackSettings = () => {
const { t, i18n } = useTranslation();
+ const [playMode, setDefaultPlayMode] = useLocalSetting("playmode", "direct");
+ const setCurrentPlayMode = useSetAtom(playModeAtom);
const [audio, setAudio] = useSetting("audioLanguage")!;
const [subtitle, setSubtitle] = useSetting("subtitleLanguage")!;
const languages = new Intl.DisplayNames([i18n.language ?? "en"], {
@@ -41,6 +47,22 @@ export const PlaybackSettings = () => {
return (
+
+