diff --git a/src/components/ResourceList/ResourceListDisplay.tsx b/src/components/ResourceList/ResourceListDisplay.tsx index dee49e0..5493c29 100644 --- a/src/components/ResourceList/ResourceListDisplay.tsx +++ b/src/components/ResourceList/ResourceListDisplay.tsx @@ -113,18 +113,23 @@ export const MemorizedComponent = ({ retryAttempts = 2, onResults }: PropsResourceListDisplay) => { - const { filterOutDeletedResources } = useCacheStore(); const {identifierOperations, lists} = useGlobal() - const deletedResources = useCacheStore().deletedResources const memoizedParams = useMemo(() => JSON.stringify(search), [search]); - const addList = useListStore().addList - const removeFromList = useListStore().removeFromList const temporaryResources = useCacheStore().getTemporaryResources(listName) - const addItems = useListStore().addItems - const list = useListStore().getListByName(listName) + const list = useListStore((state) => state.lists[listName]?.items) || []; + const [isLoading, setIsLoading] = useState(list?.length > 0 ? false : true); const isListExpired = useCacheStore().isListExpired(listName) + + const filterOutDeletedResources = useCacheStore((s) => s.filterOutDeletedResources); +const deletedResources = useCacheStore((s) => s.deletedResources); + +const addList = useListStore((s) => s.addList); +const removeFromList = useListStore((s) => s.removeFromList); +const addItems = useListStore((s) => s.addItems); + + const [isLoadingMore, setIsLoadingMore] = useState(false) const initialized = useRef(false) const [generatedIdentifier, setGeneratedIdentifier] = useState("") @@ -174,8 +179,6 @@ export const MemorizedComponent = ({ parsedParams.identifier = generatedIdentifier const responseData = await lists.fetchResources(parsedParams, listName, returnType, true); // Awaiting the async function - - addList(listName, responseData || []); } catch (error) { @@ -200,8 +203,9 @@ export const MemorizedComponent = ({ const {elementRef} = useScrollTracker(listName, list?.length > 0, disableScrollTracker); - const setSearchCacheExpiryDuration = useCacheStore().setSearchCacheExpiryDuration - const setResourceCacheExpiryDuration = useCacheStore().setResourceCacheExpiryDuration + const setSearchCacheExpiryDuration = useCacheStore((s) => s.setSearchCacheExpiryDuration); +const setResourceCacheExpiryDuration = useCacheStore((s) => s.setResourceCacheExpiryDuration); + useEffect(()=> { if(searchCacheDuration){ setSearchCacheExpiryDuration(searchCacheDuration) @@ -213,7 +217,7 @@ export const MemorizedComponent = ({ } }, []) const listToDisplay = useMemo(()=> { - return filterOutDeletedResources([...temporaryResources, ...list]) + return filterOutDeletedResources([...temporaryResources, ...(list || [])]) }, [list, listName, deletedResources, temporaryResources]) useEffect(()=> { @@ -384,7 +388,7 @@ export const ListItemWrapper: React.FC = ({ defaultLoaderParams, renderListItemLoader, }) => { - const getResourceCache = useCacheStore().getResourceCache; + const getResourceCache = useCacheStore((s)=> s.getResourceCache) const findCachedResource = getResourceCache( `${item.service}-${item.name}-${item.identifier}`, diff --git a/src/hooks/useAppInfo.tsx b/src/hooks/useAppInfo.tsx index f415489..5b46949 100644 --- a/src/hooks/useAppInfo.tsx +++ b/src/hooks/useAppInfo.tsx @@ -5,8 +5,8 @@ import { EnumCollisionStrength, hashWord } from "../utils/encryption"; export const useAppInfo = (appName?: string, publicSalt?: string) => { - const setAppState = useAppStore().setAppState - const appNameHashed = useAppStore().appNameHashed + const setAppState = useAppStore((state)=> state.setAppState) + const appNameHashed = useAppStore((state)=> state.appNameHashed) const handleAppInfoSetup = useCallback(async (name: string, salt: string)=> { diff --git a/src/hooks/useAuth.tsx b/src/hooks/useAuth.tsx index f1fca5b..10983b0 100644 --- a/src/hooks/useAuth.tsx +++ b/src/hooks/useAuth.tsx @@ -27,20 +27,21 @@ export interface UseAuthProps { } export const useAuth = ({ balanceSetting, authenticateOnMount }: UseAuthProps) => { - const { - address, - publicKey, - name, - avatarUrl, - balance, - isLoadingUser, - isLoadingInitialBalance, - errorLoadingUser, - setErrorLoadingUser, - setIsLoadingUser, - setUser, - setBalance - } = useAuthStore(); + const address = useAuthStore((s) => s.address); +const publicKey = useAuthStore((s) => s.publicKey); +const name = useAuthStore((s) => s.name); +const avatarUrl = useAuthStore((s) => s.avatarUrl); +const balance = useAuthStore((s) => s.balance); + +const isLoadingUser = useAuthStore((s) => s.isLoadingUser); +const isLoadingInitialBalance = useAuthStore((s) => s.isLoadingInitialBalance); +const errorLoadingUser = useAuthStore((s) => s.errorLoadingUser); + +const setErrorLoadingUser = useAuthStore((s) => s.setErrorLoadingUser); +const setIsLoadingUser = useAuthStore((s) => s.setIsLoadingUser); +const setUser = useAuthStore((s) => s.setUser); +const setBalance = useAuthStore((s) => s.setBalance); + const balanceSetIntervalRef = useRef>(null); diff --git a/src/hooks/usePublish.tsx b/src/hooks/usePublish.tsx index 7e4cf23..8e07c99 100644 --- a/src/hooks/usePublish.tsx +++ b/src/hooks/usePublish.tsx @@ -23,8 +23,8 @@ export const usePublish = ( const [isLoading, setIsLoading] = useState(true); const [error, setError] = useState(null); const publish = usePublishStore().getPublish(metadata || null, true); - const setPublish = usePublishStore().setPublish; - const getPublish = usePublishStore().getPublish; + const setPublish = usePublishStore((state)=> state.setPublish) + const getPublish = usePublishStore(state=> state.getPublish) const [hasResource, setHasResource] = useState(null); const fetchRawData = useCallback(async (item: QortalGetMetadata) => { diff --git a/src/hooks/useResources.tsx b/src/hooks/useResources.tsx index 4163eea..ab8476c 100644 --- a/src/hooks/useResources.tsx +++ b/src/hooks/useResources.tsx @@ -20,14 +20,13 @@ export interface Resource { data: any; } export const useResources = (retryAttempts: number = 2) => { - const { - setSearchCache, - getSearchCache, - getResourceCache, - setResourceCache, - addTemporaryResource, - markResourceAsDeleted - } = useCacheStore(); + const setSearchCache = useCacheStore((s) => s.setSearchCache); + const getSearchCache = useCacheStore((s) => s.getSearchCache); + const getResourceCache = useCacheStore((s) => s.getResourceCache); + const setResourceCache = useCacheStore((s) => s.setResourceCache); + const addTemporaryResource = useCacheStore((s) => s.addTemporaryResource); + const markResourceAsDeleted = useCacheStore((s) => s.markResourceAsDeleted); + const deleteList = useListStore(state => state.deleteList) const requestControllers = new Map();