Help

return(
		<>
			<div className={classes.headerStyle}>
				<Typography variant="h6">Nom du document</Typography>
				<Typography variant="h6">Date de signature</Typography>
				<Typography variant="h6">Date de fin</Typography>
				<Typography variant="h6">JEH livrés</Typography>
			</div>

			<div className={classes.documentStyle}>
				
			<AsyncProvider getter={getter}>
				{(plannings) => (
					<>
					{(() => {
						const nbLivraison: boolean = state.mission.planning.deliveries.length > 1;
						const pvlExist: boolean = state.mission.documents.some((d) => d.type.value === "PVL");
						const aenExist: boolean = state.mission.documents.some((d) => d.type.value === "AEN");
						const aenList: FullDocument[] = state.mission.documents.filter((d) => d.type.value === "AEN");
						const pvlIndex: number = 0;
						const aenIndex: number = 0;
						
						return state.mission.documents.map((valueDoc, element) => {
						if (
							(valueDoc.type.value === "DDE" && valueDoc.signedAt) ||
							valueDoc.type.value === "AEN" ||
							valueDoc.type.value === "PVR" ||
							valueDoc.type.value === "BCR" ||
							(valueDoc.type.value === "BDC" && valueDoc.signedAt)
						) {
							const found: Planning | undefined = plannings?.find(
							(obj: Planning) => obj.document.id === valueDoc.id
							);

							return (
							<>
								<div className={classes.pastillePlacement}>
									{(valueDoc.type.value==="DDE" || valueDoc.type.value==="BDC") ? (
										<Tooltip title={"Début de l'étude"} placement="top" arrow>
											<Box className={classes.dot} style={{ backgroundColor: "green" }}/>
										</Tooltip>
									):(
										<Tooltip title={"Random"} placement="top" arrow>
											<Box className={classes.dot} style={{ backgroundColor: "red" }}/>
										</Tooltip>
									)
									}
									<span style={{ marginLeft: "10px" }}>
										{valueDoc.reference}
									</span>
								</div>
								<span>
									{valueDoc.signedAt ? sharedDayFormat(valueDoc.signedAt) : "Non signé"}<br/>
								</span>
								{found ? (
								<>
									<span>
										{sharedDayFormat(found.deliveries[0].deliveryDate)}
									</span>
									<span>{found.deliveries[0].deliveryJEH}</span>
								</>
								) : (<><span>-</span><span>-</span></>)
								}
								{nbLivraison && (valueDoc.type.value === "DDE" || valueDoc.type.value === "AEN") && (
									<>
		{aenExist && pvlExist && (
		plannings?.map((planning) =>
			planning.deliveries.map((delivery, index) => {
				const aen = aenList.find(aen =>
				(aen?.signedAt && DateTime.fromISO(delivery.deliveryDate) > DateTime.fromISO(aen.signedAt))
				);
				console.log(aenList)
				if (!delivery?.document && aen) {
					return (
						<>
						<div className={classes.pastillePlacement}>
							{aen.signedAt ? (
							<Tooltip title={"AEN signée"} placement="top" arrow>
								<Box className={classes.dot} style={{ backgroundColor: "green" }} />
							</Tooltip>
							) : (
							<Tooltip title={"AEN non signée"} placement="top" arrow>
								<Box className={classes.dot} style={{ backgroundColor: "red" }} />
							</Tooltip>
							)}
							<span style={{ marginLeft: "10px" }}>{aen.reference}</span>
						</div>
						<span>{aen.signedAt ? sharedDayFormat(aen.signedAt) : "Non signé"}</span>
						<span>{sharedDayFormat(delivery.deliveryDate)}</span>
						<span>{delivery.deliveryJEH}</span>
						</>
					);
				} else {
					return (
					<>
						<div className={classes.pastillePlacement}>
						{delivery.document? (delivery.document.signedAt ? (
							<Tooltip title={"Document signée"} placement="top" arrow>
								<Box className={classes.dot} style={{ backgroundColor: "green" }} />
							</Tooltip>)
							:
							(<Tooltip title={"Document crée"} placement="top" arrow>
									<Box className={classes.dot} style={{ backgroundColor: "orange" }} />
								</Tooltip>)
						 ) : (
							<Tooltip title={"Document non crée"} placement="top" arrow>
								<Box className={classes.dot} style={{ backgroundColor: "red" }} />
							</Tooltip>
						)}
						<span style={{ marginLeft: "10px" }}>
							{delivery.document?.reference || `PVL ${index + 1}`}
						</span>
						</div>
						<span>
						{delivery.document?.signedAt ? sharedDayFormat(delivery.document?.signedAt) : "-"}
						</span>
						<span>{sharedDayFormat(delivery.deliveryDate)}</span>
						<span>{delivery.deliveryJEH}</span>
					</>
					);
				}
			})
		)
		)}
										{pvlExist && !aenExist && (
										found?.deliveries.slice(1, found.deliveries.length).map((d,index)=>
											<>	
												{d.document ? (
												<>
													<div className={classes.pastillePlacement}>
														{d.document.signedAt ? (
														<Tooltip title={"Document signé"} placement="top" arrow>
															<Box className={classes.dot} style={{ backgroundColor: "green" }}/>
														</Tooltip>
															):(
														<Tooltip title={"Document crée"} placement="top" arrow>
															<Box className={classes.dot} style={{ backgroundColor: "orange" }}/>
														</Tooltip>
														)}
														<span style={{ marginLeft: "10px" }}>{d.document?.reference || "PVL"}</span>
													</div>
													<span>{d.document?.signedAt ? (sharedDayFormat(d.document?.signedAt)):"-"}</span>
												</>
												):(
													<>
														<div className={classes.pastillePlacement}>
														<Tooltip title={"Document pas encore crée"} placement="top" arrow>
															<Box className={classes.dot} style={{ backgroundColor: "red" }}/>
														</Tooltip>
														<span style={{ marginLeft: "10px" }}>PVL {index+1}</span>
														</div>
														<span>-</span>
													</>
												)}
												<span>{sharedDayFormat(d.deliveryDate)}</span>
												<span>{d.deliveryJEH}</span>
											</>
										)
										)}
										{/*!pvlExist && aenExist && (
										<span>3</span>
										)*/}
										{!pvlExist && !aenExist && (
										found?.deliveries.slice(1, found.deliveries.length).map((d,index)=>
											<>
												<div className={classes.pastillePlacement}>
													<Tooltip title={"Document pas encore crée"} placement="top" arrow>
														<Box className={classes.dot} style={{ backgroundColor: "red" }}/>
													</Tooltip>
													<span style={{ marginLeft: "10px" }}>PVL {index+1}</span>
												</div>
												<span>-</span>
												<span>{sharedDayFormat(d.deliveryDate)}</span>
												<span>{d.deliveryJEH}</span>
											</>
										)
										)}
									</>
								)}
							</>
							);
						}
						});
					})()}
					</>
				)}
				</AsyncProvider>

			</div>
		</>
	)