Refactor settings store and components

2026-05-15 04:51:06 +02:00 · 2023-03-30 06:44:33 -07:00
parent 373441e4c6
commit eecbcddea3
30 changed files with 894 additions and 832 deletions
@@ -0,0 +1,99 @@
+import isElectron from 'is-electron';
+import { NumberInput, Slider, Switch, Text } from '/@/renderer/components';
+import { usePlaybackSettings, useSettingsStoreActions } from '/@/renderer/store/settings.store';
+import { SettingOption, SettingsSection } from '../settings-section';
+
+export const ScrobbleSettings = () => {
+  const settings = usePlaybackSettings();
+  const { setSettings } = useSettingsStoreActions();
+
+  const scrobbleOptions: SettingOption[] = [
+    {
+      control: (
+        <Switch
+          aria-label="Toggle scrobble"
+          defaultChecked={settings.scrobble.enabled}
+          onChange={(e) => {
+            setSettings({
+              playback: {
+                ...settings,
+                scrobble: {
+                  ...settings.scrobble,
+                  enabled: e.currentTarget.checked,
+                },
+              },
+            });
+          }}
+        />
+      ),
+      description: 'Enable or disable scrobbling to your media server',
+      isHidden: !isElectron(),
+      title: 'Scrobble',
+    },
+    {
+      control: (
+        <Slider
+          aria-label="Scrobble percentage"
+          defaultValue={settings.scrobble.scrobbleAtPercentage}
+          label={`${settings.scrobble.scrobbleAtPercentage}%`}
+          max={90}
+          min={25}
+          w={100}
+          onChange={(e) => {
+            setSettings({
+              playback: {
+                ...settings,
+                scrobble: {
+                  ...settings.scrobble,
+                  scrobbleAtPercentage: e,
+                },
+              },
+            });
+          }}
+        />
+      ),
+      description: 'The percentage of the song that must be played before submitting a scrobble',
+      isHidden: !isElectron(),
+      title: 'Minimum scrobble percentage*',
+    },
+    {
+      control: (
+        <NumberInput
+          aria-label="Scrobble duration in seconds"
+          defaultValue={settings.scrobble.scrobbleAtDuration}
+          max={1200}
+          min={0}
+          width={75}
+          onChange={(e) => {
+            if (e === '') return;
+            setSettings({
+              playback: {
+                ...settings,
+                scrobble: {
+                  ...settings.scrobble,
+                  scrobbleAtDuration: e,
+                },
+              },
+            });
+          }}
+        />
+      ),
+      description:
+        'The duration in seconds of a song that must be played before submitting a scrobble',
+      isHidden: !isElectron(),
+      title: 'Minimum scrobble duration (seconds)*',
+    },
+  ];
+
+  return (
+    <>
+      <SettingsSection options={scrobbleOptions} />
+      <Text
+        $secondary
+        size="sm"
+      >
+        *The scrobble will be submitted if one or more of the above conditions is met
+      </Text>
+    </>
+  );
+};