change backURL

build/asset-manifest.json

@@ -1,19 +1,19 @@
 {
   "files": {
-    "main.css": "/static/css/main.db6b11c8.css",
-    "main.js": "/static/js/main.df0de229.js",
-    "static/js/787.8276514b.chunk.js": "/static/js/787.8276514b.chunk.js",
+    "main.css": "/static/css/main.c25a228f.css",
+    "main.js": "/static/js/main.412b71b0.js",
+    "static/js/787.884e199e.chunk.js": "/static/js/787.884e199e.chunk.js",
     "static/media/main-page-image.png": "/static/media/main-page-image.bc655052ce386c031a15.png",
+    "static/media/default-avatar-image.png": "/static/media/default-avatar-image.fb653606e5a348e7bc76.png",
     "static/media/404.svg": "/static/media/404.7e060e4273fbd7fc09f0a17ca7f3dd68.svg",
     "static/media/shopping-logo.svg": "/static/media/shopping-logo.423022a24e67b6b6140c294be23af1b0.svg",
-    "static/media/logo.svg": "/static/media/logo.6ce24c58023cc2f8fd88fe9d219db6c6.svg",
     "index.html": "/index.html",
-    "main.db6b11c8.css.map": "/static/css/main.db6b11c8.css.map",
-    "main.df0de229.js.map": "/static/js/main.df0de229.js.map",
-    "787.8276514b.chunk.js.map": "/static/js/787.8276514b.chunk.js.map"
+    "main.c25a228f.css.map": "/static/css/main.c25a228f.css.map",
+    "main.412b71b0.js.map": "/static/js/main.412b71b0.js.map",
+    "787.884e199e.chunk.js.map": "/static/js/787.884e199e.chunk.js.map"
   },
   "entrypoints": [
-    "static/css/main.db6b11c8.css",
-    "static/js/main.df0de229.js"
+    "static/css/main.c25a228f.css",
+    "static/js/main.412b71b0.js"
   ]
 }

build/static/js/main.df0de229.js.LICENSE.txt

@@ -1,9 +1,17 @@
+/*
+object-assign
+(c) Sindre Sorhus
+@license MIT
+*/
+
 /*!
   Copyright (c) 2018 Jed Watson.
   Licensed under the MIT License (MIT), see
   http://jedwatson.github.io/classnames
 */
 
+/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */
+
 /**
  * @license React
  * react-dom.production.min.js
@@ -96,7 +104,16 @@
  * @license MIT
  */
 
-/** @license MUI v5.6.1
+/** @license MUI v5.8.0
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v0.19.1
+ * scheduler.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -111,6 +128,24 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+/** @license React v16.14.0
+ * react-dom.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.14.0
+ * react.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
 /** @license React v17.0.2
  * react-is.production.min.js
  *

package.json

@@ -1,5 +1,5 @@
 {
-  "name": "diploma",
+  "name": "store",
   "version": "0.1.0",
   "proxy": "http://127.0.0.1:8000",
   "private": true,

src/actions/actionOrders.js

@@ -6,9 +6,10 @@ export const actionOrders =
         dispatch(
             actionPromise(
                 promiseName,
-                gql(`
-            query orders{
-                OrderFind(query:"[{}]"){
+                gql(
+                    `
+            query orders($query:String){
+                OrderFind(query:$query){
                     _id price createdAt status 
                     orderGoods{
                         _id count price good{
@@ -19,6 +20,8 @@ export const actionOrders =
                     }
                 }
             }
-          `)
+          `,
+                    { query: JSON.stringify([{}, { orderBy: "-createdAt", limit: 200 }]) }
+                )
             )
         );

src/components/CartPage/CartItem.js

@@ -34,10 +34,10 @@ export const CartItem = ({ order, onDeleteClick }) => {
             <TableCell>
                 <Box
                     component="img"
-                    src={images && images[0]?.url ? `${images ? images[0]?.url : ""}` : defaultGoodImage}
+                    src={images && images[0]?.url ? `/${images ? images[0]?.url : ""}` : defaultGoodImage}
                     sx={{ width: 50 }}
                     onError={({ currentTarget }) => {
-                        currentTarget.onerror = null; // prevents looping
+                        currentTarget.onerror = null;
                         currentTarget.src = defaultGoodImage;
                     }}
                 />

src/components/CartPage/index.js

@@ -64,7 +64,7 @@ export const CartPage = ({ onConfirm, promiseStatus, serverErrors }) => {
 
                         <TableRow>
                             <TableCell colSpan={3}>
-                                <Typography variant="body1" bold>
+                                <Typography variant="body1" sx={{ fontWeight: "bold" }}>
                                     Всього:
                                 </Typography>
                             </TableCell>

src/components/DashboardPage/DashboardOrder/index.js

@@ -6,7 +6,7 @@ export const DashboardOrder = ({ order }) => {
     const { price = null, createdAt, orderGoods = [], status } = order || {};
     return (
         <Paper className="DashboardOrder">
-            <Stack direction="vertical" justifyContent="space-between" className="title">
+            <Stack direction="row" justifyContent="space-between" className="title">
                 <Typography textAlign="left">Дата: {new Date(+createdAt * 1000).toLocaleDateString()}</Typography>
                 <Typography textAlign="left">Сума: {price || " - "}</Typography>
                 <Typography textAlign="left">Статус: {"" + status?.length ? statusNumber[+order.status] : "-"}</Typography>

src/components/GoodPage/index.js

@@ -13,9 +13,10 @@ export const GoodPage = () => {
             <Grid container spacing={4} className="images">
                 <Grid item xs={12} md={4}>
                     <Carousel showIndicators={false} showStatus={false} showArrows={true}>
-                        {(good.images || [{ url: defaultGoodImage }]).map((image) => (
+                        {(good.images || [{ _id: 0, url: defaultGoodImage }]).map((image) => (
                             <img
-                                src={image?.url ? `${image?.url}` : defaultGoodImage}
+                                key={image?._id}
+                                src={image?.url ? `/${image?.url}` : defaultGoodImage}
                                 onError={({ currentTarget }) => {
                                     currentTarget.onerror = null; // prevents looping
                                     currentTarget.src = defaultGoodImage;

src/components/GoodsPage/SubCategories/index.js

@@ -4,7 +4,7 @@ import { Link } from "react-router-dom";
 export const SubCategories = ({ categories }) => (
     <Box className="SubCategories">
         {(categories || []).map((cat) => (
-            <Paper className="SubCategory Link" component={Link} to={`/category/${cat._id}`}>
+            <Paper className="SubCategory Link" key={cat._id} component={Link} to={`/category/${cat._id}`}>
                 {cat.name}
             </Paper>
         ))}

src/components/LayoutPage/index.js

@@ -118,15 +118,19 @@ const GoodsSearchPageContainer = () => {
 const GoodPageContainer = () => {
     const params = useParams();
     const dispatch = useDispatch();
+    useEffect(() => {
+        dispatch(actionGoodById({ _id: params._id }));
+    }, []);
 
-    dispatch(actionGoodById({ _id: params._id }));
     return <GoodPage />;
 };
 
 const DashboardPageContainer = () => {
     const dispatch = useDispatch();
+    useEffect(() => {
+        dispatch(actionOrders());
+    }, []);
 
-    dispatch(actionOrders());
     return <CDashboardPage />;
 };
 

src/components/admin/AdminCategoryTree/index.js

@@ -4,8 +4,8 @@ import { connect } from "react-redux";
 import SortableTree from "react-sortable-tree";
 import { FaEdit } from "react-icons/fa";
 import { actionCategoryUpsert } from "../../../actions/actionCategoryUpsert";
-import { CategoryEditModal } from "../CategoryEditModal";
 import { Box, Button } from "@mui/material";
+import { useNavigate } from "react-router-dom";
 
 const bulidCategoryTree = (list) => {
     let node,
@@ -54,7 +54,13 @@ const bulidCategoryList = (tree) => {
 export const AdminCategoryTree = ({ categories, onDrop, onPopupOpen }) => {
     const [treeData, setTreeData] = useState([]);
     const [selectedNode, setSelectedNode] = useState(null);
-    const [isCategoryPopupOpen, setIsCategoryPopupOpen] = useState(false);
+    const navigate = useNavigate();
+
+    useEffect(() => {
+        if (selectedNode) {
+            navigate(`/admin/category/${selectedNode._id}`);
+        }
+    }, [selectedNode]);
 
     useEffect(() => {
         setTreeData(bulidCategoryTree(categories));
@@ -62,7 +68,6 @@ export const AdminCategoryTree = ({ categories, onDrop, onPopupOpen }) => {
 
     return (
         <Box className="CategotyTree">
-            <CategoryEditModal category={selectedNode} isOpen={isCategoryPopupOpen} onClose={() => setIsCategoryPopupOpen(false)} />
             <SortableTree
                 isVirtualized={false}
                 treeData={treeData}
@@ -90,7 +95,6 @@ export const AdminCategoryTree = ({ categories, onDrop, onPopupOpen }) => {
                                     parent = { _id, name };
                                 }
                                 setSelectedNode({ name, _id, subcategories, parent });
-                                setIsCategoryPopupOpen(true);
                             }}
                         >
                             <FaEdit />

src/components/admin/AdminGoodsPage/AdminGoodItem.js

@@ -10,7 +10,7 @@ const AdminGoodItem = ({ good }) => (
             {
                 <Box
                     component="img"
-                    src={good.images?.length ? `${good.images ? good.images[0]?.url : ""}` : defaultGoodImage}
+                    src={good.images?.length ? `/${good.images ? good.images[0]?.url : ""}` : defaultGoodImage}
                     onError={({ currentTarget }) => {
                         currentTarget.onerror = null; // prevents looping
                         currentTarget.src = defaultGoodImage;

src/components/admin/AdminLayoutPage/index.js

@@ -28,7 +28,16 @@ import { actionUsersAll } from "../../../actions/actionUsersAll";
 const AdminCategoryPageContainer = ({}) => {
     const dispatch = useDispatch();
     const params = useParams();
-    dispatch(actionGoodsAll());
+
+    useEffect(() => {
+        dispatch(actionGoodsAll());
+
+        return () => {
+            dispatch(actionPromiseClear("goodsAll"));
+            dispatch(actionPromiseClear("adminCatById"));
+        };
+    }, []);
+
     useEffect(() => {
         if (params._id) {
             dispatch(actionCatById({ _id: params._id, promiseName: "adminCatById" }));
@@ -123,7 +132,16 @@ const AdminCategoriesSearchPageContainer = () => {
 const AdminGoodPageContainer = () => {
     const params = useParams();
     const dispatch = useDispatch();
-    dispatch(actionCatAll());
+
+    useEffect(() => {
+        dispatch(actionCatAll());
+
+        return () => {
+            dispatch(actionPromiseClear("goodsCatAll"));
+            dispatch(actionPromiseClear("adminGoodById"));
+        };
+    }, []);
+
     useEffect(() => {
         if (params._id) {
             dispatch(actionGoodById({ _id: params._id, promiseName: "adminGoodById" }));
@@ -300,14 +318,20 @@ const AdminOrdersSearchPageContainer = () => {
 const AdminOrderPageContainer = () => {
     const params = useParams();
     const dispatch = useDispatch();
-    dispatch(actionPromiseClear("adminOrderById"));
-    dispatch(actionUsersAll());
-    dispatch(actionGoodsAll());
+
+    useEffect(() => {
+        dispatch(actionPromiseClear("adminOrderById"));
+        dispatch(actionUsersAll());
+        dispatch(actionGoodsAll());
+        return () => {
+            dispatch(actionPromiseClear("usersAll"));
+            dispatch(actionPromiseClear("goodsAll"));
+            dispatch(actionPromiseClear("adminOrderById"));
+        };
+    }, []);
     useEffect(() => {
         if (params._id) {
             dispatch(actionOrderById({ _id: params._id, promiseName: "adminOrderById" }));
-        } else {
-            dispatch(actionOrderById("adminOrderById"));
         }
     }, [params._id]);
     return <CAdminOrderPage />;

src/components/admin/AdminOrderPage/OrderForm.js

@@ -171,7 +171,7 @@ export const COrderForm = connect(
         promiseStatus: state.promise.orderUpsert?.status || null,
         serverErrors: state.promise.orderUpsert?.error || null,
         order: state.promise?.adminOrderById?.payload || {},
-        userList: state.promise.adminUsersAll.payload || [],
+        userList: state.promise.adminUsersAll?.payload || [],
         deletePromiseStatus: state.promise.orderDelete?.status || null,
     }),
     {

src/components/admin/AdminOrdersPage/AdminOrderItem.js

@@ -10,7 +10,7 @@ const AdminOrderItem = ({ order }) => (
         <TableCell>
             {order.orderGoods
                 ? (order.orderGoods || []).map((orderGood) => (
-                      <Typography variant="body2">
+                      <Typography variant="body2" key={orderGood._id}>
                           {orderGood.good.name} - {orderGood.count}
                       </Typography>
                   ))

src/components/admin/CategoryEditModal/index.js

@@ -1,48 +0,0 @@
-import { useEffect } from "react";
-import { useDispatch, useSelector } from "react-redux";
-import { actionCatById } from "../../../actions/actionCatById";
-import { actionGoodsAll } from "../../../actions/actionGoodsAll";
-import { actionPromiseClear } from "../../../reducers";
-import { Modal } from "../../common/Modal";
-import { CCategoryForm } from "../AdminCategoryPage/CategoryForm";
-
-export const CategoryEditModal = ({ isOpen = false, onClose, category: categoryToEdit, onOpen } = {}) => {
-    const dispatch = useDispatch();
-    const category = useSelector((state) => state.promise?.adminCatById?.payload || {});
-    const { _id = null } = categoryToEdit || {};
-    useEffect(() => {
-        if (isOpen) {
-            onOpen && onOpen();
-        }
-    }, [isOpen]);
-
-    const handleClose = () => {
-        onClose();
-    };
-
-    useEffect(() => {
-        if (isOpen) {
-            dispatch(actionGoodsAll());
-            if (_id) {
-                dispatch(actionCatById({ _id, promiseName: "adminCatById" }));
-            } else {
-                dispatch(actionPromiseClear("adminCatById"));
-            }
-        }
-
-        return () => {
-            dispatch(actionPromiseClear("adminCatById"));
-            dispatch(actionPromiseClear("goodsAll"));
-        };
-    }, [isOpen, _id]);
-
-    return isOpen ? (
-        <div className="NodeEditModal">
-            <Modal open={isOpen} onClose={handleClose}>
-                <CCategoryForm category={category} />
-            </Modal>
-        </div>
-    ) : (
-        false
-    );
-};

src/components/common/Ava/index.js

@@ -4,5 +4,5 @@ import defaultAvatarImage from "../../../images/default-avatar-image.png";
 
 export const Ava = () => {
     const path = useSelector((state) => state.promise.aboutMe?.payload?.avatar?.url || null);
-    return <Avatar src={path ? `${path}` : defaultAvatarImage} />;
+    return <Avatar src={path ? `/${path}` : defaultAvatarImage} />;
 };

src/components/common/DrawerCart/DrawerCartItem.js

@@ -14,7 +14,7 @@ const DrawerCartItem = ({ order, onDeleteClick }) => {
             <CardMedia
                 component="img"
                 sx={{ width: 90 }}
-                src={images && images[0]?.url ? `${images ? images[0]?.url : ""}` : defaultGoodImage}
+                src={images && images[0]?.url ? `/${images ? images[0]?.url : ""}` : defaultGoodImage}
                 onError={({ currentTarget }) => {
                     currentTarget.onerror = null; // prevents looping
                     currentTarget.src = defaultGoodImage;

src/components/common/EntityEditor/index.js

@@ -35,31 +35,33 @@ export const EntityEditor = ({ entity = { images: [] }, onSave, onFileDrop, uplo
             <DropZone onFileDrop={(files) => onFileDrop(files)}>
                 <Typography>Drop images here!</Typography>
             </DropZone>
-            <SortableList pressDelay={200} onSortEnd={onSortEnd} axis="xy" className="SortableContainer">
-                <ImageList sx={{ maxHeight: 800 }} cols={3} fullwidth>
-                    {state.images?.map(
-                        (image, index) =>
-                            !!image?._id &&
-                            !!image?.url && (
-                                <SortableItem key={`item-${image._id}`} index={index}>
-                                    <ImageListItem key={image._id}>
-                                        <ImageListItemBar
-                                            sx={{
-                                                background: "rgba(0,0,0,0.1)",
-                                            }}
-                                            actionIcon={
-                                                <IconButton onClick={() => onItemRemove(image._id)}>
-                                                    <MdClose />
-                                                </IconButton>
-                                            }
-                                        />
-                                        <Box component="img" className="DropZoneImage" src={`/${image.url}`} loading="lazy" />
-                                    </ImageListItem>
-                                </SortableItem>
-                            )
-                    )}
-                </ImageList>
-            </SortableList>
+            {!!state?.images?.length && (
+                <SortableList pressDelay={200} onSortEnd={onSortEnd} axis="xy" className="SortableContainer">
+                    <ImageList sx={{ maxHeight: 800 }} cols={3} fullwidth="true">
+                        {state.images?.map(
+                            (image, index) =>
+                                !!image?._id &&
+                                !!image?.url && (
+                                    <SortableItem key={`item-${image._id}`} index={index}>
+                                        <ImageListItem key={image._id}>
+                                            <ImageListItemBar
+                                                sx={{
+                                                    background: "rgba(0,0,0,0.1)",
+                                                }}
+                                                actionIcon={
+                                                    <IconButton onClick={() => onItemRemove(image._id)}>
+                                                        <MdClose />
+                                                    </IconButton>
+                                                }
+                                            />
+                                            <Box component="img" className="DropZoneImage" src={`/${image.url}`} loading="lazy" />
+                                        </ImageListItem>
+                                    </SortableItem>
+                                )
+                        )}
+                    </ImageList>
+                </SortableList>
+            )}
             {!!onSave && (
                 <Button
                     onClick={() => {

src/components/common/GoodCard/index.js

@@ -9,7 +9,15 @@ const GoodCard = ({ good = {} }) => {
     return (
         <Card className="GoodCard">
             <CardActionArea component={Link} to={`/good/${good._id}`}>
-                <CardMedia component="img" height="200" image={`${good.images ? good.images[0]?.url : defaultGoodImage}`} />
+                <CardMedia
+                    component="img"
+                    height="200"
+                    image={`/${good.images ? good.images[0]?.url : defaultGoodImage}`}
+                    onError={({ currentTarget }) => {
+                        currentTarget.onerror = null;
+                        currentTarget.src = defaultGoodImage;
+                    }}
+                />
                 <CardContent>
                     <Typography gutterBottom variant="body1" component="div" color="#1C1B1F" textAlign="left">
                         Назва: {good.name?.length > 10 ? `${good.name.slice(0, 10)}...` : good.name}

src/components/common/SearchBar/SearchBar.js

@@ -31,6 +31,8 @@ export const SearchBar = ({
         onSearchButtonClick(inputValue);
         setInputValue("");
         onSearchEnd && onSearchEnd();
+        setIsChildrenOpen(false);
+        setTouched(false);
     };
 
     useEffect(() => {

src/components/common/SearchBar/SearchGoodResultItem.js

@@ -17,7 +17,7 @@ const SearchGoodResultItem = ({ good, onClick, link = "" } = {}) => {
             <Grid item xs={3}>
                 <Box
                     component="img"
-                    src={images ? `${images[0]?.url}` : defaultGoodImage}
+                    src={images ? `/${images[0]?.url}` : defaultGoodImage}
                     onError={({ currentTarget }) => {
                         currentTarget.onerror = null; // prevents looping
                         currentTarget.src = defaultGoodImage;

src/components/common/SearchBar/SearchResults.js

@@ -13,7 +13,7 @@ export const SearchResults = ({ items, onItemClick, itemLink = "" }) => {
                 {!!items?.length ? (
                     itemLink.match(/.+(good).+/) ? (
                         items.map((good) => (
-                            <Box>
+                            <Box key={good._id}>
                                 <SearchGoodResultItem
                                     link={itemLink}
                                     good={good}
@@ -25,7 +25,7 @@ export const SearchResults = ({ items, onItemClick, itemLink = "" }) => {
                         ))
                     ) : itemLink.match(/.+(category|categories).+/) ? (
                         items.map((cat) => (
-                            <Box>
+                            <Box key={cat._id}>
                                 <SearchCategoryResultItem
                                     link={itemLink}
                                     category={cat}
@@ -37,7 +37,7 @@ export const SearchResults = ({ items, onItemClick, itemLink = "" }) => {
                         ))
                     ) : itemLink.match(/.+(order|orders).+/) ? (
                         items.map((order) => (
-                            <Box>
+                            <Box key={order._id}>
                                 <SearchOrderResultItem
                                     link={itemLink}
                                     order={order}

src/helpers/index.js

@@ -4,6 +4,6 @@ import { getGQL } from "./GraphQL";
 import { delay } from "./delay";
 import { statusNumber, statusOptions } from "./orderStatus";
 
-export const backendURL = "";
+export const backendURL = "http://188.72.209.29:8000";
 export const gql = getGQL(backendURL + "/graphql/");
 export { jwtDecode, delay, statusNumber, statusOptions };