From 2c68c6ac41cd1862b78500dbfa33740eb27a85be Mon Sep 17 00:00:00 2001
From: Gurikov Maxim <maximgurikoff@gmail.com>
Date: Sat, 23 Nov 2024 20:32:55 +0500
Subject: [PATCH] fixes

---
 src/Pages/main-page/main-page.tsx      |  2 +-
 src/components/offer/offer-card.tsx    |  3 ++-
 src/components/offer/offer-gallery.tsx |  2 +-
 src/components/offer/offer-host.tsx    | 14 ++++++++++++--
 src/components/rating.tsx              |  2 +-
 src/components/reviews/reviews.tsx     |  5 ++++-
 src/dataTypes/enums/room-type.ts       |  2 ++
 7 files changed, 23 insertions(+), 7 deletions(-)

diff --git a/src/Pages/main-page/main-page.tsx b/src/Pages/main-page/main-page.tsx
index a78219c..e3227a1 100644
--- a/src/Pages/main-page/main-page.tsx
+++ b/src/Pages/main-page/main-page.tsx
@@ -24,7 +24,7 @@ export function MainPage(): React.JSX.Element {
     : `${pluralizeAndCombine('place', offers.length)} to stay in ${city.name}`;
   return (
     <div className="page page--gray page--main">
-      <Layout showFooter>
+      <Layout>
         <main className="page__main page__main--index">
           <Helmet>6 cities</Helmet>
           <h1 className="visually-hidden">Cities</h1>
diff --git a/src/components/offer/offer-card.tsx b/src/components/offer/offer-card.tsx
index 2fa3889..13184bf 100644
--- a/src/components/offer/offer-card.tsx
+++ b/src/components/offer/offer-card.tsx
@@ -4,6 +4,7 @@ import { AppRoutes } from '../../dataTypes/enums/app-routes.ts';
 import cn from 'classnames';
 import { Rating } from '../rating.tsx';
 import { BookmarkButton } from '../bookmark-button.tsx';
+import { capitalize } from '../../utils/string-utils.ts';
 
 interface PlaceCardProps {
   id: string;
@@ -82,7 +83,7 @@ export function OfferCard({
         <h2 className="place-card__name">
           <Link to={`${AppRoutes.Offer}/${id}`}>{title}</Link>
         </h2>
-        <p className="place-card__type">{type}</p>
+        <p className="place-card__type">{capitalize(type)}</p>
       </div>
     </article>
   );
diff --git a/src/components/offer/offer-gallery.tsx b/src/components/offer/offer-gallery.tsx
index a1047be..291b84b 100644
--- a/src/components/offer/offer-gallery.tsx
+++ b/src/components/offer/offer-gallery.tsx
@@ -10,7 +10,7 @@ export function OfferGallery({
   return (
     <div className="offer__gallery-container container">
       <div className="offer__gallery">
-        {imageSources.map((src) => (
+        {imageSources.slice(0, 6).map((src) => (
           <div key={`${src}`} className="offer__image-wrapper">
             <img className="offer__image" src={src} alt="Photo studio" />
           </div>
diff --git a/src/components/offer/offer-host.tsx b/src/components/offer/offer-host.tsx
index e4c288b..18b0e14 100644
--- a/src/components/offer/offer-host.tsx
+++ b/src/components/offer/offer-host.tsx
@@ -11,7 +11,17 @@ export function OfferHost({ host }: OfferHostProps): React.JSX.Element {
     <>
       <h2 className="offer__host-title">Meet the host</h2>
       <div className="offer__host-user user">
-        <div className="offer__avatar-wrapper offer__avatar-wrapper--pro user__avatar-wrapper">
+        {host.isPro ? (
+          <div className="offer__avatar-wrapper offer__avatar-wrapper--pro user__avatar-wrapper">
+            <img
+              className="offer__avatar user__avatar"
+              src={host.avatarUrl}
+              width="74"
+              height="74"
+              alt="Host avatar"
+            />
+          </div>
+        ) : (
           <img
             className="offer__avatar user__avatar"
             src={host.avatarUrl}
@@ -19,7 +29,7 @@ export function OfferHost({ host }: OfferHostProps): React.JSX.Element {
             height="74"
             alt="Host avatar"
           />
-        </div>
+        )}
         <span className="offer__user-name">{getFirstName(host.name)}</span>
         {host.isPro && <span className="offer__user-status">Pro</span>}
       </div>
diff --git a/src/components/rating.tsx b/src/components/rating.tsx
index 7db3415..c4c888e 100644
--- a/src/components/rating.tsx
+++ b/src/components/rating.tsx
@@ -14,7 +14,7 @@ export function Rating({
   return (
     <div className={`${usePlace}__rating rating`}>
       <div className={`${usePlace}__stars rating__stars`}>
-        <span style={{ width: `${rating * 20}%` }}></span>
+        <span style={{ width: `${Math.round(rating) * 20}%` }}></span>
         <span className="visually-hidden">Rating</span>
       </div>
       {isInOffer && (
diff --git a/src/components/reviews/reviews.tsx b/src/components/reviews/reviews.tsx
index 3959b45..654da16 100644
--- a/src/components/reviews/reviews.tsx
+++ b/src/components/reviews/reviews.tsx
@@ -9,6 +9,9 @@ interface ReviewsProps {
 }
 
 export function Reviews({ reviews }: ReviewsProps): React.JSX.Element {
+  const sortedReviews = reviews
+    .toSorted((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime())
+    .slice(0, 10);
   const isAuthorized =
     useAppSelector((state) => state.authorizationStatus) ===
     AuthorizationStatus.Authorized;
@@ -16,7 +19,7 @@ export function Reviews({ reviews }: ReviewsProps): React.JSX.Element {
   return (
     <section className="offer__reviews reviews">
       {reviewsAvailable ? (
-        <ReviewsList reviews={reviews} />
+        <ReviewsList reviews={sortedReviews} />
       ) : (
         <span
           className="reviews__item"
diff --git a/src/dataTypes/enums/room-type.ts b/src/dataTypes/enums/room-type.ts
index 86c0b35..5dc51f5 100644
--- a/src/dataTypes/enums/room-type.ts
+++ b/src/dataTypes/enums/room-type.ts
@@ -1,4 +1,6 @@
 export enum RoomType {
   Apartment = 'Apartment',
   Room = 'Room',
+  Hotel = 'Hotel',
+  House = 'House',
 }