From 237900454ffb48a5c7519a633e83bfb63ff315e9 Mon Sep 17 00:00:00 2001
From: Denis P <34074159+denispan@users.noreply.github.com>
Date: Tue, 9 Apr 2024 10:41:45 +0200
Subject: [PATCH] =?UTF-8?q?=D0=9E=D0=BF=D1=82=D0=B8=D0=BC=D0=B8=D0=B7?=
 =?UTF-8?q?=D0=B8=D1=80=D1=83=D0=B9=20=D1=8D=D1=82=D0=BE=20(=D1=87=D0=B0?=
 =?UTF-8?q?=D1=81=D1=82=D1=8C=C2=A02)=20(#13)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* фиксит ссылку

* disabled favorite button
---
 src/components/favorite-button/favorite-button.tsx | 11 ++++++-----
 src/components/login-city-link/login-city-link.tsx |  2 +-
 src/hooks/store.ts                                 |  1 +
 3 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/components/favorite-button/favorite-button.tsx b/src/components/favorite-button/favorite-button.tsx
index 2d5dfbf..5e807ae 100644
--- a/src/components/favorite-button/favorite-button.tsx
+++ b/src/components/favorite-button/favorite-button.tsx
@@ -1,9 +1,9 @@
 import {classNames} from '../../utils/class-names/class-names.ts';
 import {OfferShortInfo} from '../../types/offer.ts';
 import {useActionCreators, useAppSelector} from '../../hooks/store.ts';
-import {favoritesActions, favoritesSelectors} from '../../store/slices/favorites.ts';
+import {favoritesActions} from '../../store/slices/favorites.ts';
 import {useState} from 'react';
-import {AppRoute, AuthStatus, RequestStatus} from '../../const.ts';
+import {AppRoute, AuthStatus} from '../../const.ts';
 import {toast} from 'react-toastify';
 import {useNavigate} from 'react-router-dom';
 import {userSelectors} from '../../store/slices/user.ts';
@@ -27,8 +27,8 @@ function FavoriteButton({componentType, isFavorite, offerId}: FavoriteButtonProp
   } as const;
 
   const [isFavoriteCurrent, setIsFavoriteCurrent] = useState(isFavorite);
+  const [isDisabled, setIsDisabled] = useState(false);
   const {toggleFavorite} = useActionCreators(favoritesActions);
-  const statusToggleFavorite = useAppSelector(favoritesSelectors.statusToggleFavorite);
   const authStatus = useAppSelector(userSelectors.authStatus);
   const navigate = useNavigate();
 
@@ -38,12 +38,13 @@ function FavoriteButton({componentType, isFavorite, offerId}: FavoriteButtonProp
     if (!isAuth) {
       navigate(AppRoute.Login);
     }
-
+    setIsDisabled(true);
     toast.promise(toggleFavorite({status: Number(!isFavoriteCurrent) as 0 | 1, offerId}).unwrap(), {
       pending: 'Sending request',
       success: {
         render() {
           setIsFavoriteCurrent(!isFavoriteCurrent);
+          setIsDisabled(false);
           return 'Success';
         }
       },
@@ -59,7 +60,7 @@ function FavoriteButton({componentType, isFavorite, offerId}: FavoriteButtonProp
       }
       type="button"
       onClick={onClickHandler}
-      disabled={statusToggleFavorite === RequestStatus.Loading}
+      disabled={isDisabled}
     >
       <svg className={`${componentType}__bookmark-icon`} {...sizes[componentType]}>
         <use xlinkHref="#icon-bookmark"></use>
diff --git a/src/components/login-city-link/login-city-link.tsx b/src/components/login-city-link/login-city-link.tsx
index 0c6942f..582fef8 100644
--- a/src/components/login-city-link/login-city-link.tsx
+++ b/src/components/login-city-link/login-city-link.tsx
@@ -8,7 +8,7 @@ function LoginCityLink() {
   return (
     <section className="locations locations--login locations--current">
       <div className="locations__item">
-        <Link to={randomCity.slug} className="locations__item-link">
+        <Link to={`/${randomCity.slug}`} className="locations__item-link">
           <span>{randomCity.name}</span>
         </Link>
       </div>
diff --git a/src/hooks/store.ts b/src/hooks/store.ts
index bb98086..38c6c54 100644
--- a/src/hooks/store.ts
+++ b/src/hooks/store.ts
@@ -12,6 +12,7 @@ const useAppStore: () => typeof store = useStore;
 const useActionCreators = <Actions extends ActionCreatorsMapObject>(actions: Actions): BoundActions<Actions> => {
   const dispatch = useAppDispatch();
 
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   return useMemo(() => bindActionCreators(actions, dispatch), []);
 };