Skip to content

Commit 84bccb6

Browse files
MaxouTigrouMaxouTigrou
authored
Merge pull request #8 from ungdev/prod
Frontend update
2 parents 500f40a + 3ae2122 commit 84bccb6

File tree

12 files changed

+199
-97
lines changed

12 files changed

+199
-97
lines changed

‎backend/src/utils/emailtemplates.ts

+4-4
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ export const templateResetPassword = `
1111
</head>
1212
<body style="font-family: 'Comic Sans MS', 'Comic Sans', sans-serif; font-size: 12pt; margin: 0; padding: 0; background-color: #ffffff; text-align: center;">
1313
<div class="header">
14-
<img src="https://integration.utt.fr/ressources/logo_original.png" alt="Integration UTT Logo" style="width: 100px;">
14+
<img src="https://integration.utt.fr/img/logo_original.png" alt="Integration UTT Logo" style="width: 100px;">
1515
<h1 style="font-size: 21px; font-weight: bold; margin: 10px 0;">INTEGRATION UTT</h1>
1616
</div>
1717
<table width="100%" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse;">
@@ -105,7 +105,7 @@ export const templateNotebook = `
105105
<body>
106106
<div class="container">
107107
<div class="header">
108-
<img src="https://integration.utt.fr/ressources/logo_original.png" alt="Integration UTT Logo" style="width: 100px;">
108+
<img src="https://integration.utt.fr/img/logo_original.png" alt="Integration UTT Logo" style="width: 100px;">
109109
<h1 style="font-size: 21px; font-weight: bold; margin: 10px 0;">INTEGRATION UTT</h1>
110110
</div>
111111
<div class="content">
@@ -168,7 +168,7 @@ export const templateAttributionBus = `
168168
<table width="600" cellpadding="0" cellspacing="0" border="0" style="max-width: 100%; margin: 0 auto;">
169169
<tr>
170170
<td align="center" style="padding: 10px;">
171-
<img src="https://integration.utt.fr/ressources/logo_original.png" alt="Logo Comic" style="width: 18%; max-width: 104.4px; height: auto;">
171+
<img src="https://integration.utt.fr/img/logo_original.png" alt="Logo Comic" style="width: 18%; max-width: 104.4px; height: auto;">
172172
</td>
173173
</tr>
174174
<tr>
@@ -232,7 +232,7 @@ export const templateWelcome = `
232232
<table width="600" cellpadding="0" cellspacing="0" border="0" style="max-width: 100%; margin: 0 auto;">
233233
<tr>
234234
<td align="center" style="padding: 10px;">
235-
<img src="https://integration.utt.fr/ressources/logo_original.png" alt="Logo Comic" style="width: 18%; max-width: 104.4px; height: auto;">
235+
<img src="https://integration.utt.fr/img/logo_original.png" alt="Logo Comic" style="width: 18%; max-width: 104.4px; height: auto;">
236236
</td>
237237
</tr>
238238
<tr>

‎frontend/package-lock.json

+20
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎frontend/package.json

+1
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@
2929
"react-hook-form": "^7.55.0",
3030
"react-router-dom": "^7.5.0",
3131
"react-select": "^5.10.1",
32+
"swiper": "^11.2.6",
3233
"tailwind-merge": "^3.2.0",
3334
"tailwindcss": "^4.1.3",
3435
"tw-animate-css": "^1.2.5"

‎frontend/public/img/Home1.jpg

3.74 MB
Loading

‎frontend/public/img/Home2.jpg

2.73 MB
Loading

‎frontend/public/img/Home3.jpg

3.71 MB
Loading

‎frontend/public/img/Home4.jpg

943 KB
Loading

‎frontend/public/img/Photo.jpg

-2.88 MB
Binary file not shown.

‎frontend/src/components/home/infosSection.tsx

+76-25
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,86 @@
1-
// src/components/Welcome.tsx
1+
import { Swiper, SwiperSlide } from "swiper/react";
2+
import { Pagination, Autoplay } from "swiper/modules";
3+
import "swiper/swiper-bundle.css";
4+
25
export const Infos = () => {
36
return (
4-
<div className="container mx-auto my-10 px-4">
5-
<div className="flex flex-col lg:flex-row items-center gap-8">
6-
{/* Image */}
7-
<div className="w-full lg:w-1/2">
8-
<img
9-
src="/img/Photo.jpg"
10-
alt="Photo d'intégration"
11-
className="w-full h-auto rounded-lg shadow-md"
12-
/>
7+
<div className="w-full bg-white text-gray-800">
8+
{/* Hero Carousel */}
9+
<div className="relative w-full overflow-hidden">
10+
<Swiper
11+
modules={[Pagination, Autoplay]}
12+
spaceBetween={0}
13+
pagination={{ clickable: true }}
14+
autoplay={{ delay: 4000, disableOnInteraction: false }}
15+
loop={true}
16+
className="w-full"
17+
style={{ height: "100%", maxHeight: "600px" }}
18+
effect="fade" // Smooth transition de fond
19+
>
20+
{["Home1", "Home2", "Home3", "Home4"].map((img, i) => (
21+
<SwiperSlide key={i} className="relative">
22+
<img
23+
src={`/img/${img}.jpg`}
24+
alt={`Photo ${i + 1}`}
25+
className="w-full h-full object-cover transition-all duration-1000 ease-in-out"
26+
/>
27+
{/* Overlay sombre */}
28+
<div className="absolute inset-0 bg-gradient-to-t from-black/60 via-black/30 to-transparent z-10" />
29+
</SwiperSlide>
30+
))}
31+
</Swiper>
32+
33+
{/* Texte fixe qui reste par dessus le Swiper */}
34+
<div className="absolute inset-0 flex items-center justify-center z-20">
35+
<h1 className="text-white text-xl sm:text-3xl md:text-4xl lg:text-5xl font-bold text-center drop-shadow-xl px-4">
36+
Bienvenue à l'UTT !
37+
</h1>
38+
</div>
39+
40+
{/* SVG vague bas */}
41+
<div className="absolute bottom-0 w-full overflow-hidden leading-none">
42+
<svg
43+
viewBox="0 0 500 50"
44+
preserveAspectRatio="none"
45+
className="w-full h-10 lg:h-16 fill-white"
46+
>
47+
<path d="M0,0 C150,50 350,0 500,50 L500,00 L0,0 Z" />
48+
</svg>
1349
</div>
50+
</div>
51+
1452

15-
{/* Texte */}
16-
<div className="w-full lg:w-1/2 text-center lg:text-left">
17-
<h3 className="text-2xl font-semibold mb-4">L'intégration, c'est quoi ?</h3>
18-
<p className="text-lg mb-6">
19-
C'est l'événement où l'ensemble des étudiants de l'UTT se mobilise pour concocter aux nouveaux (comme toi) une incroyable semaine durant laquelle tu découvriras la vie sur le campus, rencontreras une tonne de nouveaux amis et démarreras ta nouvelle vie d'étudiant ! Le tout se fait dans la bonne humeur et avec bienveillance, l'objectif c'est juste de s'amuser à fond !
20-
</p>
53+
{/* Texte d'info */}
54+
<div className="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
55+
<div className="space-y-16">
56+
<section className="text-center lg:text-left">
57+
<h3 className="text-2xl sm:text-3xl md:text-4xl font-bold mb-6 text-blue-700">
58+
L'intégration, c'est quoi ?
59+
</h3>
60+
<p className="text-base sm:text-lg leading-relaxed text-gray-700 max-w-3xl mx-auto lg:mx-0">
61+
C'est l'événement où l'ensemble des étudiants de l'UTT se mobilise pour concocter aux nouveaux (comme toi) une incroyable semaine durant laquelle tu découvriras la vie sur le campus, rencontreras une tonne de nouveaux amis et démarreras ta nouvelle vie d'étudiant ! Le tout se fait dans la bonne humeur et avec bienveillance, l'objectif c'est juste de s'amuser à fond !
62+
</p>
63+
</section>
2164

22-
<h3 className="text-2xl font-semibold mb-4">La petite histoire</h3>
23-
<p className="text-lg mb-6">
24-
Chaque année, deux factions composées d'une multitude d'équipes s'affrontent. Le thème de cette année : <strong>Passé vs Futur</strong>.
25-
</p>
65+
<section className="text-center lg:text-left">
66+
<h3 className="text-2xl sm:text-3xl md:text-4xl font-bold mb-6 text-blue-700">
67+
La petite histoire
68+
</h3>
69+
<p className="text-base sm:text-lg leading-relaxed text-gray-700 max-w-3xl mx-auto lg:mx-0">
70+
Chaque année, deux factions composées d'une multitude d'équipes s'affrontent. Le thème de cette année : <strong>Vilains vs Justificers</strong>.
71+
</p>
72+
</section>
2673

27-
<h3 className="text-2xl font-semibold mb-4">Ce site, c'est quoi ?</h3>
28-
<p className="text-lg">
29-
C'est ici que tu trouveras toutes les informations nécessaires au déroulement de la semaine d'inté. Par exemple, tu pourras prendre ta place pour le WEI ou regarder quelle faction est la plus proche de la victoire.
30-
</p>
74+
<section className="text-center lg:text-left">
75+
<h3 className="text-2xl sm:text-3xl md:text-4xl font-bold mb-6 text-blue-700">
76+
Ce site, c'est quoi ?
77+
</h3>
78+
<p className="text-base sm:text-lg leading-relaxed text-gray-700 max-w-3xl mx-auto lg:mx-0">
79+
C'est ici que tu trouveras toutes les informations nécessaires au déroulement de la semaine d'inté. Par exemple, tu pourras prendre ta place pour le WEI ou regarder quelle faction est la plus proche de la victoire.
80+
</p>
81+
</section>
3182
</div>
3283
</div>
3384
</div>
3485
);
35-
};
86+
};

‎frontend/src/components/home/socialSection.tsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ export const SocialLinks = () => {
1111
<div className="flex flex-wrap justify-center gap-4">
1212
{/* Facebook */}
1313
<a
14-
href="https://www.facebook.com"
14+
href="https://www.facebook.com/bde.utt"
1515
target="_blank"
1616
rel="noopener noreferrer"
1717
className="px-6 py-2 bg-blue-600 text-white rounded-full hover:bg-blue-800 transition"
@@ -21,7 +21,7 @@ export const SocialLinks = () => {
2121

2222
{/* Instagram */}
2323
<a
24-
href="https://www.instagram.com"
24+
href="https://www.instagram.com/bdeutt/"
2525
target="_blank"
2626
rel="noopener noreferrer"
2727
className="px-6 py-2 bg-pink-600 text-white rounded-full hover:bg-pink-800 transition"
@@ -31,7 +31,7 @@ export const SocialLinks = () => {
3131

3232
{/* Twitter */}
3333
<a
34-
href="https://www.twitter.com"
34+
href="https://x.com/BDEUTT/"
3535
target="_blank"
3636
rel="noopener noreferrer"
3737
className="px-6 py-2 bg-blue-400 text-white rounded-full hover:bg-blue-600 transition"
@@ -41,7 +41,7 @@ export const SocialLinks = () => {
4141

4242
{/* LinkedIn */}
4343
<a
44-
href="https://www.linkedin.com"
44+
href="hhttps://www.linkedin.com/school/universit-de-technologie-de-troyes/"
4545
target="_blank"
4646
rel="noopener noreferrer"
4747
className="px-6 py-2 bg-blue-700 text-white rounded-full hover:bg-blue-900 transition"

‎frontend/src/components/shotgun/preregisterSection.tsx

+47-41
Original file line numberDiff line numberDiff line change
@@ -4,93 +4,95 @@ import { Button } from "../ui/button";
44
import { Input } from "../ui/input";
55
import { checkPreRegisterStatus } from "../../services/requests/event.service";
66
import { getUsers } from "../../services/requests/user.service";
7-
import Select from "react-select"; // Importer react-select
7+
import Select from "react-select";
88

99
export const TeamRegistration = () => {
10-
const [teamName, setTeamName] = useState(""); // Nom de l'équipe
11-
const [members, setMembers] = useState<string[]>([]); // Membres sélectionnés en tant que chaîne de caractères (ID)
12-
const [isPreRegistrationOpen, setIsPreRegistrationOpen] = useState(false); // Statut de la pré-inscription
13-
const [users, setUsers] = useState<{ userId: number, firstName: string, lastName: string }[]>([]); // Liste des utilisateurs
10+
const [teamName, setTeamName] = useState("");
11+
const [members, setMembers] = useState<string[]>([]);
12+
const [isPreRegistrationOpen, setIsPreRegistrationOpen] = useState(false);
13+
const [users, setUsers] = useState<{ userId: number; firstName: string; lastName: string }[]>([]);
1414

15-
// Récupérer le statut de la pré-inscription
1615
useEffect(() => {
1716
const fetchStatus = async () => {
1817
try {
1918
const status = await checkPreRegisterStatus();
20-
setIsPreRegistrationOpen(status); // Mettre à jour l'état en fonction du statut
19+
setIsPreRegistrationOpen(status);
2120
} catch (error) {
2221
alert("Erreur lors de la récupération du statut de pré-inscription.");
2322
}
2423
};
2524
fetchStatus();
2625
}, []);
2726

28-
// Récupérer la liste des utilisateurs
2927
useEffect(() => {
3028
const fetchUsers = async () => {
3129
try {
32-
const userList = await getUsers(); // Récupère les utilisateurs
33-
setUsers(userList); // Met à jour la liste des utilisateurs
30+
const userList = await getUsers();
31+
setUsers(userList);
3432
} catch (error) {
3533
alert("Erreur lors de la récupération des utilisateurs.");
3634
}
3735
};
3836
fetchUsers();
3937
}, []);
4038

41-
// Gérer l'enregistrement de l'équipe
4239
const handleSubmit = async (e: React.FormEvent) => {
4340
e.preventDefault();
44-
45-
// Convertir les membres en un tableau de nombres avant de les envoyer
46-
const memberIds = members.map((id) => parseInt(id)); // Convertir chaque ID en nombre
41+
const memberIds = members.map((id) => parseInt(id));
4742

4843
try {
49-
const response = await createTeam(teamName, memberIds); // Appeler l'API pour créer l'équipe
44+
const response = await createTeam(teamName, memberIds);
5045
alert(response.message);
51-
} catch (error : any) {
46+
} catch (error: any) {
5247
alert(error.response.data.message);
5348
}
5449
};
5550

56-
// Préparer les options de `react-select` (utilisateurs)
57-
const userOptions = users.map(user => ({
58-
value: user.userId.toString(), // ID de l'utilisateur comme valeur (en string)
59-
label: `${user.firstName} ${user.lastName}`, // Affichage du nom complet
51+
const userOptions = users.map((user) => ({
52+
value: user.userId.toString(),
53+
label: `${user.firstName} ${user.lastName}`,
6054
}));
6155

62-
// Gérer la sélection des membres dans react-select
6356
const handleSelectChange = (selectedOptions: any) => {
6457
setMembers(selectedOptions ? selectedOptions.map((option: any) => option.value) : []);
6558
};
6659

6760
return (
68-
<div className="max-w-4xl mx-auto p-8 bg-gradient-to-r from-blue-100 via-blue-200 to-blue-300 rounded-xl shadow-lg">
69-
<h2 className="text-2xl font-bold mb-6 text-center text-gray-800">Pré-inscription de l'équipe</h2>
61+
<div className="max-w-4xl mx-auto p-6 sm:p-8 bg-gradient-to-r from-blue-100 via-blue-200 to-blue-300 rounded-xl shadow-lg">
62+
<h2 className="text-2xl sm:text-3xl font-bold mb-4 text-center text-gray-800">
63+
Pré-inscription de l'équipe
64+
</h2>
65+
66+
<p className="text-center text-sm sm:text-base text-gray-700 mb-6">
67+
📝 Donnez un nom <strong>inspiré d'une musique</strong> à votre équipe si possible !
68+
<br />
69+
(Ce nom est provisoire, c’est juste pour vous reconnaître lors du shotgun 🎯)
70+
</p>
7071

71-
{/* Afficher le formulaire uniquement si la pré-inscription est ouverte */}
7272
{isPreRegistrationOpen ? (
7373
<form onSubmit={handleSubmit} className="space-y-6">
74-
{/* Champ pour le nom de l'équipe */}
75-
<Input
76-
type="text"
77-
placeholder="Nom de l'équipe"
78-
value={teamName}
79-
onChange={(e) => setTeamName(e.target.value)}
80-
className="w-full p-4 border-2 border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 transition duration-300"
81-
/>
74+
<div>
75+
<Input
76+
type="text"
77+
placeholder="Nom de l'équipe (ex: Mary on a Cross)"
78+
value={teamName}
79+
onChange={(e) => setTeamName(e.target.value)}
80+
className="w-full p-4 border-2 border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 transition duration-300"
81+
/>
82+
</div>
8283

83-
{/* Sélection des membres avec react-select */}
8484
<div className="space-y-2">
85-
<label htmlFor="members" className="block text-lg text-gray-700">Sélectionner les membres de l'équipe :</label>
85+
<label htmlFor="members" className="block text-lg text-gray-700">
86+
Sélectionner les membres de l'équipe :
87+
</label>
8688
<Select
8789
id="members"
8890
isMulti
89-
options={userOptions} // Les options que nous avons préparées
90-
value={userOptions.filter(option => members.includes(option.value))} // Valeur des membres sélectionnés
91-
onChange={handleSelectChange} // Fonction de gestion du changement
91+
options={userOptions}
92+
value={userOptions.filter((option) => members.includes(option.value))}
93+
onChange={handleSelectChange}
9294
placeholder="Rechercher et sélectionner les membres"
93-
className="w-full p-2 border-2 border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500"
95+
className="w-full"
9496
styles={{
9597
control: (provided: any) => ({
9698
...provided,
@@ -113,13 +115,17 @@ export const TeamRegistration = () => {
113115
/>
114116
</div>
115117

116-
{/* Bouton pour enregistrer l'équipe */}
117-
<Button type="submit" className="w-full py-3 text-lg bg-blue-600 text-white rounded-lg shadow-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 transition duration-300">
118+
<Button
119+
type="submit"
120+
className="w-full py-3 text-lg bg-blue-600 text-white rounded-lg shadow-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 transition duration-300"
121+
>
118122
Enregistrer l'équipe
119123
</Button>
120124
</form>
121125
) : (
122-
<p className="text-center text-red-500 text-lg">La pré-inscription est actuellement fermée.</p>
126+
<p className="text-center text-red-500 text-lg">
127+
La pré-inscription est actuellement fermée.
128+
</p>
123129
)}
124130
</div>
125131
);

0 commit comments

Comments
 (0)