From 0d0b03bf6a34d975fdb4a1721a92deb5ecae6e79 Mon Sep 17 00:00:00 2001
From: Baptiste Dumoulin <91154604+Ptitbapt@users.noreply.github.com>
Date: Thu, 8 Jun 2023 15:35:10 +0200
Subject: [PATCH 01/24] Update AddCourse.vue

---
 .../RessourcesComponents/AddCourse.vue        | 28 +++++++++++++++++++
 1 file changed, 28 insertions(+)

diff --git a/front-end/src/components/RessourcesComponents/AddCourse.vue b/front-end/src/components/RessourcesComponents/AddCourse.vue
index 610db558b..c94b0fc96 100644
--- a/front-end/src/components/RessourcesComponents/AddCourse.vue
+++ b/front-end/src/components/RessourcesComponents/AddCourse.vue
@@ -17,6 +17,22 @@
 						v-model="this.language"
 						placeholder="Language :"
 					/><br />
+					<div class="mb-4">
+						<label for="file" class="block text-sm font-medium text-gray-700">Fichier :</label>
+						<input type="file" id="file" ref="fileInput" @change="handleFileChange" multiple />
+						<ul class="mt-4 space-y-2">
+							<li v-for="file in uploadedFiles" :key="file.name" class="flex items-center">
+								<button
+									type="button"
+									class="focus:outline-none text-white bg-red-700 hover:bg-red-800 focus:ring-4 focus:ring-red-300 font-medium rounded-lg text-sm px-3 py-1.5 mr-2 mb-2 dark:bg-red-600 dark:hover:bg-red-700 dark:focus:ring-red-900"
+									@click="removeFile(index)"
+								>
+									X
+								</button>
+								<span class="text-gray-700">{{ file.name }}</span>
+							</li>
+						</ul>
+					</div>
 					<div class="flex justify-center mt-6">
 						<button
 							class="px-4 py-2 text-white bg-blue-500 rounded-lg hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50"
@@ -57,9 +73,21 @@ export default {
 			project: [],
 			site: '',
 			teacherId: '',
+			uploadedFiles: [],
 		};
 	},
 	methods: {
+		handleFileChange(event) {
+			const files = event.target.files;
+
+			// Mettez à jour la liste uploadedFiles avec les informations des fichiers téléchargés
+			for (let i = 0; i < files.length; i++) {
+				this.uploadedFiles.push(files[i]);
+			}
+		},
+		removeFile(index) {
+			this.uploadedFiles.splice(index, 1);
+		},
 		AddCourses() {
 			const course = useCoursStore();
 			this.newCourse = {

From 427503f4c5c143facac42466ebe1e5c4cf14e1d5 Mon Sep 17 00:00:00 2001
From: Baptiste Dumoulin <91154604+Ptitbapt@users.noreply.github.com>
Date: Fri, 9 Jun 2023 09:17:14 +0200
Subject: [PATCH 02/24] prettier + details addcourse

---
 .../src/base/courses/courses.controller.ts    |   4 -
 .../RessourcesComponents/AddCourse.vue        |  82 ++++---
 .../RessourcesComponents/CoursDetails.vue     | 216 +++++++++++++-----
 .../src/store/interfaces/cours.interface.ts   |  22 +-
 front-end/src/store/modules/course.store.ts   |  64 +++---
 5 files changed, 251 insertions(+), 137 deletions(-)

diff --git a/back-end/src/base/courses/courses.controller.ts b/back-end/src/base/courses/courses.controller.ts
index 288beaec9..0e9136f1f 100644
--- a/back-end/src/base/courses/courses.controller.ts
+++ b/back-end/src/base/courses/courses.controller.ts
@@ -31,7 +31,6 @@ export class CoursesController {
 		});
 	}
 
-
 	@Post('/create')
 	async createCourse(@Req() req: Request, @Res() res: Response) {
 		await this.coursesService.createCourse(req.body).then((course) => {
@@ -44,6 +43,3 @@ export class CoursesController {
 		return res.status(200).json(courses);
 	}
 }
-
-
-
diff --git a/front-end/src/components/RessourcesComponents/AddCourse.vue b/front-end/src/components/RessourcesComponents/AddCourse.vue
index c94b0fc96..295acdac8 100644
--- a/front-end/src/components/RessourcesComponents/AddCourse.vue
+++ b/front-end/src/components/RessourcesComponents/AddCourse.vue
@@ -56,54 +56,75 @@
 </template>
 
 <script lang="ts">
+import { ref } from 'vue';
 import { useCoursStore } from '@/store/modules/course.store';
+import Swal from 'sweetalert2';
 
 export default {
-	name: 'AddCourses',
 	data() {
 		return {
 			tag: '',
-			classTag: '',
-			picture: '',
-			language: '',
-			createdAt: new Date(),
 			periodStart: null,
 			periodEnd: null,
-			presence: [],
-			project: [],
-			site: '',
-			teacherId: '',
+			picture: '',
+			language: '',
 			uploadedFiles: [],
 		};
 	},
 	methods: {
 		handleFileChange(event) {
 			const files = event.target.files;
-
-			// Mettez à jour la liste uploadedFiles avec les informations des fichiers téléchargés
-			for (let i = 0; i < files.length; i++) {
-				this.uploadedFiles.push(files[i]);
-			}
+			this.uploadedFiles = Array.from(files);
 		},
 		removeFile(index) {
 			this.uploadedFiles.splice(index, 1);
 		},
-		AddCourses() {
-			const course = useCoursStore();
-			this.newCourse = {
-				tag: this.tag,
-				classTag: '',
-				picture: this.picture,
-				language: this.language,
-				createdAt: this.createdAt,
-				periodStart: this.periodStart,
-				periodEnd: this.periodEnd,
-				presence: [],
-				project: [],
-				site: '',
-				teacherId: '',
-			};
-			course.addCourse(this.newCourse);
+		async AddCourses() {
+			// Vérifier si tous les champs sont remplis
+			if (!this.tag || !this.periodStart || !this.periodEnd || !this.picture || !this.language) {
+				Swal.fire({
+					title: 'Vous devez remplir tous les champs',
+					text: 'Veuillez remplir tous les champs pour ajouter un nouveau cours',
+					icon: 'error',
+					confirmButtonColor: '#3085d6',
+					cancelButtonColor: '#d33',
+					confirmButtonText: 'OK',
+				});
+				return;
+			}
+
+			const formData = new FormData();
+			formData.append('tag', this.tag);
+			formData.append('periodStart', this.periodStart);
+			formData.append('periodEnd', this.periodEnd);
+			formData.append('picture', this.picture);
+			formData.append('language', this.language);
+			this.uploadedFiles.forEach((file) => {
+				formData.append('uploadedFiles', file);
+			});
+
+			Swal.fire({
+				title: 'Votre cours a été ajouté',
+				icon: 'success',
+				confirmButtonColor: '#3085d6',
+				cancelButtonColor: '#d33',
+				confirmButtonText: 'OK',
+			}).then(async (result) => {
+				if (result.isConfirmed) {
+					// Ajouter le cours
+					await useCoursStore.addCourse(formData);
+					// Rediriger vers la page des cours
+					this.$emit('close');
+				}
+			});
+
+			// Réinitialiser les champs
+			this.tag = '';
+			this.periodStart = null;
+			this.periodEnd = null;
+			this.picture = '';
+			this.language = '';
+			this.uploadedFiles = [];
 		},
 	},
 };
@@ -117,6 +138,7 @@ export default {
 	transform: translate(-50%, -50%);
 	background-color: white;
 	border: 1px solid black;
+	color: black;
 	padding: 20px;
 	z-index: 1000;
 	border-radius: 0.375rem;
diff --git a/front-end/src/components/RessourcesComponents/CoursDetails.vue b/front-end/src/components/RessourcesComponents/CoursDetails.vue
index e2a52db69..a03639d64 100644
--- a/front-end/src/components/RessourcesComponents/CoursDetails.vue
+++ b/front-end/src/components/RessourcesComponents/CoursDetails.vue
@@ -1,74 +1,176 @@
 <template>
-	<div>
-		<div class="text-center pt-4">
-			<h1 class="text-4xl font-bold">{{ oneItems.tag }}</h1>
-		</div>
-		<img
-			class="cover h-72 w-screen object-cover object-center"
-			:src="
-				oneItems.picture && oneItems.picture != ''
-					? oneItems.picture
-					: 'https://cdn.discordapp.com/attachments/894865078824890408/1073218625718198342/Fof04PpacAQePOW.png'
+	<img
+		class="cover h-72 w-screen object-cover object-center"
+		src="https://images.pexels.com/photos/36717/amazing-animal-beautiful-beautifull.jpg?cs=srgb&dl=pexels-pixabay-36717.jpg&fm=jpg'
 			"
-			alt=""
-		/>
-		<div class="pt-3 pb-2">
-			<span
-				class="bg-blue-100 text-blue-800 text-xs font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-blue-900 dark:text-blue-300"
-				>{{ oneItems.periodStart }}</span
-			>
+		alt=""
+	/>
+	<div class="text-center pt-4">
+		<h1 class="text-4xl font-bold">TEST</h1>
+	</div>
+	<div class="cours-detail bg-grey-800">
+		<div class="corps-enseignant">
+			<h4 class="text-lg font-bold mb-2 border-b border-gray-300">Corps enseignant du cours</h4>
+
+			<ul class="space-y-2">
+				<li v-for="teacher in teachers" :key="teacher.id" class="flex items-center">
+					<img
+						:src="teacher.profilePicture"
+						alt="Profile Picture"
+						class="w-8 h-8 rounded-full mr-2"
+					/>
+					<span class="text-white-800">{{ teacher.name }}</span>
+				</li>
+			</ul>
 		</div>
-		<div class="pt-3 pb-2">
-			<span
-				class="bg-blue-100 text-blue-800 text-xs font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-blue-900 dark:text-blue-300"
-				>{{ oneItems.periodEnd }}</span
-			>
+		<div class="contenu-cours">
+			<h4 class="text-lg font-bold mb-2 border-b border-gray-300">Contenu du cours</h4>
+			<ul class="space-y-4">
+				<li v-for="course in courses" :key="course.id">
+					<div class="course-item" :class="{ open: course.open }" @click="toggleCourse(course)">
+						<h5 class="text-xl font-semibold">{{ course.title }}</h5>
+						<p class="text-gray-600">{{ course.description }}</p>
+					</div>
+					<div v-if="course.open" class="course-files">
+						<ul class="space-y-2">
+							<li v-for="file in course.files" :key="file.id">
+								<a :href="file.url" target="_blank" class="text-blue-500">{{ file.name }}</a>
+							</li>
+						</ul>
+					</div>
+				</li>
+			</ul>
 		</div>
-		<button
-			type="button"
-			@click="
-				() => {
-					router.push('/app/ressource/cours');
-				}
-			"
-		>
-			Retour
-		</button>
 	</div>
 </template>
-<script lang="ts" setup>
-import { computed, onMounted, ref } from 'vue';
-import { useCoursStore } from '@/store/modules/course.store';
-import { useRouter } from 'vue-router';
 
+<script>
+export default {
+	data() {
+		return {
+			teachers: [
+				{
+					id: 1,
+					name: 'John Doe',
+					profilePicture: 'path/to/profile-picture1.jpg',
+				},
+				{
+					id: 2,
+					name: 'Jane Smith',
+					profilePicture: 'path/to/profile-picture2.jpg',
+				},
+			],
+			courses: [
+				{
+					id: 1,
+					title: 'Course 1',
+					description: 'Description of Course 1',
+					open: false,
+					files: [
+						{
+							id: 1,
+							name: 'File 1.pdf',
+							url: 'path/to/file1.pdf',
+						},
+						{
+							id: 2,
+							name: 'File 2.pdf',
+							url: 'path/to/file2.pdf',
+						},
+					],
+				},
+				{
+					id: 2,
+					title: 'Course 2',
+					description: 'Description of Course 2',
+					open: false,
+					files: [
+						{
+							id: 3,
+							name: 'File 3.pdf',
+							url: 'path/to/file3.pdf',
+						},
+					],
+				},
+				{
+					id: 3,
+					title: 'Course 3',
+					description: 'Description of Course 3',
+					open: false,
+					files: [
+						{
+							id: 4,
+							name: 'File 4.pdf',
+							url: 'path/to/file4.pdf',
+						},
+						{
+							id: 5,
+							name: 'File 5.pdf',
+							url: 'path/to/file5.pdf',
+						},
+					],
+				},
+			],
+		};
+	},
+	methods: {
+		toggleCourse(course) {
+			course.open = !course.open;
+		},
+	},
+};
 // get store
-const course = useCoursStore();
-const oneItems = computed(() => course.oneItems);
+// const course = useCoursStore();
+// const oneItems = computed(() => course.oneItems);
 
-const router = useRouter();
+// const router = useRouter();
 
-// get id from url
-const _id = computed(() => {
-	const url = window.location.href;
-	const id = url.substring(url.lastIndexOf('/') + 1);
-	return id;
-});
+// // get id from url
+// const _id = computed(() => {
+// 	const url = window.location.href;
+// 	const id = url.substring(url.lastIndexOf('/') + 1);
+// 	return id;
+// });
 
-// get openHouse by id
-const getCourseById = async (_id: string) => {
-	await course.getCourseById(_id);
-};
+// // get openHouse by id
+// const getCourseById = async (_id: string) => {
+// 	await course.getCourseById(_id);
+// };
 
-// fetch openHouse data on mounted
-onMounted(() => {
-	getCourseById(_id.value);
-});
+// // fetch openHouse data on mounted
+// onMounted(() => {
+// 	getCourseById(_id.value);
+// });
 </script>
 <style scoped>
-.display {
-	display: block;
+.cours-detail {
+	display: flex;
+}
+
+.corps-enseignant {
+	flex: 1;
+	padding: 20px;
+	border-right: 1px solid #e5e7eb;
 }
-.display-none {
-	display: none;
+
+.contenu-cours {
+	flex: 2;
+	padding: 20px;
+}
+
+.course-item {
+	cursor: pointer;
+}
+
+.course-item.open {
+	font-weight: bold;
+}
+
+.course-files {
+	margin-top: 10px;
+}
+
+.course-item:hover {
+	background-color: rgba(0, 0, 0, 0.1);
 }
 </style>
diff --git a/front-end/src/store/interfaces/cours.interface.ts b/front-end/src/store/interfaces/cours.interface.ts
index a25eec24c..ca970e394 100644
--- a/front-end/src/store/interfaces/cours.interface.ts
+++ b/front-end/src/store/interfaces/cours.interface.ts
@@ -1,7 +1,8 @@
 export interface CoursesStore {
 	items: Course[];
 	idCourses: string;
-    oneItems: Course;
+	oneItems: Course;
+	uploadedFiles: File[];
 }
 
 export interface Course {
@@ -9,15 +10,12 @@ export interface Course {
 	tag: string;
 	classTag: string;
 	picture: string;
-    language: string;
-    createdAt: Date;
-    periodStart: Date;
-    periodEnd: Date;
-    presence:[];
-	project:[];
-    site: string;
-    teacherId?: string;
+	language: string;
+	createdAt: Date;
+	periodStart: Date;
+	periodEnd: Date;
+	presence: [];
+	project: [];
+	site: string;
+	teacherId?: string;
 }
-
-
-
diff --git a/front-end/src/store/modules/course.store.ts b/front-end/src/store/modules/course.store.ts
index 34adbee58..dc3a1ae12 100644
--- a/front-end/src/store/modules/course.store.ts
+++ b/front-end/src/store/modules/course.store.ts
@@ -1,8 +1,7 @@
 import { CoursesStore, Course } from '../interfaces/cours.interface';
 import { defineStore } from 'pinia';
 import { withErrorHandler } from '@/utils/storeHandler';
-import {createCourse, getCourses, getCoursesById} from '@/api/ressource-req';
-import { isEmpty } from '@/utils/string.helper';
+import { createCourse, getCourses, getCoursesById } from '@/api/ressource-req';
 
 export const useCoursStore = defineStore('course', {
 	state: (): CoursesStore => {
@@ -11,60 +10,57 @@ export const useCoursStore = defineStore('course', {
 				{
 					_id: '',
 					tag: '',
-                    classTag: '',
+					classTag: '',
 					picture: '',
-                    language:'',
-				    createdAt: null,
-					periodStart:null,
-                    periodEnd: null,
+					language: '',
+					createdAt: null,
+					periodStart: null,
+					periodEnd: null,
 					presence: [],
 					project: [],
-                    site:'',
-                    teacherId: ''
+					site: '',
+					teacherId: '',
 				},
 			],
-            oneItems: {
-                _id: '',
-					tag: '',
-                    classTag: '',
-					picture: '',
-                    language:'',
-				    createdAt: null,
-					periodStart:null,
-                    periodEnd: null,
-					presence: [],
-					project: [],
-                    site:'',
-                    teacherId: ''
-            },
-		idCourses: "",
-        }
+			oneItems: {
+				_id: '',
+				tag: '',
+				classTag: '',
+				picture: '',
+				language: '',
+				createdAt: null,
+				periodStart: null,
+				periodEnd: null,
+				presence: [],
+				project: [],
+				site: '',
+				teacherId: '',
+			},
+			idCourses: '',
+			uploadedFiles: [],
+		};
 	},
 	actions: {
 		//get courses in the database
 		getCourse: withErrorHandler(async function () {
 			const response = await getCourses();
-		//	console.log(response.data);
+			//	console.log(response.data);
 			const items = response.data;
 			this.items = items;
-            console.log(this.items);
+			console.log(this.items);
 			return true;
 		}),
-        getCourseById: withErrorHandler(async function (id: string) {
+		getCourseById: withErrorHandler(async function (id: string) {
 			const response = await getCoursesById(id);
 			const oneItems = response.data;
 			this.oneItems = oneItems;
 			return true;
 		}),
-        addCourse: withErrorHandler(async function (
-			this: CoursesStore,
-			course: Course,
-		) {
-			const res = await createCourse(course); 
+		addCourse: withErrorHandler(async function (this: CoursesStore, course: Course) {
+			const res = await createCourse(course);
 			if (res.status !== 200) return false;
 			this.items.push(res.data);
 			return true;
 		}),
 	},
-  
 });

From 0a0f8c7445f5b1e681bccd3dc8cb9473db00c1a6 Mon Sep 17 00:00:00 2001
From: ThomasCast3 <91255859+ThomasCast3@users.noreply.github.com>
Date: Fri, 9 Jun 2023 09:21:37 +0200
Subject: [PATCH 03/24] form course -> language suggest

---
 .../RessourcesComponents/AddCourse.vue        | 207 ++++++++++++------
 .../components/RessourcesComponents/Cours.vue | 107 +++++----
 .../RessourcesComponents/FormOpenHouses.vue   |   4 +-
 .../RessourcesComponents/NewParticipant.vue   |   4 +-
 .../RessourcesComponents/OpenHouses.vue       |   1 -
 front-end/src/store/modules/course.store.ts   |  63 +++---
 6 files changed, 229 insertions(+), 157 deletions(-)

diff --git a/front-end/src/components/RessourcesComponents/AddCourse.vue b/front-end/src/components/RessourcesComponents/AddCourse.vue
index 7a84601ae..b94ca1f27 100644
--- a/front-end/src/components/RessourcesComponents/AddCourse.vue
+++ b/front-end/src/components/RessourcesComponents/AddCourse.vue
@@ -1,83 +1,148 @@
 <template>
-    <div class="modal">
-        <div class="modal-overlay" @click="$emit('close')"></div>
-        <div class="modal-container">
-            <h3 class="text-xl pb-2 font-medium leading-6 text-gray-900 flex justify-center mb-3">Ajouter un cours</h3>
-            <div class="modal-body">
-                <form class="w-full max-w-sm">
-                    <input type="text" name="title" v-model="this.tag" placeholder="Title :" /><br />
-					<input type="datetime-local" v-model="this.periodStart" /><br />
-                    <input type="datetime-local" v-model="this.periodEnd" /><br />
-					<input type="url" placeholder="picture link" v-model="this.picture" /><br />
-                    <input type="text" name="language" v-model="this.language" placeholder="Language :" /><br />
-                    <div class="flex justify-center mt-6">
-                        <button
-                            class="px-4 py-2 text-white bg-blue-500 rounded-lg hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50"
-                            type="button" @click="$emit('close')">Fermer</button>
-                        <button
-                            class="ml-4 px-4 py-2 text-white bg-green-500 rounded-lg hover:bg-green-600 focus:outline-none focus:ring-2 focus:ring-green-500 focus:ring-opacity-50"
-                            type="submit" @click="AddCourses">Ajouter</button>
-                    </div>
-                </form>
-            </div>
-        </div>
-    </div>
+	<div class="modal">
+		<div class="modal-overlay"></div>
+		<div class="modal-container">
+			<h3 class="text-xl pb-2 font-medium leading-6 text-gray-900 flex justify-center mb-3">
+				Ajouter un cours
+			</h3>
+			<div class="modal-body">
+				<form class="w-full max-w-sm">
+					<input type="text" name="title" v-model="tag" placeholder="Title :" /><br />
+					<input type="datetime-local" v-model="periodStart" /><br />
+					<input type="datetime-local" v-model="periodEnd" /><br />
+					<input type="url" placeholder="picture link" v-model="picture" /><br />
+					<input
+						type="text"
+						name="language"
+						v-model="language"
+						placeholder="Language :"
+						@input="searchLanguage"
+						autocomplete="off"
+					/>
+					<ul v-if="showSuggest">
+						<li v-for="suggest in languageSuggest" :key="suggest" @click="selectSuggest(suggest)">
+							{{ suggest }}
+						</li>
+					</ul>
+
+					<div class="flex justify-center mt-6">
+						<button
+							class="px-4 py-2 text-white bg-blue-500 rounded-lg hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50"
+							type="button"
+							@click="close"
+						>
+							Fermer
+						</button>
+						<button
+							class="ml-4 px-4 py-2 text-white bg-green-500 rounded-lg hover:bg-green-600 focus:outline-none focus:ring-2 focus:ring-green-500 focus:ring-opacity-50"
+							type="submit"
+							@click="AddCourses"
+						>
+							Ajouter
+						</button>
+					</div>
+				</form>
+			</div>
+		</div>
+	</div>
 </template>
 
 <script lang="ts">
 import { useCoursStore } from '@/store/modules/course.store';
 
 export default {
-    name: 'AddCourses',
-    data() {
-        return {
-            tag: '',
-            classTag: '',
-            picture: '',
-            language: '',
-            createdAt: new Date(),
-            periodStart: null,
-            periodEnd: null,
-            presence: [],
-            project: [],
-            site:'',
-            teacherId: '',
-        }
-    },
-    methods: {
-        AddCourses(){ 
-            const course = useCoursStore();
-            this.newCourse  = {
-                tag: this.tag,
-                classTag: '',
-                picture: this.picture,
-                language: this.language,
-                createdAt: this.createdAt,
-                periodStart: this.periodStart,
-                periodEnd: this.periodEnd,
-                presence:[],
-                project:[],
-                site: '',
-                teacherId: '',
-            }
-            course.addCourse(this.newCourse);
-        }
-    }
-}
+	name: 'AddCourses',
+	emits: ['close'],
+	data() {
+		return {
+			tag: '',
+			classTag: '',
+			picture: '',
+			language: '',
+			createdAt: new Date(),
+			periodStart: null,
+			periodEnd: null,
+			presence: [],
+			project: [],
+			site: '',
+			teacherId: '',
+			languages: [],
+			languageSuggest: [],
+			showSuggest: false,
+		};
+	},
+	methods: {
+		AddCourses() {
+			const course = useCoursStore();
+			this.newCourse = {
+				tag: this.tag,
+				classTag: '',
+				picture: this.picture,
+				language: this.language,
+				createdAt: this.createdAt,
+				periodStart: this.periodStart,
+				periodEnd: this.periodEnd,
+				presence: [],
+				project: [],
+				site: '',
+				teacherId: '',
+			};
+			course.addCourse(this.newCourse);
+		},
+
+		searchLanguage() {
+			//recherche de toutes les matieres
+			this.showSuggest = true;
+			this.getAllTagCourse();
+			this.languageSuggest = [];
+			this.languages.forEach((element) => {
+				let alreadyInList = false;
+				if (element.toUpperCase().includes(this.language.toUpperCase()) && this.language != '') {
+					this.languageSuggest.forEach((languageInList) => {
+						if (languageInList == element.toUpperCase()) {
+							alreadyInList = true;
+						}
+					});
+					if (!alreadyInList) {
+						this.languageSuggest.push(element.toUpperCase());
+					}
+				}
+			});
+		},
+
+		getAllTagCourse() {
+			this.languages = []; //reset la list
+			const courseStore = useCoursStore();
+			const course = courseStore.items;
+			course.forEach((element) => {
+				if (!this.languages.includes(element.language)) {
+					this.languages.push(element.language);
+				}
+			});
+		},
+
+		selectSuggest(suggest) {
+			this.language = suggest;
+		},
+
+		close() {
+			this.$emit('close');
+		},
+	},
+};
 </script>
 
 <style>
 .modal {
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-    background-color: white;
-    border: 1px solid black;
-    padding: 20px;
-    z-index: 1000;
-    border-radius: 0.375rem;
-    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
-
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	transform: translate(-50%, -50%);
+	background-color: white;
+	border: 1px solid black;
+	padding: 20px;
+	z-index: 1000;
+	border-radius: 0.375rem;
+	box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/front-end/src/components/RessourcesComponents/Cours.vue b/front-end/src/components/RessourcesComponents/Cours.vue
index 8fc942b6b..dfc6ab478 100644
--- a/front-end/src/components/RessourcesComponents/Cours.vue
+++ b/front-end/src/components/RessourcesComponents/Cours.vue
@@ -1,36 +1,54 @@
 <template>
-	
 	<div>
 		<div v-if="userRole === Roles.USER">
 			<h1>ELEVE</h1>
 		</div>
 		<div class="flex items-center justify-center">
-            <button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full mr-4"
-                @click="startYears-- && endYears--; getCurrentYearsCours(); ">←</button>
-            <span class="text-2xl font-bold">{{ startYears }} - {{ endYears }}</span>
-            <button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full ml-4"
-                @click="startYears++ && endYears++; getCurrentYearsCours();">→</button>
-        </div>
+			<button
+				class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full mr-4"
+				@click="
+					startYears-- && endYears--;
+					getCurrentYearsCours();
+				"
+			>
+				←
+			</button>
+			<span class="text-2xl font-bold">{{ startYears }} - {{ endYears }}</span>
+			<button
+				class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full ml-4"
+				@click="
+					startYears++ && endYears++;
+					getCurrentYearsCours();
+				"
+			>
+				→
+			</button>
+		</div>
 		<div>
 			<div class="flex items-center justify-center">
-            <div class="flex items-center justify-center">
-                <button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full"
-                    @click="showModal = true">+</button>
-                <AddCourse v-if="showModal" @close="showModal = false" />
-            </div>
-        </div>
+				<div class="flex items-center justify-center">
+					<button
+						class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full"
+						@click="showModal = true"
+					>
+						+
+					</button>
+					<AddCourse v-if="showModal" @close="showModal = false" />
+				</div>
+			</div>
 		</div>
-		<select  v-model="selectedOption" @change="showCoursesByLanguage()">
+		<select v-model="selectedOption" @change="showCoursesByLanguage()">
 			<option value="">Tous les cours</option>
-			<option v-for="language in TagList" :value="language" :key="language" >{{ language }}</option>
+			<option v-for="language in TagList" :value="language" :key="language">{{ language }}</option>
 		</select>
-	
+
 		<div class="text-center flex items-center justify-center max-w-full h-full">
 			<div class="grid grid-cols-2 md:grid-cols-3 gap-4">
 				<div
 					v-for="item in coursesFiltered"
 					class="max-w-sm bg-white border border-gray-200 rounded-lg shadow dark:bg-gray-800 dark:border-gray-700"
 					@click="openCourse(item._id)"
+					:key="item._id"
 				>
 					<img
 						class="object-cover h-48 w-96 rounded-t-lg"
@@ -67,18 +85,18 @@
 import { computed, onMounted, ref } from 'vue';
 import { useRouter } from 'vue-router';
 import { useCoursStore } from '@/store/modules/course.store';
-import AddCourse from './AddCourse.vue'
+import AddCourse from './AddCourse.vue';
 import { useAuthStore } from '@/store/modules/auth.store';
 import { Roles } from '@/store/interfaces/auth.interfaces';
 
-let selectedOption='';
+let selectedOption = '';
 const startYears = ref(new Date().getFullYear());
 const endYears = ref(new Date().getFullYear() + 1);
 const TagList = ref([]);
 let currentYearsCourses = [];
-const showModal = ref(false)
+const showModal = ref(false);
 // let coursesFiltered = [];
-const coursesFiltered = ref([])
+const coursesFiltered = ref([]);
 // Use the openHouses store
 const courseStore = useCoursStore();
 const authStore = useAuthStore();
@@ -87,41 +105,36 @@ const items = computed(() => courseStore.items);
 const user = computed(() => authStore.user);
 const userRole = computed(() => user.value?.role);
 
-function showCoursesByLanguage(){
-	console.log(selectedOption);
-	coursesFiltered.value = [];
-	currentYearsCourses.forEach(element =>{
-		if(element.language.toUpperCase() == selectedOption){
-			coursesFiltered.value.push(element);
-		}else if(selectedOption == ""){
-			coursesFiltered.value.push(element);
-		}
-	})
-};
+function showCoursesByLanguage() {
+	coursesFiltered.value = currentYearsCourses.filter(
+		(course) => selectedOption === '' || course.language.toUpperCase() === selectedOption,
+	);
+}
 
-function getCurrentYearsCours(){
-	currentYearsCourses = [];  //vider le tableau current years
-	const coursesList = items.value;   // list de tous les cours
-	coursesList.forEach(element =>{
-		const dateStart = new Date(element.periodStart).getFullYear();   //verif date
+function getCurrentYearsCours() {
+	currentYearsCourses = []; //vider le tableau current years
+	const coursesList = items.value; // list de tous les cours
+	coursesList.forEach((element) => {
+		const dateStart = new Date(element.periodStart).getFullYear(); //verif date
 		const dateEnd = new Date(element.periodEnd).getFullYear();
-		if(dateStart>=startYears.value && dateEnd<=endYears.value){   
-			currentYearsCourses.push(element);   //ajouter cours si date correspond
+		if (dateStart >= startYears.value && dateEnd <= endYears.value) {
+			currentYearsCourses.push(element); //ajouter cours si date correspond
 		}
-	})
-	getAllTagCourse();  //récuperer tous les matieres des currents years cours
+	});
+	getAllTagCourse(currentYearsCourses); //récuperer tous les matieres des currents years cours
 	showCoursesByLanguage();
 	//coursesFiltered.value = currentYearsCourses;   //afficher les cours
-};
+}
 
-function getAllTagCourse() {
+function getAllTagCourse(courseList) {
+	//list des matieres:
 	TagList.value = [];
-	currentYearsCourses.forEach(element =>{
-		if(!TagList.value.includes(element.language.toUpperCase())){
+	courseList.forEach((element) => {
+		if (!TagList.value.includes(element.language.toUpperCase())) {
 			TagList.value.push(element.language.toUpperCase());
 		}
-	})
-};
+	});
+}
 
 // Get the router
 const router = useRouter();
@@ -133,7 +146,7 @@ const getCourses = async () => {
 };
 
 // Call the getArticles method when the component is created
-onMounted(async() => {
+onMounted(async () => {
 	await getCourses();
 });
 
diff --git a/front-end/src/components/RessourcesComponents/FormOpenHouses.vue b/front-end/src/components/RessourcesComponents/FormOpenHouses.vue
index 05acf08ef..1f352c036 100644
--- a/front-end/src/components/RessourcesComponents/FormOpenHouses.vue
+++ b/front-end/src/components/RessourcesComponents/FormOpenHouses.vue
@@ -7,14 +7,14 @@
 					<input type="text" name="title" v-model="title" placeholder="Title :" /><br />
 					<input type="datetime-local" v-model="date" /><br />
 					<input type="url" placeholder="picture link" v-model="picture" /><br />
-					<activity :Activities="Activities"></activity>
+					<activity :Activities="Activities" />
 					<div>
 						<input type="text" v-model="street" placeholder="street :" /><br />
 						<input type="text" v-model="zipCode" placeholder="zip code :" /><br />
 						<input type="text" v-model="town" placeholder="town :" /><br />
 					</div>
 					<textarea placeholder="Description :" v-model="description"></textarea><br />
-					<participant :participants="participants" @clear="clearParticipants"></participant>
+					<participant :participants="participants" @clear="clearParticipants" />
 					<input type="file" @change="onFileSelected" /><br />
 					<button type="submit">Submit</button>
 				</form>
diff --git a/front-end/src/components/RessourcesComponents/NewParticipant.vue b/front-end/src/components/RessourcesComponents/NewParticipant.vue
index 8621bf6e5..b3bbc2335 100644
--- a/front-end/src/components/RessourcesComponents/NewParticipant.vue
+++ b/front-end/src/components/RessourcesComponents/NewParticipant.vue
@@ -5,10 +5,10 @@
 		<div v-show="showParticipant">
 			<input type="text" placeholder="name :" v-model="name" @input="searchUser" />
 			<!--input = name et lance recherche de correspondance-->
-			<p v-for="user in userList" @click="selectUser(user)">{{ user }}</p>
+			<p v-for="user in userList" @click="selectUser(user)" :key="user._id">{{ user }}</p>
 			<br />
 		</div>
-		<p v-for="user in participants">{{ user }}</p>
+		<p v-for="user in participants" :key="user.name">{{ user }}</p>
 		<br />
 		<!--afficher les participants ajouter-->
 	</div>
diff --git a/front-end/src/components/RessourcesComponents/OpenHouses.vue b/front-end/src/components/RessourcesComponents/OpenHouses.vue
index ad45cf73e..687762925 100644
--- a/front-end/src/components/RessourcesComponents/OpenHouses.vue
+++ b/front-end/src/components/RessourcesComponents/OpenHouses.vue
@@ -68,7 +68,6 @@ import { useRouter } from 'vue-router';
 import { useOpenHouseStore } from '@/store/modules/openHouse.store';
 import FormOpenHouse from './FormOpenHouses.vue';
 
-
 // Use the openHouses store
 const openHousesStore = useOpenHouseStore();
 // Create a reactive variable to store the articles
diff --git a/front-end/src/store/modules/course.store.ts b/front-end/src/store/modules/course.store.ts
index 34adbee58..40d1e92be 100644
--- a/front-end/src/store/modules/course.store.ts
+++ b/front-end/src/store/modules/course.store.ts
@@ -1,8 +1,7 @@
 import { CoursesStore, Course } from '../interfaces/cours.interface';
 import { defineStore } from 'pinia';
 import { withErrorHandler } from '@/utils/storeHandler';
-import {createCourse, getCourses, getCoursesById} from '@/api/ressource-req';
-import { isEmpty } from '@/utils/string.helper';
+import { createCourse, getCourses, getCoursesById } from '@/api/ressource-req';
 
 export const useCoursStore = defineStore('course', {
 	state: (): CoursesStore => {
@@ -11,60 +10,56 @@ export const useCoursStore = defineStore('course', {
 				{
 					_id: '',
 					tag: '',
-                    classTag: '',
+					classTag: '',
 					picture: '',
-                    language:'',
-				    createdAt: null,
-					periodStart:null,
-                    periodEnd: null,
+					language: '',
+					createdAt: null,
+					periodStart: null,
+					periodEnd: null,
 					presence: [],
 					project: [],
-                    site:'',
-                    teacherId: ''
+					site: '',
+					teacherId: '',
 				},
 			],
-            oneItems: {
-                _id: '',
-					tag: '',
-                    classTag: '',
-					picture: '',
-                    language:'',
-				    createdAt: null,
-					periodStart:null,
-                    periodEnd: null,
-					presence: [],
-					project: [],
-                    site:'',
-                    teacherId: ''
-            },
-		idCourses: "",
-        }
+			oneItems: {
+				_id: '',
+				tag: '',
+				classTag: '',
+				picture: '',
+				language: '',
+				createdAt: null,
+				periodStart: null,
+				periodEnd: null,
+				presence: [],
+				project: [],
+				site: '',
+				teacherId: '',
+			},
+			idCourses: '',
+		};
 	},
 	actions: {
 		//get courses in the database
 		getCourse: withErrorHandler(async function () {
 			const response = await getCourses();
-		//	console.log(response.data);
+			//	console.log(response.data);
 			const items = response.data;
 			this.items = items;
-            console.log(this.items);
+			console.log(this.items);
 			return true;
 		}),
-        getCourseById: withErrorHandler(async function (id: string) {
+		getCourseById: withErrorHandler(async function (id: string) {
 			const response = await getCoursesById(id);
 			const oneItems = response.data;
 			this.oneItems = oneItems;
 			return true;
 		}),
-        addCourse: withErrorHandler(async function (
-			this: CoursesStore,
-			course: Course,
-		) {
-			const res = await createCourse(course); 
+		addCourse: withErrorHandler(async function (this: CoursesStore, course: Course) {
+			const res = await createCourse(course);
 			if (res.status !== 200) return false;
 			this.items.push(res.data);
 			return true;
 		}),
 	},
-  
 });

From 07600ea8035eab3b2c38d4d7f66f8b51cd0035c3 Mon Sep 17 00:00:00 2001
From: Baptiste Dumoulin <91154604+Ptitbapt@users.noreply.github.com>
Date: Fri, 9 Jun 2023 09:22:30 +0200
Subject: [PATCH 04/24] prettier

---
 .../components/RessourcesComponents/Cours.vue | 99 +++++++++++--------
 1 file changed, 58 insertions(+), 41 deletions(-)

diff --git a/front-end/src/components/RessourcesComponents/Cours.vue b/front-end/src/components/RessourcesComponents/Cours.vue
index 8fc942b6b..c3700c6dc 100644
--- a/front-end/src/components/RessourcesComponents/Cours.vue
+++ b/front-end/src/components/RessourcesComponents/Cours.vue
@@ -1,30 +1,47 @@
 <template>
-	
 	<div>
 		<div v-if="userRole === Roles.USER">
 			<h1>ELEVE</h1>
 		</div>
 		<div class="flex items-center justify-center">
-            <button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full mr-4"
-                @click="startYears-- && endYears--; getCurrentYearsCours(); ">←</button>
-            <span class="text-2xl font-bold">{{ startYears }} - {{ endYears }}</span>
-            <button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full ml-4"
-                @click="startYears++ && endYears++; getCurrentYearsCours();">→</button>
-        </div>
+			<button
+				class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full mr-4"
+				@click="
+					startYears-- && endYears--;
+					getCurrentYearsCours();
+				"
+			>
+				←
+			</button>
+			<span class="text-2xl font-bold">{{ startYears }} - {{ endYears }}</span>
+			<button
+				class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full ml-4"
+				@click="
+					startYears++ && endYears++;
+					getCurrentYearsCours();
+				"
+			>
+				→
+			</button>
+		</div>
 		<div>
 			<div class="flex items-center justify-center">
-            <div class="flex items-center justify-center">
-                <button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full"
-                    @click="showModal = true">+</button>
-                <AddCourse v-if="showModal" @close="showModal = false" />
-            </div>
-        </div>
+				<div class="flex items-center justify-center">
+					<button
+						class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full"
+						@click="showModal = true"
+					>
+						+
+					</button>
+					<AddCourse v-if="showModal" @close="showModal = false" />
+				</div>
+			</div>
 		</div>
-		<select  v-model="selectedOption" @change="showCoursesByLanguage()">
+		<select v-model="selectedOption" @change="showCoursesByLanguage()">
 			<option value="">Tous les cours</option>
-			<option v-for="language in TagList" :value="language" :key="language" >{{ language }}</option>
+			<option v-for="language in TagList" :value="language" :key="language">{{ language }}</option>
 		</select>
-	
+
 		<div class="text-center flex items-center justify-center max-w-full h-full">
 			<div class="grid grid-cols-2 md:grid-cols-3 gap-4">
 				<div
@@ -67,18 +84,18 @@
 import { computed, onMounted, ref } from 'vue';
 import { useRouter } from 'vue-router';
 import { useCoursStore } from '@/store/modules/course.store';
-import AddCourse from './AddCourse.vue'
+import AddCourse from './AddCourse.vue';
 import { useAuthStore } from '@/store/modules/auth.store';
 import { Roles } from '@/store/interfaces/auth.interfaces';
 
-let selectedOption='';
+let selectedOption = '';
 const startYears = ref(new Date().getFullYear());
 const endYears = ref(new Date().getFullYear() + 1);
 const TagList = ref([]);
 let currentYearsCourses = [];
-const showModal = ref(false)
+const showModal = ref(false);
 // let coursesFiltered = [];
-const coursesFiltered = ref([])
+const coursesFiltered = ref([]);
 // Use the openHouses store
 const courseStore = useCoursStore();
 const authStore = useAuthStore();
@@ -87,41 +104,41 @@ const items = computed(() => courseStore.items);
 const user = computed(() => authStore.user);
 const userRole = computed(() => user.value?.role);
 
-function showCoursesByLanguage(){
+function showCoursesByLanguage() {
 	console.log(selectedOption);
 	coursesFiltered.value = [];
-	currentYearsCourses.forEach(element =>{
-		if(element.language.toUpperCase() == selectedOption){
+	currentYearsCourses.forEach((element) => {
+		if (element.language.toUpperCase() == selectedOption) {
 			coursesFiltered.value.push(element);
-		}else if(selectedOption == ""){
+		} else if (selectedOption == '') {
 			coursesFiltered.value.push(element);
 		}
-	})
-};
+	});
+}
 
-function getCurrentYearsCours(){
-	currentYearsCourses = [];  //vider le tableau current years
-	const coursesList = items.value;   // list de tous les cours
-	coursesList.forEach(element =>{
-		const dateStart = new Date(element.periodStart).getFullYear();   //verif date
+function getCurrentYearsCours() {
+	currentYearsCourses = []; //vider le tableau current years
+	const coursesList = items.value; // list de tous les cours
+	coursesList.forEach((element) => {
+		const dateStart = new Date(element.periodStart).getFullYear(); //verif date
 		const dateEnd = new Date(element.periodEnd).getFullYear();
-		if(dateStart>=startYears.value && dateEnd<=endYears.value){   
-			currentYearsCourses.push(element);   //ajouter cours si date correspond
+		if (dateStart >= startYears.value && dateEnd <= endYears.value) {
+			currentYearsCourses.push(element); //ajouter cours si date correspond
 		}
-	})
-	getAllTagCourse();  //récuperer tous les matieres des currents years cours
+	});
+	getAllTagCourse(); //récuperer tous les matieres des currents years cours
 	showCoursesByLanguage();
 	//coursesFiltered.value = currentYearsCourses;   //afficher les cours
-};
+}
 
 function getAllTagCourse() {
 	TagList.value = [];
-	currentYearsCourses.forEach(element =>{
-		if(!TagList.value.includes(element.language.toUpperCase())){
+	currentYearsCourses.forEach((element) => {
+		if (!TagList.value.includes(element.language.toUpperCase())) {
 			TagList.value.push(element.language.toUpperCase());
 		}
-	})
-};
+	});
+}
 
 // Get the router
 const router = useRouter();
@@ -133,7 +150,7 @@ const getCourses = async () => {
 };
 
 // Call the getArticles method when the component is created
-onMounted(async() => {
+onMounted(async () => {
 	await getCourses();
 });
 

From 227fdba297607869d4852dc319ce33570c1e99a5 Mon Sep 17 00:00:00 2001
From: Baptiste Dumoulin <91154604+Ptitbapt@users.noreply.github.com>
Date: Fri, 9 Jun 2023 13:19:29 +0200
Subject: [PATCH 05/24] Svg Folder + Parts CoursDetails

---
 .../RessourcesComponents/CoursDetails.vue     | 155 +++++++-----------
 .../src/components/common/svg/Folder.vue      |  16 ++
 2 files changed, 75 insertions(+), 96 deletions(-)
 create mode 100644 front-end/src/components/common/svg/Folder.vue

diff --git a/front-end/src/components/RessourcesComponents/CoursDetails.vue b/front-end/src/components/RessourcesComponents/CoursDetails.vue
index a03639d64..4d8150395 100644
--- a/front-end/src/components/RessourcesComponents/CoursDetails.vue
+++ b/front-end/src/components/RessourcesComponents/CoursDetails.vue
@@ -8,9 +8,9 @@
 	<div class="text-center pt-4">
 		<h1 class="text-4xl font-bold">TEST</h1>
 	</div>
-	<div class="cours-detail bg-grey-800">
+	<div class="cours-detail bg-grey-800 mb-5">
 		<div class="corps-enseignant">
-			<h4 class="text-lg font-bold mb-2 border-b border-gray-300">Corps enseignant du cours</h4>
+			<h4 class="text-2xl font-bold mb-2 border-b border-gray-300">Corps enseignant du cours</h4>
 
 			<ul class="space-y-2">
 				<li v-for="teacher in teachers" :key="teacher.id" class="flex items-center">
@@ -19,12 +19,25 @@
 						alt="Profile Picture"
 						class="w-8 h-8 rounded-full mr-2"
 					/>
-					<span class="text-white-800">{{ teacher.name }}</span>
+					<span class="text-white-800 text-lg mb-5">{{ teacher.name }}</span>
 				</li>
 			</ul>
+			<div class="detail-actions">
+				<div class="corps-ensaignant">
+					<h4 class="text-2xl font-bold mb-2 border-b border-gray-300">Détails et actions</h4>
+					<ul class="space-y-2">
+						<li>
+							<h4 class="text-2xl font-bold mb-2">Annuaire</h4>
+							<p class="text-blue-500 underline cursor-pointer">
+								Afficher tout les membres de votre cours
+							</p>
+						</li>
+					</ul>
+				</div>
+			</div>
 		</div>
 		<div class="contenu-cours">
-			<h4 class="text-lg font-bold mb-2 border-b border-gray-300">Contenu du cours</h4>
+			<h4 class="text-2xl font-bold mb-2 border-b border-gray-300">Contenu du cours</h4>
 			<ul class="space-y-4">
 				<li v-for="course in courses" :key="course.id">
 					<div class="course-item" :class="{ open: course.open }" @click="toggleCourse(course)">
@@ -40,107 +53,57 @@
 					</div>
 				</li>
 			</ul>
+			<h4 class="text-2xl font-bold mb-2 mt-3 border-b border-gray-300">Groupes</h4>
+			<ul class="space-y-4">
+				<li v-for="groupe in groupes" :key="groupe.id">
+					<div class="course-item" :class="{ open: groupe.open }" @click="toggleGroupe(groupe)">
+						<h5 class="text-xl font-semibold">{{ groupe.title }}</h5>
+						<p class="text-gray-600">{{ groupe.description }}</p>
+					</div>
+					<div v-if="groupe.open" class="course-files">
+						<ul class="space-y-2">
+							<li v-for="file in groupe.files" :key="file.id">
+								<a :href="file.url" target="_blank" class="text-blue-500">{{ file.name }}</a>
+							</li>
+						</ul>
+					</div>
+				</li>
+			</ul>
 		</div>
 	</div>
 </template>
 
-<script>
-export default {
-	data() {
-		return {
-			teachers: [
-				{
-					id: 1,
-					name: 'John Doe',
-					profilePicture: 'path/to/profile-picture1.jpg',
-				},
-				{
-					id: 2,
-					name: 'Jane Smith',
-					profilePicture: 'path/to/profile-picture2.jpg',
-				},
-			],
-			courses: [
-				{
-					id: 1,
-					title: 'Course 1',
-					description: 'Description of Course 1',
-					open: false,
-					files: [
-						{
-							id: 1,
-							name: 'File 1.pdf',
-							url: 'path/to/file1.pdf',
-						},
-						{
-							id: 2,
-							name: 'File 2.pdf',
-							url: 'path/to/file2.pdf',
-						},
-					],
-				},
-				{
-					id: 2,
-					title: 'Course 2',
-					description: 'Description of Course 2',
-					open: false,
-					files: [
-						{
-							id: 3,
-							name: 'File 3.pdf',
-							url: 'path/to/file3.pdf',
-						},
-					],
-				},
-				{
-					id: 3,
-					title: 'Course 3',
-					description: 'Description of Course 3',
-					open: false,
-					files: [
-						{
-							id: 4,
-							name: 'File 4.pdf',
-							url: 'path/to/file4.pdf',
-						},
-						{
-							id: 5,
-							name: 'File 5.pdf',
-							url: 'path/to/file5.pdf',
-						},
-					],
-				},
-			],
-		};
-	},
-	methods: {
-		toggleCourse(course) {
-			course.open = !course.open;
-		},
-	},
-};
+<script lang="ts">
+import { computed, onMounted, ref } from 'vue';
+import { useCoursStore } from '@/store/modules/course.store';
+import { useAuthStore } from '@/store/modules/auth.store';
+import { useRouter } from 'vue-router';
+import Folder from '@/components/common/svg/Folder.vue';
+
 // get store
-// const course = useCoursStore();
-// const oneItems = computed(() => course.oneItems);
+// Use the openHouses store
+const courseStore = useCoursStore();
+const authStore = useAuthStore();
+const oneItems = computed(() => courseStore.oneItems);
 
-// const router = useRouter();
+const router = useRouter();
 
-// // get id from url
-// const _id = computed(() => {
-// 	const url = window.location.href;
-// 	const id = url.substring(url.lastIndexOf('/') + 1);
-// 	return id;
-// });
+// get id from url
+const _id = computed(() => {
+	const url = window.location.href;
+	const id = url.substring(url.lastIndexOf('/') + 1);
+	return id;
+});
 
-// // get openHouse by id
-// const getCourseById = async (_id: string) => {
-// 	await course.getCourseById(_id);
-// };
+// get openHouse by id
+const getCourseById = async (_id: string) => {
+	await courseStore.getCourseById(_id);
+};
 
-// // fetch openHouse data on mounted
-// onMounted(() => {
-// 	getCourseById(_id.value);
-// });
+// fetch openHouse data on mounted
+onMounted(() => {
+	getCourseById(_id.value);
+});
 </script>
 <style scoped>
 .cours-detail {
diff --git a/front-end/src/components/common/svg/Folder.vue b/front-end/src/components/common/svg/Folder.vue
new file mode 100644
index 000000000..08ee8d34c
--- /dev/null
+++ b/front-end/src/components/common/svg/Folder.vue
@@ -0,0 +1,16 @@
+<template>
+	<svg
+		xmlns="http://www.w3.org/2000/svg"
+		fill="none"
+		viewBox="0 0 24 24"
+		stroke-width="1.5"
+		stroke="currentColor"
+		class="w-6 h-6"
+	>
+		<path
+			stroke-linecap="round"
+			stroke-linejoin="round"
+			d="M2.25 12.75V12A2.25 2.25 0 014.5 9.75h15A2.25 2.25 0 0121.75 12v.75m-8.69-6.44l-2.12-2.12a1.5 1.5 0 00-1.061-.44H4.5A2.25 2.25 0 002.25 6v12a2.25 2.25 0 002.25 2.25h15A2.25 2.25 0 0021.75 18V9a2.25 2.25 0 00-2.25-2.25h-5.379a1.5 1.5 0 01-1.06-.44z"
+		/>
+	</svg>
+</template>

From 404ab00f686fda6923054268dc63735498cbf79f Mon Sep 17 00:00:00 2001
From: ThomasCast3 <91255859+ThomasCast3@users.noreply.github.com>
Date: Fri, 9 Jun 2023 15:31:04 +0200
Subject: [PATCH 06/24] form open houses search suggestion

---
 back-end/src/base/users/users.controller.ts   |  6 +++
 back-end/src/base/users/users.service.ts      |  6 ++-
 front-end/src/api/ressource-req.ts            |  2 +-
 front-end/src/api/user-req.ts                 |  4 ++
 .../RessourcesComponents/AddCourse.vue        |  2 +-
 .../RessourcesComponents/FormOpenHouses.vue   | 17 ++++--
 .../RessourcesComponents/NewParticipant.vue   | 53 +++++++++----------
 .../OpenHousesDetails.vue                     |  2 +-
 .../src/store/interfaces/user.interface.ts    |  3 +-
 front-end/src/store/modules/course.store.ts   |  2 -
 front-end/src/store/modules/user.store.ts     | 10 +++-
 11 files changed, 67 insertions(+), 40 deletions(-)

diff --git a/back-end/src/base/users/users.controller.ts b/back-end/src/base/users/users.controller.ts
index 9c20369d9..2e99e21f0 100644
--- a/back-end/src/base/users/users.controller.ts
+++ b/back-end/src/base/users/users.controller.ts
@@ -77,4 +77,10 @@ export class UsersController {
 
 		return res.status(200).json({ status: 'ok', users });
 	}
+
+	@Get('')
+	async getAllUsers(@Res() res: Response) {
+		const users = await this.usersService.getAllUsers();
+		return res.status(200).json({ users });
+	}
 }
diff --git a/back-end/src/base/users/users.service.ts b/back-end/src/base/users/users.service.ts
index 8e21ab90f..990de506a 100644
--- a/back-end/src/base/users/users.service.ts
+++ b/back-end/src/base/users/users.service.ts
@@ -249,8 +249,6 @@ export class UsersService {
 		return users ?? [];
 	}
 
-
-
 	//  RETRO SECTION SEARCH
 	async getUserListOnRoomRetro(roomId: string, user: string) {
 		if (
@@ -366,4 +364,8 @@ export class UsersService {
 
 		return users ?? [];
 	}
+
+	async getAllUsers() {
+		return await this.usersRepository.getAllUsers();
+	}
 }
diff --git a/front-end/src/api/ressource-req.ts b/front-end/src/api/ressource-req.ts
index 086304fd1..42b83f8d2 100644
--- a/front-end/src/api/ressource-req.ts
+++ b/front-end/src/api/ressource-req.ts
@@ -11,4 +11,4 @@ export const getCoursesById = async (id: string) => {
 
 export const createCourse = async (course: Course) => {
 	return http.post<Course>('/courses/create', course);
-};
\ No newline at end of file
+};
diff --git a/front-end/src/api/user-req.ts b/front-end/src/api/user-req.ts
index b03be11b1..dd167aae2 100644
--- a/front-end/src/api/user-req.ts
+++ b/front-end/src/api/user-req.ts
@@ -32,3 +32,7 @@ export const apiTryFetchUserListByRoomRetro = (roomId: string, user: string) =>
 		`/users/roomRetro?id=${roomId}&user=${user}`,
 	);
 };
+
+export const getAllUsers = () => {
+	return http.get<Array<User>>('/users');
+};
diff --git a/front-end/src/components/RessourcesComponents/AddCourse.vue b/front-end/src/components/RessourcesComponents/AddCourse.vue
index 50f01efad..32e7b4f87 100644
--- a/front-end/src/components/RessourcesComponents/AddCourse.vue
+++ b/front-end/src/components/RessourcesComponents/AddCourse.vue
@@ -32,7 +32,7 @@
 								<button
 									type="button"
 									class="focus:outline-none text-white bg-red-700 hover:bg-red-800 focus:ring-4 focus:ring-red-300 font-medium rounded-lg text-sm px-3 py-1.5 mr-2 mb-2 dark:bg-red-600 dark:hover:bg-red-700 dark:focus:ring-red-900"
-									@click="removeFile(index)"
+									@click="removeFile(file)"
 								>
 									X
 								</button>
diff --git a/front-end/src/components/RessourcesComponents/FormOpenHouses.vue b/front-end/src/components/RessourcesComponents/FormOpenHouses.vue
index 1f352c036..fc523240e 100644
--- a/front-end/src/components/RessourcesComponents/FormOpenHouses.vue
+++ b/front-end/src/components/RessourcesComponents/FormOpenHouses.vue
@@ -14,7 +14,7 @@
 						<input type="text" v-model="town" placeholder="town :" /><br />
 					</div>
 					<textarea placeholder="Description :" v-model="description"></textarea><br />
-					<participant :participants="participants" @clear="clearParticipants" />
+					<addParticipant :participants="participants" @clear="clearParticipants" />
 					<input type="file" @change="onFileSelected" /><br />
 					<button type="submit">Submit</button>
 				</form>
@@ -24,6 +24,8 @@
 </template>
 
 <script setup lang="ts">
+import addParticipant from '@/components/RessourcesComponents/NewParticipant.vue';
+import activity from '@/components/RessourcesComponents/NewActivity.vue';
 import ModalOverlay from '@/components/common/Modal.vue';
 import { ref } from 'vue';
 import { http } from '@/api/network/axios';
@@ -31,7 +33,7 @@ import { http } from '@/api/network/axios';
 const showMetaModal = ref(false);
 
 const openMetaModal = () => (showMetaModal.value = true);
-const closeMetaModal = () => (showMetaModal.value = false);
+const closeMetaModal = () => closeForm();
 
 let title = '';
 let date = '';
@@ -74,6 +76,12 @@ const addOpenHouses = function () {
 	closeMetaModal();
 };
 
+const closeForm = function () {
+	showMetaModal.value = false;
+	clearParticipants();
+	clearActivitys();
+};
+
 const onFileSelected = function (event) {
 	console.log(event);
 };
@@ -81,7 +89,8 @@ const onFileSelected = function (event) {
 const clearParticipants = function () {
 	participants.splice(0, participants.length);
 };
-//	 },
 
-//}
+const clearActivitys = function () {
+	Activities.splice(0, Activities.length);
+};
 </script>
diff --git a/front-end/src/components/RessourcesComponents/NewParticipant.vue b/front-end/src/components/RessourcesComponents/NewParticipant.vue
index b3bbc2335..d4d459d62 100644
--- a/front-end/src/components/RessourcesComponents/NewParticipant.vue
+++ b/front-end/src/components/RessourcesComponents/NewParticipant.vue
@@ -5,7 +5,7 @@
 		<div v-show="showParticipant">
 			<input type="text" placeholder="name :" v-model="name" @input="searchUser" />
 			<!--input = name et lance recherche de correspondance-->
-			<p v-for="user in userList" @click="selectUser(user)" :key="user._id">{{ user }}</p>
+			<p v-for="(user, id) in userList" @click="selectUser(user)" :key="id">{{ user }}</p>
 			<br />
 		</div>
 		<p v-for="user in participants" :key="user.name">{{ user }}</p>
@@ -15,19 +15,19 @@
 </template>
 
 <script lang="ts">
-import { http } from '@/api/network/axios';
+import { useUserStore } from '@/store/modules/user.store';
+import { elements } from 'chart.js';
 export default {
 	data() {
 		return {
-			firstName: '',
-			lastName: '',
 			name: '',
 			usersNames: [],
 			userList: [],
-			userName: { firstName: '', lastName: '' }, // valeur du get peut changer d'objet a string
+			userName: '', // valeur du get peut changer d'objet a string
 			showParticipant: false,
 		};
 	},
+	// eslint-disable-next-line vue/order-in-components
 	props: {
 		participants: {
 			//props participants a envoyer pour le form
@@ -52,51 +52,50 @@ export default {
 			}
 		},
 
-		searchUser() {
+		async searchUser() {
 			//recherche de participant
-			// this.$emit('clear');
+			//this.$emit('clear');
 			this.userList = [];
-			this.getUsers(); // recuperer les users de la bdd
+			await this.getUsers(); // recuperer les users de la bdd
+			console.log(this.usersNames);
 			this.usersNames.forEach((element) => {
-				const userName = element.firstName + ' ' + element.lastName;
 				let alreadyInList = false;
-				if (userName.toUpperCase().includes(this.name.toUpperCase()) && this.name != '') {
+				if (element.toUpperCase().includes(this.name.toUpperCase()) && this.name != '') {
 					this.participants.forEach((participant) => {
-						console.log(participant);
-						console.log(userName);
-						if (participant == userName) {
+						if (participant == element) {
 							alreadyInList = true;
 						}
 					});
 					if (!alreadyInList) {
-						this.userList.push(userName);
+						this.userList.push(element.toUpperCase());
 					}
 				}
 			});
 			console.log(this.userList);
 		},
 
-		getUsers() {
-			http.get('http://localhost:8010/openhouses/users').then((response) => {
-				this.users = response.data;
-				this.users.forEach((element) => {
-					this.userName = {
-						firstName: element.profile.firstName,
-						lastName: element.profile.lastName,
-					};
+		async getUsers() {
+			this.usersNames = [];
+			const userStore = useUserStore();
+			await userStore.getAllUsers();
+			const usersList = userStore.users;
+			const test = Object.keys(usersList);
+			const testArray = test.map((key) => ({ key, value: usersList[key] }));
+			testArray.forEach((element) => {
+				element.value.forEach((user) => {
+					this.userName = user.profile.firstName + ' ' + user.profile.lastName;
 					if (!this.userCheckList()) {
-						this.usersNames.push(this.userName);
+						this.usersNames.push(this.userName.toUpperCase());
 					}
 				});
 			});
+			console.log(this.usersNames);
 		},
 		userCheckList() {
 			let alreadyInList = false;
 			this.usersNames.forEach((element) => {
-				if (element.lastName == this.userName.lastName) {
-					if (element.firstName == this.userName.firstName) {
-						alreadyInList = true;
-					}
+				if (element == this.userName.toUpperCase()) {
+					alreadyInList = true;
 				}
 			});
 			return alreadyInList;
diff --git a/front-end/src/components/RessourcesComponents/OpenHousesDetails.vue b/front-end/src/components/RessourcesComponents/OpenHousesDetails.vue
index 16452c74a..5421d9603 100644
--- a/front-end/src/components/RessourcesComponents/OpenHousesDetails.vue
+++ b/front-end/src/components/RessourcesComponents/OpenHousesDetails.vue
@@ -54,7 +54,7 @@ const getOpenHouseById = async (_id: string) => {
 };
 
 // fetch openHouse data on mounted
-onMounted(async() => {
+onMounted(async () => {
 	await getOpenHouseById(_id.value);
 });
 </script>
diff --git a/front-end/src/store/interfaces/user.interface.ts b/front-end/src/store/interfaces/user.interface.ts
index 1fc762ae3..4bba145bc 100644
--- a/front-end/src/store/interfaces/user.interface.ts
+++ b/front-end/src/store/interfaces/user.interface.ts
@@ -7,6 +7,7 @@ export interface UserStore {
 	uploadWaitingList: Array<boolean>;
 	relatedProfiles: Array<UserProfileList>;
 	relatedUserProfile: IRelatedUserProfile;
+	users: Array<User>;
 
 	saveProfile?: (this: UserStore) => Promise<boolean | undefined>;
 	uploadFinished?: (this: UserStore) => boolean;
@@ -33,4 +34,4 @@ export interface UserCanvasList extends UserProfileList {
 
 export interface UserRetroList extends UserProfileList {
 	pending?: boolean;
-}
\ No newline at end of file
+}
diff --git a/front-end/src/store/modules/course.store.ts b/front-end/src/store/modules/course.store.ts
index dc3a1ae12..751709a79 100644
--- a/front-end/src/store/modules/course.store.ts
+++ b/front-end/src/store/modules/course.store.ts
@@ -44,10 +44,8 @@ export const useCoursStore = defineStore('course', {
 		//get courses in the database
 		getCourse: withErrorHandler(async function () {
 			const response = await getCourses();
-			//	console.log(response.data);
 			const items = response.data;
 			this.items = items;
-			console.log(this.items);
 			return true;
 		}),
 		getCourseById: withErrorHandler(async function (id: string) {
diff --git a/front-end/src/store/modules/user.store.ts b/front-end/src/store/modules/user.store.ts
index 660f24588..ac3f01db2 100644
--- a/front-end/src/store/modules/user.store.ts
+++ b/front-end/src/store/modules/user.store.ts
@@ -1,5 +1,4 @@
 import { defineStore } from 'pinia';
-
 import { pick } from '@/utils/object.helper';
 import { withErrorHandler } from '@/utils/storeHandler';
 import { KeysRequired } from '@/interfaces/advanced-types.interface';
@@ -9,6 +8,7 @@ import {
 	tryGetClassProfileList,
 	trySaveUserProfile,
 	tryGetRelatedUserProfile,
+	getAllUsers,
 } from '@/api/user-req';
 
 const userStoreDefaultState = (): UserStore => ({
@@ -17,6 +17,7 @@ const userStoreDefaultState = (): UserStore => ({
 	uploadWaitingList: [],
 	relatedProfiles: [],
 	relatedUserProfile: {},
+	users: [],
 });
 
 export const useUserStore = defineStore('user', {
@@ -56,5 +57,12 @@ export const useUserStore = defineStore('user', {
 				keys?.length ? pick(userStoreDefaultState(), keys) : userStoreDefaultState(), // if no keys provided, reset all
 			);
 		},
+		getAllUsers: withErrorHandler(async function () {
+			const response = await getAllUsers();
+			const items = response.data;
+			this.users = items;
+			console.log(this.users);
+			return true;
+		}),
 	},
 });

From eaa931ccd52e149da595fb53cb1624e25db7ff5d Mon Sep 17 00:00:00 2001
From: Baptiste Dumoulin <91154604+Ptitbapt@users.noreply.github.com>
Date: Fri, 9 Jun 2023 15:49:49 +0200
Subject: [PATCH 07/24] Update package-lock.json

---
 front-end/package-lock.json | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/front-end/package-lock.json b/front-end/package-lock.json
index 98e10b9f6..c887884a4 100644
--- a/front-end/package-lock.json
+++ b/front-end/package-lock.json
@@ -10,6 +10,7 @@
 			"dependencies": {
 				"@imengyu/vue3-context-menu": "^1.2.10",
 				"@pixi/graphics-smooth": "^1.1.0",
+				"@toycode/markdown-it-class": "^1.2.4",
 				"@vitejs/plugin-vue-jsx": "^3.0.1",
 				"@vuepic/vue-datepicker": "^5.1.2",
 				"@vueuse/core": "^10.1.2",
@@ -1836,6 +1837,11 @@
 			"resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.1.0.tgz",
 			"integrity": "sha512-+9jVqKhRSpsc591z5vX+X5Yyw+he/HCB4iQ/RYxw35CEPaY1gnsNE43nf9n9AaYjAQrTiI/mOwKUKdUs9vf7Xg=="
 		},
+		"node_modules/@toycode/markdown-it-class": {
+			"version": "1.2.4",
+			"resolved": "https://registry.npmjs.org/@toycode/markdown-it-class/-/markdown-it-class-1.2.4.tgz",
+			"integrity": "sha512-hA4gHBK8moObkOYdWTjhy1wYcYy0MJeM3JjSKbsXHRpRMvIKhk6Jm+t3bXsSScTdz/byWqQbs8YIwVYjHp+SlQ=="
+		},
 		"node_modules/@tsconfig/node10": {
 			"version": "1.0.9",
 			"resolved": "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.9.tgz",

From e252de35ed2add9835961eedaa39bb15091c9690 Mon Sep 17 00:00:00 2001
From: Baptiste Dumoulin <91154604+Ptitbapt@users.noreply.github.com>
Date: Thu, 15 Jun 2023 15:04:03 +0200
Subject: [PATCH 08/24] cours

---
 .../RessourcesComponents/CoursDetails.vue     | 117 +++++++++++++-----
 .../src/store/interfaces/cours.interface.ts   |  31 ++++-
 2 files changed, 111 insertions(+), 37 deletions(-)

diff --git a/front-end/src/components/RessourcesComponents/CoursDetails.vue b/front-end/src/components/RessourcesComponents/CoursDetails.vue
index b31a8c7d9..40d5c92c0 100644
--- a/front-end/src/components/RessourcesComponents/CoursDetails.vue
+++ b/front-end/src/components/RessourcesComponents/CoursDetails.vue
@@ -1,8 +1,5 @@
 <template>
 	<div v-if="Object.keys(course.oneItems).length > 0">
-		<div class="text-center pt-4">
-			<h1 class="text-4xl font-bold">{{ courseById.tag }}</h1>
-		</div>
 		<img
 			class="cover h-72 w-screen object-cover object-center"
 			:src="
@@ -12,28 +9,73 @@
 			"
 			alt=""
 		/>
-		<div class="pt-3 pb-2">
-			<span
-				class="bg-blue-100 text-blue-800 text-xs font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-blue-900 dark:text-blue-300"
-				>{{ courseById.periodStart }}</span
-			>
+		<div class="text-center pt-4">
+			<h1 class="text-4xl font-bold">{{ courseById.tag }}</h1>
 		</div>
-		<div class="pt-3 pb-2">
-			<span
-				class="bg-blue-100 text-blue-800 text-xs font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-blue-900 dark:text-blue-300"
-				>{{ courseById.periodEnd }}</span
-			>
+		<div class="cours-detail bg-grey-800 mb-5">
+			<div class="corps-enseignant">
+				<h4 class="text-2xl font-bold mb-2 border-b border-gray-300">Corps enseignant du cours</h4>
+
+				<ul class="space-y-2">
+					<li v-for="teacher in courseById.teachers" :key="teacher.id">
+						<img
+							:src="teacher.profilePicture"
+							alt="Profile Picture"
+							class="w-8 h-8 rounded-full mr-2"
+						/>
+						<span class="text-white-800 text-lg mb-5">{{ teacher.name }}</span>
+					</li>
+				</ul>
+
+				<div class="detail-actions">
+					<div class="corps-ensaignant">
+						<h4 class="text-2xl font-bold mb-2 border-b border-gray-300">Détails et actions</h4>
+						<ul class="space-y-2">
+							<li>
+								<h4 class="text-2xl font-bold mb-2">Annuaire</h4>
+								<p class="text-blue-500 underline cursor-pointer">
+									Afficher tout les membres de votre cours
+								</p>
+							</li>
+						</ul>
+					</div>
+				</div>
+			</div>
+			<div class="contenu-cours">
+				<h4 class="text-2xl font-bold mb-2 border-b border-gray-300">Contenu du cours</h4>
+				<ul class="space-y-4">
+					<li v-for="course in courses" :key="course.id">
+						<div class="course-item" :class="{ open: course.open }" @click="toggleCourse(course)">
+							<h5 class="text-xl font-semibold">{{ course.title }}</h5>
+							<p class="text-gray-600">{{ course.description }}</p>
+						</div>
+						<div v-if="course.open" class="course-files">
+							<ul class="space-y-2">
+								<li v-for="file in course.files" :key="file.id">
+									<a :href="file.url" target="_blank" class="text-blue-500">{{ file.name }}</a>
+								</li>
+							</ul>
+						</div>
+					</li>
+				</ul>
+				<h4 class="text-2xl font-bold mb-2 mt-3 border-b border-gray-300">Groupes</h4>
+				<ul class="space-y-4">
+					<li v-for="groupe in groupes" :key="groupe.id">
+						<div class="course-item" :class="{ open: groupe.open }" @click="toggleGroupe(groupe)">
+							<h5 class="text-xl font-semibold">{{ groupe.title }}</h5>
+							<p class="text-gray-600">{{ groupe.description }}</p>
+						</div>
+						<div v-if="groupe.open" class="course-files">
+							<ul class="space-y-2">
+								<li v-for="file in groupe.files" :key="file.id">
+									<a :href="file.url" target="_blank" class="text-blue-500">{{ file.name }}</a>
+								</li>
+							</ul>
+						</div>
+					</li>
+				</ul>
+			</div>
 		</div>
-		<button
-			type="button"
-			@click="
-				() => {
-					router.push('/app/ressource/cours');
-				}
-			"
-		>
-			Retour
-		</button>
 		<div class="flex bg-slate-300 w-full gap-4 justify-center" v-if="canvas.length > 0">
 			<div v-for="canva in canvas">
 				<button
@@ -45,14 +87,24 @@
 			</div>
 		</div>
 		<div class="flex bg-slate-400 w-full gap-4 justify-center mt-4" v-if="retro">
-				<button
-					@click="goToRetro(retro)"
-					class="gradiant left-4 bottom-0 md:bottom-[unset] bg-[#24292E] hover:bg-[#24292E99] shadow rounded-lg p-4"
-				>
-					{{ retro.title }}
-				</button>
+			<button
+				@click="goToRetro(retro)"
+				class="gradiant left-4 bottom-0 md:bottom-[unset] bg-[#24292E] hover:bg-[#24292E99] shadow rounded-lg p-4"
+			>
+				{{ retro.title }}
+			</button>
 		</div>
 	</div>
+	<button
+		type="button"
+		@click="
+			() => {
+				router.push('/app/ressource/cours');
+			}
+		"
+	>
+		Retour
+	</button>
 </template>
 <script lang="ts" setup>
 import { computed, onMounted } from 'vue';
@@ -85,13 +137,12 @@ onMounted(async () => {
 });
 
 const goToProject = (canva) => {
-	router.push(`/app/agility/project/${canva._id}`)
+	router.push(`/app/agility/project/${canva._id}`);
 };
 
 const goToRetro = (retro) => {
-	router.push(`/app/retrospective/${retro.slug}`)
-}
-
+	router.push(`/app/retrospective/${retro.slug}`);
+};
 </script>
 <style scoped>
 .display {
diff --git a/front-end/src/store/interfaces/cours.interface.ts b/front-end/src/store/interfaces/cours.interface.ts
index 99e41926f..78287a1af 100644
--- a/front-end/src/store/interfaces/cours.interface.ts
+++ b/front-end/src/store/interfaces/cours.interface.ts
@@ -11,16 +11,39 @@ export interface CoursesStore {
 export interface Course {
 	_id?: string;
 	tag: string;
-	classTag: string;
+	classId: string;
 	picture: string;
 	language: string;
 	createdAt: Date;
 	periodStart: Date;
 	periodEnd: Date;
-	presence: [];
-	project: [];
-	site: string;
+	presence: Array<any>;
+	site: string | null;
 	teacherId?: string;
+	groups: Array<Group>;
+	isLocked: boolean;
+	messages: Array<Message>;
+	projects: Array<string>;
+	retro: string;
+}
+
+export interface Group {
+	id: string;
+	group: Array<string>;
+}
+
+export interface Message {
+	userId: string;
+	message: {
+		newMessage: {
+			type: string;
+			text: string;
+			sender_id: number;
+			sender_name: string;
+			date: string;
+		};
+	};
+	date: Date;
 }
 
 export interface CourseById {

From 9a9fb889e81b987ef8d94689a5970efc0b56419d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Th=C3=A9o=20Landemaine?=
 <91159174+TheoLandemaine@users.noreply.github.com>
Date: Fri, 16 Jun 2023 01:54:53 +0200
Subject: [PATCH 09/24] Link JPO with articles && add documents to articles &
 edit design home

---
 .../src/base/articles/articles.controller.ts  |  14 ++
 .../src/base/articles/articles.service.ts     |  16 ++
 .../RessourcesComponents/OpenHouses.vue       |  79 ++----
 .../OpenHousesDetails.vue                     | 224 +++++++++++++++---
 .../RessourcesComponents/Ressources.vue       |  79 ++++--
 front-end/src/components/blog/AddArticles.vue |  20 ++
 .../src/store/interfaces/article.interface.ts |   9 +-
 front-end/src/store/modules/article.store.ts  |  27 +++
 front-end/src/views/OpenHousesDetails.vue     |   2 +-
 9 files changed, 349 insertions(+), 121 deletions(-)

diff --git a/back-end/src/base/articles/articles.controller.ts b/back-end/src/base/articles/articles.controller.ts
index a62131333..35b2663b4 100644
--- a/back-end/src/base/articles/articles.controller.ts
+++ b/back-end/src/base/articles/articles.controller.ts
@@ -102,6 +102,20 @@ export class ArticlesController {
 		return res.status(201).json(article);
 	}
 
+	// add document
+	@Put('/document/:id')
+	async addDocument(@Req() req: Request, @Res() res: Response) {
+		const article = await this.articlesService.addDocument(req.params.id, req.body);
+		return res.status(201).json(article);
+	}
+
+	// remove document
+	@Put('/removeDocument/:id')
+	async removeDocument(@Req() req: Request, @Res() res: Response) {
+		const article = await this.articlesService.removeDocument(req.params.id, req.body);
+		return res.status(201).json(article);
+	}
+
 	// delete article
 	@Delete('/delete/:id')
 	async deleteArticle(@Req() req: Request, @Res() res: Response) {
diff --git a/back-end/src/base/articles/articles.service.ts b/back-end/src/base/articles/articles.service.ts
index f398c76c3..132bf8eff 100644
--- a/back-end/src/base/articles/articles.service.ts
+++ b/back-end/src/base/articles/articles.service.ts
@@ -131,6 +131,22 @@ export class ArticlesService {
 		return await this.articlesRepository.updateOneArticle({ _id: new ObjectId(id) }, update);
 	}
 
+	// add document
+	async addDocument(id, queryDocument) {
+		queryDocument._id = new ObjectId();
+		const update = { $push: { documents: queryDocument } };
+
+		return await this.articlesRepository.updateOneArticle({ _id: new ObjectId(id) }, update);
+	}
+
+	// remove document
+	async removeDocument(id, queryDocument) {
+		queryDocument._id = new ObjectId(queryDocument._id);
+		const update = { $pull: { documents: queryDocument } };
+
+		return await this.articlesRepository.updateOneArticle({ _id: new ObjectId(id) }, update);
+	}
+
 	// delete article
 	async deleteArticle(id) {
 		return await this.articlesRepository.deleteOneArticle(id);
diff --git a/front-end/src/components/RessourcesComponents/OpenHouses.vue b/front-end/src/components/RessourcesComponents/OpenHouses.vue
index ad45cf73e..efc0086f2 100644
--- a/front-end/src/components/RessourcesComponents/OpenHouses.vue
+++ b/front-end/src/components/RessourcesComponents/OpenHouses.vue
@@ -2,48 +2,31 @@
 <template>
 	<div>
 		<div class="text-center pt-4">
-			<h1 class="text-4xl font-bold">Journée Porte Ouverte</h1>
+			<h1 class="text-4xl font-bold text-black dark:text-white">Journée Porte Ouverte</h1>
 		</div>
 		<div class="text-center flex items-center justify-center max-w-full h-full">
-			<div class="grid grid-cols-2 md:grid-cols-3 gap-4">
+			<div class="grid grid-cols-2 md:grid-cols-4 gap-4">
 				<div
-					v-for="item in items"
-					class="max-w-sm bg-white border border-gray-200 rounded-lg shadow dark:bg-gray-800 dark:border-gray-700"
+					v-for="item in filteredItems"
+					class="relative max-w-sm bg-white border border-gray-200 rounded-lg shadow dark:bg-gray-800 dark:border-gray-700"
 				>
-					<img
-						class="object-cover h-48 w-96 rounded-t-lg"
-						:src="
-							item.picture && item.picture != ''
-								? item.picture
-								: 'https://cdn.discordapp.com/attachments/894865078824890408/1073218625718198342/Fof04PpacAQePOW.png'
-						"
-						alt=""
-					/>
-					<div class="pt-3 pb-2">
-						<span
-							class="bg-blue-100 text-blue-800 text-xs font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-blue-900 dark:text-blue-300"
-							>{{ formatDate(item.date) }}</span
-						>
-					</div>
-					<div class="pt-2 pb-5">
+					<div
+						class="max-w-sm p-6 bg-white border border-gray-200 rounded-lg shadow dark:bg-gray-800 dark:border-gray-700"
+					>
 						<a href="#">
 							<h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">
-								{{ item.title ? item.title : 'Pas de titre spécifié' }}
+								JPO du {{ new Date(item.date).toLocaleDateString('fr-FR') }}
 							</h5>
 						</a>
-						<p class="mb-3 p-3 font-normal text-gray-700 dark:text-gray-400">
-							{{ item.description ? item.description : 'Pas de description spécifiée' }}
-						</p>
 						<button
-							type="button"
-							@click="openOpenHouse(item._id)"
+							@click="openJPO(item._id)"
 							class="inline-flex items-center px-3 py-2 text-sm font-medium text-center text-white bg-blue-700 rounded-lg hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
 						>
-							Read more
+							Voir les documents
 							<svg
 								aria-hidden="true"
 								class="w-4 h-4 ml-2 -mr-1"
-								fill="white"
+								fill="currentColor"
 								viewBox="0 0 20 20"
 								xmlns="http://www.w3.org/2000/svg"
 							>
@@ -58,49 +41,33 @@
 				</div>
 			</div>
 		</div>
-		<FormOpenHouse />
 	</div>
 </template>
 
 <script lang="ts" setup>
 import { computed, onMounted } from 'vue';
+import { useArticleStore } from '@/store/modules/article.store';
 import { useRouter } from 'vue-router';
-import { useOpenHouseStore } from '@/store/modules/openHouse.store';
-import FormOpenHouse from './FormOpenHouses.vue';
-
 
-// Use the openHouses store
-const openHousesStore = useOpenHouseStore();
-// Create a reactive variable to store the articles
-const items = computed(() => openHousesStore.items);
-
-// Get the router
+const articlesStore = useArticleStore();
 const router = useRouter();
 
-// Fetch the articles
-const getOpenHouse = async () => {
-	await openHousesStore.getOpenHouse();
-};
+// Use the articles store
+const articles = computed(() => articlesStore.items);
 
-// Call the getArticles method when the component is created
-onMounted(async () => {
-	await getOpenHouse();
+// filter the articles if they have JPO tag
+const filteredItems = computed(() => {
+	return articles.value.filter((item) => item.tags.toUpperCase().includes('JPO'));
 });
 
-// Function to open the openHouse page
-const openOpenHouse = (id: string) => {
+const openJPO = (id) => {
 	router.push(`/app/ressource/openhouse/${id}`);
 };
 
-// Function to format the date
-const formatDate = (date) => {
-	const options = {
-		month: 'long',
-		day: 'numeric',
-		year: 'numeric',
-	} as Intl.DateTimeFormatOptions;
-	return new Date(date).toLocaleDateString('fr-FR', options);
-};
+// Call articlesStore.getArticles() when the component is created
+onMounted(async () => {
+	await articlesStore.getArticle();
+});
 </script>
 
 <style scoped>
diff --git a/front-end/src/components/RessourcesComponents/OpenHousesDetails.vue b/front-end/src/components/RessourcesComponents/OpenHousesDetails.vue
index 16452c74a..3baa11140 100644
--- a/front-end/src/components/RessourcesComponents/OpenHousesDetails.vue
+++ b/front-end/src/components/RessourcesComponents/OpenHousesDetails.vue
@@ -1,46 +1,122 @@
 <template>
-	<div>
-		<div class="text-center pt-4">
-			<h1 class="text-4xl font-bold">{{ oneItems.title }}</h1>
+	<div class="text-center max-w-full h-full">
+		<ModalOverlay v-if="addDocumentModal" @close="closeDocumentModal" size="2xl">
+			<template #body>
+				<div class="text-center p-6 dark:text-white">
+					<form @submit.prevent="addDocument(article._id)">
+						<div>
+							<label
+								for="title"
+								class="block mb-2 text-lg font-medium text-gray-900 dark:text-white"
+								>Titre</label
+							>
+							<div class="relative mb-6">
+								<input
+									type="text"
+									id="title"
+									class="form-control w-full bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block pl-4 p-2.5 dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+									placeholder="Écrire un titre..."
+									v-model="name"
+								/>
+							</div>
+						</div>
+						<label for="title" class="block mb-2 text-lg font-medium text-gray-900 dark:text-white"
+							>Commentaire</label
+						>
+						<div class="mb-6">
+							<input
+								type="text"
+								v-model="link"
+								rows="1"
+								class="p-2.5 w-full text-sm text-gray-900 bg-white rounded-lg border border-gray-300 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+								placeholder="Écrire un commentaire..."
+							/>
+						</div>
+
+						<div>
+							<button
+								type="submit"
+								class="text-gray-900 bg-light-primary border border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4 focus:ring-gray-200 font-medium rounded-lg text-sm px-5 py-2.5 mr-2 mb-2 dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:hover:border-gray-600 dark:focus:ring-gray-700"
+							>
+								Créer
+							</button>
+						</div>
+					</form>
+				</div>
+			</template>
+		</ModalOverlay>
+		<div class="text-center mt-10">
+			<h1 class="text-4xl font-bold text-black dark:text-white">
+				JPO du {{ new Date(article.date).toLocaleDateString('fr-FR') }}
+			</h1>
+			<button
+				type="submit"
+				@click="router.push('/app/ressource/openhouse')"
+				class="font-bold rounded-lg text-xs md:text-sm px-3 py-2 mt-3 focus:outline-none gap-2 bg-blue-700"
+			>
+				<span class="text-white"> Toutes les JPO </span>
+			</button>
 		</div>
-		<img
-			class="cover h-72 w-screen object-cover object-center"
-			:src="
-				oneItems.picture && oneItems.picture != ''
-					? oneItems.picture
-					: 'https://cdn.discordapp.com/attachments/894865078824890408/1073218625718198342/Fof04PpacAQePOW.png'
-			"
-			alt=""
-		/>
-		<div class="pt-3 pb-2">
-			<span
-				class="bg-blue-100 text-blue-800 text-xs font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-blue-900 dark:text-blue-300"
-				>{{ oneItems.description }}</span
+		<div class="flex items-center justify-evenly h-4/5">
+			<div
+				class="relative max-w-sm bg-white border border-gray-200 rounded-lg shadow dark:bg-gray-800 dark:border-gray-700"
 			>
+				<CardArticle :item="article" />
+			</div>
+			<div>
+				<div
+					v-for="(document, i) in article.documents"
+					:key="document.name"
+					class="relative flex flex-row items-center max-w-sm mb-4 dark:border-gray-700"
+				>
+					<button
+						type="button"
+						@click="deleteDocument(article._id, document)"
+						class="focus:outline-none text-white bg-red-700 hover:bg-red-800 focus:ring-4 focus:ring-red-300 font-medium rounded-lg text-xs p-2 mr-4 dark:bg-red-600 dark:hover:bg-red-700 dark:focus:ring-red-900"
+					>
+						<DeleteLogo />
+					</button>
+					<div
+						class="max-w-sm text-left p-4 bg-white border border-gray-200 rounded-lg shadow dark:bg-gray-800 dark:border-gray-700"
+					>
+						<a :href="document.link" target="_blank">
+							<h5 class="text-2xl font-bold tracking-tight text-gray-900 dark:text-white">
+								Document {{ i + 1 }} : {{ document.name }}
+							</h5>
+						</a>
+					</div>
+				</div>
+				<div
+					class="max-w-sm p-3 border-4 border-dashed border-gray-300 rounded-lg shadow dark:bg-gray-800 dark:border-gray-400"
+				>
+					<button
+						@click="openAddDocumentModal()"
+						class="flex flex-row items-center justify-evenly w-full"
+					>
+						<Add class="!fill-gray-400" />
+						<h5 class="text-2xl font-bold tracking-tight text-gray-400">add Document</h5>
+					</button>
+				</div>
+			</div>
 		</div>
-		<button
-			type="button"
-			@click="
-				() => {
-					router.push('/app/ressource/openhouse');
-				}
-			"
-		>
-			Retour
-		</button>
 	</div>
 </template>
 <script lang="ts" setup>
-import { computed, onMounted } from 'vue';
-import { useOpenHouseStore } from '@/store/modules/openHouse.store';
+import { computed, onMounted, ref } from 'vue';
+import CardArticle from '../blog/CardArticle.vue';
+import { useArticleStore } from '@/store/modules/article.store';
+import ModalOverlay from '@/components/common/Modal.vue';
+import Swal from 'sweetalert2';
+import Add from '../common/svg/Add.vue';
+import DeleteLogo from '../common/svg/DeleteLogo.vue';
 import { useRouter } from 'vue-router';
 
-// get store
-const openHouses = useOpenHouseStore();
-const oneItems = computed(() => openHouses.oneItems);
-
 const router = useRouter();
 
+// get store
+const articlesStore = useArticleStore();
+const article = computed(() => articlesStore.oneItems);
+
 // get id from url
 const _id = computed(() => {
 	const url = window.location.href;
@@ -48,16 +124,88 @@ const _id = computed(() => {
 	return id;
 });
 
-// get openHouse by id
-const getOpenHouseById = async (_id: string) => {
-	await openHouses.getOpenHouseById(_id);
+const addDocumentModal = ref(false);
+
+const openAddDocumentModal = () => {
+	addDocumentModal.value = true;
 };
 
-// fetch openHouse data on mounted
-onMounted(async() => {
-	await getOpenHouseById(_id.value);
+const closeDocumentModal = () => {
+	addDocumentModal.value = false;
+};
+
+// form data
+const name = ref('');
+const link = ref('');
+
+// Function to post the data to the API
+const addDocument = async (id) => {
+	// add verification if all the fields are filled
+	if (!name.value || !link.value) {
+		Swal.fire({
+			title: 'You have to fill all the fields',
+			text: 'Please fill all the fields to add a new document',
+			icon: 'error',
+			confirmButtonColor: '#3085d6',
+			cancelButtonColor: '#d33',
+			confirmButtonText: 'Ok',
+		});
+		return;
+	}
+
+	let data = {
+		name: name.value,
+		link: link.value,
+	};
+
+	//reset the form
+	name.value = '';
+	link.value = '';
+
+	Swal.fire({
+		title: 'Your document has been added',
+		icon: 'success',
+		confirmButtonColor: '#3085d6',
+		cancelButtonColor: '#d33',
+		confirmButtonText: 'Ok',
+	}).then(async (result) => {
+		if (result.isConfirmed) {
+			await articlesStore.addDocument(id, data);
+			closeDocumentModal();
+		}
+	});
+};
+
+const deleteDocument = async (id, document) => {
+	const documentRemoved = {
+		_id: document._id,
+		name: document.name,
+		link: document.link,
+	};
+
+	Swal.fire({
+		title: 'Are you sure?',
+		text: 'You will not be able to recover this document!',
+		icon: 'warning',
+		showCancelButton: true,
+		confirmButtonColor: '#3085d6',
+		cancelButtonColor: '#d33',
+		cancelButtonText: 'Cancel',
+		confirmButtonText: 'Yes, delete it!',
+	}).then(async (result) => {
+		if (result.isConfirmed) {
+			await articlesStore.removeDocument(id, documentRemoved);
+			Swal.fire('Deleted!', 'Your document has been deleted.', 'success');
+		}
+	});
+};
+
+// get article by id with a onMounted
+onMounted(async () => {
+	await articlesStore.getArticleById(_id.value);
 });
 </script>
+
 <style scoped>
 .display {
 	display: block;
diff --git a/front-end/src/components/RessourcesComponents/Ressources.vue b/front-end/src/components/RessourcesComponents/Ressources.vue
index 758c25869..18db785e1 100644
--- a/front-end/src/components/RessourcesComponents/Ressources.vue
+++ b/front-end/src/components/RessourcesComponents/Ressources.vue
@@ -1,41 +1,70 @@
 <template>
-	<div>
-		<div class="text-center pt-4">
-			<h1 class="text-4xl font-bold">Ressources</h1>
-		</div>
-		<div class="flex justify-center items-center space-x-4">
+	<div class="h-full">
+		<div class="flex flex-row justify-evenly items-center space-x-4 h-full">
 			<div
-				class="w-40 h-40 bg-blue-500 rounded-lg p-4 text-center cursor-pointer"
-				@click="openOpenHouses()"
+				class="max-w-sm h-64 flex flex-col items-left justify-between p-6 bg-white border border-gray-200 rounded-lg shadow dark:bg-gray-800 dark:border-gray-700"
 			>
-				<div class="text-white text-4xl">
-					<svg class="w-12 h-12 mx-auto" viewBox="0 0 24 24">
-						<path
-							fill="currentColor"
-							d="M12 6a1 1 0 0 1 .707.293l4 4A1 1 0 0 1 17 12v6a1 1 0 0 1-1 1h-4a1 1 0 0 1-1-1v-4a1 1 0 0 0-2 0v4a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1v-6a1 1 0 0 1 .293-.707l4-4A1 1 0 0 1 12 6z"
-						/>
+				<a href="#">
+					<h5 class="mb-2 text-3xl font-bold tracking-tight text-gray-900 dark:text-white">
+						Journée Porte Ouverte
+					</h5>
+				</a>
+				<p class="mb-3 font-normal text-gray-700 dark:text-gray-400">
+					Retrouvez les differentes dates de Journée Porte Ouverte de l'ESIEE-IT avec les documents
+					associés à ces dernières.
+				</p>
+				<button
+					@click="openOpenHouses()"
+					class="inline-flex w-fit items-center px-3 py-2 text-sm font-medium text-center text-white bg-blue-700 rounded-lg hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+				>
+					JPO
+					<svg
+						aria-hidden="true"
+						class="w-4 h-4 ml-2 -mr-1"
+						fill="currentColor"
+						viewBox="0 0 20 20"
+						xmlns="http://www.w3.org/2000/svg"
+					>
 						<path
-							fill="currentColor"
-							d="M9 16a1 1 0 0 0 2 0v-4a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v4a1 1 0 0 0 2 0v-6a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v6z"
+							fill-rule="evenodd"
+							d="M10.293 3.293a1 1 0 011.414 0l6 6a1 1 0 010 1.414l-6 6a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-4.293-4.293a1 1 0 010-1.414z"
+							clip-rule="evenodd"
 						/>
 					</svg>
-				</div>
-				<div class="text-white text-lg mt-2">Open House</div>
+				</button>
 			</div>
 
 			<div
-				class="w-40 h-40 bg-green-500 rounded-lg p-4 text-center cursor-pointer"
-				@click="openCours()"
+				class="max-w-sm flex flex-col items-left justify-between h-64 p-6 bg-white border border-gray-200 rounded-lg shadow dark:bg-gray-800 dark:border-gray-700"
 			>
-				<div class="text-white text-4xl">
-					<svg class="w-12 h-12 mx-auto" viewBox="0 0 24 24">
+				<a href="#">
+					<h5 class="mb-2 text-3xl font-bold tracking-tight text-gray-900 dark:text-white">
+						Cours
+					</h5>
+				</a>
+				<p class="mb-3 font-normal text-gray-700 dark:text-gray-400">
+					Retrouvez les différents cours de la coding factory, trier par année et par matière. Vous
+					y trouverez également les groupes de chaque sprint, avec des documents associés.
+				</p>
+				<button
+					@click="openCours()"
+					class="inline-flex w-fit items-center px-3 py-2 text-sm font-medium text-center text-white bg-blue-700 rounded-lg hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+				>
+					Cours
+					<svg
+						aria-hidden="true"
+						class="w-4 h-4 ml-2 -mr-1"
+						fill="currentColor"
+						viewBox="0 0 20 20"
+						xmlns="http://www.w3.org/2000/svg"
+					>
 						<path
-							fill="currentColor"
-							d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm1-13H7v2h6V7zm0 4H7v2h6v-2zm0 4H7v2h6v-2z"
+							fill-rule="evenodd"
+							d="M10.293 3.293a1 1 0 011.414 0l6 6a1 1 0 010 1.414l-6 6a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-4.293-4.293a1 1 0 010-1.414z"
+							clip-rule="evenodd"
 						/>
 					</svg>
-				</div>
-				<div class="text-white text-lg mt-2">Cours</div>
+				</button>
 			</div>
 		</div>
 	</div>
diff --git a/front-end/src/components/blog/AddArticles.vue b/front-end/src/components/blog/AddArticles.vue
index 71249179f..f929342ab 100644
--- a/front-end/src/components/blog/AddArticles.vue
+++ b/front-end/src/components/blog/AddArticles.vue
@@ -282,6 +282,26 @@ const addArticle = async () => {
 			dislikes: [],
 		};
 
+		// post the data
+		await articleStore.addArticle(data);
+	} else if (tags.value.toUpperCase() == 'JPO') {
+		let data = {
+			owner: authStore.user._id,
+			title: title.value,
+			descriptions: description.value,
+			content: content.value,
+			picture: picture.value,
+			tags: tags.value,
+			type: type.value,
+			status: status.value,
+			date: date.value,
+			likes: [],
+			dislikes: [],
+			participants: [],
+			comments: [],
+			documents: [],
+		};
+
 		// post the data
 		await articleStore.addArticle(data);
 	} else {
diff --git a/front-end/src/store/interfaces/article.interface.ts b/front-end/src/store/interfaces/article.interface.ts
index e0d9b0121..a9618bdc5 100644
--- a/front-end/src/store/interfaces/article.interface.ts
+++ b/front-end/src/store/interfaces/article.interface.ts
@@ -15,10 +15,11 @@ export interface Article {
 	type: string;
 	status?: string;
 	content?: string;
-	participants?: Participants[];
 	likes?: Likes[];
 	dislikes?: Dislikes[];
+	participants?: Participants[];
 	comments?: Comments[];
+	documents?: Documents[];
 }
 
 export interface Likes {
@@ -46,3 +47,9 @@ export interface Comments {
 	date: Date;
 	picture?: string;
 }
+
+export interface Documents {
+	_id: string;
+	name: string;
+	link: string;
+}
diff --git a/front-end/src/store/modules/article.store.ts b/front-end/src/store/modules/article.store.ts
index b44d1716c..ee9fe815a 100644
--- a/front-end/src/store/modules/article.store.ts
+++ b/front-end/src/store/modules/article.store.ts
@@ -3,6 +3,7 @@ import {
 	ArticleStore,
 	Comments,
 	Dislikes,
+	Documents,
 	Likes,
 	Participants,
 } from '../interfaces/article.interface';
@@ -60,6 +61,13 @@ export const useArticleStore = defineStore('article', {
 						date: new Date(),
 					},
 				],
+				documents: [
+					{
+						_id: '',
+						name: '',
+						link: '',
+					},
+				],
 			},
 			idArticle: '',
 		};
@@ -176,6 +184,25 @@ export const useArticleStore = defineStore('article', {
 			return true;
 		}),
 
+		// add document to the array of documents in article in the database
+		addDocument: withErrorHandler(async function (id: string, document) {
+			await http.put(`/articles/document/${id}`, document);
+
+			this.oneItems.documents.push(document);
+
+			return true;
+		}),
+
+		// remove document from the array of documents in article in the database
+		removeDocument: withErrorHandler(async function (id: string, document: Documents) {
+			await http.put(`/articles/removeDocument/${id}`, document);
+
+			const index = this.oneItems.documents.findIndex((el) => el._id === document._id);
+			this.oneItems.documents.splice(index, 1);
+
+			return true;
+		}),
+
 		// delete article from the database
 		deleteArticle: withErrorHandler(async function (id: string) {
 			await http.delete(`/articles/delete/${id}`);
diff --git a/front-end/src/views/OpenHousesDetails.vue b/front-end/src/views/OpenHousesDetails.vue
index 765fe34dd..49b0b81a4 100644
--- a/front-end/src/views/OpenHousesDetails.vue
+++ b/front-end/src/views/OpenHousesDetails.vue
@@ -1,5 +1,5 @@
 <template>
-	<OpenHousesDetails></OpenHousesDetails>
+	<OpenHousesDetails />
 </template>
 
 <script lang="ts" setup>

From d617e0893164c679d507e304d6e979eb847de153 Mon Sep 17 00:00:00 2001
From: ThomasCast3 <91255859+ThomasCast3@users.noreply.github.com>
Date: Fri, 16 Jun 2023 03:11:59 +0200
Subject: [PATCH 10/24] form cours saved in db + save pdf files

---
 .../src/base/courses/courses.controller.ts    |  4 +-
 back-end/src/base/courses/dto/coures.dto.ts   |  3 +
 .../courses/interfaces/courses.interface.ts   |  1 +
 .../interfaces/openHouses.interface.ts        |  1 +
 back-end/src/main.ts                          |  3 +-
 .../RessourcesComponents/AddCourse.vue        | 65 +++++++++++++++----
 .../RessourcesComponents/CoursDetails.vue     |  1 +
 .../RessourcesComponents/FormOpenHouses.vue   | 36 +++++++++-
 .../RessourcesComponents/OpenHouses.vue       |  8 ++-
 front-end/src/components/common/Modal.vue     | 60 ++++++++++++-----
 .../components/materials/FormMaterials.vue    |  2 +-
 .../src/store/interfaces/cours.interface.ts   |  1 +
 .../src/store/interfaces/openhouse.store.ts   |  1 +
 front-end/src/store/modules/course.store.ts   |  5 +-
 .../src/store/modules/openHouse.store.ts      |  2 +
 15 files changed, 154 insertions(+), 39 deletions(-)

diff --git a/back-end/src/base/courses/courses.controller.ts b/back-end/src/base/courses/courses.controller.ts
index 1a35d622f..30824a305 100644
--- a/back-end/src/base/courses/courses.controller.ts
+++ b/back-end/src/base/courses/courses.controller.ts
@@ -26,12 +26,14 @@ export class CoursesController {
 	@Get('/:id')
 	async getCoursesById(@Req() req: Request, @Res() res: Response, @Param('id') courseId: string) {
 		const courseById = await this.coursesService.getCoursesById(courseId);
-		return res.status(200).json({ status: 'ok', courseById });
+		console.log(courseById);
+		return res.status(200).json(courseById);
 	}
 
 	@Post('/create')
 	async createCourse(@Req() req: Request, @Res() res: Response) {
 		await this.coursesService.createCourse(req.body).then((course) => {
+			console.log(course);
 			res.status(200).json(course);
 		});
 	}
diff --git a/back-end/src/base/courses/dto/coures.dto.ts b/back-end/src/base/courses/dto/coures.dto.ts
index 1db119a07..4d94e8181 100644
--- a/back-end/src/base/courses/dto/coures.dto.ts
+++ b/back-end/src/base/courses/dto/coures.dto.ts
@@ -22,6 +22,9 @@ export class CourseDTO {
 	@IsOptional()
 	createdAt?: Date;
 
+	@IsOptional()
+	files?: string;
+
 	@IsOptional()
 	periodStart?: Date;
 
diff --git a/back-end/src/base/courses/interfaces/courses.interface.ts b/back-end/src/base/courses/interfaces/courses.interface.ts
index bb0e0da7b..6d458df77 100644
--- a/back-end/src/base/courses/interfaces/courses.interface.ts
+++ b/back-end/src/base/courses/interfaces/courses.interface.ts
@@ -12,6 +12,7 @@ export interface Course {
 	periodStart: Date;
 	periodEnd: Date;
 	presence: [];
+	files: string;
 	projects: Array<ObjectId>;
 	site: string;
 	teacherId?: ObjectId;
diff --git a/back-end/src/base/openHouses/interfaces/openHouses.interface.ts b/back-end/src/base/openHouses/interfaces/openHouses.interface.ts
index fa31f406f..38e4892e4 100644
--- a/back-end/src/base/openHouses/interfaces/openHouses.interface.ts
+++ b/back-end/src/base/openHouses/interfaces/openHouses.interface.ts
@@ -10,6 +10,7 @@ export interface OpenHouse {
 	address: string;
 	group: Group;
 	participants: Array<User>;
+	files: string;
 	description: string;
 	project: Project;
 }
diff --git a/back-end/src/main.ts b/back-end/src/main.ts
index 7baa15f65..11c262c36 100644
--- a/back-end/src/main.ts
+++ b/back-end/src/main.ts
@@ -7,6 +7,7 @@ import { config } from 'src/config/config';
 
 import { AppModule } from 'src/app.module';
 import { corsOptionsDelegate } from 'src/config/cors';
+import * as bodyParser from 'body-parser';
 
 //! Proxy settings, production only
 // <NestExpressApplication>
@@ -27,7 +28,7 @@ async function bootstrap() {
 	);
 
 	app.use(cookieParser());
-
+	app.use(bodyParser.json({ limit: '50mb' }));
 	app.enableCors(corsOptionsDelegate);
 	//! versioning, production only
 	// app.enableVersioning({
diff --git a/front-end/src/components/RessourcesComponents/AddCourse.vue b/front-end/src/components/RessourcesComponents/AddCourse.vue
index 32e7b4f87..0bdff3a23 100644
--- a/front-end/src/components/RessourcesComponents/AddCourse.vue
+++ b/front-end/src/components/RessourcesComponents/AddCourse.vue
@@ -8,8 +8,20 @@
 			<div class="modal-body">
 				<form class="w-full max-w-sm">
 					<input type="text" name="title" v-model="tag" placeholder="Title :" /><br />
-					<input type="datetime-local" v-model="periodStart" /><br />
-					<input type="datetime-local" v-model="periodEnd" /><br />
+					<div>
+						<VueDatePicker
+							placeholder="debut"
+							v-model="periodStart"
+							:format="dateFormat"
+							:language="datePickerLanguage"
+						/>
+						<VueDatePicker
+							placeholder="fin"
+							v-model="periodEnd"
+							:format="dateFormat"
+							:language="datePickerLanguage"
+						/>
+					</div>
 					<input type="url" placeholder="picture link" v-model="picture" /><br />
 					<input
 						type="text"
@@ -26,8 +38,8 @@
 					</ul>
 					<div class="mb-4">
 						<label for="file" class="block text-sm font-medium text-gray-700">Fichier :</label>
-						<input type="file" id="file" ref="fileInput" @change="handleFileChange" multiple />
-						<ul class="mt-4 space-y-2">
+						<input type="file" id="file" ref="fileInput" @change="onFileSelected" />
+						<!--ul class="mt-4 space-y-2">
 							<li v-for="file in uploadedFiles" :key="file.name" class="flex items-center">
 								<button
 									type="button"
@@ -38,7 +50,7 @@
 								</button>
 								<span class="text-gray-700">{{ file.name }}</span>
 							</li>
-						</ul>
+						</ul-->
 					</div>
 					<div class="flex justify-center mt-6">
 						<button
@@ -63,12 +75,16 @@
 </template>
 
 <script lang="ts">
-import { ref } from 'vue';
+import VueDatePicker from '@vuepic/vue-datepicker';
 import { useCoursStore } from '@/store/modules/course.store';
 import Swal from 'sweetalert2';
+import { http } from '@/api/network/axios';
 
 export default {
 	name: 'AddCourses',
+	components: {
+		VueDatePicker,
+	},
 	emits: ['close'],
 	data() {
 		return {
@@ -86,11 +102,16 @@ export default {
 			languages: [],
 			languageSuggest: [],
 			showSuggest: false,
-			uploadedFiles: [],
+			//uploadedFiles: [],
+			dateFormat: 'yyyy-MM-dd HH:mm',
+			datePickerLanguage: 'fr', // Langue du date picker
+			selectedFile: null,
+			base64String: '',
 		};
 	},
 	methods: {
-		async AddCourses() {
+		async AddCourses(event) {
+			event.preventDefault();
 			// Vérifier si tous les champs sont remplis
 			if (!this.tag || !this.periodStart || !this.periodEnd || !this.picture || !this.language) {
 				Swal.fire({
@@ -110,9 +131,9 @@ export default {
 			formData.append('periodEnd', this.periodEnd);
 			formData.append('picture', this.picture);
 			formData.append('language', this.language);
-			this.uploadedFiles.forEach((file) => {
-				formData.append('uploadedFiles', file);
-			});
+			//this.uploadedFiles.forEach((file) => {
+			formData.append('files', this.selectedFile);
+			//	});
 
 			Swal.fire({
 				title: 'Votre cours a été ajouté',
@@ -123,7 +144,11 @@ export default {
 			}).then(async (result) => {
 				if (result.isConfirmed) {
 					// Ajouter le cours
-					await useCoursStore.addCourse(formData);
+					//	await useCoursStore.addCourse(formData);
+					http.post('/courses/create', formData).catch((error) => {
+						console.log(error);
+						this.$emit('addnew');
+					});
 					// Rediriger vers la page des cours
 					this.$emit('close');
 				}
@@ -185,6 +210,22 @@ export default {
 		close() {
 			this.$emit('close');
 		},
+
+		onFileSelected(event) {
+			this.selectedFile = event.target.files[0];
+			this.convertToBase64();
+		},
+
+		convertToBase64() {
+			if (this.selectedFile) {
+				const reader = new FileReader();
+				reader.onload = (event) => {
+					let result = event.target.result;
+					this.base64String = result.toString();
+				};
+				reader.readAsDataURL(this.selectedFile);
+			}
+		},
 	},
 };
 </script>
diff --git a/front-end/src/components/RessourcesComponents/CoursDetails.vue b/front-end/src/components/RessourcesComponents/CoursDetails.vue
index 1a04ef0c0..bbfb3baf2 100644
--- a/front-end/src/components/RessourcesComponents/CoursDetails.vue
+++ b/front-end/src/components/RessourcesComponents/CoursDetails.vue
@@ -57,6 +57,7 @@ const _id = computed(() => {
 // get openHouse by id
 const getCourseById = async (_id: string) => {
 	await course.getCourseById(_id);
+	console.log(oneItems.value);
 };
 
 // fetch openHouse data on mounted
diff --git a/front-end/src/components/RessourcesComponents/FormOpenHouses.vue b/front-end/src/components/RessourcesComponents/FormOpenHouses.vue
index fc523240e..20a768c97 100644
--- a/front-end/src/components/RessourcesComponents/FormOpenHouses.vue
+++ b/front-end/src/components/RessourcesComponents/FormOpenHouses.vue
@@ -15,7 +15,7 @@
 					</div>
 					<textarea placeholder="Description :" v-model="description"></textarea><br />
 					<addParticipant :participants="participants" @clear="clearParticipants" />
-					<input type="file" @change="onFileSelected" /><br />
+					<input type="file" accept="application/pdf" @change="onFileSelected" /><br />
 					<button type="submit">Submit</button>
 				</form>
 			</template>
@@ -29,6 +29,7 @@ import activity from '@/components/RessourcesComponents/NewActivity.vue';
 import ModalOverlay from '@/components/common/Modal.vue';
 import { ref } from 'vue';
 import { http } from '@/api/network/axios';
+import Swal from 'sweetalert2';
 
 const showMetaModal = ref(false);
 
@@ -44,13 +45,29 @@ let description = '';
 let picture = '';
 let participants = [];
 let Activities = [];
+let selectedFile = null;
+let base64String = '';
+
+const addOpenHouses = async function () {
+	// Vérifier si tous les champs sont remplis
+	if (!title || !date || !street || !zipCode || !town) {
+		Swal.fire({
+			title: 'Vous devez remplir tous les champs',
+			text: 'Veuillez remplir tous les champs pour ajouter une nouvelle JPO',
+			icon: 'error',
+			confirmButtonColor: '#3085d6',
+			cancelButtonColor: '#d33',
+			confirmButtonText: 'OK',
+		});
+		return;
+	}
 
-const addOpenHouses = function () {
 	let adress = {
 		street: street,
 		zipCode: zipCode,
 		city: town,
 	};
+
 	http
 		.post('/openhouses/create', {
 			title: title,
@@ -60,6 +77,7 @@ const addOpenHouses = function () {
 			adress: adress,
 			description: description,
 			participants: participants,
+			files: base64String,
 		})
 		.catch((error) => {
 			console.log(error);
@@ -83,7 +101,19 @@ const closeForm = function () {
 };
 
 const onFileSelected = function (event) {
-	console.log(event);
+	selectedFile = event.target.files[0];
+	convertToBase64();
+};
+
+const convertToBase64 = function () {
+	if (selectedFile) {
+		const reader = new FileReader();
+		reader.onload = (event) => {
+			let result = event.target.result;
+			base64String = result.toString();
+		};
+		reader.readAsDataURL(selectedFile);
+	}
 };
 
 const clearParticipants = function () {
diff --git a/front-end/src/components/RessourcesComponents/OpenHouses.vue b/front-end/src/components/RessourcesComponents/OpenHouses.vue
index 687762925..c4e29f458 100644
--- a/front-end/src/components/RessourcesComponents/OpenHouses.vue
+++ b/front-end/src/components/RessourcesComponents/OpenHouses.vue
@@ -1,8 +1,11 @@
 <!-- eslint-disable vue/require-v-for-key -->
 <template>
 	<div>
-		<div class="text-center pt-4">
-			<h1 class="text-4xl font-bold">Journée Porte Ouverte</h1>
+		<div>
+			<div class="text-center pt-4">
+				<h1 class="text-4xl font-bold">Journée Porte Ouverte</h1>
+			</div>
+			<FormOpenHouse />
 		</div>
 		<div class="text-center flex items-center justify-center max-w-full h-full">
 			<div class="grid grid-cols-2 md:grid-cols-3 gap-4">
@@ -58,7 +61,6 @@
 				</div>
 			</div>
 		</div>
-		<FormOpenHouse />
 	</div>
 </template>
 
diff --git a/front-end/src/components/common/Modal.vue b/front-end/src/components/common/Modal.vue
index 33f7beec2..4b07994a7 100644
--- a/front-end/src/components/common/Modal.vue
+++ b/front-end/src/components/common/Modal.vue
@@ -1,30 +1,46 @@
 <template>
 	<div>
-		<div class="bg-dark-primary bg-opacity-50 dark:bg-opacity-60 fixed inset-0 z-[60]" @click="closeModal"/>
+		<div
+			class="bg-dark-primary bg-opacity-50 dark:bg-opacity-60 fixed inset-0 z-[60]"
+			@click="closeModal"
+		></div>
 		<div
 			tabindex="-1"
 			class="overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-[70] w-full inset-0 h-full justify-center items-center flex"
 		>
-			<div class="flex flex-col relative p-4 m-4 w-full h-auto rounded-lg shadow bg-light-primary dark:bg-dark-tertiary" :class="`${modalSizeClasses[size]}`">
+			<div
+				class="flex flex-col relative p-4 m-4 w-full h-auto rounded-lg shadow bg-light-primary dark:bg-dark-tertiary"
+				:class="`${modalSizeClasses[size]}`"
+			>
 				<!-- Modal content -->
 
-				<button @click="closeModal" type="button" class="absolute right-2 top-2 bg-transparent hover:bg-light-secondary dark:hover:bg-dark-secondary rounded-lg text-sm p-1.5 ml-auto inline-flex items-center">
-					<SvgCross class="!fill-red-500"/>
+				<button
+					@click="closeModal"
+					type="button"
+					class="absolute right-2 top-2 bg-transparent hover:bg-light-secondary dark:hover:bg-dark-secondary rounded-lg text-sm p-1.5 ml-auto inline-flex items-center"
+				>
+					<SvgCross class="!fill-red-500" />
 				</button>
 
 				<!-- Modal header -->
-				<div class="rounded-t flex justify-between items-center" :class="$slots.header ? 'border-b border-light-secondary dark:border-dark-highlight' : ''">
-					<slot name="header" />
+				<div
+					class="rounded-t flex justify-between items-center"
+					:class="$slots.header ? 'border-b border-light-secondary dark:border-dark-highlight' : ''"
+				>
+					<slot name="header"></slot>
 				</div>
 
 				<!-- Modal body -->
 				<div :class="$slots.footer ? '!py-6 grow' : ''">
-					<slot name="body" id="body" />
+					<slot name="body" id="body"></slot>
 				</div>
 
 				<!-- Modal footer -->
-				<div v-if="$slots.footer" class="pt-6 rounded-b border-t border-light-secondary dark:border-dark-highlight">
-					<slot name="footer" />
+				<div
+					v-if="$slots.footer"
+					class="pt-6 rounded-b border-t border-light-secondary dark:border-dark-highlight"
+				>
+					<slot name="footer"></slot>
 				</div>
 			</div>
 		</div>
@@ -37,14 +53,26 @@ import SvgCross from '@/components/common/svg/Cross.vue';
 
 defineProps({
 	position: {
-		type: String as PropType<'bottom-left' | 'bottom-right' | 'bottom-center' | 'top-left' | 'top-center' | 'top-right' | 'center-left' | 'center' | 'center-right'>,
+		type: String as PropType<
+			| 'bottom-left'
+			| 'bottom-right'
+			| 'bottom-center'
+			| 'top-left'
+			| 'top-center'
+			| 'top-right'
+			| 'center-left'
+			| 'center'
+			| 'center-right'
+		>,
 		default: 'center',
 	},
 	size: {
-		type: String as PropType<'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | 'full'>,
+		type: String as PropType<
+			'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | 'full'
+		>,
 		default: '2xl',
 	},
-})
+});
 
 const emit = defineEmits(['close']);
 const modalSizeClasses = {
@@ -59,10 +87,10 @@ const modalSizeClasses = {
 	'5xl': 'max-w-5xl',
 	'6xl': 'max-w-6xl',
 	'7xl': 'max-w-7xl',
-	'full': 'w-screens p-4 !m-0 min-h-screen justify-between'
-}
+	full: 'w-screens p-4 !m-0 min-h-screen justify-between',
+};
 
 function closeModal() {
-	emit('close')
+	emit('close');
 }
-</script>
\ No newline at end of file
+</script>
diff --git a/front-end/src/components/materials/FormMaterials.vue b/front-end/src/components/materials/FormMaterials.vue
index 472c207f8..5faad1b12 100644
--- a/front-end/src/components/materials/FormMaterials.vue
+++ b/front-end/src/components/materials/FormMaterials.vue
@@ -64,7 +64,7 @@ const description = ref('');
 const returnDate = ref('');
 const emit = defineEmits(['close']);
 
-const borrorwingMaterial = async (identifiant: string) =>{
+const borrorwingMaterial = async (identifiant: string) => {
 	const response = await materialStore.borrowMaterial(identifiant, {
 		borrowingDate: new Date(borrowingDate.value),
 		borrowingUser: props.userId,
diff --git a/front-end/src/store/interfaces/cours.interface.ts b/front-end/src/store/interfaces/cours.interface.ts
index 60c68cf3d..878fc6cf2 100644
--- a/front-end/src/store/interfaces/cours.interface.ts
+++ b/front-end/src/store/interfaces/cours.interface.ts
@@ -22,6 +22,7 @@ export interface Course {
 	project: [];
 	site: string;
 	teacherId?: string;
+	files: string;
 }
 
 export interface CourseById {
diff --git a/front-end/src/store/interfaces/openhouse.store.ts b/front-end/src/store/interfaces/openhouse.store.ts
index b598418a7..92033621f 100644
--- a/front-end/src/store/interfaces/openhouse.store.ts
+++ b/front-end/src/store/interfaces/openhouse.store.ts
@@ -24,4 +24,5 @@ export interface OpenHouse {
 	}[];
 	description: string;
 	project: string;
+	files: string;
 }
diff --git a/front-end/src/store/modules/course.store.ts b/front-end/src/store/modules/course.store.ts
index 7c57d804b..03ab5a588 100644
--- a/front-end/src/store/modules/course.store.ts
+++ b/front-end/src/store/modules/course.store.ts
@@ -52,12 +52,13 @@ export const useCoursStore = defineStore('course', {
 		}),
 		getCourseById: withErrorHandler(async function (id: string) {
 			const response = await getCoursesById(id);
-			this.oneItems = response.data; //.courseById;
-
+			this.oneItems = response.data;
+			console.log(this.oneItems);
 			return true;
 		}),
 		addCourse: withErrorHandler(async function (this: CoursesStore, course: Course) {
 			const res = await createCourse(course);
+			console.log(res.data);
 			if (res.status !== 200) return false;
 			this.items.push(res.data);
 			return true;
diff --git a/front-end/src/store/modules/openHouse.store.ts b/front-end/src/store/modules/openHouse.store.ts
index 21616c3b9..21db7a245 100644
--- a/front-end/src/store/modules/openHouse.store.ts
+++ b/front-end/src/store/modules/openHouse.store.ts
@@ -33,6 +33,7 @@ export const useOpenHouseStore = defineStore('openhouse', {
 					],
 					description: '',
 					project: '',
+					files: '',
 				},
 			],
 			oneItems: {
@@ -61,6 +62,7 @@ export const useOpenHouseStore = defineStore('openhouse', {
 				],
 				description: '',
 				project: '',
+				files: '',
 			},
 			idOpenHouse: '',
 		};

From bab52ecfc092913ea52f27354fb5853a2d4ecc50 Mon Sep 17 00:00:00 2001
From: Baptiste Dumoulin <91154604+Ptitbapt@users.noreply.github.com>
Date: Fri, 16 Jun 2023 09:32:14 +0200
Subject: [PATCH 11/24] CoursDetails

---
 .../RessourcesComponents/CoursDetails.vue     | 169 +++++++++---------
 front-end/src/components/common/svg/Board.vue |  16 ++
 2 files changed, 104 insertions(+), 81 deletions(-)
 create mode 100644 front-end/src/components/common/svg/Board.vue

diff --git a/front-end/src/components/RessourcesComponents/CoursDetails.vue b/front-end/src/components/RessourcesComponents/CoursDetails.vue
index 40d5c92c0..5d466b124 100644
--- a/front-end/src/components/RessourcesComponents/CoursDetails.vue
+++ b/front-end/src/components/RessourcesComponents/CoursDetails.vue
@@ -1,5 +1,8 @@
 <template>
-	<div v-if="Object.keys(course.oneItems).length > 0">
+	<div
+		class="font-semibold text-gray-900 dark:text-white"
+		v-if="Object.keys(course.oneItems).length > 0"
+	>
 		<img
 			class="cover h-72 w-screen object-cover object-center"
 			:src="
@@ -12,81 +15,49 @@
 		<div class="text-center pt-4">
 			<h1 class="text-4xl font-bold">{{ courseById.tag }}</h1>
 		</div>
-		<div class="cours-detail bg-grey-800 mb-5">
-			<div class="corps-enseignant">
-				<h4 class="text-2xl font-bold mb-2 border-b border-gray-300">Corps enseignant du cours</h4>
-
-				<ul class="space-y-2">
-					<li v-for="teacher in courseById.teachers" :key="teacher.id">
-						<img
-							:src="teacher.profilePicture"
-							alt="Profile Picture"
-							class="w-8 h-8 rounded-full mr-2"
-						/>
-						<span class="text-white-800 text-lg mb-5">{{ teacher.name }}</span>
-					</li>
-				</ul>
-
-				<div class="detail-actions">
-					<div class="corps-ensaignant">
-						<h4 class="text-2xl font-bold mb-2 border-b border-gray-300">Détails et actions</h4>
+		<div class="text-center pt-4">
+			<h2 class="text-xl font-bold">
+				Disponible du
+				<span class="underline">{{ formatDate(courseById.periodStart) }}</span>
+				jusqu'au
+				<span class="underline">{{ formatDate(courseById.periodEnd) }}</span>
+			</h2>
+		</div>
+		<div class="contenu-cours">
+			<h4 class="text-2xl font-bold mb-2 border-b border-gray-300">Contenu du cours</h4>
+			<ul class="space-y-4">
+				<li v-for="course in courses" :key="course.id">
+					<div class="course-item" :class="{ open: course.open }" @click="toggleCourse(course)">
+						<h5 class="text-xl font-semibold">{{ course.title }}</h5>
+						<p class="text-gray-600">{{ course.description }}</p>
+					</div>
+					<div v-if="course.open" class="course-files bg-gray-100 p-4">
 						<ul class="space-y-2">
-							<li>
-								<h4 class="text-2xl font-bold mb-2">Annuaire</h4>
-								<p class="text-blue-500 underline cursor-pointer">
-									Afficher tout les membres de votre cours
-								</p>
+							<li v-for="file in course.files" :key="file.id">
+								<a :href="file.url" target="_blank" class="text-blue-500">{{ file.name }}</a>
 							</li>
 						</ul>
 					</div>
-				</div>
-			</div>
-			<div class="contenu-cours">
-				<h4 class="text-2xl font-bold mb-2 border-b border-gray-300">Contenu du cours</h4>
-				<ul class="space-y-4">
-					<li v-for="course in courses" :key="course.id">
-						<div class="course-item" :class="{ open: course.open }" @click="toggleCourse(course)">
-							<h5 class="text-xl font-semibold">{{ course.title }}</h5>
-							<p class="text-gray-600">{{ course.description }}</p>
-						</div>
-						<div v-if="course.open" class="course-files">
-							<ul class="space-y-2">
-								<li v-for="file in course.files" :key="file.id">
-									<a :href="file.url" target="_blank" class="text-blue-500">{{ file.name }}</a>
-								</li>
-							</ul>
-						</div>
-					</li>
-				</ul>
-				<h4 class="text-2xl font-bold mb-2 mt-3 border-b border-gray-300">Groupes</h4>
-				<ul class="space-y-4">
-					<li v-for="groupe in groupes" :key="groupe.id">
-						<div class="course-item" :class="{ open: groupe.open }" @click="toggleGroupe(groupe)">
-							<h5 class="text-xl font-semibold">{{ groupe.title }}</h5>
-							<p class="text-gray-600">{{ groupe.description }}</p>
-						</div>
-						<div v-if="groupe.open" class="course-files">
-							<ul class="space-y-2">
-								<li v-for="file in groupe.files" :key="file.id">
-									<a :href="file.url" target="_blank" class="text-blue-500">{{ file.name }}</a>
-								</li>
-							</ul>
-						</div>
-					</li>
-				</ul>
-			</div>
-		</div>
-		<div class="flex bg-slate-300 w-full gap-4 justify-center" v-if="canvas.length > 0">
-			<div v-for="canva in canvas">
-				<button
-					@click="goToProject(canva)"
-					class="gradiant left-4 bottom-0 md:bottom-[unset] bg-[#24292E] hover:bg-[#24292E99] shadow rounded-lg p-4"
-				>
-					{{ canva.meta.title }}
-				</button>
-			</div>
+				</li>
+			</ul>
+			<h4 class="text-2xl font-bold mb-2 mt-3 border-b border-gray-300">Groupes</h4>
+			<ul class="space-y-4">
+				<li v-if="canvas.length > 0">
+					<div v-for="canva in canvas" :key="canva.id">
+						<button
+							class="flex items-center bg-gray-200 hover:bg-gray-300 text-gray-800 font-semibold py-2 px-4 rounded"
+						>
+							<Board class="mr-2" />
+							<span>{{ canva.meta.title }}</span>
+						</button>
+					</div>
+				</li>
+			</ul>
 		</div>
-		<div class="flex bg-slate-400 w-full gap-4 justify-center mt-4" v-if="retro">
+	</div>
+	<div class="flex w-full gap-4 justify-center mt-4">
+		<div class="contenu-cours" v-if="retro">
+			<h4 class="text-2xl font-bold mb-2 border-b border-gray-300">Contenu du cours</h4>
 			<button
 				@click="goToRetro(retro)"
 				class="gradiant left-4 bottom-0 md:bottom-[unset] bg-[#24292E] hover:bg-[#24292E99] shadow rounded-lg p-4"
@@ -95,21 +66,12 @@
 			</button>
 		</div>
 	</div>
-	<button
-		type="button"
-		@click="
-			() => {
-				router.push('/app/ressource/cours');
-			}
-		"
-	>
-		Retour
-	</button>
 </template>
 <script lang="ts" setup>
 import { computed, onMounted } from 'vue';
 import { useCoursStore } from '@/store/modules/course.store';
 import { useRouter } from 'vue-router';
+import Board from '@/components/common/svg/Board.vue';
 
 // get store
 const course = useCoursStore();
@@ -119,6 +81,42 @@ const canvas = computed(() => course.oneItems.projects);
 
 const router = useRouter();
 
+const courses = [
+	{
+		id: 1,
+		title: 'Cours 1',
+		description: 'Description du cours 1',
+		open: false,
+		files: [
+			{ id: 1, name: 'Fichier 1', url: '#' },
+			{ id: 2, name: 'Fichier 2', url: '#' },
+			{ id: 3, name: 'Fichier 3', url: '#' },
+		],
+	},
+	{
+		id: 2,
+		title: 'Cours 2',
+		description: 'Description du cours 2',
+		open: false,
+		files: [
+			{ id: 4, name: 'Fichier 4', url: '#' },
+			{ id: 5, name: 'Fichier 5', url: '#' },
+			{ id: 6, name: 'Fichier 6', url: '#' },
+		],
+	},
+	{
+		id: 3,
+		title: 'Cours 3',
+		description: 'Description du cours 3',
+		open: false,
+		files: [
+			{ id: 7, name: 'Fichier 7', url: '#' },
+			{ id: 8, name: 'Fichier 8', url: '#' },
+			{ id: 9, name: 'Fichier 9', url: '#' },
+		],
+	},
+];
+
 // get id from url
 const _id = computed(() => {
 	const url = window.location.href;
@@ -131,6 +129,15 @@ const getCourseById = async (_id: string) => {
 	await course.getCourseById(_id);
 };
 
+const formatDate = (date) => {
+	const options = {
+		month: 'long',
+		day: 'numeric',
+		year: 'numeric',
+	} as Intl.DateTimeFormatOptions;
+	return new Date(date).toLocaleDateString('fr-FR', options);
+};
+
 // fetch openHouse data on mounted
 onMounted(async () => {
 	await getCourseById(_id.value);
diff --git a/front-end/src/components/common/svg/Board.vue b/front-end/src/components/common/svg/Board.vue
new file mode 100644
index 000000000..2f42c61fe
--- /dev/null
+++ b/front-end/src/components/common/svg/Board.vue
@@ -0,0 +1,16 @@
+<template>
+	<svg
+		xmlns="http://www.w3.org/2000/svg"
+		fill="none"
+		viewBox="0 0 24 24"
+		stroke-width="1.5"
+		stroke="currentColor"
+		class="w-6 h-6"
+	>
+		<path
+			stroke-linecap="round"
+			stroke-linejoin="round"
+			d="M15.666 3.888A2.25 2.25 0 0013.5 2.25h-3c-1.03 0-1.9.693-2.166 1.638m7.332 0c.055.194.084.4.084.612v0a.75.75 0 01-.75.75H9a.75.75 0 01-.75-.75v0c0-.212.03-.418.084-.612m7.332 0c.646.049 1.288.11 1.927.184 1.1.128 1.907 1.077 1.907 2.185V19.5a2.25 2.25 0 01-2.25 2.25H6.75A2.25 2.25 0 014.5 19.5V6.257c0-1.108.806-2.057 1.907-2.185a48.208 48.208 0 011.927-.184"
+		/>
+	</svg>
+</template>

From e021da0b212365b8925be4167a1db853750b0c95 Mon Sep 17 00:00:00 2001
From: Baptiste Dumoulin <91154604+Ptitbapt@users.noreply.github.com>
Date: Fri, 16 Jun 2023 09:55:39 +0200
Subject: [PATCH 12/24] Update Cours.vue

---
 .../src/components/RessourcesComponents/Cours.vue    | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/front-end/src/components/RessourcesComponents/Cours.vue b/front-end/src/components/RessourcesComponents/Cours.vue
index 965f8bbfc..9ee87870e 100644
--- a/front-end/src/components/RessourcesComponents/Cours.vue
+++ b/front-end/src/components/RessourcesComponents/Cours.vue
@@ -5,7 +5,7 @@
 		</div>
 		<div class="flex items-center justify-center">
 			<button
-				class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full mr-4"
+				class="bg-blue-500 hover:bg-blue-700 font-bold py-2 px-4 rounded-full mr-4"
 				@click="
 					startYears-- && endYears--;
 					getCurrentYearsCours();
@@ -13,9 +13,11 @@
 			>
 				←
 			</button>
-			<span class="text-2xl font-bold">{{ startYears }} - {{ endYears }}</span>
+			<span class="text-2xl font-bold text-gray-900 dark:text-white"
+				>{{ startYears }} - {{ endYears }}</span
+			>
 			<button
-				class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full ml-4"
+				class="bg-blue-500 hover:bg-blue-700 font-bold py-2 px-4 rounded-full ml-4"
 				@click="
 					startYears++ && endYears++;
 					getCurrentYearsCours();
@@ -28,7 +30,7 @@
 			<div class="flex items-center justify-center">
 				<div class="flex items-center justify-center">
 					<button
-						class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full"
+						class="bg-blue-500 hover:bg-blue-700 font-bold py-2 px-4 rounded-full"
 						@click="showModal = true"
 					>
 						+
@@ -46,7 +48,7 @@
 			<div class="grid grid-cols-2 md:grid-cols-3 gap-4">
 				<div
 					v-for="item in coursesFiltered"
-					class="max-w-sm bg-white border border-gray-200 rounded-lg shadow dark:bg-gray-800 dark:border-gray-700"
+					class="max-w-sm bg-white border border-gray-200 rounded-lg shadow dark:bg-gray-800 dark:border-gray-700 text-gray-900 dark:text-white"
 					@click="openCourse(item._id)"
 				>
 					<img

From d886459730c1d738adcfd7ce35d99d025baa48da Mon Sep 17 00:00:00 2001
From: ThomasCast3 <91255859+ThomasCast3@users.noreply.github.com>
Date: Fri, 16 Jun 2023 10:04:56 +0200
Subject: [PATCH 13/24] pdf files for course

---
 .../RessourcesComponents/AddCourse.vue        | 34 +++++++++++--------
 .../components/RessourcesComponents/Cours.vue |  3 --
 .../src/store/interfaces/cours.interface.ts   |  6 ++--
 front-end/src/store/modules/course.store.ts   |  4 ++-
 4 files changed, 25 insertions(+), 22 deletions(-)

diff --git a/front-end/src/components/RessourcesComponents/AddCourse.vue b/front-end/src/components/RessourcesComponents/AddCourse.vue
index 0bdff3a23..289a9b33a 100644
--- a/front-end/src/components/RessourcesComponents/AddCourse.vue
+++ b/front-end/src/components/RessourcesComponents/AddCourse.vue
@@ -125,16 +125,6 @@ export default {
 				return;
 			}
 
-			const formData = new FormData();
-			formData.append('tag', this.tag);
-			formData.append('periodStart', this.periodStart);
-			formData.append('periodEnd', this.periodEnd);
-			formData.append('picture', this.picture);
-			formData.append('language', this.language);
-			//this.uploadedFiles.forEach((file) => {
-			formData.append('files', this.selectedFile);
-			//	});
-
 			Swal.fire({
 				title: 'Votre cours a été ajouté',
 				icon: 'success',
@@ -145,10 +135,24 @@ export default {
 				if (result.isConfirmed) {
 					// Ajouter le cours
 					//	await useCoursStore.addCourse(formData);
-					http.post('/courses/create', formData).catch((error) => {
-						console.log(error);
-						this.$emit('addnew');
-					});
+					console.log(this.selectedFile);
+					http
+						.post('/courses/create', {
+							tag: this.tag,
+							periodStart: this.periodStart,
+							periodEnd: this.periodEnd,
+							picture: this.picture,
+							language: this.language,
+							files: this.base64String,
+							presence: this.presence,
+							createdAt: this.createdAt,
+							project: this.project,
+							site: this.site,
+						})
+						.catch((error) => {
+							console.log(error);
+							//this.$emit('addnew');
+						});
 					// Rediriger vers la page des cours
 					this.$emit('close');
 				}
@@ -160,7 +164,7 @@ export default {
 			this.periodEnd = null;
 			this.picture = '';
 			this.language = '';
-			this.uploadedFiles = [];
+			//this.uploadedFiles = [];
 		},
 
 		searchLanguage() {
diff --git a/front-end/src/components/RessourcesComponents/Cours.vue b/front-end/src/components/RessourcesComponents/Cours.vue
index a65ae3ce8..a0fd56c17 100644
--- a/front-end/src/components/RessourcesComponents/Cours.vue
+++ b/front-end/src/components/RessourcesComponents/Cours.vue
@@ -1,8 +1,5 @@
 <template>
 	<div>
-		<div v-if="userRole === Roles.USER">
-			<h1>ELEVE</h1>
-		</div>
 		<div class="flex items-center justify-center">
 			<button
 				class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full mr-4"
diff --git a/front-end/src/store/interfaces/cours.interface.ts b/front-end/src/store/interfaces/cours.interface.ts
index 878fc6cf2..f252df087 100644
--- a/front-end/src/store/interfaces/cours.interface.ts
+++ b/front-end/src/store/interfaces/cours.interface.ts
@@ -6,7 +6,7 @@ export interface CoursesStore {
 	items: Array<Course>;
 	idCourses: string;
 	oneItems: Course;
-	uploadedFiles: File[];
+	//uploadedFiles: File[];
 }
 
 export interface Course {
@@ -27,7 +27,7 @@ export interface Course {
 
 export interface CourseById {
 	course?: Course;
-	retro?: Retrospective;
-	projects?: Array<ProjectMeta>;
+	//retro?: Retrospective;
+	//projects?: Array<ProjectMeta>;
 	// trellos?: Trello A Définir
 }
diff --git a/front-end/src/store/modules/course.store.ts b/front-end/src/store/modules/course.store.ts
index 03ab5a588..42b12f9e1 100644
--- a/front-end/src/store/modules/course.store.ts
+++ b/front-end/src/store/modules/course.store.ts
@@ -22,6 +22,7 @@ export const useCoursStore = defineStore('course', {
 					project: [],
 					site: '',
 					teacherId: '',
+					files: '',
 				},
 			],
 			oneItems: {
@@ -37,9 +38,10 @@ export const useCoursStore = defineStore('course', {
 				project: [],
 				site: '',
 				teacherId: '',
+				files: '',
 			},
 			idCourses: '',
-			uploadedFiles: [],
+			//uploadedFiles: [],
 		};
 	},
 	actions: {

From f81a516dadf7a13c246aebf77cd1e7cfd2b94a2f Mon Sep 17 00:00:00 2001
From: ThomasCast3 <91255859+ThomasCast3@users.noreply.github.com>
Date: Fri, 16 Jun 2023 10:17:46 +0200
Subject: [PATCH 14/24] correction ajout form course

---
 .../RessourcesComponents/AddCourse.vue        | 37 ++++++++++---------
 1 file changed, 19 insertions(+), 18 deletions(-)

diff --git a/front-end/src/components/RessourcesComponents/AddCourse.vue b/front-end/src/components/RessourcesComponents/AddCourse.vue
index 289a9b33a..78914e6ab 100644
--- a/front-end/src/components/RessourcesComponents/AddCourse.vue
+++ b/front-end/src/components/RessourcesComponents/AddCourse.vue
@@ -125,6 +125,20 @@ export default {
 				return;
 			}
 
+			const formData = new FormData();
+			formData.append('tag', this.tag);
+			formData.append('periodStart', this.periodStart);
+			formData.append('periodEnd', this.periodEnd);
+			formData.append('picture', this.picture);
+			formData.append('language', this.language);
+			//this.uploadedFiles.forEach((file) => {
+			formData.append('files', this.base64String);
+			formData.append('presence', this.presence);
+			formData.append('createdAt', this.createdAt);
+			formData.append('project', this.project);
+			formData.append('site', this.site);
+			//	});
+
 			Swal.fire({
 				title: 'Votre cours a été ajouté',
 				icon: 'success',
@@ -135,24 +149,11 @@ export default {
 				if (result.isConfirmed) {
 					// Ajouter le cours
 					//	await useCoursStore.addCourse(formData);
-					console.log(this.selectedFile);
-					http
-						.post('/courses/create', {
-							tag: this.tag,
-							periodStart: this.periodStart,
-							periodEnd: this.periodEnd,
-							picture: this.picture,
-							language: this.language,
-							files: this.base64String,
-							presence: this.presence,
-							createdAt: this.createdAt,
-							project: this.project,
-							site: this.site,
-						})
-						.catch((error) => {
-							console.log(error);
-							//this.$emit('addnew');
-						});
+					console.log(this.tag);
+					http.post('/courses/create', formData).catch((error) => {
+						console.log(error);
+						//this.$emit('addnew');
+					});
 					// Rediriger vers la page des cours
 					this.$emit('close');
 				}

From a84c27964e2bad174016b7354af44329b2de669b Mon Sep 17 00:00:00 2001
From: Baptiste Dumoulin <91154604+Ptitbapt@users.noreply.github.com>
Date: Fri, 16 Jun 2023 10:27:23 +0200
Subject: [PATCH 15/24] Revert "Merge branch 'G2-cours-V2' into
 G2/feature/connection_between_group"

This reverts commit a523bf940b72bddace2203deb6ea46a24b0cf38e, reversing
changes made to b657da13a8800545814622c6a40818191cab421b.
---
 .../src/base/courses/courses.controller.ts    |   4 +-
 back-end/src/base/courses/dto/coures.dto.ts   |   3 -
 .../courses/interfaces/courses.interface.ts   |   1 -
 .../interfaces/openHouses.interface.ts        |   1 -
 back-end/src/base/users/users.controller.ts   |   6 -
 back-end/src/base/users/users.service.ts      |   4 -
 back-end/src/main.ts                          |   3 +-
 front-end/src/api/user-req.ts                 |   4 -
 .../RessourcesComponents/AddCourse.vue        | 199 ++----------------
 .../components/RessourcesComponents/Cours.vue |  12 +-
 .../RessourcesComponents/FormOpenHouses.vue   |  55 +----
 .../RessourcesComponents/NewParticipant.vue   |  53 +++--
 front-end/src/components/common/Modal.vue     |  60 ++----
 .../src/components/common/svg/Folder.vue      |  16 --
 .../components/materials/FormMaterials.vue    |   2 +-
 .../src/store/interfaces/cours.interface.ts   |   8 +-
 .../src/store/interfaces/openhouse.store.ts   |   1 -
 front-end/src/store/modules/course.store.ts   |  26 +--
 .../src/store/modules/openHouse.store.ts      |   2 -
 19 files changed, 90 insertions(+), 370 deletions(-)
 delete mode 100644 front-end/src/components/common/svg/Folder.vue

diff --git a/back-end/src/base/courses/courses.controller.ts b/back-end/src/base/courses/courses.controller.ts
index 30824a305..1a35d622f 100644
--- a/back-end/src/base/courses/courses.controller.ts
+++ b/back-end/src/base/courses/courses.controller.ts
@@ -26,14 +26,12 @@ export class CoursesController {
 	@Get('/:id')
 	async getCoursesById(@Req() req: Request, @Res() res: Response, @Param('id') courseId: string) {
 		const courseById = await this.coursesService.getCoursesById(courseId);
-		console.log(courseById);
-		return res.status(200).json(courseById);
+		return res.status(200).json({ status: 'ok', courseById });
 	}
 
 	@Post('/create')
 	async createCourse(@Req() req: Request, @Res() res: Response) {
 		await this.coursesService.createCourse(req.body).then((course) => {
-			console.log(course);
 			res.status(200).json(course);
 		});
 	}
diff --git a/back-end/src/base/courses/dto/coures.dto.ts b/back-end/src/base/courses/dto/coures.dto.ts
index 4d94e8181..1db119a07 100644
--- a/back-end/src/base/courses/dto/coures.dto.ts
+++ b/back-end/src/base/courses/dto/coures.dto.ts
@@ -22,9 +22,6 @@ export class CourseDTO {
 	@IsOptional()
 	createdAt?: Date;
 
-	@IsOptional()
-	files?: string;
-
 	@IsOptional()
 	periodStart?: Date;
 
diff --git a/back-end/src/base/courses/interfaces/courses.interface.ts b/back-end/src/base/courses/interfaces/courses.interface.ts
index 6d458df77..bb0e0da7b 100644
--- a/back-end/src/base/courses/interfaces/courses.interface.ts
+++ b/back-end/src/base/courses/interfaces/courses.interface.ts
@@ -12,7 +12,6 @@ export interface Course {
 	periodStart: Date;
 	periodEnd: Date;
 	presence: [];
-	files: string;
 	projects: Array<ObjectId>;
 	site: string;
 	teacherId?: ObjectId;
diff --git a/back-end/src/base/openHouses/interfaces/openHouses.interface.ts b/back-end/src/base/openHouses/interfaces/openHouses.interface.ts
index 38e4892e4..fa31f406f 100644
--- a/back-end/src/base/openHouses/interfaces/openHouses.interface.ts
+++ b/back-end/src/base/openHouses/interfaces/openHouses.interface.ts
@@ -10,7 +10,6 @@ export interface OpenHouse {
 	address: string;
 	group: Group;
 	participants: Array<User>;
-	files: string;
 	description: string;
 	project: Project;
 }
diff --git a/back-end/src/base/users/users.controller.ts b/back-end/src/base/users/users.controller.ts
index 2e99e21f0..9c20369d9 100644
--- a/back-end/src/base/users/users.controller.ts
+++ b/back-end/src/base/users/users.controller.ts
@@ -77,10 +77,4 @@ export class UsersController {
 
 		return res.status(200).json({ status: 'ok', users });
 	}
-
-	@Get('')
-	async getAllUsers(@Res() res: Response) {
-		const users = await this.usersService.getAllUsers();
-		return res.status(200).json({ users });
-	}
 }
diff --git a/back-end/src/base/users/users.service.ts b/back-end/src/base/users/users.service.ts
index 990de506a..215a4659e 100644
--- a/back-end/src/base/users/users.service.ts
+++ b/back-end/src/base/users/users.service.ts
@@ -364,8 +364,4 @@ export class UsersService {
 
 		return users ?? [];
 	}
-
-	async getAllUsers() {
-		return await this.usersRepository.getAllUsers();
-	}
 }
diff --git a/back-end/src/main.ts b/back-end/src/main.ts
index 11c262c36..7baa15f65 100644
--- a/back-end/src/main.ts
+++ b/back-end/src/main.ts
@@ -7,7 +7,6 @@ import { config } from 'src/config/config';
 
 import { AppModule } from 'src/app.module';
 import { corsOptionsDelegate } from 'src/config/cors';
-import * as bodyParser from 'body-parser';
 
 //! Proxy settings, production only
 // <NestExpressApplication>
@@ -28,7 +27,7 @@ async function bootstrap() {
 	);
 
 	app.use(cookieParser());
-	app.use(bodyParser.json({ limit: '50mb' }));
+
 	app.enableCors(corsOptionsDelegate);
 	//! versioning, production only
 	// app.enableVersioning({
diff --git a/front-end/src/api/user-req.ts b/front-end/src/api/user-req.ts
index dd167aae2..b03be11b1 100644
--- a/front-end/src/api/user-req.ts
+++ b/front-end/src/api/user-req.ts
@@ -32,7 +32,3 @@ export const apiTryFetchUserListByRoomRetro = (roomId: string, user: string) =>
 		`/users/roomRetro?id=${roomId}&user=${user}`,
 	);
 };
-
-export const getAllUsers = () => {
-	return http.get<Array<User>>('/users');
-};
diff --git a/front-end/src/components/RessourcesComponents/AddCourse.vue b/front-end/src/components/RessourcesComponents/AddCourse.vue
index 78914e6ab..610db558b 100644
--- a/front-end/src/components/RessourcesComponents/AddCourse.vue
+++ b/front-end/src/components/RessourcesComponents/AddCourse.vue
@@ -7,51 +7,16 @@
 			</h3>
 			<div class="modal-body">
 				<form class="w-full max-w-sm">
-					<input type="text" name="title" v-model="tag" placeholder="Title :" /><br />
-					<div>
-						<VueDatePicker
-							placeholder="debut"
-							v-model="periodStart"
-							:format="dateFormat"
-							:language="datePickerLanguage"
-						/>
-						<VueDatePicker
-							placeholder="fin"
-							v-model="periodEnd"
-							:format="dateFormat"
-							:language="datePickerLanguage"
-						/>
-					</div>
-					<input type="url" placeholder="picture link" v-model="picture" /><br />
+					<input type="text" name="title" v-model="this.tag" placeholder="Title :" /><br />
+					<input type="datetime-local" class="text-field" v-model="this.periodStart" /><br />
+					<input type="datetime-local" class="text-field" v-model="this.periodEnd" /><br />
+					<input type="url" placeholder="picture link" v-model="this.picture" /><br />
 					<input
 						type="text"
 						name="language"
-						v-model="language"
+						v-model="this.language"
 						placeholder="Language :"
-						@input="searchLanguage"
-						autocomplete="off"
-					/>
-					<ul v-if="showSuggest">
-						<li v-for="suggest in languageSuggest" :key="suggest" @click="selectSuggest(suggest)">
-							{{ suggest }}
-						</li>
-					</ul>
-					<div class="mb-4">
-						<label for="file" class="block text-sm font-medium text-gray-700">Fichier :</label>
-						<input type="file" id="file" ref="fileInput" @change="onFileSelected" />
-						<!--ul class="mt-4 space-y-2">
-							<li v-for="file in uploadedFiles" :key="file.name" class="flex items-center">
-								<button
-									type="button"
-									class="focus:outline-none text-white bg-red-700 hover:bg-red-800 focus:ring-4 focus:ring-red-300 font-medium rounded-lg text-sm px-3 py-1.5 mr-2 mb-2 dark:bg-red-600 dark:hover:bg-red-700 dark:focus:ring-red-900"
-									@click="removeFile(file)"
-								>
-									X
-								</button>
-								<span class="text-gray-700">{{ file.name }}</span>
-							</li>
-						</ul-->
-					</div>
+					/><br />
 					<div class="flex justify-center mt-6">
 						<button
 							class="px-4 py-2 text-white bg-blue-500 rounded-lg hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50"
@@ -75,17 +40,10 @@
 </template>
 
 <script lang="ts">
-import VueDatePicker from '@vuepic/vue-datepicker';
 import { useCoursStore } from '@/store/modules/course.store';
-import Swal from 'sweetalert2';
-import { http } from '@/api/network/axios';
 
 export default {
 	name: 'AddCourses',
-	components: {
-		VueDatePicker,
-	},
-	emits: ['close'],
 	data() {
 		return {
 			tag: '',
@@ -99,137 +57,25 @@ export default {
 			project: [],
 			site: '',
 			teacherId: '',
-			languages: [],
-			languageSuggest: [],
-			showSuggest: false,
-			//uploadedFiles: [],
-			dateFormat: 'yyyy-MM-dd HH:mm',
-			datePickerLanguage: 'fr', // Langue du date picker
-			selectedFile: null,
-			base64String: '',
 		};
 	},
 	methods: {
-		async AddCourses(event) {
-			event.preventDefault();
-			// Vérifier si tous les champs sont remplis
-			if (!this.tag || !this.periodStart || !this.periodEnd || !this.picture || !this.language) {
-				Swal.fire({
-					title: 'Vous devez remplir tous les champs',
-					text: 'Veuillez remplir tous les champs pour ajouter un nouveau cours',
-					icon: 'error',
-					confirmButtonColor: '#3085d6',
-					cancelButtonColor: '#d33',
-					confirmButtonText: 'OK',
-				});
-				return;
-			}
-
-			const formData = new FormData();
-			formData.append('tag', this.tag);
-			formData.append('periodStart', this.periodStart);
-			formData.append('periodEnd', this.periodEnd);
-			formData.append('picture', this.picture);
-			formData.append('language', this.language);
-			//this.uploadedFiles.forEach((file) => {
-			formData.append('files', this.base64String);
-			formData.append('presence', this.presence);
-			formData.append('createdAt', this.createdAt);
-			formData.append('project', this.project);
-			formData.append('site', this.site);
-			//	});
-
-			Swal.fire({
-				title: 'Votre cours a été ajouté',
-				icon: 'success',
-				confirmButtonColor: '#3085d6',
-				cancelButtonColor: '#d33',
-				confirmButtonText: 'OK',
-			}).then(async (result) => {
-				if (result.isConfirmed) {
-					// Ajouter le cours
-					//	await useCoursStore.addCourse(formData);
-					console.log(this.tag);
-					http.post('/courses/create', formData).catch((error) => {
-						console.log(error);
-						//this.$emit('addnew');
-					});
-					// Rediriger vers la page des cours
-					this.$emit('close');
-				}
-			});
-
-			// Réinitialiser les champs
-			this.tag = '';
-			this.periodStart = null;
-			this.periodEnd = null;
-			this.picture = '';
-			this.language = '';
-			//this.uploadedFiles = [];
-		},
-
-		searchLanguage() {
-			//recherche de toutes les matieres
-			this.showSuggest = true;
-			this.getAllTagCourse();
-			this.languageSuggest = [];
-			this.languages.forEach((element) => {
-				let alreadyInList = false;
-				if (element.toUpperCase().includes(this.language.toUpperCase()) && this.language != '') {
-					this.languageSuggest.forEach((languageInList) => {
-						if (languageInList == element.toUpperCase()) {
-							alreadyInList = true;
-						}
-					});
-					if (!alreadyInList) {
-						this.languageSuggest.push(element.toUpperCase());
-					}
-				}
-			});
-		},
-
-		getAllTagCourse() {
-			this.languages = []; //reset la list
-			const courseStore = useCoursStore();
-			const course = courseStore.items;
-			course.forEach((element) => {
-				if (!this.languages.includes(element.language)) {
-					this.languages.push(element.language);
-				}
-			});
-		},
-
-		selectSuggest(suggest) {
-			this.language = suggest;
-		},
-
-		handleFileChange(event) {
-			const files = event.target.files;
-			this.uploadedFiles = Array.from(files);
-		},
-
-		removeFile(index) {
-			this.uploadedFiles.splice(index, 1);
-		},
-
-		close() {
-			this.$emit('close');
-		},
-
-		onFileSelected(event) {
-			this.selectedFile = event.target.files[0];
-			this.convertToBase64();
-		},
-
-		convertToBase64() {
-			if (this.selectedFile) {
-				const reader = new FileReader();
-				reader.onload = (event) => {
-					let result = event.target.result;
-					this.base64String = result.toString();
-				};
-				reader.readAsDataURL(this.selectedFile);
-			}
+		AddCourses() {
+			const course = useCoursStore();
+			this.newCourse = {
+				tag: this.tag,
+				classTag: '',
+				picture: this.picture,
+				language: this.language,
+				createdAt: this.createdAt,
+				periodStart: this.periodStart,
+				periodEnd: this.periodEnd,
+				presence: [],
+				project: [],
+				site: '',
+				teacherId: '',
+			};
+			course.addCourse(this.newCourse);
 		},
 	},
 };
@@ -243,7 +89,6 @@ export default {
 	transform: translate(-50%, -50%);
 	background-color: white;
 	border: 1px solid black;
-	color: black;
 	padding: 20px;
 	z-index: 1000;
 	border-radius: 0.375rem;
diff --git a/front-end/src/components/RessourcesComponents/Cours.vue b/front-end/src/components/RessourcesComponents/Cours.vue
index 40839d7b1..9ee87870e 100644
--- a/front-end/src/components/RessourcesComponents/Cours.vue
+++ b/front-end/src/components/RessourcesComponents/Cours.vue
@@ -1,5 +1,8 @@
 <template>
 	<div>
+		<div v-if="userRole === Roles.USER">
+			<h1>ELEVE</h1>
+		</div>
 		<div class="flex items-center justify-center">
 			<button
 				class="bg-blue-500 hover:bg-blue-700 font-bold py-2 px-4 rounded-full mr-4"
@@ -47,7 +50,6 @@
 					v-for="item in coursesFiltered"
 					class="max-w-sm bg-white border border-gray-200 rounded-lg shadow dark:bg-gray-800 dark:border-gray-700 text-gray-900 dark:text-white"
 					@click="openCourse(item._id)"
-					:key="item._id"
 				>
 					<img
 						class="object-cover h-48 w-96 rounded-t-lg"
@@ -119,15 +121,13 @@ function getCurrentYearsCours() {
 			currentYearsCourses.push(element); //ajouter cours si date correspond
 		}
 	});
-	getAllTagCourse(currentYearsCourses); //récuperer tous les matieres des currents years cours
+	getAllTagCourse(); //récuperer tous les matieres des currents years cours
 	showCoursesByLanguage();
-	//coursesFiltered.value = currentYearsCourses;   //afficher les cours
 }
 
-function getAllTagCourse(courseList) {
-	//list des matieres:
+function getAllTagCourse() {
 	TagList.value = [];
-	courseList.forEach((element) => {
+	currentYearsCourses.forEach((element) => {
 		if (!TagList.value.includes(element.language.toUpperCase())) {
 			TagList.value.push(element.language.toUpperCase());
 		}
diff --git a/front-end/src/components/RessourcesComponents/FormOpenHouses.vue b/front-end/src/components/RessourcesComponents/FormOpenHouses.vue
index 20a768c97..05acf08ef 100644
--- a/front-end/src/components/RessourcesComponents/FormOpenHouses.vue
+++ b/front-end/src/components/RessourcesComponents/FormOpenHouses.vue
@@ -7,15 +7,15 @@
 					<input type="text" name="title" v-model="title" placeholder="Title :" /><br />
 					<input type="datetime-local" v-model="date" /><br />
 					<input type="url" placeholder="picture link" v-model="picture" /><br />
-					<activity :Activities="Activities" />
+					<activity :Activities="Activities"></activity>
 					<div>
 						<input type="text" v-model="street" placeholder="street :" /><br />
 						<input type="text" v-model="zipCode" placeholder="zip code :" /><br />
 						<input type="text" v-model="town" placeholder="town :" /><br />
 					</div>
 					<textarea placeholder="Description :" v-model="description"></textarea><br />
-					<addParticipant :participants="participants" @clear="clearParticipants" />
-					<input type="file" accept="application/pdf" @change="onFileSelected" /><br />
+					<participant :participants="participants" @clear="clearParticipants"></participant>
+					<input type="file" @change="onFileSelected" /><br />
 					<button type="submit">Submit</button>
 				</form>
 			</template>
@@ -24,17 +24,14 @@
 </template>
 
 <script setup lang="ts">
-import addParticipant from '@/components/RessourcesComponents/NewParticipant.vue';
-import activity from '@/components/RessourcesComponents/NewActivity.vue';
 import ModalOverlay from '@/components/common/Modal.vue';
 import { ref } from 'vue';
 import { http } from '@/api/network/axios';
-import Swal from 'sweetalert2';
 
 const showMetaModal = ref(false);
 
 const openMetaModal = () => (showMetaModal.value = true);
-const closeMetaModal = () => closeForm();
+const closeMetaModal = () => (showMetaModal.value = false);
 
 let title = '';
 let date = '';
@@ -45,29 +42,13 @@ let description = '';
 let picture = '';
 let participants = [];
 let Activities = [];
-let selectedFile = null;
-let base64String = '';
-
-const addOpenHouses = async function () {
-	// Vérifier si tous les champs sont remplis
-	if (!title || !date || !street || !zipCode || !town) {
-		Swal.fire({
-			title: 'Vous devez remplir tous les champs',
-			text: 'Veuillez remplir tous les champs pour ajouter une nouvelle JPO',
-			icon: 'error',
-			confirmButtonColor: '#3085d6',
-			cancelButtonColor: '#d33',
-			confirmButtonText: 'OK',
-		});
-		return;
-	}
 
+const addOpenHouses = function () {
 	let adress = {
 		street: street,
 		zipCode: zipCode,
 		city: town,
 	};
-
 	http
 		.post('/openhouses/create', {
 			title: title,
@@ -77,7 +58,6 @@ const addOpenHouses = async function () {
 			adress: adress,
 			description: description,
 			participants: participants,
-			files: base64String,
 		})
 		.catch((error) => {
 			console.log(error);
@@ -94,33 +74,14 @@ const addOpenHouses = async function () {
 	closeMetaModal();
 };
 
-const closeForm = function () {
-	showMetaModal.value = false;
-	clearParticipants();
-	clearActivitys();
-};
-
 const onFileSelected = function (event) {
-	selectedFile = event.target.files[0];
-	convertToBase64();
-};
-
-const convertToBase64 = function () {
-	if (selectedFile) {
-		const reader = new FileReader();
-		reader.onload = (event) => {
-			let result = event.target.result;
-			base64String = result.toString();
-		};
-		reader.readAsDataURL(selectedFile);
-	}
+	console.log(event);
 };
 
 const clearParticipants = function () {
 	participants.splice(0, participants.length);
 };
+//	 },
 
-const clearActivitys = function () {
-	Activities.splice(0, Activities.length);
-};
+//}
 </script>
diff --git a/front-end/src/components/RessourcesComponents/NewParticipant.vue b/front-end/src/components/RessourcesComponents/NewParticipant.vue
index c856e6517..ac48b24d4 100644
--- a/front-end/src/components/RessourcesComponents/NewParticipant.vue
+++ b/front-end/src/components/RessourcesComponents/NewParticipant.vue
@@ -5,29 +5,29 @@
 		<div v-show="showParticipant">
 			<input type="text" placeholder="name :" v-model="name" @input="searchUser" />
 			<!--input = name et lance recherche de correspondance-->
-			<p v-for="(user, id) in userList" @click="selectUser(user)" :key="id">{{ user }}</p>
+			<p v-for="user in userList" @click="selectUser(user)">{{ user }}</p>
 			<br />
 		</div>
-		<p v-for="user in participants" :key="user.name">{{ user }}</p>
+		<p v-for="user in participants">{{ user }}</p>
 		<br />
 		<!--afficher les participants ajouter-->
 	</div>
 </template>
 
 <script lang="ts">
-import { useUserStore } from '@/store/modules/user.store';
-
+import { http } from '@/api/network/axios';
 export default {
 	data() {
 		return {
+			firstName: '',
+			lastName: '',
 			name: '',
 			usersNames: [],
 			userList: [],
-			userName: '', // valeur du get peut changer d'objet a string
+			userName: { firstName: '', lastName: '' }, // valeur du get peut changer d'objet a string
 			showParticipant: false,
 		};
 	},
-	// eslint-disable-next-line vue/order-in-components
 	props: {
 		participants: {
 			//props participants a envoyer pour le form
@@ -52,49 +52,48 @@ export default {
 			}
 		},
 
-		async searchUser() {
+		searchUser() {
 			//recherche de participant
-			//this.$emit('clear');
+			// this.$emit('clear');
 			this.userList = [];
-			await this.getUsers(); // recuperer les users de la bdd
-			console.log(this.usersNames);
+			this.getUsers(); // recuperer les users de la bdd
 			this.usersNames.forEach((element) => {
+				const userName = element.firstName + ' ' + element.lastName;
 				let alreadyInList = false;
-				if (element.toUpperCase().includes(this.name.toUpperCase()) && this.name != '') {
+				if (userName.toUpperCase().includes(this.name.toUpperCase()) && this.name != '') {
 					this.participants.forEach((participant) => {
-						if (participant == element) {
+						if (participant == userName) {
 							alreadyInList = true;
 						}
 					});
 					if (!alreadyInList) {
-						this.userList.push(element.toUpperCase());
+						this.userList.push(userName);
 					}
 				}
 			});
 		},
 
-		async getUsers() {
-			this.usersNames = [];
-			const userStore = useUserStore();
-			await userStore.getAllUsers();
-			const usersList = userStore.users;
-			const test = Object.keys(usersList);
-			const testArray = test.map((key) => ({ key, value: usersList[key] }));
-			testArray.forEach((element) => {
-				element.value.forEach((user) => {
-					this.userName = user.profile.firstName + ' ' + user.profile.lastName;
+		getUsers() {
+			http.get('http://localhost:8010/openhouses/users').then((response) => {
+				this.users = response.data;
+				this.users.forEach((element) => {
+					this.userName = {
+						firstName: element.profile.firstName,
+						lastName: element.profile.lastName,
+					};
 					if (!this.userCheckList()) {
-						this.usersNames.push(this.userName.toUpperCase());
+						this.usersNames.push(this.userName);
 					}
 				});
 			});
-			console.log(this.usersNames);
 		},
 		userCheckList() {
 			let alreadyInList = false;
 			this.usersNames.forEach((element) => {
-				if (element == this.userName.toUpperCase()) {
-					alreadyInList = true;
+				if (element.lastName == this.userName.lastName) {
+					if (element.firstName == this.userName.firstName) {
+						alreadyInList = true;
+					}
 				}
 			});
 			return alreadyInList;
diff --git a/front-end/src/components/common/Modal.vue b/front-end/src/components/common/Modal.vue
index 4b07994a7..33f7beec2 100644
--- a/front-end/src/components/common/Modal.vue
+++ b/front-end/src/components/common/Modal.vue
@@ -1,46 +1,30 @@
 <template>
 	<div>
-		<div
-			class="bg-dark-primary bg-opacity-50 dark:bg-opacity-60 fixed inset-0 z-[60]"
-			@click="closeModal"
-		></div>
+		<div class="bg-dark-primary bg-opacity-50 dark:bg-opacity-60 fixed inset-0 z-[60]" @click="closeModal"/>
 		<div
 			tabindex="-1"
 			class="overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-[70] w-full inset-0 h-full justify-center items-center flex"
 		>
-			<div
-				class="flex flex-col relative p-4 m-4 w-full h-auto rounded-lg shadow bg-light-primary dark:bg-dark-tertiary"
-				:class="`${modalSizeClasses[size]}`"
-			>
+			<div class="flex flex-col relative p-4 m-4 w-full h-auto rounded-lg shadow bg-light-primary dark:bg-dark-tertiary" :class="`${modalSizeClasses[size]}`">
 				<!-- Modal content -->
 
-				<button
-					@click="closeModal"
-					type="button"
-					class="absolute right-2 top-2 bg-transparent hover:bg-light-secondary dark:hover:bg-dark-secondary rounded-lg text-sm p-1.5 ml-auto inline-flex items-center"
-				>
-					<SvgCross class="!fill-red-500" />
+				<button @click="closeModal" type="button" class="absolute right-2 top-2 bg-transparent hover:bg-light-secondary dark:hover:bg-dark-secondary rounded-lg text-sm p-1.5 ml-auto inline-flex items-center">
+					<SvgCross class="!fill-red-500"/>
 				</button>
 
 				<!-- Modal header -->
-				<div
-					class="rounded-t flex justify-between items-center"
-					:class="$slots.header ? 'border-b border-light-secondary dark:border-dark-highlight' : ''"
-				>
-					<slot name="header"></slot>
+				<div class="rounded-t flex justify-between items-center" :class="$slots.header ? 'border-b border-light-secondary dark:border-dark-highlight' : ''">
+					<slot name="header" />
 				</div>
 
 				<!-- Modal body -->
 				<div :class="$slots.footer ? '!py-6 grow' : ''">
-					<slot name="body" id="body"></slot>
+					<slot name="body" id="body" />
 				</div>
 
 				<!-- Modal footer -->
-				<div
-					v-if="$slots.footer"
-					class="pt-6 rounded-b border-t border-light-secondary dark:border-dark-highlight"
-				>
-					<slot name="footer"></slot>
+				<div v-if="$slots.footer" class="pt-6 rounded-b border-t border-light-secondary dark:border-dark-highlight">
+					<slot name="footer" />
 				</div>
 			</div>
 		</div>
@@ -53,26 +37,14 @@ import SvgCross from '@/components/common/svg/Cross.vue';
 
 defineProps({
 	position: {
-		type: String as PropType<
-			| 'bottom-left'
-			| 'bottom-right'
-			| 'bottom-center'
-			| 'top-left'
-			| 'top-center'
-			| 'top-right'
-			| 'center-left'
-			| 'center'
-			| 'center-right'
-		>,
+		type: String as PropType<'bottom-left' | 'bottom-right' | 'bottom-center' | 'top-left' | 'top-center' | 'top-right' | 'center-left' | 'center' | 'center-right'>,
 		default: 'center',
 	},
 	size: {
-		type: String as PropType<
-			'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | 'full'
-		>,
+		type: String as PropType<'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | 'full'>,
 		default: '2xl',
 	},
-});
+})
 
 const emit = defineEmits(['close']);
 const modalSizeClasses = {
@@ -87,10 +59,10 @@ const modalSizeClasses = {
 	'5xl': 'max-w-5xl',
 	'6xl': 'max-w-6xl',
 	'7xl': 'max-w-7xl',
-	full: 'w-screens p-4 !m-0 min-h-screen justify-between',
-};
+	'full': 'w-screens p-4 !m-0 min-h-screen justify-between'
+}
 
 function closeModal() {
-	emit('close');
+	emit('close')
 }
-</script>
+</script>
\ No newline at end of file
diff --git a/front-end/src/components/common/svg/Folder.vue b/front-end/src/components/common/svg/Folder.vue
deleted file mode 100644
index 08ee8d34c..000000000
--- a/front-end/src/components/common/svg/Folder.vue
+++ /dev/null
@@ -1,16 +0,0 @@
-<template>
-	<svg
-		xmlns="http://www.w3.org/2000/svg"
-		fill="none"
-		viewBox="0 0 24 24"
-		stroke-width="1.5"
-		stroke="currentColor"
-		class="w-6 h-6"
-	>
-		<path
-			stroke-linecap="round"
-			stroke-linejoin="round"
-			d="M2.25 12.75V12A2.25 2.25 0 014.5 9.75h15A2.25 2.25 0 0121.75 12v.75m-8.69-6.44l-2.12-2.12a1.5 1.5 0 00-1.061-.44H4.5A2.25 2.25 0 002.25 6v12a2.25 2.25 0 002.25 2.25h15A2.25 2.25 0 0021.75 18V9a2.25 2.25 0 00-2.25-2.25h-5.379a1.5 1.5 0 01-1.06-.44z"
-		/>
-	</svg>
-</template>
diff --git a/front-end/src/components/materials/FormMaterials.vue b/front-end/src/components/materials/FormMaterials.vue
index 5faad1b12..472c207f8 100644
--- a/front-end/src/components/materials/FormMaterials.vue
+++ b/front-end/src/components/materials/FormMaterials.vue
@@ -64,7 +64,7 @@ const description = ref('');
 const returnDate = ref('');
 const emit = defineEmits(['close']);
 
-const borrorwingMaterial = async (identifiant: string) => {
+const borrorwingMaterial = async (identifiant: string) =>{
 	const response = await materialStore.borrowMaterial(identifiant, {
 		borrowingDate: new Date(borrowingDate.value),
 		borrowingUser: props.userId,
diff --git a/front-end/src/store/interfaces/cours.interface.ts b/front-end/src/store/interfaces/cours.interface.ts
index e9e30a8f5..78287a1af 100644
--- a/front-end/src/store/interfaces/cours.interface.ts
+++ b/front-end/src/store/interfaces/cours.interface.ts
@@ -5,8 +5,7 @@ export interface CoursesStore {
 	allCourses: Array<Course>;
 	items: Array<Course>;
 	idCourses: string;
-	oneItems: Course;
-	//uploadedFiles: File[];
+	oneItems: CourseById;
 }
 
 export interface Course {
@@ -26,7 +25,6 @@ export interface Course {
 	messages: Array<Message>;
 	projects: Array<string>;
 	retro: string;
-	files: string;
 }
 
 export interface Group {
@@ -50,7 +48,7 @@ export interface Message {
 
 export interface CourseById {
 	course?: Course;
-	//retro?: Retrospective;
-	//projects?: Array<ProjectMeta>;
+	retro?: Retrospective;
+	projects?: Array<ProjectMeta>;
 	// trellos?: Trello A Définir
 }
diff --git a/front-end/src/store/interfaces/openhouse.store.ts b/front-end/src/store/interfaces/openhouse.store.ts
index 92033621f..b598418a7 100644
--- a/front-end/src/store/interfaces/openhouse.store.ts
+++ b/front-end/src/store/interfaces/openhouse.store.ts
@@ -24,5 +24,4 @@ export interface OpenHouse {
 	}[];
 	description: string;
 	project: string;
-	files: string;
 }
diff --git a/front-end/src/store/modules/course.store.ts b/front-end/src/store/modules/course.store.ts
index 42b12f9e1..67641f042 100644
--- a/front-end/src/store/modules/course.store.ts
+++ b/front-end/src/store/modules/course.store.ts
@@ -22,26 +22,10 @@ export const useCoursStore = defineStore('course', {
 					project: [],
 					site: '',
 					teacherId: '',
-					files: '',
 				},
 			],
-			oneItems: {
-				_id: '',
-				tag: '',
-				classTag: '',
-				picture: '',
-				language: '',
-				createdAt: null,
-				periodStart: null,
-				periodEnd: null,
-				presence: [],
-				project: [],
-				site: '',
-				teacherId: '',
-				files: '',
-			},
+			oneItems: {},
 			idCourses: '',
-			//uploadedFiles: [],
 		};
 	},
 	actions: {
@@ -54,16 +38,18 @@ export const useCoursStore = defineStore('course', {
 		}),
 		getCourseById: withErrorHandler(async function (id: string) {
 			const response = await getCoursesById(id);
-			this.oneItems = response.data;
-			console.log(this.oneItems);
+			this.oneItems = response.data.courseById;
 			return true;
 		}),
 		addCourse: withErrorHandler(async function (this: CoursesStore, course: Course) {
 			const res = await createCourse(course);
-			console.log(res.data);
 			if (res.status !== 200) return false;
 			this.items.push(res.data);
 			return true;
 		}),
+		async getAllCourses(this: CoursesStore) {
+			const resp = await tryGetAllCourses();
+			if (resp.status === 200) this.allCourses = resp.data.courses;
+		},
 	},
 });
diff --git a/front-end/src/store/modules/openHouse.store.ts b/front-end/src/store/modules/openHouse.store.ts
index 21db7a245..21616c3b9 100644
--- a/front-end/src/store/modules/openHouse.store.ts
+++ b/front-end/src/store/modules/openHouse.store.ts
@@ -33,7 +33,6 @@ export const useOpenHouseStore = defineStore('openhouse', {
 					],
 					description: '',
 					project: '',
-					files: '',
 				},
 			],
 			oneItems: {
@@ -62,7 +61,6 @@ export const useOpenHouseStore = defineStore('openhouse', {
 				],
 				description: '',
 				project: '',
-				files: '',
 			},
 			idOpenHouse: '',
 		};

From 57ea88041eddb5ae59cd246ada32d3e4f855ee7b Mon Sep 17 00:00:00 2001
From: ThomasCast3 <91255859+ThomasCast3@users.noreply.github.com>
Date: Fri, 16 Jun 2023 10:36:38 +0200
Subject: [PATCH 16/24] debut ajout pdf

---
 .../RessourcesComponents/AddCourse.vue        | 50 +++++++++++++++----
 1 file changed, 39 insertions(+), 11 deletions(-)

diff --git a/front-end/src/components/RessourcesComponents/AddCourse.vue b/front-end/src/components/RessourcesComponents/AddCourse.vue
index 610db558b..c22430ab2 100644
--- a/front-end/src/components/RessourcesComponents/AddCourse.vue
+++ b/front-end/src/components/RessourcesComponents/AddCourse.vue
@@ -7,16 +7,21 @@
 			</h3>
 			<div class="modal-body">
 				<form class="w-full max-w-sm">
-					<input type="text" name="title" v-model="this.tag" placeholder="Title :" /><br />
-					<input type="datetime-local" class="text-field" v-model="this.periodStart" /><br />
-					<input type="datetime-local" class="text-field" v-model="this.periodEnd" /><br />
-					<input type="url" placeholder="picture link" v-model="this.picture" /><br />
-					<input
-						type="text"
-						name="language"
-						v-model="this.language"
-						placeholder="Language :"
-					/><br />
+					<input type="text" name="title" v-model="tag" placeholder="Title :" /><br />
+					<VueDatePicker
+						placeholder="debut"
+						v-model="periodStart"
+						:format="dateFormat"
+						:language="datePickerLanguage"
+					/>
+					<VueDatePicker
+						placeholder="fin"
+						v-model="periodEnd"
+						:format="dateFormat"
+						:language="datePickerLanguage"
+					/>
+					<input type="url" placeholder="picture link" v-model="picture" /><br />
+					<input type="text" name="language" v-model="language" placeholder="Language :" /><br />
 					<div class="flex justify-center mt-6">
 						<button
 							class="px-4 py-2 text-white bg-blue-500 rounded-lg hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50"
@@ -41,6 +46,8 @@
 
 <script lang="ts">
 import { useCoursStore } from '@/store/modules/course.store';
+import VueDatePicker from '@vuepic/vue-datepicker';
+import Swal from 'sweetalert2';
 
 export default {
 	name: 'AddCourses',
@@ -57,11 +64,17 @@ export default {
 			project: [],
 			site: '',
 			teacherId: '',
+			dateFormat: 'yyyy-MM-dd HH:mm',
+			datePickerLanguage: 'fr', // Langue du date picker
+			selectedFile: null,
+			base64String: '',
 		};
 	},
 	methods: {
-		AddCourses() {
+		AddCourses(event) {
 			const course = useCoursStore();
+
+
 			this.newCourse = {
 				tag: this.tag,
 				classTag: '',
@@ -77,6 +90,21 @@ export default {
 			};
 			course.addCourse(this.newCourse);
 		},
+		onFileSelected(event) {
+			this.selectedFile = event.target.files[0];
+			this.convertToBase64();
+		},
+
+		convertToBase64() {
+			if (this.selectedFile) {
+				const reader = new FileReader();
+				reader.onload = (event) => {
+					let result = event.target.result;
+					this.base64String = result.toString();
+				};
+				reader.readAsDataURL(this.selectedFile);
+			}
+		},
 	},
 };
 </script>

From 8f7dd4fcdd6544f4d1e0fd7d89bb3d83cfbe50bd Mon Sep 17 00:00:00 2001
From: ThomasCast3 <91255859+ThomasCast3@users.noreply.github.com>
Date: Fri, 16 Jun 2023 10:48:03 +0200
Subject: [PATCH 17/24] Revert "debut ajout pdf"

This reverts commit 57ea88041eddb5ae59cd246ada32d3e4f855ee7b.
---
 .../RessourcesComponents/AddCourse.vue        | 50 ++++---------------
 1 file changed, 11 insertions(+), 39 deletions(-)

diff --git a/front-end/src/components/RessourcesComponents/AddCourse.vue b/front-end/src/components/RessourcesComponents/AddCourse.vue
index c22430ab2..610db558b 100644
--- a/front-end/src/components/RessourcesComponents/AddCourse.vue
+++ b/front-end/src/components/RessourcesComponents/AddCourse.vue
@@ -7,21 +7,16 @@
 			</h3>
 			<div class="modal-body">
 				<form class="w-full max-w-sm">
-					<input type="text" name="title" v-model="tag" placeholder="Title :" /><br />
-					<VueDatePicker
-						placeholder="debut"
-						v-model="periodStart"
-						:format="dateFormat"
-						:language="datePickerLanguage"
-					/>
-					<VueDatePicker
-						placeholder="fin"
-						v-model="periodEnd"
-						:format="dateFormat"
-						:language="datePickerLanguage"
-					/>
-					<input type="url" placeholder="picture link" v-model="picture" /><br />
-					<input type="text" name="language" v-model="language" placeholder="Language :" /><br />
+					<input type="text" name="title" v-model="this.tag" placeholder="Title :" /><br />
+					<input type="datetime-local" class="text-field" v-model="this.periodStart" /><br />
+					<input type="datetime-local" class="text-field" v-model="this.periodEnd" /><br />
+					<input type="url" placeholder="picture link" v-model="this.picture" /><br />
+					<input
+						type="text"
+						name="language"
+						v-model="this.language"
+						placeholder="Language :"
+					/><br />
 					<div class="flex justify-center mt-6">
 						<button
 							class="px-4 py-2 text-white bg-blue-500 rounded-lg hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50"
@@ -46,8 +41,6 @@
 
 <script lang="ts">
 import { useCoursStore } from '@/store/modules/course.store';
-import VueDatePicker from '@vuepic/vue-datepicker';
-import Swal from 'sweetalert2';
 
 export default {
 	name: 'AddCourses',
@@ -64,17 +57,11 @@ export default {
 			project: [],
 			site: '',
 			teacherId: '',
-			dateFormat: 'yyyy-MM-dd HH:mm',
-			datePickerLanguage: 'fr', // Langue du date picker
-			selectedFile: null,
-			base64String: '',
 		};
 	},
 	methods: {
-		AddCourses(event) {
+		AddCourses() {
 			const course = useCoursStore();
-
-
 			this.newCourse = {
 				tag: this.tag,
 				classTag: '',
@@ -90,21 +77,6 @@ export default {
 			};
 			course.addCourse(this.newCourse);
 		},
-		onFileSelected(event) {
-			this.selectedFile = event.target.files[0];
-			this.convertToBase64();
-		},
-
-		convertToBase64() {
-			if (this.selectedFile) {
-				const reader = new FileReader();
-				reader.onload = (event) => {
-					let result = event.target.result;
-					this.base64String = result.toString();
-				};
-				reader.readAsDataURL(this.selectedFile);
-			}
-		},
 	},
 };
 </script>

From 285b310f540e9dd0191eb4497e2a6f42ca56689b Mon Sep 17 00:00:00 2001
From: ThomasCast3 <91255859+ThomasCast3@users.noreply.github.com>
Date: Fri, 16 Jun 2023 10:52:12 +0200
Subject: [PATCH 18/24] Revert "Revert "debut ajout pdf""

This reverts commit 8f7dd4fcdd6544f4d1e0fd7d89bb3d83cfbe50bd.
---
 .../RessourcesComponents/AddCourse.vue        | 50 +++++++++++++++----
 1 file changed, 39 insertions(+), 11 deletions(-)

diff --git a/front-end/src/components/RessourcesComponents/AddCourse.vue b/front-end/src/components/RessourcesComponents/AddCourse.vue
index 610db558b..c22430ab2 100644
--- a/front-end/src/components/RessourcesComponents/AddCourse.vue
+++ b/front-end/src/components/RessourcesComponents/AddCourse.vue
@@ -7,16 +7,21 @@
 			</h3>
 			<div class="modal-body">
 				<form class="w-full max-w-sm">
-					<input type="text" name="title" v-model="this.tag" placeholder="Title :" /><br />
-					<input type="datetime-local" class="text-field" v-model="this.periodStart" /><br />
-					<input type="datetime-local" class="text-field" v-model="this.periodEnd" /><br />
-					<input type="url" placeholder="picture link" v-model="this.picture" /><br />
-					<input
-						type="text"
-						name="language"
-						v-model="this.language"
-						placeholder="Language :"
-					/><br />
+					<input type="text" name="title" v-model="tag" placeholder="Title :" /><br />
+					<VueDatePicker
+						placeholder="debut"
+						v-model="periodStart"
+						:format="dateFormat"
+						:language="datePickerLanguage"
+					/>
+					<VueDatePicker
+						placeholder="fin"
+						v-model="periodEnd"
+						:format="dateFormat"
+						:language="datePickerLanguage"
+					/>
+					<input type="url" placeholder="picture link" v-model="picture" /><br />
+					<input type="text" name="language" v-model="language" placeholder="Language :" /><br />
 					<div class="flex justify-center mt-6">
 						<button
 							class="px-4 py-2 text-white bg-blue-500 rounded-lg hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50"
@@ -41,6 +46,8 @@
 
 <script lang="ts">
 import { useCoursStore } from '@/store/modules/course.store';
+import VueDatePicker from '@vuepic/vue-datepicker';
+import Swal from 'sweetalert2';
 
 export default {
 	name: 'AddCourses',
@@ -57,11 +64,17 @@ export default {
 			project: [],
 			site: '',
 			teacherId: '',
+			dateFormat: 'yyyy-MM-dd HH:mm',
+			datePickerLanguage: 'fr', // Langue du date picker
+			selectedFile: null,
+			base64String: '',
 		};
 	},
 	methods: {
-		AddCourses() {
+		AddCourses(event) {
 			const course = useCoursStore();
+
+
 			this.newCourse = {
 				tag: this.tag,
 				classTag: '',
@@ -77,6 +90,21 @@ export default {
 			};
 			course.addCourse(this.newCourse);
 		},
+		onFileSelected(event) {
+			this.selectedFile = event.target.files[0];
+			this.convertToBase64();
+		},
+
+		convertToBase64() {
+			if (this.selectedFile) {
+				const reader = new FileReader();
+				reader.onload = (event) => {
+					let result = event.target.result;
+					this.base64String = result.toString();
+				};
+				reader.readAsDataURL(this.selectedFile);
+			}
+		},
 	},
 };
 </script>

From 1ffaa6ef6229b6f357d7075af0d01379191fb8f2 Mon Sep 17 00:00:00 2001
From: ThomasCast3 <91255859+ThomasCast3@users.noreply.github.com>
Date: Fri, 16 Jun 2023 10:55:57 +0200
Subject: [PATCH 19/24] ajout form cours

---
 .../RessourcesComponents/AddCourse.vue           | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/front-end/src/components/RessourcesComponents/AddCourse.vue b/front-end/src/components/RessourcesComponents/AddCourse.vue
index c22430ab2..b0a2bac8c 100644
--- a/front-end/src/components/RessourcesComponents/AddCourse.vue
+++ b/front-end/src/components/RessourcesComponents/AddCourse.vue
@@ -22,6 +22,7 @@
 					/>
 					<input type="url" placeholder="picture link" v-model="picture" /><br />
 					<input type="text" name="language" v-model="language" placeholder="Language :" /><br />
+					<input type="file" v-model="selectedFile" @change="onFileSelected" />
 					<div class="flex justify-center mt-6">
 						<button
 							class="px-4 py-2 text-white bg-blue-500 rounded-lg hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50"
@@ -72,8 +73,21 @@ export default {
 	},
 	methods: {
 		AddCourses(event) {
-			const course = useCoursStore();
+			event.preventDefault();
 
+			// Vérifier si tous les champs sont remplis
+			if (!this.tag || !this.periodStart || !this.periodEnd || !this.picture || !this.language) {
+				Swal.fire({
+					title: 'Vous devez remplir tous les champs',
+					text: 'Veuillez remplir tous les champs pour ajouter un nouveau cours',
+					icon: 'error',
+					confirmButtonColor: '#3085d6',
+					cancelButtonColor: '#d33',
+					confirmButtonText: 'OK',
+				});
+				return;
+			}
+			const course = useCoursStore();
 
 			this.newCourse = {
 				tag: this.tag,

From 7c8e849b8bc0f6fd61a87bd25c2e65fde73fef39 Mon Sep 17 00:00:00 2001
From: ThomasCast3 <91255859+ThomasCast3@users.noreply.github.com>
Date: Fri, 16 Jun 2023 10:58:56 +0200
Subject: [PATCH 20/24] form cours

---
 front-end/src/components/RessourcesComponents/AddCourse.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/front-end/src/components/RessourcesComponents/AddCourse.vue b/front-end/src/components/RessourcesComponents/AddCourse.vue
index b0a2bac8c..a496f8b93 100644
--- a/front-end/src/components/RessourcesComponents/AddCourse.vue
+++ b/front-end/src/components/RessourcesComponents/AddCourse.vue
@@ -22,7 +22,7 @@
 					/>
 					<input type="url" placeholder="picture link" v-model="picture" /><br />
 					<input type="text" name="language" v-model="language" placeholder="Language :" /><br />
-					<input type="file" v-model="selectedFile" @change="onFileSelected" />
+					<input type="file" id="file" ref="fileInput" @change="onFileSelected" />
 					<div class="flex justify-center mt-6">
 						<button
 							class="px-4 py-2 text-white bg-blue-500 rounded-lg hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50"
@@ -101,6 +101,7 @@ export default {
 				project: [],
 				site: '',
 				teacherId: '',
+				files: this.base64String,
 			};
 			course.addCourse(this.newCourse);
 		},

From 2a1c57d62d92363aabab700216ffc9feb501869d Mon Sep 17 00:00:00 2001
From: ThomasCast3 <91255859+ThomasCast3@users.noreply.github.com>
Date: Fri, 16 Jun 2023 11:04:58 +0200
Subject: [PATCH 21/24] fin form add course

---
 back-end/src/main.ts                             |  3 ++-
 .../RessourcesComponents/AddCourse.vue           | 16 +++++++++++++++-
 2 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/back-end/src/main.ts b/back-end/src/main.ts
index 7baa15f65..11c262c36 100644
--- a/back-end/src/main.ts
+++ b/back-end/src/main.ts
@@ -7,6 +7,7 @@ import { config } from 'src/config/config';
 
 import { AppModule } from 'src/app.module';
 import { corsOptionsDelegate } from 'src/config/cors';
+import * as bodyParser from 'body-parser';
 
 //! Proxy settings, production only
 // <NestExpressApplication>
@@ -27,7 +28,7 @@ async function bootstrap() {
 	);
 
 	app.use(cookieParser());
-
+	app.use(bodyParser.json({ limit: '50mb' }));
 	app.enableCors(corsOptionsDelegate);
 	//! versioning, production only
 	// app.enableVersioning({
diff --git a/front-end/src/components/RessourcesComponents/AddCourse.vue b/front-end/src/components/RessourcesComponents/AddCourse.vue
index a496f8b93..569569120 100644
--- a/front-end/src/components/RessourcesComponents/AddCourse.vue
+++ b/front-end/src/components/RessourcesComponents/AddCourse.vue
@@ -103,7 +103,21 @@ export default {
 				teacherId: '',
 				files: this.base64String,
 			};
-			course.addCourse(this.newCourse);
+
+			Swal.fire({
+				title: 'Votre cours a été ajouté',
+				icon: 'success',
+				confirmButtonColor: '#3085d6',
+				cancelButtonColor: '#d33',
+				confirmButtonText: 'OK',
+			}).then(async (result) => {
+				if (result.isConfirmed) {
+					// Ajouter le cours
+					course.addCourse(this.newCourse);
+				}
+			});
+			// Rediriger vers la page des cours
+			this.$emit('close');
 		},
 		onFileSelected(event) {
 			this.selectedFile = event.target.files[0];

From a374a47db5ebe50e5e1c72309fe97b88b09c45e8 Mon Sep 17 00:00:00 2001
From: ThomasCast3 <91255859+ThomasCast3@users.noreply.github.com>
Date: Fri, 16 Jun 2023 11:10:14 +0200
Subject: [PATCH 22/24] suggest language

---
 .../RessourcesComponents/AddCourse.vue        | 49 ++++++++++++++++++-
 .../components/RessourcesComponents/Cours.vue |  3 --
 2 files changed, 48 insertions(+), 4 deletions(-)

diff --git a/front-end/src/components/RessourcesComponents/AddCourse.vue b/front-end/src/components/RessourcesComponents/AddCourse.vue
index 569569120..6b9e1b05d 100644
--- a/front-end/src/components/RessourcesComponents/AddCourse.vue
+++ b/front-end/src/components/RessourcesComponents/AddCourse.vue
@@ -21,7 +21,19 @@
 						:language="datePickerLanguage"
 					/>
 					<input type="url" placeholder="picture link" v-model="picture" /><br />
-					<input type="text" name="language" v-model="language" placeholder="Language :" /><br />
+					<input
+						type="text"
+						name="language"
+						v-model="language"
+						placeholder="Language :"
+						@input="searchLanguage"
+						autocomplete="off"
+					/>
+					<ul v-if="showSuggest">
+						<li v-for="suggest in languageSuggest" :key="suggest" @click="selectSuggest(suggest)">
+							{{ suggest }}
+						</li>
+					</ul>
 					<input type="file" id="file" ref="fileInput" @change="onFileSelected" />
 					<div class="flex justify-center mt-6">
 						<button
@@ -134,6 +146,41 @@ export default {
 				reader.readAsDataURL(this.selectedFile);
 			}
 		},
+
+		searchLanguage() {
+			//recherche de toutes les matieres
+			this.showSuggest = true;
+			this.getAllTagCourse();
+			this.languageSuggest = [];
+			this.languages.forEach((element) => {
+				let alreadyInList = false;
+				if (element.toUpperCase().includes(this.language.toUpperCase()) && this.language != '') {
+					this.languageSuggest.forEach((languageInList) => {
+						if (languageInList == element.toUpperCase()) {
+							alreadyInList = true;
+						}
+					});
+					if (!alreadyInList) {
+						this.languageSuggest.push(element.toUpperCase());
+					}
+				}
+			});
+		},
+
+		getAllTagCourse() {
+			this.languages = []; //reset la list
+			const courseStore = useCoursStore();
+			const course = courseStore.items;
+			course.forEach((element) => {
+				if (!this.languages.includes(element.language)) {
+					this.languages.push(element.language);
+				}
+			});
+		},
+
+		selectSuggest(suggest) {
+			this.language = suggest;
+		},
 	},
 };
 </script>
diff --git a/front-end/src/components/RessourcesComponents/Cours.vue b/front-end/src/components/RessourcesComponents/Cours.vue
index 9ee87870e..9ac8327e3 100644
--- a/front-end/src/components/RessourcesComponents/Cours.vue
+++ b/front-end/src/components/RessourcesComponents/Cours.vue
@@ -1,8 +1,5 @@
 <template>
 	<div>
-		<div v-if="userRole === Roles.USER">
-			<h1>ELEVE</h1>
-		</div>
 		<div class="flex items-center justify-center">
 			<button
 				class="bg-blue-500 hover:bg-blue-700 font-bold py-2 px-4 rounded-full mr-4"

From 648f3ef96ed3d2658a1c3780154b3bc36340ecb7 Mon Sep 17 00:00:00 2001
From: ThomasCast3 <91255859+ThomasCast3@users.noreply.github.com>
Date: Fri, 16 Jun 2023 11:11:32 +0200
Subject: [PATCH 23/24] suggest langue

---
 front-end/src/components/RessourcesComponents/AddCourse.vue | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/front-end/src/components/RessourcesComponents/AddCourse.vue b/front-end/src/components/RessourcesComponents/AddCourse.vue
index 6b9e1b05d..57b0f23b0 100644
--- a/front-end/src/components/RessourcesComponents/AddCourse.vue
+++ b/front-end/src/components/RessourcesComponents/AddCourse.vue
@@ -77,6 +77,9 @@ export default {
 			project: [],
 			site: '',
 			teacherId: '',
+            languages: [],
+			languageSuggest: [],
+			showSuggest: false,
 			dateFormat: 'yyyy-MM-dd HH:mm',
 			datePickerLanguage: 'fr', // Langue du date picker
 			selectedFile: null,

From 8e633d8e882bbd668ebfb87bbbe8fc39dee14052 Mon Sep 17 00:00:00 2001
From: Baptiste Dumoulin <91154604+Ptitbapt@users.noreply.github.com>
Date: Fri, 16 Jun 2023 11:12:39 +0200
Subject: [PATCH 24/24] groupe projects

---
 .../RessourcesComponents/CoursDetails.vue     | 38 +++++++++++--------
 .../src/components/common/svg/Clipboard.vue   | 16 ++++++++
 2 files changed, 38 insertions(+), 16 deletions(-)
 create mode 100644 front-end/src/components/common/svg/Clipboard.vue

diff --git a/front-end/src/components/RessourcesComponents/CoursDetails.vue b/front-end/src/components/RessourcesComponents/CoursDetails.vue
index 5d466b124..b2f1ee194 100644
--- a/front-end/src/components/RessourcesComponents/CoursDetails.vue
+++ b/front-end/src/components/RessourcesComponents/CoursDetails.vue
@@ -42,28 +42,33 @@
 			</ul>
 			<h4 class="text-2xl font-bold mb-2 mt-3 border-b border-gray-300">Groupes</h4>
 			<ul class="space-y-4">
-				<li v-if="canvas.length > 0">
-					<div v-for="canva in canvas" :key="canva.id">
-						<button
-							class="flex items-center bg-gray-200 hover:bg-gray-300 text-gray-800 font-semibold py-2 px-4 rounded"
-						>
-							<Board class="mr-2" />
-							<span>{{ canva.meta.title }}</span>
-						</button>
-					</div>
+				<li v-for="(canva, index) in canvas" :key="canva.id">
+					<h2 class="text-xl font-semibold">Groupe {{ index + 1 }}</h2>
+					<button
+						@click="goToProject(canva)"
+						class="flex items-center bg-gray-200 hover:bg-gray-300 text-gray-800 font-semibold py-2 px-4 rounded"
+					>
+						<Board class="mr-2" />
+						<span>{{ canva.meta.title }}</span>
+					</button>
 				</li>
 			</ul>
 		</div>
 	</div>
 	<div class="flex w-full gap-4 justify-center mt-4">
 		<div class="contenu-cours" v-if="retro">
-			<h4 class="text-2xl font-bold mb-2 border-b border-gray-300">Contenu du cours</h4>
-			<button
-				@click="goToRetro(retro)"
-				class="gradiant left-4 bottom-0 md:bottom-[unset] bg-[#24292E] hover:bg-[#24292E99] shadow rounded-lg p-4"
-			>
-				{{ retro.title }}
-			</button>
+			<h4 class="text-2xl font-bold mb-2 border-b border-gray-300 text-gray-900 dark:text-white">
+				Contenu du cours
+			</h4>
+			<div class="flex justify-center">
+				<button
+					@click="goToRetro(retro)"
+					class="flex justify-center items-center bg-gray-200 hover:bg-gray-300 text-gray-800 font-semibold py-2 px-4 rounded"
+				>
+					<Clipboard class="mr-2" />
+					{{ retro.title }}
+				</button>
+			</div>
 		</div>
 	</div>
 </template>
@@ -72,6 +77,7 @@ import { computed, onMounted } from 'vue';
 import { useCoursStore } from '@/store/modules/course.store';
 import { useRouter } from 'vue-router';
 import Board from '@/components/common/svg/Board.vue';
+import Clipboard from '@/components/common/svg/Clipboard.vue';
 
 // get store
 const course = useCoursStore();
diff --git a/front-end/src/components/common/svg/Clipboard.vue b/front-end/src/components/common/svg/Clipboard.vue
new file mode 100644
index 000000000..7e5b5395c
--- /dev/null
+++ b/front-end/src/components/common/svg/Clipboard.vue
@@ -0,0 +1,16 @@
+<template>
+	<svg
+		xmlns="http://www.w3.org/2000/svg"
+		fill="none"
+		viewBox="0 0 24 24"
+		stroke-width="1.5"
+		stroke="currentColor"
+		class="w-6 h-6"
+	>
+		<path
+			stroke-linecap="round"
+			stroke-linejoin="round"
+			d="M8.25 7.5V6.108c0-1.135.845-2.098 1.976-2.192.373-.03.748-.057 1.123-.08M15.75 18H18a2.25 2.25 0 002.25-2.25V6.108c0-1.135-.845-2.098-1.976-2.192a48.424 48.424 0 00-1.123-.08M15.75 18.75v-1.875a3.375 3.375 0 00-3.375-3.375h-1.5a1.125 1.125 0 01-1.125-1.125v-1.5A3.375 3.375 0 006.375 7.5H5.25m11.9-3.664A2.251 2.251 0 0015 2.25h-1.5a2.251 2.251 0 00-2.15 1.586m5.8 0c.065.21.1.433.1.664v.75h-6V4.5c0-.231.035-.454.1-.664M6.75 7.5H4.875c-.621 0-1.125.504-1.125 1.125v12c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V16.5a9 9 0 00-9-9z"
+		/>
+	</svg>
+</template>