From fd5b2cecec25e25d5907ba8f9f7c311a2b62943b Mon Sep 17 00:00:00 2001
From: Maxime Lalo <maxime.lalo.pro@gmail.com>
Date: Fri, 5 Apr 2024 10:39:45 +0200
Subject: [PATCH] :sparkles: creating handle submit and cancel

---
 .../SubscriptionManageCollaborators/index.tsx     | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/front/Components/Layouts/Subscription/Manage/SubscriptionManageCollaborators/index.tsx b/src/front/Components/Layouts/Subscription/Manage/SubscriptionManageCollaborators/index.tsx
index 50315170..fef69292 100644
--- a/src/front/Components/Layouts/Subscription/Manage/SubscriptionManageCollaborators/index.tsx
+++ b/src/front/Components/Layouts/Subscription/Manage/SubscriptionManageCollaborators/index.tsx
@@ -4,7 +4,7 @@ import DefaultTemplate from "@Front/Components/LayoutTemplates/DefaultTemplate";
 import Form from "@Front/Components/DesignSystem/Form";
 import CheckBox from "@Front/Components/DesignSystem/CheckBox";
 import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button";
-import { useCallback, useEffect, useState } from "react";
+import React, { useCallback, useEffect, useState } from "react";
 import User, { Subscription } from "le-coffre-resources/dist/Admin";
 import JwtService from "@Front/Services/JwtService/JwtService";
 import Subscriptions from "@Front/Api/LeCoffreApi/Admin/Subscriptions/Subscriptions";
@@ -96,6 +96,15 @@ export default function SubscriptionManageCollaborators() {
 		[selectedCollaborators, subscription],
 	);
 
+	const cancelAll = () => {
+		setSelectedCollaborators([]);
+	};
+
+	const handleSubmit = async (e: React.FormEvent<HTMLFormElement> | null, values: { [key: string]: string }) => {
+		if (!e) return;
+		e.preventDefault();
+	};
+
 	useEffect(() => {
 		loadSubscription();
 	}, [loadSubscription]);
@@ -110,7 +119,7 @@ export default function SubscriptionManageCollaborators() {
 					<Typography typo={ITypo.P_SB_18} color={ITypoColor.BLACK}>
 						{subscription.nb_seats} sièges disponibles
 					</Typography>
-					<Form>
+					<Form onSubmit={handleSubmit}>
 						<div className={classes["collaborators-container"]}>
 							{availableCollaborators.map((collaborator) => (
 								<CheckBox
@@ -136,7 +145,7 @@ export default function SubscriptionManageCollaborators() {
 							<Button variant={EButtonVariant.PRIMARY} fullwidth>
 								Enregistrer
 							</Button>
-							<Button variant={EButtonVariant.GHOST} fullwidth>
+							<Button variant={EButtonVariant.GHOST} fullwidth onClick={cancelAll} type="button">
 								Annuler
 							</Button>
 						</div>