diff --git a/src/pages/enum.js b/src/pages/enum.js
new file mode 100644
index 0000000..e3ea41f
--- /dev/null
+++ b/src/pages/enum.js
@@ -0,0 +1,6 @@
+const TABS_ENUM = {
+ MENU: 'menu',
+ REVIEWS: 'reviews',
+};
+
+export default TABS_ENUM;
diff --git a/src/pages/restaurant-page.js b/src/pages/restaurant-page.js
new file mode 100644
index 0000000..76560b2
--- /dev/null
+++ b/src/pages/restaurant-page.js
@@ -0,0 +1,38 @@
+import React from 'react';
+import { connect } from 'react-redux';
+import { createStructuredSelector } from 'reselect';
+import PropTypes from 'prop-types';
+import { restaurantsListSelector } from '../redux/selectors';
+import Menu from '../components/menu';
+import Reviews from '../components/reviews';
+import Restaurants from '../components/restaurants';
+import TABS_ENUM from './enum';
+
+const RestaurantPage = ({ restaurants, match }) => {
+ const { restId, tab } = match.params;
+ const restaurant = restaurants.find((restaurant) => restaurant.id === restId);
+ const { menu, reviews } = restaurant;
+
+ switch (tab) {
+ case TABS_ENUM.MENU:
+ return
;
+ case TABS_ENUM.REVIEWS:
+ return ;
+ default:
+ return ;
+ }
+};
+
+RestaurantPage.propTypes = {
+ restaurants: PropTypes.arrayOf(
+ PropTypes.shape({
+ id: PropTypes.string.isRequired,
+ }).isRequired
+ ).isRequired,
+};
+
+export default connect(
+ createStructuredSelector({
+ restaurants: restaurantsListSelector,
+ })
+)(RestaurantPage);
diff --git a/src/pages/restaurants-page.js b/src/pages/restaurants-page.js
index 9e8e1ed..0163dd6 100644
--- a/src/pages/restaurants-page.js
+++ b/src/pages/restaurants-page.js
@@ -1,6 +1,6 @@
import React, { useEffect } from 'react';
import { connect } from 'react-redux';
-import { Route } from 'react-router-dom';
+import { Route, Link, Switch } from 'react-router-dom';
import { createStructuredSelector } from 'reselect';
import Restaurants from '../components/restaurants';
import Loader from '../components/loader';
@@ -11,6 +11,7 @@ import {
restaurantsLoadingSelector,
} from '../redux/selectors';
import { loadRestaurants } from '../redux/actions';
+import RestaurantPage from './restaurant-page';
function RestaurantsPage({ loading, loaded, loadRestaurants, match }) {
useEffect(() => {
@@ -28,7 +29,12 @@ function RestaurantsPage({ loading, loaded, loadRestaurants, match }) {
);
}
- return ;
+ return (
+
+ ;
+ ;
+
+ );
}
export default connect(
diff --git a/src/redux/selectors.js b/src/redux/selectors.js
index ca4f2a9..ceabbda 100644
--- a/src/redux/selectors.js
+++ b/src/redux/selectors.js
@@ -28,6 +28,18 @@ export const restaurantsListSelector = createSelector(
Object.values
);
+export const restaurantIdByProductIdSelector = (state, props) =>
+ Object.values(restaurantsSelector(state)).find((rest) =>
+ rest.menu.includes(props.product.id)
+ ).id;
+
+export const restaurantSelector = getById(restaurantsSelector);
+
+export const reviewsListSelector = createSelector(
+ reviewsSelector,
+ Object.values
+);
+
export const productAmountSelector = getById(orderSelector, 0);
export const productSelector = getById(productsSelector);
const reviewSelector = getById(reviewsSelector);