✨ Read all notifications functionnality

src/front/Components/DesignSystem/Header/Notifications/NotificationModal/classes.module.scss

@@ -30,6 +30,15 @@
 			cursor: pointer;
 		}
 	}
+
+	.notification-subheader {
+		width: 100%;
+		display: inline-flex;
+		justify-content: space-between;
+		text-decoration: underline;
+		cursor: pointer;
+	}
+
 	.notification-body {
 		margin-top: 24px;
 		overflow: hidden;

src/front/Components/DesignSystem/Header/Notifications/NotificationModal/index.tsx

@@ -37,10 +37,12 @@ export default class NotificationModal extends React.Component<IProps, IState> {
 							<Image src={CloseIcon} alt="Close notification modal" className={classes["close-icon"]}></Image>
 						</div>
 					</div>
-					;
+					<div className={classes["notification-subheader"]} onClick={this.readAllNotifications}>
+						<Typography typo={ITypo.CAPTION_14}>Tout marquer comme lu</Typography>
+					</div>
 					<div className={classes["notification-body"]}>
 						<>
-							{Toasts.getInstance().toasts.length === 0 ? (
+							{!this.state.toastList || this.state.toastList.length === 0 ? (
 								<div className={classes["missing-notification"]}>
 									<Typography typo={ITypo.P_18} color={ITypoColor.GREY}>
 										Vous n'avez pas de notifications.
@@ -64,6 +66,10 @@ export default class NotificationModal extends React.Component<IProps, IState> {
 		this.removeOnToastChange();
 	}
 
+	private readAllNotifications() {
+		Toasts.getInstance().closeAll();
+	}
+
 	private handleToastChange(toastList: IToast[] | null) {
 		this.setState({
 			toastList,

src/front/Components/DesignSystem/Toasts/ToastsContainer/ToastElement/index.tsx

@@ -109,7 +109,6 @@ class ToastElementClass extends React.Component<IPropsClass, IState> {
 	}
 
 	private async handleClick(e: React.MouseEvent) {
-		console.log('redirectUrl', this.props.toast.redirectUrl);
 		if (this.props.toast.redirectUrl) {
 			this.onClose(e);
 			await this.props.router.push(this.props.toast.redirectUrl);

src/front/Stores/Toasts.tsx

@@ -97,6 +97,15 @@ export default class Toasts {
 		this.event.emit("change", this.toastList);
 	}
 
+	public async closeAll() {
+		for (let i = 0; i < this.toastList.length; i++) {
+			await Notifications.getInstance().put(this.toastList[i]?.uid as string, {
+				read: true,
+			});
+		}
+		this.event.emit("change", []);
+	}
+
 	/**
 	 * An utility static method you can use to quickly display an error toast
 	 * with a custom error message.