From b042ca28520e39b19130d3546817e01b0286d8dc Mon Sep 17 00:00:00 2001
From: Maxime Lalo <maxime.lalo.pro@gmail.com>
Date: Thu, 14 Dec 2023 16:31:54 +0100
Subject: [PATCH] :sparkles: Toasts working on success upload

---
 package-lock.json                             | 21 +++++++++++++++++++
 package.json                                  |  1 +
 .../DesignSystem/DepositDocument/index.tsx    |  6 ++++++
 .../LayoutTemplates/DefaultLayout.tsx         |  8 +++++--
 src/front/index.scss                          |  7 ++++++-
 5 files changed, 40 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 53cc4aca..e463010a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -28,6 +28,7 @@
 				"react": "18.2.0",
 				"react-dom": "18.2.0",
 				"react-select": "^5.7.2",
+				"react-toastify": "^9.1.3",
 				"sass": "^1.59.2",
 				"sharp": "^0.32.1",
 				"typescript": "4.9.5",
@@ -4085,6 +4086,26 @@
 				"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
 			}
 		},
+		"node_modules/react-toastify": {
+			"version": "9.1.3",
+			"resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-9.1.3.tgz",
+			"integrity": "sha512-fPfb8ghtn/XMxw3LkxQBk3IyagNpF/LIKjOBflbexr2AWxAH1MJgvnESwEwBn9liLFXgTKWgBSdZpw9m4OTHTg==",
+			"dependencies": {
+				"clsx": "^1.1.1"
+			},
+			"peerDependencies": {
+				"react": ">=16",
+				"react-dom": ">=16"
+			}
+		},
+		"node_modules/react-toastify/node_modules/clsx": {
+			"version": "1.2.1",
+			"resolved": "https://registry.npmjs.org/clsx/-/clsx-1.2.1.tgz",
+			"integrity": "sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg==",
+			"engines": {
+				"node": ">=6"
+			}
+		},
 		"node_modules/react-transition-group": {
 			"version": "4.4.5",
 			"resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz",
diff --git a/package.json b/package.json
index f0f72fa7..9b32d4d6 100644
--- a/package.json
+++ b/package.json
@@ -30,6 +30,7 @@
 		"react": "18.2.0",
 		"react-dom": "18.2.0",
 		"react-select": "^5.7.2",
+		"react-toastify": "^9.1.3",
 		"sass": "^1.59.2",
 		"sharp": "^0.32.1",
 		"typescript": "4.9.5",
diff --git a/src/front/Components/DesignSystem/DepositDocument/index.tsx b/src/front/Components/DesignSystem/DepositDocument/index.tsx
index 549d245c..b7cf8644 100644
--- a/src/front/Components/DesignSystem/DepositDocument/index.tsx
+++ b/src/front/Components/DesignSystem/DepositDocument/index.tsx
@@ -18,6 +18,7 @@ import Alert from "../Modal/Alert";
 import GreenCheckIcon from "@Assets/Icons/green-check.svg";
 import Loader from "../Loader";
 import TextAreaField from "../Form/TextareaField";
+import { toast } from "react-toastify";
 
 type IProps = {
 	defaultFiles?: FileCustomer[];
@@ -241,6 +242,10 @@ export default class DepositDocument extends React.Component<IProps, IState> {
 		}
 	}
 
+	private openSuccessToast() {
+		toast.success("Document envoyé avec succès");
+	}
+
 	private onCloseModalShowRefusedReason() {
 		this.setState({
 			isShowRefusedReasonModalVisible: false,
@@ -370,6 +375,7 @@ export default class DepositDocument extends React.Component<IProps, IState> {
 				fileName: newFile?.file_name ?? "",
 			},
 		];
+		this.openSuccessToast();
 		this.setState(
 			{
 				currentFiles: files,
diff --git a/src/front/Components/LayoutTemplates/DefaultLayout.tsx b/src/front/Components/LayoutTemplates/DefaultLayout.tsx
index 2676be82..45452b20 100644
--- a/src/front/Components/LayoutTemplates/DefaultLayout.tsx
+++ b/src/front/Components/LayoutTemplates/DefaultLayout.tsx
@@ -1,7 +1,8 @@
 import Head from "next/head";
 import { ReactNode } from "react";
 type DefaultLayoutProps = { children: ReactNode };
-
+import { ToastContainer } from "react-toastify";
+import "react-toastify/dist/ReactToastify.css";
 export const DefaultLayout = ({ children }: DefaultLayoutProps) => {
 	return (
 		<>
@@ -9,7 +10,10 @@ export const DefaultLayout = ({ children }: DefaultLayoutProps) => {
 				<title>LECoffre</title>
 				{/* <link rel="shortcut icon" href="/favicon.svg" /> */}
 			</Head>
-			<main>{children}</main>
+			<main>
+				{children}
+				<ToastContainer />
+			</main>
 		</>
 	);
 };
diff --git a/src/front/index.scss b/src/front/index.scss
index a398cb89..e3442de1 100644
--- a/src/front/index.scss
+++ b/src/front/index.scss
@@ -63,4 +63,9 @@ a:hover {
 .react-select__menu-notice {
 	font-size: 18px;
 	font-family: Inter;
-}
\ No newline at end of file
+}
+
+.Toastify__toast-body {
+	font-size: 14px;
+	font-family: Inter;
+}