правит нейминг обработчиков

htmlacademy-react · Apr 10, 2024 · b16b37c · b16b37c
1 parent 6937d94
commit b16b37c
Show file tree

Hide file tree

Showing 7 changed files with 26 additions and 26 deletions.
diff --git a/src/components/favorite-button/favorite-button.tsx b/src/components/favorite-button/favorite-button.tsx
@@ -34,7 +34,7 @@ function FavoriteButton({componentType, isFavorite, offerId}: FavoriteButtonProp
 
   const isAuth = authStatus === AuthStatus.Auth;
 
-  const onClickHandler = () => {
+  const handleButtonClick = () => {
     if (!isAuth) {
       navigate(AppRoute.Login);
     }
@@ -59,7 +59,7 @@ function FavoriteButton({componentType, isFavorite, offerId}: FavoriteButtonProp
           isFavoriteCurrent && isAuth && `${componentType}__bookmark-button--active`)
       }
       type="button"
-      onClick={onClickHandler}
+      onClick={handleButtonClick}
       disabled={isDisabled}
     >
       <svg className={`${componentType}__bookmark-icon`} {...sizes[componentType]}>

diff --git a/src/components/form-login/login-form.tsx b/src/components/form-login/login-form.tsx
@@ -10,7 +10,7 @@ function LoginForm() {
   const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
   const passwordRegex = /^(?=.*\d)(?=.*[a-zA-Z]).*$/;
 
-  const onSubmitHandler = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleFormSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
     if (!emailRegex.test(email)) {
       toast.error('Введен неверный email');
@@ -29,7 +29,7 @@ function LoginForm() {
     <section className="login">
       <h1 className="login__title">Sign in</h1>
       <form
-        onSubmit={(e) => onSubmitHandler(e)}
+        onSubmit={(e) => handleFormSubmit(e)}
         className="login__form form"
         action="#"
         method="post"

diff --git a/src/components/form-review/form-review.tsx b/src/components/form-review/form-review.tsx
@@ -24,14 +24,14 @@ function FormReview({offerId}: FormReviewProps) {
   const [isFormDisabled, setIsFormDisabled] = useState(false);
   const {postComment} = useActionCreators(commentsActions);
 
-  const onChangeForm = (evt: FormEvent<HTMLFormElement>) => {
+  const handleFormChange = (evt: FormEvent<HTMLFormElement>) => {
     const form = evt.currentTarget as Form;
     const rating = form.rating.value;
     const comment = form.review.value;
     setIsSubmitDisabled(isValidForm(comment, rating));
   };
 
-  const onFormSubmit = (evt: FormEvent<HTMLFormElement>) => {
+  const handleFormSubmit = (evt: FormEvent<HTMLFormElement>) => {
     evt.preventDefault();
     const form = evt.currentTarget as Form;
 
@@ -68,8 +68,8 @@ function FormReview({offerId}: FormReviewProps) {
 
   return (
     <form
-      onSubmit={(evt) => onFormSubmit(evt)}
-      onChange={(evt) => onChangeForm(evt)}
+      onSubmit={(evt) => handleFormSubmit(evt)}
+      onChange={(evt) => handleFormChange(evt)}
       className="reviews__form form"
       action="#"
       method="post"

diff --git a/src/components/header-nav-auth-user/header-nav-auth-user.tsx b/src/components/header-nav-auth-user/header-nav-auth-user.tsx
@@ -13,7 +13,7 @@ function HeaderNavAuthUser() {
   const {fetchFavorites} = useActionCreators(favoritesActions);
   const statusFetchFavorites = useAppSelector(favoritesSelectors.statusFetchFavorites);
 
-  const logoutHandler = async (e: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => {
+  const handleSingOutClick = async (e: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => {
     e.preventDefault();
     await logout().unwrap().catch((error: Error) => {
       toast.warning(error.message);
@@ -44,7 +44,7 @@ function HeaderNavAuthUser() {
           className="header__nav-link"
           href="#"
           onClick={(e) => {
-            logoutHandler(e).catch((error: Error) => toast.warning(error.message));
+            handleSingOutClick(e).catch((error: Error) => toast.warning(error.message));
           }}
         >
           <span className="header__signout">Sign out</span>

diff --git a/src/components/offer-card/offer-card.tsx b/src/components/offer-card/offer-card.tsx
@@ -8,10 +8,10 @@ import {memo} from 'react';
 interface PlaceCardProps {
   offer: OfferShortInfo;
   componentType: 'cities' | 'favorites' | 'near-places';
-  onHoverCard?: (offer: OfferShortInfo | null) => void;
+  handleCardHover?: (offer: OfferShortInfo | null) => void;
 }
 
-function OfferCard_({offer, componentType, onHoverCard}: PlaceCardProps) {
+function OfferCard_({offer, componentType, handleCardHover}: PlaceCardProps) {
   const {
     id,
     isPremium,
@@ -38,14 +38,14 @@ function OfferCard_({offer, componentType, onHoverCard}: PlaceCardProps) {
     },
   };
 
-  const mouseOnHandler = () => onHoverCard?.(offer);
-  const mouseOfHandler = () => onHoverCard?.(null);
+  const handleCardMouseOn = () => handleCardHover?.(offer);
+  const handleCardMouseOff = () => handleCardHover?.(null);
 
   return (
     <article
       className={`${componentType}__card place-card`}
-      onMouseEnter={mouseOnHandler}
-      onMouseLeave={mouseOfHandler}
+      onMouseEnter={handleCardMouseOn}
+      onMouseLeave={handleCardMouseOff}
     >
       {isPremium && (
         <div className="place-card__mark">

diff --git a/src/components/offers-list/offers-list.tsx b/src/components/offers-list/offers-list.tsx
@@ -21,7 +21,7 @@ function OffersList ({offersByCity, city}: OffersListProps) {
   }, [setActiveSortOption]);
 
   const {setActiveOffer} = useActionCreators(offersActions);
-  const onHoverCard = useCallback((offerActive: OfferShortInfo | null) => setActiveOffer(offerActive), [setActiveOffer]);
+  const handleCardHover = useCallback((offerActive: OfferShortInfo | null) => setActiveOffer(offerActive), [setActiveOffer]);
 
   if (offersByCity.length === 0) {
     return (
@@ -55,7 +55,7 @@ function OffersList ({offersByCity, city}: OffersListProps) {
               key={offer.id}
               componentType={'cities'}
               offer={offer}
-              onHoverCard={onHoverCard}
+              handleCardHover={handleCardHover}
             />
           ))}
       </div>

diff --git a/src/components/sort/sort.tsx b/src/components/sort/sort.tsx
@@ -14,29 +14,29 @@ function Sort_({activeSortOption, setActiveSortOption}: Props) {
 
   useEffect(() => {
     if (isOn) {
-      const onEscKeyDown = (evt: KeyboardEvent) => {
+      const handleEscKeyDown = (evt: KeyboardEvent) => {
         if (evt.key === 'Escape') {
           evt.preventDefault();
           off();
         }
       };
-      const onClickOutside = (evt: MouseEvent) => {
+      const handleClickOutside = (evt: MouseEvent) => {
         if (sortFormRef.current && !(sortFormRef.current as HTMLElement).contains(evt.target as Node)) {
           off();
         }
       };
 
-      document.addEventListener('keydown', onEscKeyDown);
-      document.addEventListener('click', onClickOutside);
+      document.addEventListener('keydown', handleEscKeyDown);
+      document.addEventListener('click', handleClickOutside);
 
       return () => {
-        document.removeEventListener('keydown', onEscKeyDown);
-        document.removeEventListener('click', onClickOutside);
+        document.removeEventListener('keydown', handleEscKeyDown);
+        document.removeEventListener('click', handleClickOutside);
       };
     }
   }, [isOn, off, activeSortOption]);
 
-  const onClickSortOption = (sortOption: SortOption) => {
+  const handleSortOptionClick = (sortOption: SortOption) => {
     setActiveSortOption(sortOption);
     off();
   };
@@ -56,7 +56,7 @@ function Sort_({activeSortOption, setActiveSortOption}: Props) {
             key={sortOption}
             className={classNames('places__option', activeSortOption === sortOption && 'places__option--active')}
             tabIndex={index}
-            onClick={() => onClickSortOption(sortOption)}
+            onClick={() => handleSortOptionClick(sortOption)}
           >
             {sortOption}
           </li>