add new request

app/Components/Alta/registerAlta.tsx

@@ -1,8 +1,30 @@
 "use client";
-import { useState } from "react";
+import axios from "axios";
+import { useEffect, useState } from "react";
 
 export default function RegisterAlta() {
+  const [listMajor, setListMajor] = useState([]);
   const [major, setMajor] = useState("");
+
+  useEffect(() => {
+    const fetchCarreras = async () => {
+      try {
+        const response = await axios.get(
+          "https://venus.acatlan.unam.mx/asignacionTiempo_test/carrera"
+        );
+
+        const sortedCarreras = response.data.sort((a: any, b: any) =>
+          a.carrera.localeCompare(b.carrera)
+        );
+
+        setListMajor(sortedCarreras);
+      } catch (error) {
+        console.error("Error al obtener carreras:", error);
+      }
+    };
+    fetchCarreras();
+  }, []);
+
   return (
     <form className="containerAlta gap gridAlta">
       <div className="containerForm">
@@ -59,6 +81,11 @@ export default function RegisterAlta() {
         <label className="label">Carrera</label>
         <select value={major} onChange={(e) => setMajor(e.target.value)}>
           <option value="">Selecciona la carrera</option>
+          {listMajor.map((carrera: any, index) => (
+            <option key={index} value={carrera.id_carrera}>
+              {carrera.carrera}
+            </option>
+          ))}
         </select>
       </div>
 

app/Components/Global/selectArea.tsx

@@ -0,0 +1,33 @@
+import axios from "axios";
+import { useEffect, useState } from "react";
+
+export default function selectArea() {
+  const [area, setArea] = useState([]);
+
+  useEffect(() => {
+    const fetchArea = async () => {
+      const response = await axios.get(
+        "https://venus.acatlan.unam.mx/asignacionTiempo_test/area-ubicacion"
+      );
+      setArea(response.data);
+    };
+
+    fetchArea();
+  });
+  return (
+    <>
+      <label className="label">Seleccione el área</label>
+      <select>
+        {area.map((area) => (
+          <option>{area}</option>
+        ))}
+        <option value="0">windows</option>
+        <option value="1">ADOBE CREATIVE SUITE</option>
+        <option value="2">mmmmm</option>
+        <option value="3">mmmmm</option>
+        <option value="4">mmmmm</option>
+        <option value="5">mmmmm</option>
+      </select>
+    </>
+  );
+}

app/Components/Receipt/Receipt.css

@@ -0,0 +1,24 @@
+.groupInformation {
+  display: flex;
+  max-width: 500px;
+  min-width: 40px;
+  width: 100%;
+  justify-content: end;
+  gap: 10px;
+}
+
+.informationButton {
+  text-align: center;
+  appearance: none;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  border: 1px solid #cfcfcf;
+  background-color: #fff;
+  max-width: 40px;
+  min-width: 40px;
+}
+
+.informationButton:hover {
+  border: 1px solid #cfcfcf;
+  background-color: #cfcfcf;
+}

app/Components/Receipt/Receipt.tsx

@@ -3,7 +3,7 @@
 import toast from "react-hot-toast";
 import { useState } from "react";
 import { PostReceipt } from "@/app/lib/postReceipt";
-import { useParams, usePathname, useRouter } from "next/navigation";
+import { useRouter } from "next/navigation";
 
 import "./Receipt.css";
 
@@ -13,8 +13,6 @@ interface ReceiptsProps {
 
 function Receipt({ numAcount }: ReceiptsProps) {
   const router = useRouter();
-  const path = usePathname();
-  console.log(path);
 
   const [folio, setFolio] = useState("");
   const [amount, setAmount] = useState("");
@@ -80,19 +78,25 @@ function Receipt({ numAcount }: ReceiptsProps) {
       <div className="gap">
         <div className="groupInput">
           <label className="label">Ticket:</label>
-          <input
-            type="text"
-            value={folio}
-            onChange={(error) => {
-              const value = error.target.value;
-              if (/^\d*$/.test(value) && value.length <= 7) {
-                setFolio(value);
-              }
-            }}
-            placeholder="Numero de tiket..."
-            inputMode="numeric"
-            pattern="[0-9]*"
-          />
+          <div className="groupInformation">
+            <input
+              type="text"
+              value={folio}
+              onChange={(error) => {
+                const value = error.target.value;
+                if (/^\d*$/.test(value) && value.length <= 7) {
+                  setFolio(value);
+                }
+              }}
+              placeholder="Numero de tiket..."
+              inputMode="numeric"
+              pattern="[0-9]*"
+            />
+            <select className="informationButton">
+              <option>7</option>
+              <option>8</option>
+            </select>
+          </div>
         </div>
 
         <div className="groupInput">

app/Components/auth/ChangePassword/changePassword.tsx

@@ -1,4 +1,5 @@
 "use client";
+import axios from "axios";
 import { useState } from "react";
 
 export default function ChangePassword() {
@@ -6,10 +7,14 @@ export default function ChangePassword() {
   const [newPass, setNewPass] = useState("");
   const [confirmNewPass, setconfirmNewPass] = useState("");
 
-  const handleChangePass = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleChangePass = async (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault;
     const data = { pass, newPass, confirmNewPass };
-    console.log(data);
+
+    await axios.post(
+      "https://venus.acatlan.unam.mx/asignacionTiempo_test/user/create",
+      data
+    );
   };
 
   return (

app/Components/layout/ToastProvider.tsx

@@ -12,6 +12,7 @@ export function ToastProvider({ children }: { children: React.ReactNode }) {
           style: {
             padding: "16px",
             fontSize: "16px",
+            maxWidth: "400px",
           },
 
           error: {
@@ -21,7 +22,7 @@ export function ToastProvider({ children }: { children: React.ReactNode }) {
               backgroundColor: "#fee2e2dd",
               color: "#000000ff",
               fontWeight: "600",
-              padding:"1.5rem"
+              padding: "1.5rem",
             },
           },
 
@@ -32,7 +33,7 @@ export function ToastProvider({ children }: { children: React.ReactNode }) {
               backgroundColor: "#d1fae5dd",
               color: "#000000ff",
               fontWeight: "600",
-              padding:"1.5rem"
+              padding: "1.5rem",
             },
           },
         }}