- Used useCallback to improve the performance
This commit is contained in:
parent
df973c3992
commit
abc0bc54d5
|
@ -1,4 +1,4 @@
|
||||||
import React, { useEffect, useState } from 'react'
|
import React, { useCallback, useState } from 'react'
|
||||||
import ReactRouterPropTypes from 'react-router-prop-types'
|
import ReactRouterPropTypes from 'react-router-prop-types'
|
||||||
import gql from 'graphql-tag'
|
import gql from 'graphql-tag'
|
||||||
import { Query } from 'react-apollo'
|
import { Query } from 'react-apollo'
|
||||||
|
@ -51,29 +51,32 @@ function AlbumPage({ match }) {
|
||||||
match.params.subPage === 'favorites'
|
match.params.subPage === 'favorites'
|
||||||
)
|
)
|
||||||
|
|
||||||
const toggleFavorites = refetch => {
|
const toggleFavorites = useCallback(
|
||||||
const newState = !onlyFavorites
|
refetch => {
|
||||||
if (
|
const newState = !onlyFavorites
|
||||||
(refetchNeededAll && !newState) ||
|
if (
|
||||||
(refetchNeededFavorites && newState)
|
(refetchNeededAll && !newState) ||
|
||||||
) {
|
(refetchNeededFavorites && newState)
|
||||||
refetch({ id: albumId, onlyFavorites: newState }).then(() => {
|
) {
|
||||||
if (onlyFavorites) {
|
refetch({ id: albumId, onlyFavorites: newState }).then(() => {
|
||||||
refetchNeededFavorites = false
|
if (onlyFavorites) {
|
||||||
} else {
|
refetchNeededFavorites = false
|
||||||
refetchNeededAll = false
|
} else {
|
||||||
}
|
refetchNeededAll = false
|
||||||
|
}
|
||||||
|
setOnlyFavorites(newState)
|
||||||
|
})
|
||||||
|
} else {
|
||||||
setOnlyFavorites(newState)
|
setOnlyFavorites(newState)
|
||||||
})
|
}
|
||||||
} else {
|
history.replaceState(
|
||||||
setOnlyFavorites(newState)
|
{},
|
||||||
}
|
'',
|
||||||
history.replaceState(
|
'/album/' + albumId + (newState ? '/favorites' : '')
|
||||||
{},
|
)
|
||||||
'',
|
},
|
||||||
'/album/' + albumId + (newState ? '/favorites' : '')
|
[onlyFavorites, setOnlyFavorites]
|
||||||
)
|
)
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Query query={albumQuery} variables={{ id: albumId, onlyFavorites }}>
|
<Query query={albumQuery} variables={{ id: albumId, onlyFavorites }}>
|
||||||
|
|
Loading…
Reference in New Issue