Merge pull request #14 from Mayanzev/master

htmlacademy-univer-javascript-3 · May 28, 2024 · f3c8671 · f3c8671
2 parents 1efe9af + bf0f9b6
commit f3c8671
Show file tree

Hide file tree

Showing 7 changed files with 18 additions and 70 deletions.
diff --git a/src/components/offer-card/offer-card.tsx b/src/components/offer-card/offer-card.tsx
@@ -1,7 +1,7 @@
 import { useAppDispatch } from '../../hooks';
 import { Offer } from '../../types/offer';
 import { Link } from 'react-router-dom';
-import { listToCard, ratingPercentage, typeOfCardList } from '../../utils';
+import { listToCard, ratingPercentage, TypeOfCardList } from '../../utils';
 import { fetchNearbyAction, fetchOfferAction, fetchReviewsAction } from '../../store/api-actions';
 import { changeHighlightedMarker } from '../../store/common-data/common-data';
 import ChangeFavoriteButton from '../change-favorite-button/change-favorite-button';
@@ -16,7 +16,7 @@ function OfferCard({ offer, cardType }: OfferProps): JSX.Element {
   return (
     <article
       className={cardType}
-      {...(cardType === listToCard.get(typeOfCardList.standart) && {
+      {...(cardType === listToCard.get(TypeOfCardList.standart) && {
         onMouseEnter: () => dispatch(changeHighlightedMarker(offer.location)),
         onMouseLeave: () => dispatch(changeHighlightedMarker(undefined))
       })}
@@ -26,12 +26,12 @@ function OfferCard({ offer, cardType }: OfferProps): JSX.Element {
           <span>Premium</span>
         </div>
       ) : null}
-      <div className={`${cardType === listToCard.get(typeOfCardList.favourites) ? 'favorites' : 'cities'}__image-wrapper place-card__image-wrapper`}>
-        <a href="#">
-          <img className="place-card__image" src={offer.previewImage} width={cardType === listToCard.get(typeOfCardList.favourites) ? '150' : '260'} height={cardType === listToCard.get(typeOfCardList.favourites) ? '110' : '200'} alt="Place image" />
+      <div className={`${cardType === listToCard.get(TypeOfCardList.favourites) ? 'favorites' : 'cities'}__image-wrapper place-card__image-wrapper`}>
+        <a>
+          <img className="place-card__image" src={offer.previewImage} width={cardType === listToCard.get(TypeOfCardList.favourites) ? '150' : '260'} height={cardType === listToCard.get(TypeOfCardList.favourites) ? '110' : '200'} alt="Place image" />
         </a>
       </div>
-      <div className={(cardType === listToCard.get(typeOfCardList.favourites)) ? 'favorites__card-info place-card__info' : 'place-card__info'}>
+      <div className={(cardType === listToCard.get(TypeOfCardList.favourites)) ? 'favorites__card-info place-card__info' : 'place-card__info'}>
         <div className="place-card__price-wrapper">
           <div className="place-card__price">
             <b className="place-card__price-value">&euro;{offer.price}</b>

diff --git a/src/components/offer-list/offer-list.tsx b/src/components/offer-list/offer-list.tsx
@@ -1,12 +1,12 @@
-import { getSortedOffers, listToCard, typeOfCardList } from '../../utils';
+import { getSortedOffers, listToCard, TypeOfCardList } from '../../utils';
 import { useAppSelector } from '../../hooks';
 import { Offer } from '../../types/offer';
 import OfferCard from '../offer-card/offer-card';
 import { getSortType } from '../../store/common-data/selectors';
 
 type OfferListProps = {
   offers: Offer[];
-  listType: typeOfCardList;
+  listType: TypeOfCardList;
 };
 
 function OfferList({offers, listType}: OfferListProps): JSX.Element {

diff --git a/src/pages/favorites-empty-screen/favorites-empty-screen.tsx b/src/pages/favorites-empty-screen/favorites-empty-screen.tsx
diff --git a/src/pages/favorites-screen/favorites-screen.tsx b/src/pages/favorites-screen/favorites-screen.tsx
@@ -1,5 +1,5 @@
 import { Link } from 'react-router-dom';
-import { typeOfCardList } from '../../utils';
+import { TypeOfCardList } from '../../utils';
 import OfferList from '../../components/offer-list/offer-list';
 import { useAppDispatch, useAppSelector } from '../../hooks';
 import { AppRoute } from '../../const';
@@ -41,7 +41,7 @@ function FavoritesScreen(): JSX.Element {
                         </a>
                       </div>
                     </div>
-                    <OfferList offers={favoriteOffers.filter((o) => o.city.name === city)} listType={typeOfCardList.favourites} />
+                    <OfferList offers={favoriteOffers.filter((o) => o.city.name === city)} listType={TypeOfCardList.favourites} />
                   </li>
                 ))}
               </ul>

diff --git a/src/pages/main-screen/main-screen.tsx b/src/pages/main-screen/main-screen.tsx
@@ -1,6 +1,6 @@
 import OfferList from '../../components/offer-list/offer-list';
 import Map from '../../components/map/map';
-import { typeOfCardList } from '../../utils';
+import { TypeOfCardList } from '../../utils';
 import { useAppSelector } from '../../hooks';
 import CityList from '../../components/city-list/city-list';
 import { Header } from '../../components/header/header';
@@ -35,7 +35,7 @@ function MainScreen(): JSX.Element {
                 <h2 className="visually-hidden">Places</h2>
                 <b className="places__found">{chosenOffers.length} places to stay in {city}</b>
                 <CardsSortingOptions />
-                <OfferList offers={chosenOffers} listType={typeOfCardList.standart} />
+                <OfferList offers={chosenOffers} listType={TypeOfCardList.standart} />
               </section>
               <div className="cities__right-section">
                 <section className="cities__map map">

diff --git a/src/pages/offer-screen/offer-screen.tsx b/src/pages/offer-screen/offer-screen.tsx
@@ -1,7 +1,7 @@
 import ReviewsList from '../../components/reviews-list/reviews-list';
 import Map from '../../components/map/map';
 import OfferList from '../../components/offer-list/offer-list';
-import { ratingPercentage, typeOfCardList } from '../../utils';
+import { ratingPercentage, TypeOfCardList } from '../../utils';
 import { useAppDispatch, useAppSelector } from '../../hooks';
 import { fetchNearbyAction, fetchOfferAction, fetchReviewsAction } from '../../store/api-actions';
 import LoadingScreen from '../loading-screen/loading-screen';
@@ -138,7 +138,7 @@ function OfferScreen(): JSX.Element {
         <div className="container">
           <section className="near-places places">
             <h2 className="near-places__title">Other places in the neighbourhood</h2>
-            <OfferList offers={displayedNearby} listType={typeOfCardList.nearest} />
+            <OfferList offers={displayedNearby} listType={TypeOfCardList.nearest} />
           </section>
         </div>
       </main>

diff --git a/src/utils.ts b/src/utils.ts
@@ -1,16 +1,16 @@
 import { Offer } from './types/offer';
 
-export enum typeOfCardList {
+export enum TypeOfCardList {
     favourites = 'favorites__places',
     nearest = 'near-places__list places__list',
     standart = 'cities__places-list places__list tabs__content',
   }
 
 export const listToCard = new Map(
   [
-    [typeOfCardList.favourites, 'favorites__card place-card'],
-    [typeOfCardList.nearest, 'near-places__card place-card'],
-    [typeOfCardList.standart, 'cities__card place-card']
+    [TypeOfCardList.favourites, 'favorites__card place-card'],
+    [TypeOfCardList.nearest, 'near-places__card place-card'],
+    [TypeOfCardList.standart, 'cities__card place-card']
   ]
 );