From 7fdd11f312f6972557d0752bcab54e978bb2d8b1 Mon Sep 17 00:00:00 2001
From: mayonnaise <90057279+Mayanzev@users.noreply.github.com>
Date: Wed, 29 May 2024 14:15:33 +0300
Subject: [PATCH] final

---
 src/pages/offer-screen/offer-screen.tsx | 9 +++++++--
 src/services/api.ts                     | 2 +-
 src/store/offer-data/offer-data.ts      | 3 +++
 3 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/pages/offer-screen/offer-screen.tsx b/src/pages/offer-screen/offer-screen.tsx
index c014513..ee60d13 100644
--- a/src/pages/offer-screen/offer-screen.tsx
+++ b/src/pages/offer-screen/offer-screen.tsx
@@ -12,6 +12,7 @@ import { getChosenOffer, getIsChosenOfferDataLoading, getNearbyOffers, getReview
 import { getOffers } from '../../store/offers-data/selectors';
 import { changeHighlightedMarker } from '../../store/common-data/common-data';
 import ChangeFavoriteButton from '../../components/change-favorite-button/change-favorite-button';
+import NotFoundScreen from '../not-found-screen/not-found-screen';
 
 const MAXIMUM_NEARBY_PREVIEW = 3;
 
@@ -20,7 +21,7 @@ function OfferScreen(): JSX.Element {
   const offer = useAppSelector(getChosenOffer);
   const reviews = useAppSelector(getReviews);
   const nearbyOffers = useAppSelector(getNearbyOffers);
-  const city = useAppSelector(getOffers)[0].city;
+  const offers = useAppSelector(getOffers);
   const id = String(useParams().id);
 
   const displayedNearby = (nearbyOffers).slice(
@@ -42,6 +43,10 @@ function OfferScreen(): JSX.Element {
     );
   }
 
+  if (!offer) {
+    return <NotFoundScreen />;
+  }
+
   const bedrooms = offer?.bedrooms;
   const maxAdults = offer?.maxAdults;
 
@@ -132,7 +137,7 @@ function OfferScreen(): JSX.Element {
             </div>
           </div>
           <section className="offer__map map">
-            <Map points={displayedNearby.map((nearOffer) => nearOffer.location)} city={nearbyOffers.length > 0 ? nearbyOffers[0].city : city} />
+            <Map points={displayedNearby.map((nearOffer) => nearOffer.location)} city={nearbyOffers.length > 0 ? nearbyOffers[0].city : offers[0].city} />
           </section>
         </section>
         <div className="container">
diff --git a/src/services/api.ts b/src/services/api.ts
index 35f6851..d179801 100644
--- a/src/services/api.ts
+++ b/src/services/api.ts
@@ -16,7 +16,7 @@ const StatusCodeMapping: Record<number, boolean> = {
 
 const shouldDisplayError = (response: AxiosResponse) => !!StatusCodeMapping[response.status];
 
-const BACKEND_URL = 'https://14.design.htmlacademy.pro/six-cities';
+const BACKEND_URL = 'https://14.design.htmlacademy.pro/six-citie';
 const REQUEST_TIMEOUT = 5000;
 
 export const createAPI = (): AxiosInstance => {
diff --git a/src/store/offer-data/offer-data.ts b/src/store/offer-data/offer-data.ts
index a6fbc4d..95c86fc 100644
--- a/src/store/offer-data/offer-data.ts
+++ b/src/store/offer-data/offer-data.ts
@@ -26,6 +26,9 @@ export const offerData = createSlice({
       .addCase(fetchOfferAction.pending, (state) => {
         state.isChosenOfferDataLoading = true;
       })
+      .addCase(fetchOfferAction.rejected, (state) => {
+        state.isChosenOfferDataLoading = false;
+      })
       .addCase(fetchReviewsAction.fulfilled, (state, action) => {
         state.isChosenOfferDataLoading = false;
         state.reviews = action.payload;