From 47c65ea8cb621d4bb8e860b327fac9367098b17b Mon Sep 17 00:00:00 2001 From: austinried <4966622+austinried@users.noreply.github.com> Date: Fri, 18 Mar 2022 14:20:57 +0900 Subject: [PATCH] don't reset parts manually, do it all at once --- app/hooks/list.ts | 9 ++++----- app/screens/Home.tsx | 4 ++-- app/screens/LibraryAlbums.tsx | 3 ++- app/screens/LibraryArtists.tsx | 4 +--- app/screens/LibraryPlaylists.tsx | 11 ++++++----- app/state/library.ts | 23 +++++++++++------------ app/state/settings.ts | 3 +-- 7 files changed, 27 insertions(+), 30 deletions(-) diff --git a/app/hooks/list.ts b/app/hooks/list.ts index 5a561c4..7db7793 100644 --- a/app/hooks/list.ts +++ b/app/hooks/list.ts @@ -28,7 +28,7 @@ export const useFetchList = (fetchList: () => Promise) => { return { list, refreshing, refresh, reset } } -export const useFetchList2 = (fetchList: () => Promise, resetList: () => void) => { +export const useFetchList2 = (fetchList: () => Promise) => { const [refreshing, setRefreshing] = useState(false) const refresh = useCallback(async () => { @@ -39,9 +39,8 @@ export const useFetchList2 = (fetchList: () => Promise, resetList: () => v useActiveServerRefresh( useCallback(async () => { - resetList() await refresh() - }, [refresh, resetList]), + }, [refresh]), ) return { refreshing, refresh } @@ -72,8 +71,8 @@ export const useFetchPaginatedList = ( useActiveServerRefresh( useCallback(() => { - reset() - }, [reset]), + refresh() + }, [refresh]), ) const fetchNextPage = useCallback(() => { diff --git a/app/screens/Home.tsx b/app/screens/Home.tsx index d96d7ed..ceb59f4 100644 --- a/app/screens/Home.tsx +++ b/app/screens/Home.tsx @@ -6,7 +6,7 @@ import NothingHere from '@app/components/NothingHere' import { useFetchPaginatedList } from '@app/hooks/list' import { useActiveServerRefresh } from '@app/hooks/server' import { AlbumListItem } from '@app/models/music' -import { Album } from '@app/state/library' +import { Album, mapById } from '@app/state/library' import { selectMusic } from '@app/state/music' import { selectSettings } from '@app/state/settings' import { Store, useStore } from '@app/state/store' @@ -56,7 +56,7 @@ const Category = React.memo<{ type: string }>(({ type }) => { const list = useHomeStore(useCallback(store => store.lists[type] || [], [type])) - const albums = useStore(useCallback(store => list.map(id => store.entities.albums[id]), [list])) + const albums = useStore(useCallback(store => mapById(store.entities.albums, list), [list])) const Albums = () => ( { ) const { list, refreshing, refresh, fetchNextPage } = useFetchPaginatedList(fetchPage, 300) - const albums = useStore(useCallback(store => list.map(id => store.entities.albums[id]), [list])) + const albums = useStore(useCallback(store => mapById(store.entities.albums, list), [list])) const layout = useWindowDimensions() diff --git a/app/screens/LibraryArtists.tsx b/app/screens/LibraryArtists.tsx index 6a0350c..a75b82c 100644 --- a/app/screens/LibraryArtists.tsx +++ b/app/screens/LibraryArtists.tsx @@ -23,9 +23,7 @@ const selectArtists = (store: Store) => store.entities.artists const ArtistsList = () => { const fetchArtists = useStore(store => store.fetchLibraryArtists) - const resetArtists = useStore(store => store.resetLibraryArtists) - - const { refreshing, refresh } = useFetchList2(fetchArtists, resetArtists) + const { refreshing, refresh } = useFetchList2(fetchArtists) const artists = useStore(selectArtists) const filter = useStore(selectSettings.libraryArtistFilter) diff --git a/app/screens/LibraryPlaylists.tsx b/app/screens/LibraryPlaylists.tsx index 9c3fb00..ab21981 100644 --- a/app/screens/LibraryPlaylists.tsx +++ b/app/screens/LibraryPlaylists.tsx @@ -1,10 +1,10 @@ import GradientFlatList from '@app/components/GradientFlatList' import ListItem from '@app/components/ListItem' -import { useFetchList } from '@app/hooks/list' +import { useFetchList, useFetchList2 } from '@app/hooks/list' import { PlaylistListItem } from '@app/models/music' import { selectMusic } from '@app/state/music' import { useStore } from '@app/state/store' -import React from 'react' +import React, { useCallback, useState } from 'react' import { StyleSheet } from 'react-native' const PlaylistRenderItem: React.FC<{ item: PlaylistListItem }> = ({ item }) => ( @@ -12,12 +12,13 @@ const PlaylistRenderItem: React.FC<{ item: PlaylistListItem }> = ({ item }) => ( ) const PlaylistsList = () => { - const fetchPlaylists = useStore(selectMusic.fetchPlaylists) - const { list, refreshing, refresh } = useFetchList(fetchPlaylists) + const fetchPlaylists = useStore(store => store.fetchLibraryPlaylists) + const { refreshing, refresh } = useFetchList2(fetchPlaylists) + const playlists = useStore(store => store.entities.playlists) return ( item.id} onRefresh={refresh} diff --git a/app/state/library.ts b/app/state/library.ts index 0cda9db..065f586 100644 --- a/app/state/library.ts +++ b/app/state/library.ts @@ -20,6 +20,7 @@ import { SubsonicResponse, } from '@app/subsonic/responses' import produce from 'immer' +import { WritableDraft } from 'immer/dist/types/types-external' import merge from 'lodash.merge' import pick from 'lodash.pick' import { GetState, SetState } from 'zustand' @@ -175,13 +176,12 @@ export type LibrarySlice = { songs: ById } - resetLibrary: () => void + resetLibrary: (state?: WritableDraft) => void fetchLibraryArtists: () => Promise fetchLibraryArtist: (id: string) => Promise fetchLibraryArtistInfo: (artistId: string) => Promise fetchLibraryArtistTopSongs: (artistName: string) => Promise - resetLibraryArtists: () => void fetchLibraryAlbum: (id: string) => Promise @@ -205,6 +205,10 @@ function mergeById(object: T, source: T): v merge(object, source) } +export function mapById(object: ById, ids: string[]): T[] { + return ids.map(id => object[id]).filter(a => a !== undefined) +} + const defaultEntities = () => ({ artists: {}, artistAlbums: {}, @@ -225,7 +229,11 @@ const defaultEntities = () => ({ export const createLibrarySlice = (set: SetState, get: GetState): LibrarySlice => ({ entities: defaultEntities(), - resetLibrary: () => { + resetLibrary: state => { + if (state) { + state.entities = defaultEntities() + return + } set(store => { store.entities = defaultEntities() }) @@ -281,15 +289,6 @@ export const createLibrarySlice = (set: SetState, get: GetState): ) }, - resetLibraryArtists: () => { - set( - produce(state => { - state.entities.artists = {} - state.entities.artistAlbums = {} - }), - ) - }, - fetchLibraryArtistInfo: async id => { const client = get().client if (!client) { diff --git a/app/state/settings.ts b/app/state/settings.ts index ae3daf1..a9f7657 100644 --- a/app/state/settings.ts +++ b/app/state/settings.ts @@ -115,10 +115,9 @@ export const createSettingsSlice = (set: SetState, get: GetState): produce(state => { state.settings.activeServer = newActiveServer.id state.client = new SubsonicApiClient(newActiveServer) + get().resetLibrary(state) }), ) - - get().resetLibrary() }, getActiveServer: () => get().settings.servers.find(s => s.id === get().settings.activeServer),