diff --git a/README.md b/README.md
index d11fdd6..c52dcfa 100644
--- a/README.md
+++ b/README.md
@@ -50,3 +50,9 @@
5. При загрузках показывать лоадеры, все грузить максимально низко, там где эти данные нужны
6. Все данные грузить только один раз (не загружать повторно данные, которые уже есть)
7. (Опционально) переписать все на **immer**
+
+## HT6
+
+1. Сделать reviews/menu отдельными роутами (**/restaurants/:id/reviews**)
+2. Сделать редиректы со **/** и с **/restaurants/:id** на страницу ресторана с меню
+3. В корзине сделать продукты линками на их ресторан
diff --git a/package.json b/package.json
index c4bee90..7769a7d 100644
--- a/package.json
+++ b/package.json
@@ -12,6 +12,7 @@
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-redux": "^7.2.5",
+ "react-router-dom": "^5.3.0",
"react-scripts": "4.0.3",
"redux": "^4.1.1",
"redux-devtools-extension": "^2.13.9",
diff --git a/src/components/app/app.js b/src/components/app/app.js
index b10a175..eebabc8 100644
--- a/src/components/app/app.js
+++ b/src/components/app/app.js
@@ -1,13 +1,20 @@
import { PureComponent } from 'react';
+import { Route, Switch } from 'react-router-dom';
import Restaurants from '../restaurants';
import Header from '../header';
+import Basket from '../basket';
export default class App extends PureComponent {
render() {
return (
-
+
+
Home page
} />
+
+
+
404 - Not found :(
} />
+
);
}
diff --git a/src/components/basket/basket.js b/src/components/basket/basket.js
index 4b6e320..ac2f8e0 100644
--- a/src/components/basket/basket.js
+++ b/src/components/basket/basket.js
@@ -1,4 +1,5 @@
import { connect } from 'react-redux';
+import { Link } from 'react-router-dom';
import styles from './basket.module.css';
import itemStyles from './basket-item/basket-item.module.css';
@@ -35,9 +36,11 @@ function Basket({ title = 'Basket', total, orderProducts }) {
{`${total} $`}
-
+
+
+
);
}
diff --git a/src/components/header/header.js b/src/components/header/header.js
index 8d5c5c3..c0e8fce 100644
--- a/src/components/header/header.js
+++ b/src/components/header/header.js
@@ -1,9 +1,12 @@
+import { Link } from 'react-router-dom';
import { ReactComponent as Logo } from '../../icons/logo.svg';
import styles from './header.module.css';
const Header = () => (
-
+
+
+
);
diff --git a/src/components/restaurants/restaurants.js b/src/components/restaurants/restaurants.js
index 79ed192..bf17a3c 100644
--- a/src/components/restaurants/restaurants.js
+++ b/src/components/restaurants/restaurants.js
@@ -1,41 +1,46 @@
-import { useEffect, useMemo } from 'react';
+import { useEffect } from 'react';
import { connect } from 'react-redux';
+import { NavLink, Switch, Route, Redirect } from 'react-router-dom';
import PropTypes from 'prop-types';
import Restaurant from '../restaurant';
-import Tabs from '../tabs';
import Loader from '../loader';
import {
restaurantsListSelector,
- activeIdRestaurantSelector,
restaurantsLoadingSelector,
restaurantsLoadedSelector,
} from '../../redux/selectors';
-import { loadRestaurants, changeRestaurant } from '../../redux/actions';
+import { loadRestaurants } from '../../redux/actions';
-function Restaurants({
- restaurants,
- activeId,
- loading,
- loaded,
- loadRestaurants,
- changeRestaurant,
-}) {
+import styles from './restaurants.module.css';
+
+function Restaurants({ restaurants, loading, loaded, loadRestaurants }) {
useEffect(() => {
if (!loading && !loaded) loadRestaurants();
}, [loading, loaded, loadRestaurants]);
- const tabs = useMemo(
- () => restaurants.map(({ id, name }) => ({ id, label: name })),
- [restaurants]
- );
-
if (loading) return ;
if (!loaded) return 'No data :(';
return (