From 6f054bc70745adf6fa2f588e8c81f0038d59a7ab Mon Sep 17 00:00:00 2001
From: Mathis <mathis.balet@gmail.com>
Date: Thu, 10 Apr 2025 23:02:33 +0200
Subject: [PATCH] Responsivite admin page

---
 Front-end/src/pages/Admin/AdminObjet.jsx         | 12 ++++++------
 Front-end/src/pages/Admin/User.jsx               |  3 ---
 Front-end/src/pages/Gestion/ObjectManagement.jsx |  2 +-
 Front-end/src/pages/Login.jsx                    |  3 ++-
 Front-end/src/pages/Settings.jsx                 |  2 +-
 Front-end/src/pages/Signup.jsx                   |  7 ++++---
 6 files changed, 14 insertions(+), 15 deletions(-)

diff --git a/Front-end/src/pages/Admin/AdminObjet.jsx b/Front-end/src/pages/Admin/AdminObjet.jsx
index 05f1abd..8ad524b 100644
--- a/Front-end/src/pages/Admin/AdminObjet.jsx
+++ b/Front-end/src/pages/Admin/AdminObjet.jsx
@@ -146,16 +146,15 @@ function AdminObjet() {
           {/*Formulaire d'ajout d'objet*/}
           <FormNewObject isAdmin={true} />
 
-          {/* Tri des objets */}
           <section className="bg-white p-6 rounded-xl shadow-md mt-12 mb-12">
-            <div className="flex items-center justify-between mb-4">
+            <div className="flex flex-col md:flex-row md:items-center md:justify-between mb-4 gap-4">
               <h2 className="text-2xl font-semibold">
                 Liste des Objets et Outils/Services
               </h2>
               <select
                 value={sortCriteria}
                 onChange={(e) => setSortCriteria(e.target.value)}
-                className="border border-gray-300 rounded-lg p-2"
+                className="border border-gray-300 rounded-lg p-2 w-full md:w-auto"
               >
                 <option value="">-- Trier par --</option>
                 <option value="proprietaire">Propriétaire</option>
@@ -164,14 +163,15 @@ function AdminObjet() {
                 <option value="status">Status</option>
               </select>
             </div>
-            <div>
+
+            <div className="overflow-x-auto">
               <table className="min-w-full divide-y divide-gray-200">
                 <thead>
                   <tr>
                     <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                       Nom
                     </th>
-                    <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                    <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider w-48">
                       Description
                     </th>
                     <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
@@ -195,7 +195,7 @@ function AdminObjet() {
                       <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-900">
                         {obj.name}
                       </td>
-                      <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
+                      <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500 w-48 truncate">
                         {obj.description}
                       </td>
                       <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
diff --git a/Front-end/src/pages/Admin/User.jsx b/Front-end/src/pages/Admin/User.jsx
index 404c62b..9244805 100644
--- a/Front-end/src/pages/Admin/User.jsx
+++ b/Front-end/src/pages/Admin/User.jsx
@@ -182,7 +182,6 @@ function User() {
                   <td className={`${thTd}`}>{user.name}</td>
                   <td className={`${thTd}`}>{user.email}</td>
                   <td className={`${thTd}`}>
-                    {/* Menu déroulant pour changer le niveau d'accès */}
                     <select
                       value={user.role}
                       onChange={(e) =>
@@ -196,7 +195,6 @@ function User() {
                     </select>
                   </td>
                   <td className={`${thTd}`}>
-                    {/* Input et bouton pour ajuster les points */}
                     <input
                       className="border ml-4 w-16"
                       type="number"
@@ -217,7 +215,6 @@ function User() {
                     </button>
                   </td>
                   <td className={`${thTd}`}>
-                    {/* Bouton de suppression */}
                     <button
                       className="p-2 bg-red-600 text-white border-none rounded-md"
                       onClick={() => handleDeleteUser(user.id)}
diff --git a/Front-end/src/pages/Gestion/ObjectManagement.jsx b/Front-end/src/pages/Gestion/ObjectManagement.jsx
index a440258..22c6cc4 100644
--- a/Front-end/src/pages/Gestion/ObjectManagement.jsx
+++ b/Front-end/src/pages/Gestion/ObjectManagement.jsx
@@ -24,7 +24,7 @@ function ObjectManagement() {
   });
 
   useEffect(() => {
-    axios.get("http://localhost:8888/objets").then((response) => {
+    axios.get(`${API_BASE_URL}/objets`).then((response) => {
       setObjects(response.data);
     });
   }, []);
diff --git a/Front-end/src/pages/Login.jsx b/Front-end/src/pages/Login.jsx
index 5aab8e4..7885384 100644
--- a/Front-end/src/pages/Login.jsx
+++ b/Front-end/src/pages/Login.jsx
@@ -3,6 +3,7 @@ import { Mail, Lock } from 'lucide-react';
 import { useNavigate, Link } from 'react-router-dom';
 import axios from 'axios'; // Assurez-vous d'avoir axios importé
 import { useAuth } from '../AuthContext';
+import { API_BASE_URL } from "../config";
 
 function Login() {
   const [formData, setFormData] = useState({
@@ -24,7 +25,7 @@ function Login() {
     e.preventDefault();
 
     try {
-      const response = await fetch("http://localhost:8888/login", {
+      const response = await fetch(`${API_BASE_URL}/login`, {
         method: "POST",
         headers: {
           "Content-Type": "application/json",
diff --git a/Front-end/src/pages/Settings.jsx b/Front-end/src/pages/Settings.jsx
index b749a20..924a6b4 100644
--- a/Front-end/src/pages/Settings.jsx
+++ b/Front-end/src/pages/Settings.jsx
@@ -30,7 +30,7 @@ function Settings() {
     }
   
     try {
-      const response = await fetch("http://localhost:8888/settings", {
+      const response = await fetch(`${API_BASE_URL}/settings`, {
         method: "POST",
         headers: {
           "Content-Type": "application/json",
diff --git a/Front-end/src/pages/Signup.jsx b/Front-end/src/pages/Signup.jsx
index 595e7ec..d3b3eb3 100644
--- a/Front-end/src/pages/Signup.jsx
+++ b/Front-end/src/pages/Signup.jsx
@@ -1,6 +1,7 @@
 import React, { useState } from 'react';
 import { Mail, User, Lock } from 'lucide-react';
 import { useNavigate, Link} from 'react-router-dom'; // Importation du hook useNavigate
+import { API_BASE_URL } from "../config.js";
 
 function Signup() {
   const [formData, setFormData] = useState({
@@ -30,7 +31,7 @@ function Signup() {
     }
   
     try {
-      const response = await fetch("http://localhost:8888/signup", {
+      const response = await fetch(`${API_BASE_URL}/signup`, {
         method: "POST",
         headers: {
           "Content-Type": "application/json",
@@ -46,8 +47,8 @@ function Signup() {
   
       alert("Inscription réussie !");
       
-      // Redirection vers la page d'accueil après une inscription réussie
-      navigate("/home");  // Remplace "/home" par l'URL de ta page d'accueil
+
+      navigate("/");
     } catch (error) {
       alert(error.message);
     }