добавлена работа со списками продуктов, попытка оптимизировать запрос по поиску коктейлей

front/src/components/cocktails/Cocktail.js

@@ -12,6 +12,7 @@ import DeleteIcon from '@mui/icons-material/Delete';
 import LocalBarIcon from '@mui/icons-material/LocalBar';
 import {paths} from "../../path";
 import {useAlert} from "../../hooks/useAlert";
+import {useUser} from "../../hooks/useUser";
 
 function renderFavouriteBadge(handleFavourite, row) {
     const childIcon = row.rating.favourite ? <FavoriteIcon/> : <FavoriteBorderIcon/>;
@@ -35,6 +36,7 @@ function renderRating(handleChangeRating, row) {
 
 export function Cocktail({row, handleFavourite, handleChangeRating, handleSelect, deleteHandler}) {
     const {notImplement} = useAlert();
+    const {user} = useUser();
     return (
         <Grid item sx={{pr: 2}}>
             <CocktailItemStyled>
@@ -63,12 +65,17 @@ export function Cocktail({row, handleFavourite, handleChangeRating, handleSelect
                         {renderFavouriteBadge(handleFavourite, row)}
                         {renderRating(handleChangeRating, row)}
 
-                        <IconButton size='small' href={`${paths.bar.cocktailEdit}?id=${row.id}`}>
-                            <EditIcon fontSize='small'/>
-                        </IconButton>
-                        <IconButton size='small' onClick={() => deleteHandler(row)}>
-                            <DeleteIcon fontSize='small'/>
-                        </IconButton>
+                        {user.role !== 'USER' &&
+                            <>
+                                <IconButton size='small' href={`${paths.bar.cocktailEdit}?id=${row.id}`}>
+                                    <EditIcon fontSize='small'/>
+                                </IconButton>
+                                <IconButton size='small' onClick={() => deleteHandler(row)}>
+                                    <DeleteIcon fontSize='small'/>
+                                </IconButton>
+                            </>
+
+                        }
                     </CardActions>
                     <CardContent sx={{pb: 0, pl: 2, pt: 0}}>
                         <Typography variant="h5" minHeight={'50px'} mt={2}>{row.name} </Typography>