diff --git a/src/renderer/features/settings/components/settings-header.tsx b/src/renderer/features/settings/components/settings-header.tsx
index 289b2353..57fcaafc 100644
--- a/src/renderer/features/settings/components/settings-header.tsx
+++ b/src/renderer/features/settings/components/settings-header.tsx
@@ -1,13 +1,45 @@
+import { Flex, Group } from '@mantine/core';
+import { closeAllModals, openModal } from '@mantine/modals';
import { RiSettings2Fill } from 'react-icons/ri';
-import { PageHeader } from '/@/renderer/components';
+import { Button, ConfirmModal, PageHeader } from '/@/renderer/components';
import { LibraryHeaderBar } from '/@/renderer/features/shared';
+import { useSettingsStoreActions } from '../../../store/settings.store';
export const SettingsHeader = () => {
+ const { reset } = useSettingsStoreActions();
+
+ const handleResetToDefault = () => {
+ reset();
+ closeAllModals();
+ };
+
+ const openResetConfirmModal = () => {
+ openModal({
+ children: Are you sure?,
+ title: 'Reset settings to default',
+ });
+ };
+
return (
-
- Settings
+
+
+
+ Settings
+
+
+
);
diff --git a/src/renderer/store/settings.store.ts b/src/renderer/store/settings.store.ts
index 42520641..02dabda8 100644
--- a/src/renderer/store/settings.store.ts
+++ b/src/renderer/store/settings.store.ts
@@ -1,5 +1,6 @@
/* eslint-disable prefer-destructuring */
/* eslint-disable @typescript-eslint/no-unused-vars */
+import isElectron from 'is-electron';
import merge from 'lodash/merge';
import create from 'zustand';
import { devtools, persist } from 'zustand/middleware';
@@ -80,177 +81,195 @@ export interface SettingsState {
export interface SettingsSlice extends SettingsState {
actions: {
+ reset: () => void;
setSettings: (data: Partial) => void;
};
}
+const initialState: SettingsState = {
+ general: {
+ followSystemTheme: false,
+ fontContent: 'Poppins',
+ playButtonBehavior: Play.NOW,
+ showQueueDrawerButton: false,
+ sideQueueType: 'sideDrawerQueue',
+ skipButtons: {
+ enabled: false,
+ skipBackwardSeconds: 5,
+ skipForwardSeconds: 10,
+ },
+ theme: AppTheme.DEFAULT_DARK,
+ themeDark: AppTheme.DEFAULT_DARK,
+ themeLight: AppTheme.DEFAULT_LIGHT,
+ volumeWheelStep: 5,
+ },
+ playback: {
+ audioDeviceId: undefined,
+ crossfadeDuration: 5,
+ crossfadeStyle: CrossfadeStyle.EQUALPOWER,
+ globalMediaHotkeys: false,
+ muted: false,
+ scrobble: {
+ enabled: true,
+ scrobbleAtDuration: 240,
+ scrobbleAtPercentage: 75,
+ },
+
+ style: PlaybackStyle.GAPLESS,
+ type: PlaybackType.LOCAL,
+ },
+ tab: 'general',
+ tables: {
+ fullScreen: {
+ autoFit: true,
+ columns: [
+ {
+ column: TableColumn.TITLE_COMBINED,
+ width: 500,
+ },
+ {
+ column: TableColumn.DURATION,
+ width: 100,
+ },
+ {
+ column: TableColumn.USER_FAVORITE,
+ width: 100,
+ },
+ ],
+ followCurrentSong: true,
+ rowHeight: 60,
+ },
+ nowPlaying: {
+ autoFit: true,
+ columns: [
+ {
+ column: TableColumn.ROW_INDEX,
+ width: 50,
+ },
+ {
+ column: TableColumn.TITLE,
+ width: 500,
+ },
+ {
+ column: TableColumn.DURATION,
+ width: 100,
+ },
+ {
+ column: TableColumn.ALBUM,
+ width: 100,
+ },
+ {
+ column: TableColumn.ALBUM_ARTIST,
+ width: 100,
+ },
+ {
+ column: TableColumn.GENRE,
+ width: 100,
+ },
+ {
+ column: TableColumn.YEAR,
+ width: 100,
+ },
+ ],
+ followCurrentSong: true,
+ rowHeight: 30,
+ },
+ sideDrawerQueue: {
+ autoFit: true,
+ columns: [
+ {
+ column: TableColumn.TITLE_COMBINED,
+ width: 500,
+ },
+ {
+ column: TableColumn.DURATION,
+ width: 100,
+ },
+ ],
+ followCurrentSong: true,
+ rowHeight: 60,
+ },
+ sideQueue: {
+ autoFit: true,
+ columns: [
+ {
+ column: TableColumn.ROW_INDEX,
+ width: 50,
+ },
+ {
+ column: TableColumn.TITLE_COMBINED,
+ width: 500,
+ },
+ {
+ column: TableColumn.DURATION,
+ width: 100,
+ },
+ ],
+ followCurrentSong: true,
+ rowHeight: 60,
+ },
+ songs: {
+ autoFit: true,
+ columns: [
+ {
+ column: TableColumn.ROW_INDEX,
+ width: 50,
+ },
+ {
+ column: TableColumn.TITLE_COMBINED,
+ width: 500,
+ },
+ {
+ column: TableColumn.DURATION,
+ width: 100,
+ },
+ {
+ column: TableColumn.ALBUM,
+ width: 300,
+ },
+ {
+ column: TableColumn.ARTIST,
+ width: 100,
+ },
+ {
+ column: TableColumn.YEAR,
+ width: 100,
+ },
+ ],
+ rowHeight: 60,
+ },
+ },
+ window: {
+ disableAutoUpdate: true,
+ exitToTray: false,
+ minimizeToTray: false,
+ windowBarStyle: Platform.WEB,
+ },
+};
+
export const useSettingsStore = create()(
persist(
devtools(
immer((set, get) => ({
actions: {
+ reset: () => {
+ if (!isElectron()) {
+ set({
+ ...initialState,
+ playback: {
+ ...initialState.playback,
+ type: PlaybackType.WEB,
+ },
+ });
+ } else {
+ set(initialState);
+ }
+ },
setSettings: (data) => {
set({ ...get(), ...data });
},
},
- general: {
- followSystemTheme: false,
- fontContent: 'Poppins',
- playButtonBehavior: Play.NOW,
- showQueueDrawerButton: false,
- sideQueueType: 'sideDrawerQueue',
- skipButtons: {
- enabled: false,
- skipBackwardSeconds: 5,
- skipForwardSeconds: 10,
- },
- theme: AppTheme.DEFAULT_DARK,
- themeDark: AppTheme.DEFAULT_DARK,
- themeLight: AppTheme.DEFAULT_LIGHT,
- volumeWheelStep: 5,
- },
- playback: {
- audioDeviceId: undefined,
- crossfadeDuration: 5,
- crossfadeStyle: CrossfadeStyle.EQUALPOWER,
- globalMediaHotkeys: false,
- muted: false,
- scrobble: {
- enabled: true,
- scrobbleAtDuration: 240,
- scrobbleAtPercentage: 75,
- },
-
- style: PlaybackStyle.GAPLESS,
- type: PlaybackType.LOCAL,
- },
- tab: 'general',
- tables: {
- fullScreen: {
- autoFit: true,
- columns: [
- {
- column: TableColumn.TITLE_COMBINED,
- width: 500,
- },
- {
- column: TableColumn.DURATION,
- width: 100,
- },
- {
- column: TableColumn.USER_FAVORITE,
- width: 100,
- },
- ],
- followCurrentSong: true,
- rowHeight: 60,
- },
- nowPlaying: {
- autoFit: true,
- columns: [
- {
- column: TableColumn.ROW_INDEX,
- width: 50,
- },
- {
- column: TableColumn.TITLE,
- width: 500,
- },
- {
- column: TableColumn.DURATION,
- width: 100,
- },
- {
- column: TableColumn.ALBUM,
- width: 100,
- },
- {
- column: TableColumn.ALBUM_ARTIST,
- width: 100,
- },
- {
- column: TableColumn.GENRE,
- width: 100,
- },
- {
- column: TableColumn.YEAR,
- width: 100,
- },
- ],
- followCurrentSong: true,
- rowHeight: 30,
- },
- sideDrawerQueue: {
- autoFit: true,
- columns: [
- {
- column: TableColumn.TITLE_COMBINED,
- width: 500,
- },
- {
- column: TableColumn.DURATION,
- width: 100,
- },
- ],
- followCurrentSong: true,
- rowHeight: 60,
- },
- sideQueue: {
- autoFit: true,
- columns: [
- {
- column: TableColumn.ROW_INDEX,
- width: 50,
- },
- {
- column: TableColumn.TITLE_COMBINED,
- width: 500,
- },
- {
- column: TableColumn.DURATION,
- width: 100,
- },
- ],
- followCurrentSong: true,
- rowHeight: 60,
- },
- songs: {
- autoFit: true,
- columns: [
- {
- column: TableColumn.ROW_INDEX,
- width: 50,
- },
- {
- column: TableColumn.TITLE_COMBINED,
- width: 500,
- },
- {
- column: TableColumn.DURATION,
- width: 100,
- },
- {
- column: TableColumn.ALBUM,
- width: 300,
- },
- {
- column: TableColumn.ARTIST,
- width: 100,
- },
- {
- column: TableColumn.YEAR,
- width: 100,
- },
- ],
- rowHeight: 60,
- },
- },
- window: {
- disableAutoUpdate: true,
- exitToTray: false,
- minimizeToTray: false,
- windowBarStyle: Platform.WEB,
- },
+ ...initialState,
})),
{ name: 'store_settings' },
),