feat: changes

src/App.tsx

@@ -1,4 +1,3 @@
-import { useState } from "react";
 import "./App.css";
 import { BrowserRouter, Route, Routes } from "react-router-dom";
 import Navigation from "./component/Navigation/Navigation";

src/component/Navigation/Navigation.tsx

@@ -32,7 +32,7 @@ const Navigation: React.FC<NavigationProps> = ({
     localStorage.removeItem("root");
   };
 
-  const handleToggle = (e) => {
+  const handleToggle = () => {
     if (theme === "light") {
       setTheme("dark");
     } else {
@@ -49,7 +49,7 @@ const Navigation: React.FC<NavigationProps> = ({
     localStorage.setItem("theme", theme);
     const localTheme = localStorage.getItem("theme");
     document.querySelector("html").setAttribute("data-theme", localTheme);
-  }, [theme]);
+  }, [theme, navigate]);
 
   return (
     <>

src/pages/Dashboard.tsx

@@ -1,10 +1,11 @@
 import { useEffect, useState } from "react";
-import Card from "../component/Card/Card";
 import axios from "axios";
 import { Link } from "react-router-dom";
+import { Tp } from "../type/TpType";
 
 function Dashboard() {
   const [dashboard, setDashboard] = useState(null);
+  const username = localStorage.getItem("username");
   useEffect(() => {
     axios.get("/api/dashboard").then((res) => {
       setDashboard(res.data);
@@ -15,7 +16,9 @@ function Dashboard() {
     <>
       <section className="bg-blue-500 text-white py-16">
         <div className="container mx-auto text-center">
-          <h2 className="text-3xl font-bold">Welcome to La Banquise</h2>
+          <h2 className="text-3xl font-bold">
+            Welcome to La Banquise {username}
+          </h2>
           <p className="mt-4 text-lg">
             You will find here all of your instances and practicals
           </p>
@@ -29,7 +32,7 @@ function Dashboard() {
                 Practicals
               </h3>
               <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
-                {dashboard.tps.map((tp) => (
+                {dashboard.tps.map((tp: Tp) => (
                   <div
                     key={tp.id}
                     className="card card-compact bg-base-200 shadow-lg p-4"

src/pages/Login.tsx

@@ -25,7 +25,7 @@ const LoginPage: React.FC = () => {
           axios.get("/api/users/me").then((res) => {
             localStorage.setItem("username", res.data.username);
             if (res.data.roles.includes("root")) {
-              localStorage.setItem("root", true);
+              localStorage.setItem("root", "true");
             } else {
               localStorage.removeItem("root");
             }
@@ -35,7 +35,7 @@ const LoginPage: React.FC = () => {
       })
       .catch((response) => {
         if (response.status === 401) {
-          setError("wrong_user_pwd");
+          setError("Wrong user or password");
         }
       });
   };
@@ -44,11 +44,11 @@ const LoginPage: React.FC = () => {
     <div className="flex mt-20 justify-center items-center">
       <div className="card w-96 bg-base-100 shadow-xl">
         <div className="card-body">
-          <h2 className="card-title">{"login"}</h2>
+          <h2 className="card-title">Login</h2>
           <form onSubmit={handleSubmit}>
             <div className="form-control">
               <label className="label">
-                <span className="label-text">{"username"}</span>
+                <span className="label-text">Username</span>
               </label>
               <input
                 type="text"
@@ -63,7 +63,7 @@ const LoginPage: React.FC = () => {
 
             <div className="form-control mt-4">
               <label className="label">
-                <span className="label-text">{"password"}</span>
+                <span className="label-text">Password</span>
               </label>
               <input
                 type="password"

src/pages/Practical.tsx

@@ -3,10 +3,11 @@ import axios from "axios";
 import { useEffect, useState } from "react";
 import { useParams } from "react-router-dom";
 import { toast } from "react-toastify";
+import { Tp } from "../type/TpType";
 
 function Practical() {
   const { id } = useParams();
-  const [tp, setTp] = useState(null);
+  const [tp, setTp] = useState<Tp>();
 
   const copyText = (copy: string) => {
     navigator.clipboard.writeText(copy);

src/pages/admin/BulkCreateUser.tsx

@@ -1,15 +1,16 @@
 import axios from "axios";
 import { useEffect, useState } from "react";
 import { useNavigate } from "react-router-dom";
+import { User } from "../../type/UserType";
+import { Tp } from "../../type/TpType";
 
 function BulkUsers() {
-  const [file, setFile] = useState(null);
   const [userData, setUserData] = useState([]);
   const [practical, setPractical] = useState("0");
   const navigate = useNavigate();
   const [tps, setTps] = useState([]);
 
-  const handlePracticalChange = (e) => {
+  const handlePracticalChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
     setPractical(e.target.value);
   };
 
@@ -19,19 +20,14 @@ function BulkUsers() {
     });
   }, []);
 
-  const handleFileChange = (event) => {
+  const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {
     const selectedFile = event.target.files[0];
-    // if (selectedFile && selectedFile.type === "text/csv") {
-    setFile(selectedFile);
     parseCSV(selectedFile);
-    // } else {
-    //   alert("Please upload a valid CSV file.");
-    // }
   };
 
-  const parseCSV = (file) => {
+  const parseCSV = (file: File) => {
     const reader = new FileReader();
-    reader.onload = (event) => {
+    reader.onload = (event: ProgressEvent<FileReader>) => {
       const text = event.target.result;
       const rows = text.split("\n").map((row) => row.split(","));
       const formattedData = rows.map((row) => ({
@@ -71,7 +67,6 @@ function BulkUsers() {
               <tr>
                 <th>Name</th>
                 <th>Email</th>
-                {/* Add other headers as necessary */}
               </tr>
             </thead>
             <tbody>
@@ -91,11 +86,11 @@ function BulkUsers() {
         <select
           name="practical"
           value={practical}
-          onChange={handlePracticalChange}
+          onChange={() => handlePracticalChange}
           className="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
         >
           return <option value="0">Empty</option>;
-          {tps.map((tp) => {
+          {tps.map((tp: Tp) => {
             return <option value={tp.id}>{tp.name}</option>;
           })}
         </select>

src/pages/admin/CreateTp.tsx

@@ -14,14 +14,17 @@ function CreateTp() {
   });
   const navigate = useNavigate();
 
-  const handleInputChange = (e) => {
+  const handleInputChange = (
+    e: React.ChangeEvent<
+      HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement
+    >,
+  ) => {
     const { name, value } = e.target;
     setPractical({ ...practical, [name]: value });
   };
 
-  const handleSubmit = (e) => {
+  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
-    console.log("Practical created :", practical);
     axios.post("/api/tps", practical).then((res) => {
       if (res.status === 200) {
         navigate(`/tps/${res.data.id}`);