добавление рандомного города на странице логина

src/components/login-city-link/login-city-link.tsx

@@ -0,0 +1,19 @@
+import {getRandomElement} from '../../utils/common.ts';
+import {CITIES} from '../../const.ts';
+import {Link} from 'react-router-dom';
+
+function LoginCityLink() {
+  const randomCity = getRandomElement(CITIES);
+
+  return (
+    <section className="locations locations--login locations--current">
+      <div className="locations__item">
+        <Link to={randomCity.slug} className="locations__item-link">
+          <span>{randomCity.name}</span>
+        </Link>
+      </div>
+    </section>
+  );
+}
+
+export default LoginCityLink;

src/pages/login/login.tsx

@@ -1,6 +1,7 @@
 import Logo from '../../components/logo/logo.tsx';
 import {useDocumentTitle} from '../../hooks/document-title.ts';
 import LoginForm from '../../components/form-login/login-form.tsx';
+import LoginCityLink from '../../components/login-city-link/login-city-link.tsx';
 
 interface LoginProps {
   title?: string;
@@ -27,13 +28,7 @@ function Login({title = 'Login'}: LoginProps) {
             <h1 className="login__title">Sign in</h1>
             <LoginForm />
           </section>
-          <section className="locations locations--login locations--current">
-            <div className="locations__item">
-              <a className="locations__item-link" href="#">
-                <span>Amsterdam</span>
-              </a>
-            </div>
-          </section>
+          <LoginCityLink />
         </div>
       </main>
     </div>

src/pages/main/main.tsx

@@ -26,12 +26,10 @@ function Main({title = 'Main', citySlug}: MainProps) {
   const allOffers = useAppSelector(offersSelectors.offers);
 
   useEffect(() => {
-    if (status === RequestStatus.Idle) {
-      fetchOffers().unwrap().catch((err: AxiosError) => {
-        toast.warning(err.message);
-      }) ;
-    }
-  }, [status, fetchOffers]);
+    fetchOffers().unwrap().catch((err: AxiosError) => {
+      toast.warning(err.message);
+    }) ;
+  }, []);
 
 
   const activeCity = CITIES.find((city) => city.slug === citySlug);

src/utils/common.ts

@@ -7,4 +7,9 @@ const capitalizeFirstLetter = (string: string) => string.charAt(0).toUpperCase()
 
 const getCitySlug = (cityName: CityName) => CITIES.find((city) => city.name === cityName)?.slug;
 
-export {getRatingValue, capitalizeFirstLetter, getCitySlug};
+const getRandomElement = <T>(arr:readonly T[]): T => {
+  const randomIndex = Math.floor(Math.random() * arr.length);
+  return arr[randomIndex];
+};
+
+export {getRatingValue, capitalizeFirstLetter, getCitySlug, getRandomElement};