Giovanni/SAE-BUT2-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Convert Modal component to Typescript

Browse Source
This commit is contained in:
T'JAMPENS QUENTIN p2406187
2026-02-06 15:11:03 +01:00
parent d79f9f5c84
commit 3c992d5df7
15 changed files with 24 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Footer/Footer.jsx
+1 -1
View File
@@ -1,7 +1,7 @@
import styles from "./Footer.module.css"
import {Link} from "react-router";
import {useState} from "react";
import Modal from "../ui/modal/modal.jsx";
import Modal from "../ui/modal/modal.tsx";
import Button from "../ui/button/button.tsx";
import scrollToTop from "../../utils/scrollToTop.js";
src/components/createEventBtn/CreateEventBtn.jsx
+1 -1
View File
@@ -1,6 +1,6 @@
import styles from "./createEventBtn.module.css"
import { useState, useContext } from "react";
import Modal from "../ui/modal/modal.jsx";
import Modal from "../ui/modal/modal.tsx";
import Button from "../ui/button/button.tsx";
import TextInput from "../ui/input/input.tsx";
import { EventContext } from "../../contexts/events/EventContext.js";
src/components/ui/modal/modal.jsx → src/components/ui/modal/modal.tsx
+10 -3
View File
@@ -1,16 +1,23 @@
import { ReactNode, MouseEvent } from "react";
import { createPortal } from "react-dom";
import styles from "./modal.module.css";
import Button from "../button/button.tsx";
import Button from "../button/button";
const Modal = ({ open, onClose, children, title }) => {
interface ModalProps {
open: boolean;
onClose: () => void;
children: ReactNode;
title?: string;
}
const Modal = ({ open, onClose, children, title }: ModalProps) => {
if (!open) return null;
const handleOverlayClick = () => {
onClose();
};
const handleModalClick = (e) => {
const handleModalClick = (e: MouseEvent<HTMLDivElement>) => {
e.stopPropagation();
};
src/pages/Admin/components/pendingMembers/PendingMembers.jsx
+1 -1
View File
@@ -1,7 +1,7 @@
import React, {useState, useEffect} from "react";
import Button from "../../../../components/ui/button/button.tsx";
import styles from "./PendingMembers.module.css";
import Modal from "../../../../components/ui/modal/modal.jsx";
import Modal from "../../../../components/ui/modal/modal.tsx";
import getUserToValidate from "../../../../utils/users/getUserToValidate.js";
import getUserById from "../../../../utils/users/getUserById.js";
import validateUser from "../../../../utils/users/validateUser.js";
src/pages/Login/components/loginform/loginForm.jsx
+1 -1
View File
@@ -2,7 +2,7 @@ import { useState, useContext } from "react";
import styles from "./loginForm.module.css";
import Button from "../../../../components/ui/button/button.tsx";
import Input from "../../../../components/ui/input/input.tsx";
import Modal from "../../../../components/ui/modal/modal.jsx";
import Modal from "../../../../components/ui/modal/modal.tsx";
import { useNavigate } from "react-router";
import { AuthContext } from "../../../../contexts/auth/AuthContext.js";
src/pages/Profile/components/SettingsModal/SettingsModal.jsx
+1 -1
View File
@@ -1,4 +1,4 @@
import Modal from "../../../../components/ui/modal/modal.jsx";
import Modal from "../../../../components/ui/modal/modal.tsx";
import Button from "../../../../components/ui/button/button.tsx";
import styles from "./SettingsModal.module.css"
import { useContext, useState } from "react";
src/pages/Register/RegisterPage.jsx
+1 -1
View File
@@ -6,7 +6,7 @@ import {useContext, useEffect, useState} from "react";
import register from "../../utils/register.js";
import { useNavigate } from "react-router";
import { AuthContext } from "../../contexts/auth/AuthContext.js";
import Modal from "../../components/ui/modal/modal.jsx";
import Modal from "../../components/ui/modal/modal.tsx";
function RegisterPage() {
src/pages/VolunteerProfile/components/manageMember/ManageMember.jsx
+1 -1
View File
@@ -1,5 +1,5 @@
import Button from "../../../../components/ui/button/button.tsx";
import Modal from "../../../../components/ui/modal/modal.jsx";
import Modal from "../../../../components/ui/modal/modal.tsx";
import {useContext, useState} from "react";
import styles from "./manageMember.module.css"
import DeactivateMemberBtn from "./deactivateMember/deactivateMemberBtn.jsx";
src/pages/VolunteerProfile/components/manageMember/deactivateMember/deactivateMemberBtn.jsx
+1 -1
View File
@@ -1,5 +1,5 @@
import Button from "../../../../../components/ui/button/button.tsx";
import Modal from "../../../../../components/ui/modal/modal.jsx";
import Modal from "../../../../../components/ui/modal/modal.tsx";
import { useState } from "react";
import deactivateUser from "../../../../../utils/users/deactivateUser.js"
import { useNavigate } from "react-router";
src/pages/VolunteerProfile/components/manageMember/modifyrole/ModifyRole.jsx
+1 -1
View File
@@ -3,7 +3,7 @@ import Button from "../../../../../components/ui/button/button.tsx";
import modifyRole from "../../../../../utils/users/modifyRole.js";
import { useState, useEffect } from "react";
import getRoles from "../../../../../utils/getRoles.js";
import Modal from "../../../../../components/ui/modal/modal.jsx";
import Modal from "../../../../../components/ui/modal/modal.tsx";
export default function ModifyRole({ user }) {
src/pages/eventDetail/components/EventTask/EventTask.jsx
+1 -1
View File
@@ -5,7 +5,7 @@ import assign from "../../../../utils/tasks/assign.js";
import unAssign from "../../../../utils/tasks/unAssign.js";
import { useContext, useEffect, useState } from "react";
import isAssigned from "../../../../utils/tasks/isAssigned.js";
import Modal from "../../../../components/ui/modal/modal.jsx";
import Modal from "../../../../components/ui/modal/modal.tsx";
import { AuthContext } from "../../../../contexts/auth/AuthContext.js";
import DeleteTaskBtn from "../deleteTaskBtn/deleteTaskBtn.jsx";
src/pages/eventDetail/components/createTaskBtn/createTaskBtn.jsx
+1 -1
View File
@@ -2,7 +2,7 @@ import styles from "../../eventDetail.module.css";
import Button from "../../../../components/ui/button/button.tsx";
import {useContext, useState} from "react";
import TextInput from "../../../../components/ui/input/input.tsx";
import Modal from "../../../../components/ui/modal/modal.jsx";
import Modal from "../../../../components/ui/modal/modal.tsx";
import createTaskApi from "../../../../utils/tasks/createTask.js";
import {EventDetailContext} from "../../../../contexts/eventDetail/eventDetail.js";
src/pages/eventDetail/components/deleteEventBtn/deleteEventBtn.jsx
+1 -1
View File
@@ -1,6 +1,6 @@
import styles from "../../eventDetail.module.css";
import Button from "../../../../components/ui/button/button.tsx";
import Modal from "../../../../components/ui/modal/modal.jsx";
import Modal from "../../../../components/ui/modal/modal.tsx";
import { useContext, useState } from "react";
import { EventDetailContext } from "../../../../contexts/eventDetail/eventDetail.js";
import { EventContext } from "../../../../contexts/events/EventContext.js";
src/pages/eventDetail/components/deleteTaskBtn/deleteTaskBtn.jsx
+1 -1
View File
@@ -3,7 +3,7 @@ import { AuthContext } from "../../../../contexts/auth/AuthContext.js";
import { EventDetailContext } from "../../../../contexts/eventDetail/eventDetail.js";
import Button from "../../../../components/ui/button/button.tsx";
import { useState } from "react";
import Modal from "../../../../components/ui/modal/modal.jsx";
import Modal from "../../../../components/ui/modal/modal.tsx";
import styles from "../../eventDetail.module.css";
export default function DeleteTaskBtn({ taskId, eventId, taskName }) {
src/stories/Modal.stories.jsx
+1 -1
View File
@@ -1,4 +1,4 @@
import Modal from "../components/ui/modal/modal.jsx";
import Modal from "../components/ui/modal/modal.tsx";
import Button from "../components/ui/button/button.tsx";
import { useState } from "react";