diff --git a/src/features/ProfileCard/hooks.tsx b/src/features/ProfileCard/hooks.tsx
index f91e25ab..687dd88d 100644
--- a/src/features/ProfileCard/hooks.tsx
+++ b/src/features/ProfileCard/hooks.tsx
@@ -1,8 +1,9 @@
import type { BaseSyntheticEvent } from 'react'
import { useCallback } from 'react'
-import findIndex from 'lodash/findIndex'
+import find from 'lodash/find'
+import { FavoritesActions } from 'requests'
import { handleImageError, getProfileLogo } from 'helpers'
import { useSportNameParam, usePageId } from 'hooks'
@@ -16,11 +17,11 @@ export const useProfileCard = ({ profileType }: ProfileCardProps) => {
const profileId = usePageId()
const { sportType } = useSportNameParam()
- const isFavorite = findIndex(userFavorites, {
+ const isFavorite = Boolean(find(userFavorites, {
id: profileId,
sport: sportType,
type: profileType,
- }) !== -1
+ }))
const logo = getProfileLogo({
id: profileId,
@@ -28,14 +29,18 @@ export const useProfileCard = ({ profileType }: ProfileCardProps) => {
sportType,
})
- const addToFavorites = useCallback(() => {
+ const toggleFavorites = useCallback(() => {
+ const action = isFavorite
+ ? FavoritesActions.REMOVE
+ : FavoritesActions.ADD
addRemoveFavorite({
- action: 1,
+ action,
id: profileId,
sport: sportType,
type: profileType,
})
}, [
+ isFavorite,
addRemoveFavorite,
profileId,
profileType,
@@ -49,9 +54,9 @@ export const useProfileCard = ({ profileType }: ProfileCardProps) => {
}), [profileType, sportType])
return {
- addToFavorites,
isFavorite,
logo,
onError,
+ toggleFavorites,
}
}
diff --git a/src/features/ProfileCard/index.tsx b/src/features/ProfileCard/index.tsx
index 26a2937a..175d4044 100644
--- a/src/features/ProfileCard/index.tsx
+++ b/src/features/ProfileCard/index.tsx
@@ -27,10 +27,10 @@ export const ProfileCard = (props: ProfileCardProps) => {
} = props
const {
- addToFavorites,
isFavorite,
logo,
onError,
+ toggleFavorites,
} = useProfileCard(props)
return (
@@ -45,12 +45,12 @@ export const ProfileCard = (props: ProfileCardProps) => {
{name}
{isFavorite ? (
-
+
) : (
-
+
diff --git a/src/features/ProfileCard/styled.tsx b/src/features/ProfileCard/styled.tsx
index d08205a9..12be63d7 100644
--- a/src/features/ProfileCard/styled.tsx
+++ b/src/features/ProfileCard/styled.tsx
@@ -43,7 +43,7 @@ export const AddToFavButton = styled.button`
background:
linear-gradient(
180deg, rgba(255, 255, 255, 0) 0%,
- rgba(255, 255, 255, 0.1) 0.01%,
+ rgba(255, 255, 255, 0.1) 0.01%,
rgba(0, 0, 0, 0.1) 99.99%
),
#0033CC;
@@ -63,7 +63,6 @@ export const InFavorites = styled(AddToFavButton)`
color: #EACB6F;
border: 1px solid currentColor;
background-color: transparent;
- cursor: default;
`
export const InfoItems = styled.div`
diff --git a/src/features/UserFavorites/index.tsx b/src/features/UserFavorites/index.tsx
index 07fdfe5f..77054480 100644
--- a/src/features/UserFavorites/index.tsx
+++ b/src/features/UserFavorites/index.tsx
@@ -2,12 +2,13 @@ import React from 'react'
import map from 'lodash/map'
+import { FavoritesActions } from 'requests'
import { handleImageError } from 'helpers'
import { Modal } from 'features/Modal'
import { TooltipBlock } from './TooltipBlock'
-
+import { useUserFavoritesStore } from './store'
import {
StyledLink,
UserSportFavItemLogoWrapper,
@@ -20,7 +21,6 @@ import {
FavoriteModal,
Text,
} from './styled'
-import { useUserFavoritesStore } from './store'
export const UserFavorites = () => {
const {
@@ -39,7 +39,7 @@ export const UserFavorites = () => {
addRemoveFavorite({
- action: 2,
+ action: FavoritesActions.REMOVE,
id: item.id,
sport: item.sport,
type: item.type,
diff --git a/src/requests/modifyUserSportFavs.tsx b/src/requests/modifyUserSportFavs.tsx
index dc50c150..a9a24cc4 100644
--- a/src/requests/modifyUserSportFavs.tsx
+++ b/src/requests/modifyUserSportFavs.tsx
@@ -15,8 +15,18 @@ enum FavoriteStatusTypes {
FAILURE = 2,
}
+export enum FavoritesActions {
+ ADD = 1,
+ REMOVE = 2,
+}
+
+type Response = {
+ _p_data: UserFavorites,
+ _p_status: FavoriteStatusTypes,
+}
+
type Args = {
- action: number,
+ action: FavoritesActions,
id: number,
sport: SportTypes,
type: ProfileTypes,
@@ -28,7 +38,7 @@ export const modifyUserFavorites = async ({
id,
sport,
type,
-}: Args): Promise => {
+}: Args) => {
const config = {
body: {
params: {
@@ -41,7 +51,7 @@ export const modifyUserFavorites = async ({
},
}
- const { _p_data, _p_status } = await callApi({
+ const { _p_data, _p_status }: Response = await callApi({
config,
url: DATA_URL,
})