Add final page fail

public/product_assets/data/dairy_coffee.json → public/product_assets/data/dairy_coffee_egg.json

@@ -1,130 +1,138 @@
 [
   {
     "id": "ea86d695-59b7-465d-94b9-4b31ca4f8ab8",
-    "title": "Watermelon",
+    "title": "Cheddar",
     "description": "Cillum in laborum eu sint.",
-    "price": "$ 2.42 each",
+    "price": "2.42€ pièce",
     "previewImageUrl": "/product_assets/dairy_coffee/american_cheese.jpg",
-    "category": "DAIRY_COFFEE"
+    "category": "DAIRY_COFFEE_EGG"
   },
   {
     "id": "3b4470d2-ce5c-4967-8088-1162b191d1d8",
-    "title": "Green Apple",
+    "title": "Beurre",
     "description": "Ipsum velit officia officia eiusmod commodo tempor.",
-    "price": "$ 1.69 each",
+    "price": "1.69€ pièce",
     "previewImageUrl": "/product_assets/dairy_coffee/butter.jpg",
-    "category": "DAIRY_COFFEE"
+    "category": "DAIRY_COFFEE_EGG"
   },
   {
     "id": "d98c63f7-323c-49a0-879b-a49e76b55d84",
-    "title": "Apricot",
+    "title": "Graines de café",
     "description": "Proident ea voluptate veniam nulla duis fugiat veniam.",
-    "price": "$ 1.22 each",
+    "price": "1.22€ pièce",
     "previewImageUrl": "/product_assets/dairy_coffee/coffee_beans.jpg",
-    "category": "DAIRY_COFFEE"
+    "category": "DAIRY_COFFEE_EGG"
   },
   {
     "id": "b119f376-0228-4d9f-a0c0-56cc46d62c51",
-    "title": "Plum",
+    "title": "Capsule de café",
     "description": "Exercitation nostrud nisi labore id occaecat quis nulla.",
-    "price": "$ 3.21 each",
+    "price": "3.21€ pièce",
     "previewImageUrl": "/product_assets/dairy_coffee/coffee_capsule.jpg",
-    "category": "DAIRY_COFFEE"
+    "category": "DAIRY_COFFEE_EGG"
   },
   {
     "id": "e9591ded-7b1a-4428-97a1-1435a675306c",
-    "title": "Yellow Apple",
+    "title": "Papier filtre",
     "description": "Laborum laboris dolore eiusmod sint dolor eiusmod cillum.",
-    "price": "$ 4.11 each",
+    "price": "4.11€ pièce",
     "previewImageUrl": "/product_assets/dairy_coffee/coffee_paper_filter.jpg",
-    "category": "DAIRY_COFFEE"
+    "category": "DAIRY_COFFEE_EGG"
   },
   {
     "id": "24d3e3d3-9dd5-467d-a1b8-f1dfa4959dba",
-    "title": "Orange",
+    "title": "Café broyé",
     "description": "Eiusmod dolore elit cillum ex sint sunt irure laborum.",
-    "price": "$ 1.21 each",
+    "price": "1.21€ pièce",
     "previewImageUrl": "/product_assets/dairy_coffee/coffee_powder.jpg",
-    "category": "DAIRY_COFFEE"
+    "category": "DAIRY_COFFEE_EGG"
   },
   {
     "id": "69824912-20ca-4e74-951d-82cc9a5c43e2",
-    "title": "Strawberry",
+    "title": "Lait concentré",
     "description": "Elit ex in aliqua magna ut voluptate labore ullamco dolor voluptate in ex.",
-    "price": "$ 1.61 each",
+    "price": "1.61€ pièce",
     "previewImageUrl": "/product_assets/dairy_coffee/condensed_milk.jpg",
-    "category": "DAIRY_COFFEE"
+    "category": "DAIRY_COFFEE_EGG"
   },
   {
     "id": "8aebeb2f-2442-4801-8c73-80e0901e8ba6",
-    "title": "Peach",
+    "title": "Crème",
     "description": "Excepteur mollit enim et dolore ipsum eu non reprehenderit.",
-    "price": "$ 1.36 each",
+    "price": "1.36€ pièce",
     "previewImageUrl": "/product_assets/dairy_coffee/cream.jpg",
-    "category": "DAIRY_COFFEE"
+    "category": "DAIRY_COFFEE_EGG"
   },
   {
     "id": "6e1301f3-c547-4166-9487-ede8cba2e88e",
-    "title": "Red Apple",
+    "title": "Ghee",
     "description": "Consectetur excepteur sit id enim deserunt laborum officia.",
-    "price": "$ 2.57 each",
+    "price": "2.57€ pièce",
     "previewImageUrl": "/product_assets/dairy_coffee/ghee.jpg",
-    "category": "DAIRY_COFFEE"
+    "category": "DAIRY_COFFEE_EGG"
   },
   {
     "id": "79cf61db-65cd-422e-a077-384f4e45a64c",
-    "title": "Watermelon",
+    "title": "Glace",
     "description": "Aliquip id esse dolor ad adipisicing labore cillum sint est irure.",
-    "price": "$ 3.91 each",
+    "price": "3.91€ pièce",
     "previewImageUrl": "/product_assets/dairy_coffee/ice_cream.jpg",
-    "category": "DAIRY_COFFEE"
+    "category": "DAIRY_COFFEE_EGG"
   },
   {
     "id": "968805b1-cc7b-4597-9f20-edf2df7798b4",
-    "title": "Green Apple",
+    "title": "Lait",
     "description": "Laborum sint laboris consectetur officia.",
-    "price": "$ 7.23 each",
+    "price": "7.23€ pièce",
     "previewImageUrl": "/product_assets/dairy_coffee/milk.jpg",
-    "category": "DAIRY_COFFEE"
+    "category": "DAIRY_COFFEE_EGG"
   },
   {
     "id": "d67c00e2-f3a3-4ffe-a06c-0d08c8d4ee3f",
-    "title": "Apricot",
+    "title": "Parmesan",
     "description": "Deserunt voluptate dolor est quis aute.",
-    "price": "$ 1.91 each",
+    "price": "1.91€ pièce",
     "previewImageUrl": "/product_assets/dairy_coffee/parmesan_cheese.jpg",
-    "category": "DAIRY_COFFEE"
+    "category": "DAIRY_COFFEE_EGG"
   },
   {
     "id": "79ad3f98-0719-4dd0-970a-8b53296f10e1",
-    "title": "Plum",
+    "title": "Lait en poudre",
     "description": "Excepteur eu anim consequat irure cillum fugiat nostrud.",
-    "price": "$ 3.97 each",
+    "price": "3.97€ pièce",
     "previewImageUrl": "/product_assets/dairy_coffee/powdered_milk.jpg",
-    "category": "DAIRY_COFFEE"
+    "category": "DAIRY_COFFEE_EGG"
   },
   {
     "id": "93bd748b-40b1-4064-9bff-205d97ac0404",
-    "title": "Yellow Apple",
+    "title": "Fromage frais",
     "description": "Aute sit officia duis excepteur.",
-    "price": "$ 1.04 each",
+    "price": "1.04€ pièce",
     "previewImageUrl": "/product_assets/dairy_coffee/soft_cheese.jpg",
-    "category": "DAIRY_COFFEE"
+    "category": "DAIRY_COFFEE_EGG"
   },
   {
     "id": "7cfabc56-e24f-4631-bb43-99c3dd8b4e50",
-    "title": "Orange",
+    "title": "Fromage suisse",
     "description": "Occaecat ex consequat qui nulla sint proident do elit.",
-    "price": "$ 1.73 each",
+    "price": "1.73€ pièce",
     "previewImageUrl": "/product_assets/dairy_coffee/swiss_cheese.jpg",
-    "category": "DAIRY_COFFEE"
+    "category": "DAIRY_COFFEE_EGG"
   },
   {
     "id": "6c543f63-f66a-4b66-9910-d56943d0fd60",
-    "title": "Strawberry",
+    "title": "Yaourt",
     "description": "Pariatur dolore amet cupidatat eiusmod pariatur officia.",
-    "price": "$ 3.18 each",
+    "price": "3.18€ pièce",
     "previewImageUrl": "/product_assets/dairy_coffee/yogurt.jpg",
-    "category": "DAIRY_COFFEE"
+    "category": "DAIRY_COFFEE_EGG"
+  },
+  {
+    "id": "b1b0b6a0-5b0a-4b0e-8b0a-2b0b0b0b0b0b",
+    "title": "Oeuf",
+    "description": "Pariatur dolore amet cupidatat eiusmod pariatur officia.",
+    "price": "0,5€ pièce",
+    "previewImageUrl": "/product_assets/dairy_coffee/egg.jpg",
+    "category": "DAIRY_COFFEE_EGG"
   }
 ]

src/components/ui/AppBar/Menu/Menu.tsx

@@ -21,6 +21,11 @@ const menuItems = [
     link: "flour",
     icon: require("/public/icons/flour.svg"),
   },
+  {
+    text: ProductCategory.DAIRY_COFFEE_EGG,
+    link: "egg",
+    icon: require("/public/icons/egg.svg"),
+  },
 ];
 
 const Menu: React.FC = () => {

src/components/ui/Buttons/AppLink.tsx

@@ -26,10 +26,7 @@ const AppLink: React.FC<IAppLink> = ({ text, link }) => {
       }}
     >
       {text}
-      <Image
-        src={require("public/product_assets/images/white-arrow.svg")}
-        alt=""
-      />
+      <Image src={require("public/icons/white-arrow.svg")} alt="" />
     </Link>
   );
 };

src/components/ui/Cards/AddToCartButton/AddToCartButton.tsx

@@ -46,7 +46,7 @@ const AddToCartButton: React.FC<IAddToCartButton> = ({
     <Button aria-label="Add cart" style={styleButton} onClick={addToCart}>
       Ajouter
       <Image
-        src={require("public/product_assets/images/add.png")}
+        src={require("public/icons/add.png")}
         width={addImageSize}
         height={addImageSize}
         alt=""

src/components/ui/Cards/ProductCard/ProductCard.tsx

@@ -1,32 +1,39 @@
 import { Typography, Paper, Box } from "@mui/material";
-import Image from "next/image";
 
 import { Product } from "src/types/product";
 
+import { getImageStyle, stylePrice } from "./ProductCardStyle";
 import AddToCartButton from "../AddToCartButton/AddToCartButton";
 
 export interface IProductCard {
   product: Product;
+  tiny?: boolean;
 }
 
-const ProductCard: React.FC<IProductCard> = ({ product }) => {
+const ProductCard: React.FC<IProductCard> = ({ product, tiny = false }) => {
   return (
     <Paper>
-      <Image
-        alt={product.title}
-        src={product.previewImageUrl}
-        width={218}
-        height={218}
-        layout="responsive"
-      />
-      <Box paddingX={2} paddingY={1}>
-        <Typography>{product.title}</Typography>
-
-        <Box display="flex" justifyContent="space-between" alignItems="center">
-          <Typography variant="caption">{product.price}</Typography>
-          <AddToCartButton product={product} />
+      <Box style={getImageStyle(product, tiny)}>
+        <Box
+          style={{
+            display: "flex",
+            justifyContent: "space-between",
+            width: "100%",
+            padding: "5px",
+          }}
+        >
+          <Typography style={stylePrice}>{product.price}</Typography>
+          <AddToCartButton product={product} tiny={tiny} />
         </Box>
       </Box>
+      <Typography
+        style={{
+          display: "flex",
+          justifyContent: "center",
+        }}
+      >
+        {product.title}
+      </Typography>
     </Paper>
   );
 };

src/components/ui/Cards/ProductCard/ProductCardStyle.tsx

@@ -15,7 +15,7 @@ const imageSize = 218;
 export const getImageStyle = (product: Product, tiny: boolean) => {
   const style: React.CSSProperties = {
     height: imageSize,
-    width: tiny ? "" : imageSize,
+    width: tiny ? "" : "100%",
     backgroundImage: `url(${product.previewImageUrl})`,
     backgroundSize: "cover",
     display: "flex",

src/components/ui/FinalPage/FailureComponent.tsx

@@ -0,0 +1,45 @@
+import { List, ListItem, Typography } from "@mui/material";
+import { Container } from "@mui/system";
+import Image from "next/image";
+
+interface IFailureComponent {
+  missingCartTitles: string[];
+}
+
+const FailureComponent: React.FC<IFailureComponent> = ({
+  missingCartTitles,
+}) => {
+  return (
+    <Container>
+      <Image src={require("/public/icons/smiley-sad.svg")} alt="" />
+      <Typography
+        fontSize={60}
+        sx={{
+          color: "primary.main",
+          marginTop: "20px",
+        }}
+      >
+        Dommage,
+      </Typography>
+      <Typography
+        style={{
+          fontFamily: "fontFamily",
+          fontSize: "20px",
+          color: "primary.main",
+          marginBottom: "5px",
+        }}
+      >
+        Tu as oublié d&apos;ajouter les ingrédients suivants à ton panier :
+        <List sx={{ listStyleType: "disc" }}>
+          {missingCartTitles.map((title) => (
+            <ListItem sx={{ display: "list-item" }} key={title}>
+              {title}
+            </ListItem>
+          ))}
+        </List>
+      </Typography>
+    </Container>
+  );
+};
+
+export default FailureComponent;