From 51f74f21f44f36aed9e21f935b18f12773bf8452 Mon Sep 17 00:00:00 2001 From: Aleksey Obukhov Date: Thu, 19 Jan 2023 20:39:38 +0300 Subject: [PATCH 1/4] =?UTF-8?q?=D1=80=D0=B5=D0=B0=D0=BA=D1=82-=D0=BA=D0=BE?= =?UTF-8?q?=D0=BD=D1=82=D0=B5=D0=BA=D1=81=D1=82=20=D0=B8=20=D1=81=D0=BE?= =?UTF-8?q?=D1=85=D1=80=D0=B0=D0=BD=D0=B5=D0=BD=D0=B8=D0=B5=20=D0=B7=D0=B0?= =?UTF-8?q?=D0=BA=D0=B0=D0=B7=D0=B0=20=D0=BD=D0=B0=20=D1=81=D0=B5=D1=80?= =?UTF-8?q?=D0=B2=D0=B5=D1=80=D0=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/app/app.jsx | 50 +++++++++++-------- .../burger-constructor-order.jsx | 25 ++++++---- .../burger-constructor/burger-constructor.jsx | 33 ++++++++---- .../burger-constructor.module.css | 4 +- .../burger-ingredients-item.jsx | 32 +++++++++--- .../burger-ingredients/burger-ingredients.jsx | 2 +- .../order-details/order-details.jsx | 2 +- src/services/order-context.js | 3 ++ src/services/sum-reducer.js | 12 +++++ src/utils/api-constants.js | 4 ++ src/utils/dataLoad.js | 11 ++-- src/utils/orderCreate.js | 30 +++++++++++ 12 files changed, 150 insertions(+), 58 deletions(-) create mode 100644 src/services/order-context.js create mode 100644 src/services/sum-reducer.js create mode 100644 src/utils/api-constants.js create mode 100644 src/utils/orderCreate.js diff --git a/src/components/app/app.jsx b/src/components/app/app.jsx index 6945fb6..45f9bc9 100644 --- a/src/components/app/app.jsx +++ b/src/components/app/app.jsx @@ -1,6 +1,9 @@ -import { useEffect, useState } from 'react'; -import styles from './app.module.css'; +import { useEffect, useState, useReducer } from 'react'; import { dataLoad } from '../../utils/dataLoad'; +import { sumReducer, sumInitialValue } from '../../services/sum-reducer'; +import { OrderContext } from '../../services/order-context'; + +import styles from './app.module.css'; import AppHeader from '../app-header/app-header'; import BurgerConstructor from '../burger-constructor/burger-constructor'; import BurgerIngredients from '../burger-ingredients/burger-ingredients'; @@ -14,15 +17,19 @@ function App() { useEffect(() => { dataLoad() - .then(data => { - setState({ data: data, isLoading: false, isError: false }); - }) - .catch(err => { - console.log('ошибка получения данных', err); - setState({ data: null, isLoading: false, isError: true }); - }); + .then(data => { + setState({ data: data, isLoading: false, isError: false }); + }) + .catch(err => { + console.log('ошибка получения данных', err); + setState({ data: null, isLoading: false, isError: true }); + }); }, []); + const [bun, setBun] = useState(null); + const [ingredients, setIngredients] = useState([]); + const [sumState, sumDispatcher] = useReducer(sumReducer, sumInitialValue); + return ( <> {(state.isLoading || state.isError) ? ( @@ -32,17 +39,20 @@ function App() {

) : - state.data && ( - <> - -
-
- - -
-
- - )} + state.data && ( + <> + +
+
+ + + + +
+
+ + )} ); } diff --git a/src/components/burger-constructor-order/burger-constructor-order.jsx b/src/components/burger-constructor-order/burger-constructor-order.jsx index f70af62..2d899aa 100644 --- a/src/components/burger-constructor-order/burger-constructor-order.jsx +++ b/src/components/burger-constructor-order/burger-constructor-order.jsx @@ -1,14 +1,24 @@ -import { useState } from 'react'; -import PropTypes from 'prop-types'; +import { useState, useContext } from 'react'; import { CurrencyIcon, Button } from "@ya.praktikum/react-developer-burger-ui-components"; import styles from './burger-constructor-order.module.css'; import OrderDetails from '../order-details/order-details'; +import { OrderContext } from '../../services/order-context'; +import { orderCreate } from '../../utils/orderCreate'; -function BurgerConstructorOrder({ sum, number }) { +function BurgerConstructorOrder() { const [show, setShow] = useState(false); + const [number, setNumber] = useState(''); + const { ingredients, sumState } = useContext(OrderContext); function showOrder() { - setShow(true); + orderCreate(ingredients) + .then(num => { + setNumber(num); + setShow(true); + }) + .catch(error => { + console.log(error); + }); } function hideOrder() { @@ -17,7 +27,7 @@ function BurgerConstructorOrder({ sum, number }) { return (
-
{sum}
+
{sumState.sum}
{show && } @@ -25,9 +35,4 @@ function BurgerConstructorOrder({ sum, number }) { ); } -BurgerConstructorOrder.propTypes = { - sum: PropTypes.number.isRequired, - number: PropTypes.string.isRequired -} - export default BurgerConstructorOrder; \ No newline at end of file diff --git a/src/components/burger-constructor/burger-constructor.jsx b/src/components/burger-constructor/burger-constructor.jsx index 3331856..8b13e5b 100644 --- a/src/components/burger-constructor/burger-constructor.jsx +++ b/src/components/burger-constructor/burger-constructor.jsx @@ -1,18 +1,33 @@ -import { useMemo } from 'react'; +import { useContext, useEffect } from 'react'; import PropTypes from 'prop-types'; import styles from './burger-constructor.module.css'; import { dataPropTypes } from '../../utils/dataPropTypes'; import { BUN } from '../../utils/dataNames'; import { ConstructorElement, DragIcon } from '@ya.praktikum/react-developer-burger-ui-components'; import BurgerConstructorOrder from '../burger-constructor-order/burger-constructor-order'; - +import { OrderContext } from '../../services/order-context'; function BurgerConstructor({ data }) { - const list = useMemo(() => data.filter(item => item.type !== BUN), [data]); - const bun = useMemo(() => data.find(item => item.type === BUN), [data]); - const sum = useMemo(() => bun.price * 2 + list.reduce((sum, item) => sum += item.price, 0), [list, bun]); - return ( + const { bun, setBun, ingredients, setIngredients, sumDispatcher } = useContext(OrderContext); + + useEffect(() => { + const buns = data.filter(item => item.type === BUN); + setBun(buns[Math.floor(Math.random() * buns.length)]); + + const list = data.filter(item => item.type !== BUN && + Math.round(Math.random()) === 1); + setIngredients(list); + }, [data, setBun, setIngredients]); + + useEffect(() => { + if (bun) { + const sum = bun.price * 2 + ingredients.reduce((sum, item) => sum += item.price, 0); + sumDispatcher({ type: 'set', value: sum }); + } + }, [bun, ingredients, sumDispatcher]); + + return bun && (
    - {list.map((item, index) => ( + {ingredients.map((item, index) => (
  • - +
- +
); } diff --git a/src/components/burger-constructor/burger-constructor.module.css b/src/components/burger-constructor/burger-constructor.module.css index db08878..79fe08a 100644 --- a/src/components/burger-constructor/burger-constructor.module.css +++ b/src/components/burger-constructor/burger-constructor.module.css @@ -55,12 +55,10 @@ .list-item { display: flex; align-items: center; + cursor: move; } .ingredient { background: var(--background); } -.draggable { - cursor: grabbing; -} diff --git a/src/components/burger-ingredients-item/burger-ingredients-item.jsx b/src/components/burger-ingredients-item/burger-ingredients-item.jsx index 1a14721..5226636 100644 --- a/src/components/burger-ingredients-item/burger-ingredients-item.jsx +++ b/src/components/burger-ingredients-item/burger-ingredients-item.jsx @@ -1,12 +1,31 @@ -import { useState } from 'react'; -import PropTypes from 'prop-types'; +import { useState, useContext, useMemo } from 'react'; import { dataPropTypes } from '../../utils/dataPropTypes'; +import { OrderContext } from '../../services/order-context'; + import styles from './burger-ingredients-item.module.css'; import { CurrencyIcon, Counter } from '@ya.praktikum/react-developer-burger-ui-components'; import IngredientDetails from '../ingredient-details/ingredient-details'; +import { BUN } from '../../utils/dataNames'; + +function BurgerIngredientItem({ item }) { + const [ show, setShow ] = useState(false); + const { ingredients, bun } = useContext(OrderContext); + + const count = useMemo(() => { + if (item.type === BUN && bun) { + return bun._id === item._id ? 1 : 0; + } + else { + const list = ingredients.filter(i => i._id === item._id); + return list.length; + } + }, [item, bun, ingredients]); -function BurgerIngredientItem({ item, count }) { - const [show, setShow] = useState(false); +// useEffect(() => { +// const list = ingredients.filter(i => i._id = item._id); +// console.log(`item: ${item.name}, list: ${list.length}, ing: ${ingredients.length}`); +// setCount(list.length); + // }, [item, ingredients, setCount]); function showDialog() { setShow(true); @@ -25,15 +44,14 @@ function BurgerIngredientItem({ item, count }) {
{item.name}
- {count && count > 0 ? : undefined} + {count > 0 && } {show && } ); } BurgerIngredientItem.propTypes = { - item: dataPropTypes.isRequired, - count: PropTypes.number + item: dataPropTypes.isRequired } export default BurgerIngredientItem; \ No newline at end of file diff --git a/src/components/burger-ingredients/burger-ingredients.jsx b/src/components/burger-ingredients/burger-ingredients.jsx index 98cdad3..7005dab 100644 --- a/src/components/burger-ingredients/burger-ingredients.jsx +++ b/src/components/burger-ingredients/burger-ingredients.jsx @@ -35,7 +35,7 @@ function BurgerIngredients({ data }) {

{names[type]}

    {groups[type].map((item, index) => ( - + ))}
diff --git a/src/components/order-details/order-details.jsx b/src/components/order-details/order-details.jsx index 8a740a0..e8a0878 100644 --- a/src/components/order-details/order-details.jsx +++ b/src/components/order-details/order-details.jsx @@ -16,7 +16,7 @@ function OrderDetails({ number, onClose }) { } OrderDetails.propTypes = { - number: PropTypes.string.isRequired, + number: PropTypes.number.isRequired, onClose: PropTypes.func.isRequired } diff --git a/src/services/order-context.js b/src/services/order-context.js new file mode 100644 index 0000000..4406ea0 --- /dev/null +++ b/src/services/order-context.js @@ -0,0 +1,3 @@ +import { createContext } from 'react'; + +export const OrderContext = createContext(); \ No newline at end of file diff --git a/src/services/sum-reducer.js b/src/services/sum-reducer.js new file mode 100644 index 0000000..cdfd315 --- /dev/null +++ b/src/services/sum-reducer.js @@ -0,0 +1,12 @@ +export const sumInitialValue = { sum: 0 }; + +export function sumReducer(state, action) { + switch (action.type) { + case 'set': + return { sum: action.value }; + case 'reset': + return sumInitialValue; + default: + throw Error(`Неверное действие: ${action.type}`); + } +} diff --git a/src/utils/api-constants.js b/src/utils/api-constants.js new file mode 100644 index 0000000..436ecf1 --- /dev/null +++ b/src/utils/api-constants.js @@ -0,0 +1,4 @@ +export const DOMAIN = "https://norma.nomoreparties.space"; +export const API_LOAD = "/api/ingredients"; +export const API_ORDER = "/api/orders"; +export const STATUS_OK = 200; diff --git a/src/utils/dataLoad.js b/src/utils/dataLoad.js index 99032bc..73dcf46 100644 --- a/src/utils/dataLoad.js +++ b/src/utils/dataLoad.js @@ -1,9 +1,7 @@ -const DOMAIN = "https://norma.nomoreparties.space"; -const API = "/api/ingredients"; -const STATUS_OK = 200; +import { DOMAIN, API_LOAD, STATUS_OK } from './api-constants'; export function dataLoad() { - return fetch(`${DOMAIN}${API}`) + return fetch(`${DOMAIN}${API_LOAD}`) .then(res => { if (res.status !== STATUS_OK) { throw Error(`Неверный html-статус ответа: ${res.status}: ${res.statusText}`); @@ -17,9 +15,8 @@ export function dataLoad() { if (res.data && res.data.length > 0) { return res.data; - } - else { - throw Error('возвращен пустой или некорректный набор данных'); + } else { + throw Error('Возвращен пустой или некорректный набор данных'); } }); } diff --git a/src/utils/orderCreate.js b/src/utils/orderCreate.js new file mode 100644 index 0000000..3d56ce6 --- /dev/null +++ b/src/utils/orderCreate.js @@ -0,0 +1,30 @@ +import { DOMAIN, API_ORDER, STATUS_OK } from './api-constants'; + +export function orderCreate(ingredients) { + return fetch(`${DOMAIN}${API_ORDER}`, { + method: "POST", + headers: { + 'Content-Type': 'application/json;charset=utf-8' + }, + body: JSON.stringify({ ingredients: ingredients.map(item => item._id) }) + }) + .then(res => { + if (res.status !== STATUS_OK) { + console.log(`Неверный html-статус ответа: ${res.status}: ${res.statusText}`); + } + return res.json(); + }) + .then(res => { + if (res.success) { + + if (res.order && typeof res.order.number === "number") { + return res.order.number; + } else { + throw Error('Не найден order.number внутри ответа'); + } + } + else { + throw Error(`Ошибка от сервера: ${res.message}`); + } + }); +} From 485c8c0fd13d1177f5bb28743687e34b0527aca3 Mon Sep 17 00:00:00 2001 From: Aleksey Obukhov Date: Fri, 20 Jan 2023 12:25:19 +0300 Subject: [PATCH 2/4] =?UTF-8?q?=D0=B8=D1=81=D0=BF=D1=80=D0=B0=D0=B2=D0=BB?= =?UTF-8?q?=D0=B5=D0=BD=D0=B8=D0=B5=20=D0=BF=D0=BE=20=D1=80=D0=B5=D0=B7?= =?UTF-8?q?=D1=83=D0=BB=D1=8C=D1=82=D0=B0=D1=82=D0=B0=D0=BC=20=D1=80=D0=B5?= =?UTF-8?q?=D0=B2=D1=8C=D1=8E?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/app/app.jsx | 6 ++-- .../burger-constructor-order.jsx | 7 +++- .../burger-constructor/burger-constructor.jsx | 10 ++---- .../burger-ingredients-item.jsx | 17 +++++----- .../burger-ingredients/burger-ingredients.jsx | 16 ++++----- .../ingredient-details/ingredient-details.jsx | 11 +++--- src/components/modal/modal.jsx | 2 +- .../order-details/order-details.jsx | 12 +++---- src/utils/dataLoad.js | 11 ++---- src/utils/orderCreate.js | 34 ++++++++----------- src/utils/request.js | 12 +++++++ 11 files changed, 64 insertions(+), 74 deletions(-) create mode 100644 src/utils/request.js diff --git a/src/components/app/app.jsx b/src/components/app/app.jsx index 45f9bc9..7705015 100644 --- a/src/components/app/app.jsx +++ b/src/components/app/app.jsx @@ -44,10 +44,10 @@ function App() {
- - - + +
diff --git a/src/components/burger-constructor-order/burger-constructor-order.jsx b/src/components/burger-constructor-order/burger-constructor-order.jsx index 2d899aa..95f2b25 100644 --- a/src/components/burger-constructor-order/burger-constructor-order.jsx +++ b/src/components/burger-constructor-order/burger-constructor-order.jsx @@ -4,6 +4,7 @@ import styles from './burger-constructor-order.module.css'; import OrderDetails from '../order-details/order-details'; import { OrderContext } from '../../services/order-context'; import { orderCreate } from '../../utils/orderCreate'; +import Modal from '../modal/modal'; function BurgerConstructorOrder() { const [show, setShow] = useState(false); @@ -30,7 +31,11 @@ function BurgerConstructorOrder() {
{sumState.sum}
- {show && } + {show && ( + + + + )} ); } diff --git a/src/components/burger-constructor/burger-constructor.jsx b/src/components/burger-constructor/burger-constructor.jsx index 8b13e5b..b00c163 100644 --- a/src/components/burger-constructor/burger-constructor.jsx +++ b/src/components/burger-constructor/burger-constructor.jsx @@ -1,15 +1,13 @@ import { useContext, useEffect } from 'react'; -import PropTypes from 'prop-types'; import styles from './burger-constructor.module.css'; -import { dataPropTypes } from '../../utils/dataPropTypes'; import { BUN } from '../../utils/dataNames'; import { ConstructorElement, DragIcon } from '@ya.praktikum/react-developer-burger-ui-components'; import BurgerConstructorOrder from '../burger-constructor-order/burger-constructor-order'; import { OrderContext } from '../../services/order-context'; -function BurgerConstructor({ data }) { +function BurgerConstructor() { - const { bun, setBun, ingredients, setIngredients, sumDispatcher } = useContext(OrderContext); + const { data, bun, setBun, ingredients, setIngredients, sumDispatcher } = useContext(OrderContext); useEffect(() => { const buns = data.filter(item => item.type === BUN); @@ -66,8 +64,4 @@ function BurgerConstructor({ data }) { ); } -BurgerConstructor.propTypes = { - data: PropTypes.arrayOf(dataPropTypes.isRequired).isRequired -} - export default BurgerConstructor; \ No newline at end of file diff --git a/src/components/burger-ingredients-item/burger-ingredients-item.jsx b/src/components/burger-ingredients-item/burger-ingredients-item.jsx index 5226636..9793350 100644 --- a/src/components/burger-ingredients-item/burger-ingredients-item.jsx +++ b/src/components/burger-ingredients-item/burger-ingredients-item.jsx @@ -1,14 +1,15 @@ import { useState, useContext, useMemo } from 'react'; import { dataPropTypes } from '../../utils/dataPropTypes'; import { OrderContext } from '../../services/order-context'; +import { BUN } from '../../utils/dataNames'; import styles from './burger-ingredients-item.module.css'; import { CurrencyIcon, Counter } from '@ya.praktikum/react-developer-burger-ui-components'; import IngredientDetails from '../ingredient-details/ingredient-details'; -import { BUN } from '../../utils/dataNames'; +import Modal from '../modal/modal'; function BurgerIngredientItem({ item }) { - const [ show, setShow ] = useState(false); + const [show, setShow] = useState(false); const { ingredients, bun } = useContext(OrderContext); const count = useMemo(() => { @@ -21,12 +22,6 @@ function BurgerIngredientItem({ item }) { } }, [item, bun, ingredients]); -// useEffect(() => { -// const list = ingredients.filter(i => i._id = item._id); -// console.log(`item: ${item.name}, list: ${list.length}, ing: ${ingredients.length}`); -// setCount(list.length); - // }, [item, ingredients, setCount]); - function showDialog() { setShow(true); } @@ -45,7 +40,11 @@ function BurgerIngredientItem({ item }) {
{item.name}
{count > 0 && } - {show && } + {show && ( + + + + )} ); } diff --git a/src/components/burger-ingredients/burger-ingredients.jsx b/src/components/burger-ingredients/burger-ingredients.jsx index 7005dab..7fdbd34 100644 --- a/src/components/burger-ingredients/burger-ingredients.jsx +++ b/src/components/burger-ingredients/burger-ingredients.jsx @@ -1,12 +1,12 @@ -import { useMemo, useRef } from 'react'; -import PropTypes from 'prop-types'; +import { useContext, useMemo, useRef } from 'react'; import styles from './burger-ingredients.module.css'; import { BUN, SAUCE, MAIN, names } from '../../utils/dataNames'; -import { dataPropTypes } from '../../utils/dataPropTypes'; import BurgerIngredientsTabs from '../burger-ingredients-tabs/burger-ingredients-tabs'; import BurgerIngredientsItem from '../burger-ingredients-item/burger-ingredients-item'; +import { OrderContext } from '../../services/order-context'; -function BurgerIngredients({ data }) { +function BurgerIngredients() { + const { data } = useContext(OrderContext); const groups = useMemo(() => { let res = {}; res[BUN] = data.filter(i => i.type === BUN); @@ -34,8 +34,8 @@ function BurgerIngredients({ data }) {

{names[type]}

    - {groups[type].map((item, index) => ( - + {groups[type].map((item) => ( + ))}
@@ -45,8 +45,4 @@ function BurgerIngredients({ data }) { ); } -BurgerIngredients.propTypes = { - data: PropTypes.arrayOf(dataPropTypes.isRequired).isRequired -} - export default BurgerIngredients; \ No newline at end of file diff --git a/src/components/ingredient-details/ingredient-details.jsx b/src/components/ingredient-details/ingredient-details.jsx index e043651..c13812c 100644 --- a/src/components/ingredient-details/ingredient-details.jsx +++ b/src/components/ingredient-details/ingredient-details.jsx @@ -1,11 +1,9 @@ -import PropTypes from 'prop-types'; import styles from './ingredient-details.module.css'; -import Modal from '../modal/modal'; import { dataPropTypes } from '../../utils/dataPropTypes'; -function IngredientDetails({ item, onClose }) { +function IngredientDetails({ item }) { return ( - + <> Изображение ингридиента

{item.name}

@@ -26,13 +24,12 @@ function IngredientDetails({ item, onClose }) {
{item.carbohydrates}
- + ); } IngredientDetails.propTypes = { - item: dataPropTypes.isRequired, - onClose: PropTypes.func.isRequired + item: dataPropTypes.isRequired } export default IngredientDetails; \ No newline at end of file diff --git a/src/components/modal/modal.jsx b/src/components/modal/modal.jsx index 2d4cdf9..a140042 100644 --- a/src/components/modal/modal.jsx +++ b/src/components/modal/modal.jsx @@ -38,7 +38,7 @@ function Modal({ caption, children, onClose }) { Modal.propTypes = { caption: PropTypes.string, - children: PropTypes.arrayOf(PropTypes.element), + children: PropTypes.element.isRequired, onClose: PropTypes.func.isRequired } diff --git a/src/components/order-details/order-details.jsx b/src/components/order-details/order-details.jsx index e8a0878..57fe094 100644 --- a/src/components/order-details/order-details.jsx +++ b/src/components/order-details/order-details.jsx @@ -1,23 +1,21 @@ import PropTypes from 'prop-types'; import img from '../../images/done.png'; -import Modal from '../modal/modal'; import styles from './order-details.module.css'; -function OrderDetails({ number, onClose }) { +function OrderDetails({ number }) { return ( - -

{number}

+ <> +

{number}

идентификатор заказа

Заказ принят

Ваш заказ начали готовить

Дождитесь готовности на орбитальной станции

- + ); } OrderDetails.propTypes = { - number: PropTypes.number.isRequired, - onClose: PropTypes.func.isRequired + number: PropTypes.number.isRequired } export default OrderDetails; \ No newline at end of file diff --git a/src/utils/dataLoad.js b/src/utils/dataLoad.js index 73dcf46..1f4065f 100644 --- a/src/utils/dataLoad.js +++ b/src/utils/dataLoad.js @@ -1,13 +1,8 @@ -import { DOMAIN, API_LOAD, STATUS_OK } from './api-constants'; +import { DOMAIN, API_LOAD } from './api-constants'; +import { request } from './request'; export function dataLoad() { - return fetch(`${DOMAIN}${API_LOAD}`) - .then(res => { - if (res.status !== STATUS_OK) { - throw Error(`Неверный html-статус ответа: ${res.status}: ${res.statusText}`); - } - return res.json(); - }) + return request(`${DOMAIN}${API_LOAD}`) .then(res => { if (!res.success) { throw Error('В json-ответе success !== true'); diff --git a/src/utils/orderCreate.js b/src/utils/orderCreate.js index 3d56ce6..ef24661 100644 --- a/src/utils/orderCreate.js +++ b/src/utils/orderCreate.js @@ -1,30 +1,24 @@ -import { DOMAIN, API_ORDER, STATUS_OK } from './api-constants'; +import { DOMAIN, API_ORDER } from './api-constants'; +import { request } from './request'; export function orderCreate(ingredients) { - return fetch(`${DOMAIN}${API_ORDER}`, { + return request(`${DOMAIN}${API_ORDER}`, { method: "POST", headers: { 'Content-Type': 'application/json;charset=utf-8' }, body: JSON.stringify({ ingredients: ingredients.map(item => item._id) }) }) - .then(res => { - if (res.status !== STATUS_OK) { - console.log(`Неверный html-статус ответа: ${res.status}: ${res.statusText}`); + .then(res => { + if (res.success) { + if (res.order && typeof res.order.number === "number") { + return res.order.number; + } else { + throw Error('Не найден order.number внутри ответа'); } - return res.json(); - }) - .then(res => { - if (res.success) { - - if (res.order && typeof res.order.number === "number") { - return res.order.number; - } else { - throw Error('Не найден order.number внутри ответа'); - } - } - else { - throw Error(`Ошибка от сервера: ${res.message}`); - } - }); + } + else { + throw Error(`Ошибка от сервера: ${res.message}`); + } + }); } diff --git a/src/utils/request.js b/src/utils/request.js new file mode 100644 index 0000000..73a29b5 --- /dev/null +++ b/src/utils/request.js @@ -0,0 +1,12 @@ +import { STATUS_OK } from "./api-constants"; + +export function request(url, options) { + return fetch(url, options).then(checkResponse); +} + +function checkResponse(res) { + if (res.status !== STATUS_OK) { + console.log(`Неверный html-статус ответа: ${res.status}: ${res.statusText}`); + } + return res.json(); +} \ No newline at end of file From 9142506ea0633b80c66169ee455d4126a21aa80e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Alexey=20Obukhov=20=28=D0=90=D0=BB=D0=B5=D0=BA=D1=81=D0=B5?= =?UTF-8?q?=D0=B9=20=D0=9E=D0=B1=D1=83=D1=85=D0=BE=D0=B2=29?= Date: Fri, 20 Jan 2023 12:29:48 +0300 Subject: [PATCH 3/4] Update README.md --- README.md | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/README.md b/README.md index 3c9b181..b7544e0 100644 --- a/README.md +++ b/README.md @@ -34,3 +34,11 @@ git checkout sprint-1/step-1 git checkout sprint-1/step-2 ``` Были [замечания](https://github.com/miptleha/react-burger/pull/4) по загрузке данных с сервера, успешно их исправил, работу приняли и я смержил все в main ветку. + +## Спринт 2 +### Шаг 1 +Данные перенесены в Context. Заказ отправляется на сервер. +``` +git checkout sprint-2/step-1 +``` +[Замечания](https://github.com/miptleha/react-burger/pull/6) по изменениям в ветке From 7b26fe7a9f13567fd39ee236d00d6db8c2785f38 Mon Sep 17 00:00:00 2001 From: Aleksey Obukhov Date: Fri, 20 Jan 2023 17:05:19 +0300 Subject: [PATCH 4/4] =?UTF-8?q?=D0=B4=D0=B8=D0=B0=D0=BB=D0=BE=D0=B3=20?= =?UTF-8?q?=D1=81=20=D0=B4=D0=B5=D1=82=D0=B0=D0=BB=D1=8F=D0=BC=D0=B8=20?= =?UTF-8?q?=D0=BF=D0=B5=D1=80=D0=B5=D0=BD=D0=B5=D1=81=D0=B5=D0=BD=20=D0=BD?= =?UTF-8?q?=D0=B0=20=D1=83=D1=80=D0=BE=D0=B2=D0=B5=D0=BD=D1=8C=20=D0=B2?= =?UTF-8?q?=D1=8B=D1=88=D0=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../burger-ingredients-item.jsx | 31 ++++++------------- .../burger-ingredients/burger-ingredients.jsx | 29 ++++++++++++++--- 2 files changed, 35 insertions(+), 25 deletions(-) diff --git a/src/components/burger-ingredients-item/burger-ingredients-item.jsx b/src/components/burger-ingredients-item/burger-ingredients-item.jsx index 9793350..dfd8fd7 100644 --- a/src/components/burger-ingredients-item/burger-ingredients-item.jsx +++ b/src/components/burger-ingredients-item/burger-ingredients-item.jsx @@ -1,15 +1,13 @@ -import { useState, useContext, useMemo } from 'react'; +import { useContext, useMemo } from 'react'; +import PropTypes from 'prop-types'; import { dataPropTypes } from '../../utils/dataPropTypes'; import { OrderContext } from '../../services/order-context'; import { BUN } from '../../utils/dataNames'; import styles from './burger-ingredients-item.module.css'; import { CurrencyIcon, Counter } from '@ya.praktikum/react-developer-burger-ui-components'; -import IngredientDetails from '../ingredient-details/ingredient-details'; -import Modal from '../modal/modal'; -function BurgerIngredientItem({ item }) { - const [show, setShow] = useState(false); +function BurgerIngredientsItem({ item, onShowDetails }) { const { ingredients, bun } = useContext(OrderContext); const count = useMemo(() => { @@ -22,17 +20,12 @@ function BurgerIngredientItem({ item }) { } }, [item, bun, ingredients]); - function showDialog() { - setShow(true); - } - - function hideDialog(e) { - setShow(false); - e.stopPropagation(); + function showDialogItem() { + onShowDetails(item); } return ( -
  • +
  • Ингридиент
    {item.price} @@ -40,17 +33,13 @@ function BurgerIngredientItem({ item }) {
    {item.name}
    {count > 0 && } - {show && ( - - - - )}
    • ); } -BurgerIngredientItem.propTypes = { - item: dataPropTypes.isRequired +BurgerIngredientsItem.propTypes = { + item: dataPropTypes.isRequired, + onShowDetails: PropTypes.func.isRequired } -export default BurgerIngredientItem; \ No newline at end of file +export default BurgerIngredientsItem; \ No newline at end of file diff --git a/src/components/burger-ingredients/burger-ingredients.jsx b/src/components/burger-ingredients/burger-ingredients.jsx index 7fdbd34..41156b1 100644 --- a/src/components/burger-ingredients/burger-ingredients.jsx +++ b/src/components/burger-ingredients/burger-ingredients.jsx @@ -1,12 +1,18 @@ -import { useContext, useMemo, useRef } from 'react'; -import styles from './burger-ingredients.module.css'; +import { useContext, useMemo, useRef, useState } from 'react'; import { BUN, SAUCE, MAIN, names } from '../../utils/dataNames'; +import { OrderContext } from '../../services/order-context'; + +import styles from './burger-ingredients.module.css'; import BurgerIngredientsTabs from '../burger-ingredients-tabs/burger-ingredients-tabs'; import BurgerIngredientsItem from '../burger-ingredients-item/burger-ingredients-item'; -import { OrderContext } from '../../services/order-context'; +import Modal from '../modal/modal'; +import IngredientDetails from '../ingredient-details/ingredient-details'; function BurgerIngredients() { + const [itemShow, setItemShow] = useState(null); + const { data } = useContext(OrderContext); + const groups = useMemo(() => { let res = {}; res[BUN] = data.filter(i => i.type === BUN); @@ -24,6 +30,15 @@ function BurgerIngredients() { headers[value].current.scrollIntoView({ behavior: "smooth" }); } + function showDialog(item) { + setItemShow(item); + } + + function hideDialog(e) { + setItemShow(null); + e.stopPropagation(); + } + return (

    Соберите бургер

    @@ -35,12 +50,18 @@ function BurgerIngredients() {

    {names[type]}

      {groups[type].map((item) => ( - + ))}
    ))} + + {itemShow && ( + + + + )}
    ); }