From 6d30168ea0da0c6b7e78c91743badd2d0f3785b1 Mon Sep 17 00:00:00 2001 From: austinried <4966622+austinried@users.noreply.github.com> Date: Mon, 2 Aug 2021 10:18:56 +0900 Subject: [PATCH] store client in state, populate with active server --- app/hooks/music.ts | 15 ++++++--------- app/state/music.ts | 31 +++++++++++++++++++------------ app/state/settings.ts | 42 +++++++++++++++++++++++++++++++----------- app/state/store.ts | 8 +++++--- 4 files changed, 61 insertions(+), 35 deletions(-) diff --git a/app/hooks/music.ts b/app/hooks/music.ts index 919d1b8..c9ff74b 100644 --- a/app/hooks/music.ts +++ b/app/hooks/music.ts @@ -31,36 +31,33 @@ const selectors = { } export const useArtistInfo = (id: string) => { - const server = useStore(selectSettings.activeServer) const artistInfo = useStore(useCallback((state: Store) => state.artistInfo[id], [id])) const fetchArtistInfo = useStore(selectors.fetchArtistInfo) - if (server && !artistInfo) { - fetchArtistInfo(server, id) + if (!artistInfo) { + fetchArtistInfo(id) } return artistInfo } export const useAlbumWithSongs = (id: string) => { - const server = useStore(selectSettings.activeServer) const album = useStore(useCallback((state: Store) => state.albums[id], [id])) const fetchAlbum = useStore(selectors.fetchAlbum) - if (server && !album) { - fetchAlbum(server, id) + if (!album) { + fetchAlbum(id) } return album } export const usePlaylistWithSongs = (id: string) => { - const server = useStore(selectSettings.activeServer) const playlist = useStore(useCallback((state: Store) => state.playlists[id], [id])) const fetchPlaylist = useStore(selectors.fetchPlaylist) - if (server && !playlist) { - fetchPlaylist(server, id) + if (!playlist) { + fetchPlaylist(id) } return playlist diff --git a/app/state/music.ts b/app/state/music.ts index 15288c5..87a3759 100644 --- a/app/state/music.ts +++ b/app/state/music.ts @@ -10,9 +10,7 @@ import { PlaylistWithSongs, SearchResults, } from '@app/models/music' -import { Server } from '@app/models/settings' import { Store } from '@app/state/store' -import { SubsonicApiClient } from '@app/subsonic/api' import produce from 'immer' import { atom } from 'jotai' import { GetState, SetState } from 'zustand' @@ -25,12 +23,12 @@ export type MusicSlice = { albumsCache: string[] playlists: { [id: string]: PlaylistWithSongs | undefined } playlistsCache: string[] - fetchArtistInfo: (server: Server, id: string) => Promise - fetchAlbum: (server: Server, id: string) => Promise - fetchPlaylist: (server: Server, id: string) => Promise + fetchArtistInfo: (id: string) => Promise + fetchAlbum: (id: string) => Promise + fetchPlaylist: (id: string) => Promise } -export const createMusicSlice = (set: SetState, _get: GetState): MusicSlice => ({ +export const createMusicSlice = (set: SetState, get: GetState): MusicSlice => ({ cacheSize: 100, artistInfo: {}, artistInfoCache: [], @@ -38,8 +36,11 @@ export const createMusicSlice = (set: SetState, _get: GetState): M albumsCache: [], playlists: {}, playlistsCache: [], - fetchArtistInfo: async (server, id) => { - const client = new SubsonicApiClient(server) + fetchArtistInfo: async id => { + const client = get().client + if (!client) { + return undefined + } try { const [artistResponse, artistInfoResponse] = await Promise.all([ @@ -68,8 +69,11 @@ export const createMusicSlice = (set: SetState, _get: GetState): M return undefined } }, - fetchAlbum: async (server, id) => { - const client = new SubsonicApiClient(server) + fetchAlbum: async id => { + const client = get().client + if (!client) { + return undefined + } try { const response = await client.getAlbum({ id }) @@ -89,8 +93,11 @@ export const createMusicSlice = (set: SetState, _get: GetState): M return undefined } }, - fetchPlaylist: async (server, id) => { - const client = new SubsonicApiClient(server) + fetchPlaylist: async id => { + const client = get().client + if (!client) { + return undefined + } try { const response = await client.getPlaylist({ id }) diff --git a/app/state/settings.ts b/app/state/settings.ts index ff35add..1a9333b 100644 --- a/app/state/settings.ts +++ b/app/state/settings.ts @@ -1,35 +1,55 @@ import { AppSettings, Server } from '@app/models/settings' import { Store } from '@app/state/store' +import { SubsonicApiClient } from '@app/subsonic/api' import produce from 'immer' import { GetState, SetState } from 'zustand' export type SettingsSlice = { settings: AppSettings + client?: SubsonicApiClient + createClient: () => void setActiveServer: (id?: string) => void setServers: (servers: Server[]) => void } -export const createSettingsSlice = (set: SetState, _get: GetState): SettingsSlice => ({ +export const createSettingsSlice = (set: SetState, get: GetState): SettingsSlice => ({ settings: { servers: [], home: { lists: ['recent', 'random', 'frequent', 'starred'], }, }, - setActiveServer: id => + createClient: () => { + const server = get().settings.servers.find(s => s.id === get().settings.activeServer) + if (!server) { + return + } + + set( + produce(state => { + state.client = new SubsonicApiClient(server) + }), + ) + }, + setActiveServer: id => { + const servers = get().settings.servers + const currentActiveServerId = get().settings.activeServer + + if (!servers.find(s => s.id === id)) { + return + } + if (currentActiveServerId === id) { + return + } + set( produce(state => { - if (!state.settings.servers.find(s => s.id === id)) { - console.log('could not find') - return - } - if (state.settings.activeServer === id) { - console.log('already active') - return - } state.settings.activeServer = id }), - ), + ) + + get().createClient() + }, setServers: servers => set( produce(state => { diff --git a/app/state/store.ts b/app/state/store.ts index dfe678a..8ea3d09 100644 --- a/app/state/store.ts +++ b/app/state/store.ts @@ -34,9 +34,11 @@ export const useStore = create( name: '@appStore', getStorage: () => storage, whitelist: ['settings'], - // onRehydrateStorage: state => { - // return (state, error) => {} - // }, + onRehydrateStorage: _preState => { + return (postState, _error) => { + postState?.createClient() + } + }, }, ), )