Merge pull request #430 from streamyfin/feat/refreshsettings

feat: Refresh remote settings

app/(auth)/(tabs)/(home)/index.tsx

@@ -59,7 +59,13 @@ export default function index() {
   const user = useAtomValue(userAtom);
 
   const [loading, setLoading] = useState(false);
-  const [settings, _] = useSettings();
+  const [
+    settings,
+    updateSettings,
+    pluginSettings,
+    setPluginSettings,
+    refreshStreamyfinPluginSettings,
+  ] = useSettings();
 
   const [isConnected, setIsConnected] = useState<boolean | null>(null);
   const [loadingRetry, setLoadingRetry] = useState(false);
@@ -110,6 +116,7 @@ export default function index() {
     cleanCacheDirectory().catch((e) =>
       console.error("Something went wrong cleaning cache directory")
     );
+
     return () => {
       unsubscribe();
     };
@@ -154,6 +161,7 @@ export default function index() {
 
   const refetch = useCallback(async () => {
     setLoading(true);
+    await refreshStreamyfinPluginSettings();
     await invalidateCache();
     setLoading(false);
   }, []);
@@ -189,7 +197,7 @@ export default function index() {
   );
 
   let sections: Section[] = [];
-  if (settings?.home === null || settings?.home?.sections === null) {
+  if (!settings?.home || !settings?.home?.sections) {
     sections = useMemo(() => {
       if (!api || !user?.Id) return [];
 
@@ -305,7 +313,7 @@ export default function index() {
             (
               await getItemsApi(api).getItems({
                 userId: user?.Id,
-                limit: section.items?.limit || 20,
+                limit: section.items?.limit || 25,
                 recursive: true,
                 includeItemTypes: section.items?.includeItemTypes,
                 sortBy: section.items?.sortBy,

components/settings/OtherSettings.tsx

@@ -9,7 +9,7 @@ import * as BackgroundFetch from "expo-background-fetch";
 import { useRouter } from "expo-router";
 import * as ScreenOrientation from "expo-screen-orientation";
 import * as TaskManager from "expo-task-manager";
-import React, {useEffect, useMemo} from "react";
+import React, { useEffect, useMemo } from "react";
 import { Linking, Switch, TouchableOpacity } from "react-native";
 import { toast } from "sonner-native";
 import { Text } from "../common/Text";
@@ -52,28 +52,28 @@ export const OtherSettings: React.FC = () => {
   /**********************
    *********************/
 
-  const disabled = useMemo(() => (
-    pluginSettings?.autoRotate?.locked === true &&
-    pluginSettings?.defaultVideoOrientation?.locked === true &&
-    pluginSettings?.safeAreaInControlsEnabled?.locked === true &&
-    pluginSettings?.showCustomMenuLinks?.locked === true &&
-    pluginSettings?.hiddenLibraries?.locked === true &&
-    pluginSettings?.disableHapticFeedback?.locked === true
-  ), [pluginSettings]);
+  const disabled = useMemo(
+    () =>
+      pluginSettings?.autoRotate?.locked === true &&
+      pluginSettings?.defaultVideoOrientation?.locked === true &&
+      pluginSettings?.safeAreaInControlsEnabled?.locked === true &&
+      pluginSettings?.showCustomMenuLinks?.locked === true &&
+      pluginSettings?.hiddenLibraries?.locked === true &&
+      pluginSettings?.disableHapticFeedback?.locked === true,
+    [pluginSettings]
+  );
 
   const orientations = [
     ScreenOrientation.OrientationLock.DEFAULT,
     ScreenOrientation.OrientationLock.PORTRAIT_UP,
     ScreenOrientation.OrientationLock.LANDSCAPE_LEFT,
-    ScreenOrientation.OrientationLock.LANDSCAPE_RIGHT
-  ]
+    ScreenOrientation.OrientationLock.LANDSCAPE_RIGHT,
+  ];
 
   if (!settings) return null;
 
   return (
-    <DisabledSetting
-      disabled={disabled}
-    >
+    <DisabledSetting disabled={disabled}>
       <ListGroup title="Other" className="">
         <ListItem
           title="Auto rotate"
@@ -82,32 +82,40 @@ export const OtherSettings: React.FC = () => {
           <Switch
             value={settings.autoRotate}
             disabled={pluginSettings?.autoRotate?.locked}
-            onValueChange={(value) => updateSettings({autoRotate: value})}
+            onValueChange={(value) => updateSettings({ autoRotate: value })}
           />
         </ListItem>
 
         <ListItem
           title="Video orientation"
-          disabled={pluginSettings?.defaultVideoOrientation?.locked || settings.autoRotate}
+          disabled={
+            pluginSettings?.defaultVideoOrientation?.locked ||
+            settings.autoRotate
+          }
         >
           <Dropdown
             data={orientations}
-            disabled={pluginSettings?.defaultVideoOrientation?.locked || settings.autoRotate}
-            keyExtractor={String}
-            titleExtractor={(item) =>
-              ScreenOrientationEnum[item]
+            disabled={
+              pluginSettings?.defaultVideoOrientation?.locked ||
+              settings.autoRotate
             }
+            keyExtractor={String}
+            titleExtractor={(item) => ScreenOrientationEnum[item]}
             title={
               <TouchableOpacity className="flex flex-row items-center justify-between py-3 pl-3">
                 <Text className="mr-1 text-[#8E8D91]">
                   {ScreenOrientationEnum[settings.defaultVideoOrientation]}
                 </Text>
-                <Ionicons name="chevron-expand-sharp" size={18} color="#5A5960"/>
+                <Ionicons
+                  name="chevron-expand-sharp"
+                  size={18}
+                  color="#5A5960"
+                />
               </TouchableOpacity>
             }
             label="Orientation"
             onSelected={(defaultVideoOrientation) =>
-              updateSettings({defaultVideoOrientation})
+              updateSettings({ defaultVideoOrientation })
             }
           />
         </ListItem>
@@ -120,7 +128,7 @@ export const OtherSettings: React.FC = () => {
             value={settings.safeAreaInControlsEnabled}
             disabled={pluginSettings?.safeAreaInControlsEnabled?.locked}
             onValueChange={(value) =>
-              updateSettings({safeAreaInControlsEnabled: value})
+              updateSettings({ safeAreaInControlsEnabled: value })
             }
           />
         </ListItem>
@@ -138,7 +146,7 @@ export const OtherSettings: React.FC = () => {
             value={settings.showCustomMenuLinks}
             disabled={pluginSettings?.showCustomMenuLinks?.locked}
             onValueChange={(value) =>
-              updateSettings({showCustomMenuLinks: value})
+              updateSettings({ showCustomMenuLinks: value })
             }
           />
         </ListItem>
@@ -155,7 +163,7 @@ export const OtherSettings: React.FC = () => {
             value={settings.disableHapticFeedback}
             disabled={pluginSettings?.disableHapticFeedback?.locked}
             onValueChange={(disableHapticFeedback) =>
-              updateSettings({disableHapticFeedback})
+              updateSettings({ disableHapticFeedback })
             }
           />
         </ListItem>

providers/JellyfinProvider.tsx

@@ -174,6 +174,14 @@ export const JellyfinProvider: React.FC<{ children: ReactNode }> = ({
 
   useInterval(pollQuickConnect, isPolling ? 1000 : null);
 
+  useEffect(() => {
+    (async () => {
+      await refreshStreamyfinPluginSettings();
+    })();
+  }, []);
+
+  useInterval(refreshStreamyfinPluginSettings, 60 * 5 * 1000); // 5 min
+
   const discoverServers = async (url: string): Promise<Server[]> => {
     const servers = await jellyfin?.discovery.getRecommendedServerCandidates(
       url

utils/atoms/settings.ts

@@ -189,7 +189,14 @@ const loadSettings = (): Settings => {
   }
 };
 
+const EXCLUDE_FROM_SAVE = ["home"];
+
 const saveSettings = (settings: Settings) => {
+  Object.keys(settings).forEach((key) => {
+    if (EXCLUDE_FROM_SAVE.includes(key)) {
+      delete settings[key as keyof Settings];
+    }
+  });
   const jsonValue = JSON.stringify(settings);
   storage.set("settings", jsonValue);
 };
@@ -221,11 +228,13 @@ export const useSettings = () => {
 
   const refreshStreamyfinPluginSettings = useCallback(async () => {
     if (!api) return;
-    const settings = await api
-      .getStreamyfinPluginConfig()
-      .then(({ data }) => data?.settings);
-
-    writeInfoLog(`Got remote settings: ${JSON.stringify(settings)}`);
+    const settings = await api.getStreamyfinPluginConfig().then(
+      ({ data }) => {
+        writeInfoLog(`Got remote settings`);
+        return data?.settings;
+      },
+      (err) => undefined
+    );
 
     setPluginSettings(settings);
     return settings;
@@ -275,6 +284,7 @@ export const useSettings = () => {
     if (Object.keys(unlockedPluginDefaults).length > 0) {
       updateSettings(unlockedPluginDefaults);
     }
+
     return {
       ..._settings,
       ...overrideSettings,