added clearParams

app/(private)/ActivosMantenimiento/page.tsx

@@ -2,6 +2,7 @@ import Areas from "@/app/Components/ActivosMantenimiento/Areas";
 import Mesas from "@/app/Components/ActivosMantenimiento/Mesas";
 import Equipos from "@/app/Components/Equipos/equipos";
 import AlertBox from "@/app/Components/Global/AlertBox/AlertBox";
+import ClearParams from "@/app/Components/Global/ClearParams/ClearParams";
 import SearchUser from "@/app/Components/Global/SearchUser/searchUser";
 import Toggle from "@/app/Components/Global/Toggle/Toggle";
 
@@ -21,11 +22,17 @@ export default async function Page(props: {
   return (
     <section className="containerSection">
       {showError && (
-        <AlertBox key={Date.now()} message={showError} type="error" />
+        <>
+          <AlertBox key={Date.now()} message={showError} type="error" />
+          <ClearParams paramsToClear={["error"]} />
+        </>
       )}
 
       {showSuccess && (
-        <AlertBox key={Date.now()} message={showSuccess} type="success" />
+        <>
+          <AlertBox key={Date.now()} message={showSuccess} type="success" />
+          <ClearParams paramsToClear={["success"]} />
+        </>
       )}
 
       <h2 className="title">EQUIPOS ACTIVOS Y EN MANTENIMIENTO</h2>

app/(private)/AgregarTiempo/page.tsx

@@ -6,6 +6,7 @@ import AlertBox from "@/app/Components/Global/AlertBox/AlertBox";
 import { GetStudent } from "@/app/lib/getStudent";
 
 import "./addTime.css";
+import ClearParams from "@/app/Components/Global/ClearParams/ClearParams";
 
 export default async function Page(props: {
   searchParams?: Promise<{
@@ -33,11 +34,17 @@ export default async function Page(props: {
   return (
     <section className="containerSection">
       {showError && (
-        <AlertBox key={Date.now()} message={showError} type="error" />
+        <>
+          <AlertBox key={Date.now()} message={showError} type="error" />
+          <ClearParams paramsToClear={["error"]} />
+        </>
       )}
 
       {showSuccess && (
-        <AlertBox message="Recibo guardado correctamente" type="success" />
+        <>
+          <AlertBox message="Recibo guardado correctamente" type="success" />
+          <ClearParams paramsToClear={["success"]} />
+        </>
       )}
 
       <h2 className="title"> AGREGAR TIEMPO </h2>
@@ -49,7 +56,7 @@ export default async function Page(props: {
           <Information NoCuenta={student.id_cuenta} Nombre={student.nombre} />
 
           <div className="addTime">
-            <Receipt urlBase={"/AgregarTiempo"} numAcount={student.id_cuenta} />
+            <Receipt numAcount={student.id_cuenta} />
           </div>
         </>
       ) : (

app/(private)/Alta/page.tsx

@@ -2,6 +2,7 @@ import AlertBox from "@/app/Components/Global/AlertBox/AlertBox";
 import RegisterAlta from "@/app/Components/Alta/registerAlta";
 
 import "./style.css";
+import ClearParams from "@/app/Components/Global/ClearParams/ClearParams";
 
 export default async function Page(props: {
   searchParams?: Promise<{
@@ -16,11 +17,17 @@ export default async function Page(props: {
   return (
     <section className="containerSection">
       {showError && (
-        <AlertBox key={Date.now()} message={showError} type="error" />
+        <>
+          <AlertBox key={Date.now()} message={showError} type="error" />
+          <ClearParams paramsToClear={["error"]} />
+        </>
       )}
 
       {showSuccess && (
-        <AlertBox key={Date.now()} message={showSuccess} type="success" />
+        <>
+          <AlertBox key={Date.now()} message={showSuccess} type="success" />
+          <ClearParams paramsToClear={["success"]} />
+        </>
       )}
 
       <h1 className="title">ALTA</h1>

app/(private)/AsignacionEquipo/page.tsx

@@ -1,4 +1,5 @@
 import AlertBox from "@/app/Components/Global/AlertBox/AlertBox";
+import ClearParams from "@/app/Components/Global/ClearParams/ClearParams";
 import SearchUser from "@/app/Components/Global/SearchUser/searchUser";
 import Toggle from "@/app/Components/Global/Toggle/Toggle";
 
@@ -19,11 +20,17 @@ export default async function Page(props: {
   return (
     <section className="containerSection">
       {showError && (
-        <AlertBox key={Date.now()} message={showError} type="error" />
+        <>
+          <AlertBox key={Date.now()} message={showError} type="error" />
+          <ClearParams paramsToClear={["error"]} />
+        </>
       )}
 
       {showSuccess && (
-        <AlertBox key={Date.now()} message={showSuccess} type="success" />
+        <>
+          <AlertBox key={Date.now()} message={showSuccess} type="success" />
+          <ClearParams paramsToClear={["success"]} />
+        </>
       )}
       
       <h2 className="title"> ASIGNACION DE EQUIPOS </h2>

app/(private)/BitacoraSanciones/page.tsx

@@ -5,6 +5,7 @@ import Sanciones from "@/app/Components/BitacoraSanciones/Sanciones";
 import Toggle from "@/app/Components/Global/Toggle/Toggle";
 import AlertBox from "@/app/Components/Global/AlertBox/AlertBox";
 import { GetStudent } from "@/app/lib/getStudent";
+import ClearParams from "@/app/Components/Global/ClearParams/ClearParams";
 
 export default async function Page(props: {
   searchParams?: Promise<{
@@ -34,11 +35,17 @@ export default async function Page(props: {
   return (
     <section className="containerSection">
       {showError && (
-        <AlertBox key={Date.now()} message={showError} type="error" />
+        <>
+          <AlertBox key={Date.now()} message={showError} type="error" />
+          <ClearParams paramsToClear={["error"]} />
+        </>
       )}
 
       {showSuccess && (
-        <AlertBox key={Date.now()} message={showSuccess} type="success" />
+        <>
+          <AlertBox key={Date.now()} message={showSuccess} type="success" />
+          <ClearParams paramsToClear={["success"]} />
+        </>
       )}
       
       <h2 className="title"> BITACORA Y SANCIONES </h2>

app/(private)/CambiarPass/page.tsx

@@ -1,5 +1,6 @@
 import ChangePassword from "@/app/Components/auth/ChangePassword/changePassword";
 import AlertBox from "@/app/Components/Global/AlertBox/AlertBox";
+import ClearParams from "@/app/Components/Global/ClearParams/ClearParams";
 
 export default async function Page(props: {
   searchParams?: Promise<{
@@ -14,11 +15,17 @@ export default async function Page(props: {
   return (
     <section className="containerSection">
       {showError && (
-        <AlertBox key={Date.now()} message={showError} type="error" />
+        <>
+          <AlertBox key={Date.now()} message={showError} type="error" />
+          <ClearParams paramsToClear={["error"]} />
+        </>
       )}
 
       {showSuccess && (
-        <AlertBox key={Date.now()} message={showSuccess} type="success" />
+        <>
+          <AlertBox key={Date.now()} message={showSuccess} type="success" />
+          <ClearParams paramsToClear={["success"]} />
+        </>
       )}
       
       <h2 className="title"> Cambiar contraseña </h2>

app/(private)/Impresiones/page.tsx

@@ -7,6 +7,7 @@ import Impressions from "@/app/Components/Impressions/impressions";
 import { GetStudent } from "@/app/lib/getStudent";
 
 import "@/app/globals.css";
+import ClearParams from "@/app/Components/Global/ClearParams/ClearParams";
 
 export default async function Page(props: {
   searchParams?: Promise<{
@@ -36,11 +37,17 @@ export default async function Page(props: {
   return (
     <section className="containerSection">
       {showError && (
-        <AlertBox key={Date.now()} message={showError} type="error" />
+        <>
+          <AlertBox key={Date.now()} message={showError} type="error" />
+          <ClearParams paramsToClear={["error"]} />
+        </>
       )}
 
       {showSuccess && (
-        <AlertBox key={Date.now()} message={showSuccess} type="success" />
+        <>
+          <AlertBox key={Date.now()} message={showSuccess} type="success" />
+          <ClearParams paramsToClear={["success"]} />
+        </>
       )}
 
       <h2 className="title">IMPRESIONES Y PLOTEO</h2>
@@ -61,12 +68,7 @@ export default async function Page(props: {
               {
                 key: "Recibo",
                 label: "Recibo",
-                content: (
-                  <Receipt
-                    urlBase="/Impresiones"
-                    numAcount={student.id_cuenta}
-                  />
-                ),
+                content: <Receipt numAcount={student.id_cuenta} />,
               },
               {
                 key: "B/N",

app/(private)/InformacionEquipo/page.tsx

@@ -4,6 +4,7 @@ import AlertBox from "@/app/Components/Global/AlertBox/AlertBox";
 import ProgramSelector from "@/app/Components/InformacionEquipos/ProgramSelector";
 
 import "./informacionequipo.css";
+import ClearParams from "@/app/Components/Global/ClearParams/ClearParams";
 
 export default async function Page(props: {
   searchParams?: Promise<{
@@ -20,11 +21,17 @@ export default async function Page(props: {
   return (
     <section className="containerSection">
       {showError && (
-        <AlertBox key={Date.now()} message={showError} type="error" />
+        <>
+          <AlertBox key={Date.now()} message={showError} type="error" />
+          <ClearParams paramsToClear={["error"]} />
+        </>
       )}
 
       {showSuccess && (
-        <AlertBox key={Date.now()} message={showSuccess} type="success" />
+        <>
+          <AlertBox key={Date.now()} message={showSuccess} type="success" />
+          <ClearParams paramsToClear={["success"]} />
+        </>
       )}
 
       <h2 className="title"> INFORMACION DE EQUIPOS </h2>

app/(private)/Inscripcion/inscripcion.css

@@ -0,0 +1,9 @@
+.inscripcion{
+    background-color: #f9f9f9;
+    width: 100%;
+    max-width: 700px;
+    border-radius: 4px;
+    padding: 1rem;
+    margin-top: 1rem;
+    outline: 1px solid #cfcfcf;
+}

app/(private)/Inscripcion/page.tsx

@@ -1,12 +1,12 @@
 import SearchUser from "@/app/Components/Global/SearchUser/searchUser";
 import Information from "@/app/Components/Global/Information/information";
-import StepNavigator from "@/app/Components/Global/StepNavigator/StepNavigator";
 import Receipt from "@/app/Components/Receipt/Receipt";
 import Selection from "@/app/Components/Selection/Selection";
 import AlertBox from "@/app/Components/Global/AlertBox/AlertBox";
+import ClearParams from "@/app/Components/Global/ClearParams/ClearParams";
 import { GetStudent } from "@/app/lib/getStudent";
 
-import "./inscriptions.css";
+import "./inscripcion.css";
 
 export default async function Page(props: {
   searchParams?: Promise<{
@@ -34,18 +34,24 @@ export default async function Page(props: {
   return (
     <section className="containerSection">
       {showError && (
-        <AlertBox key={Date.now()} message={showError} type="error" />
+        <>
+          <AlertBox key={Date.now()} message={showError} type="error" />
+          <ClearParams paramsToClear={["error"]} />
+        </>
       )}
 
       {showSuccess && (
-        <AlertBox key={Date.now()} message={showSuccess} type="success" />
+        <>
+          <AlertBox key={Date.now()} message={showSuccess} type="success" />
+          <ClearParams paramsToClear={["success"]} />
+        </>
       )}
 
       <h2 className="title"> INSCRIPCION </h2>
 
       <SearchUser urlBase="Inscripcion" value={numAcount} />
 
-      {student ? (
+      {student && (
         <>
           <Information
             NoCuenta={student.id_cuenta}
@@ -53,14 +59,11 @@ export default async function Page(props: {
             Carrera={student.carrera.carrera}
             Credito={student.credito}
           />
-
-          <StepNavigator totalSteps={2}>
+          <section className="inscripcion">
             <Selection />
-            <Receipt urlBase={"Inscripcion"} numAcount={student.id_cuenta} />
-          </StepNavigator>
+            <Receipt numAcount={student.id_cuenta} />
+          </section>
         </>
-      ) : (
-        <></>
       )}
     </section>
   );

app/(private)/Inscritos/page.tsx

@@ -1,3 +1,5 @@
+import AlertBox from "@/app/Components/Global/AlertBox/AlertBox";
+import ClearParams from "@/app/Components/Global/ClearParams/ClearParams";
 
 export default async function Page(props: {
   searchParams?: Promise<{
@@ -12,14 +14,26 @@ export default async function Page(props: {
   const showError = params?.error ? params.error : null;
 
   return (
-    <section className='containerSection'>
-      <h2 className='title'> INSCRITOS </h2>
+    <section className="containerSection">
+      {showError && (
+        <>
+          <AlertBox key={Date.now()} message={showError} type="error" />
+          <ClearParams paramsToClear={["error"]} />
+        </>
+      )}
+
+      {showSuccess && (
+        <>
+          <AlertBox key={Date.now()} message={showSuccess} type="success" />
+          <ClearParams paramsToClear={["success"]} />
+        </>
+      )}
+      <h2 className="title"> INSCRITOS </h2>
 
       <form className="containerForm">
         <label>Seleccione el periodo</label>
         <div className="groupInput">
-          <select
-          >
+          <select>
             <option value="">-- Seleccione el periodo --</option>
             <option value="15">1 </option>
             <option value="30">2 </option>
@@ -28,17 +42,14 @@ export default async function Page(props: {
             <option value="90">5 </option>
             <option value="120">6 </option>
           </select>
-          <button
-            className='button buttonSearch'
-            type='submit'
-          >Buscar
+          <button className="button buttonSearch" type="submit">
+            Buscar
           </button>
         </div>
-
       </form>
 
       <div className="tableContainer">
-        <table >
+        <table>
           <thead>
             <tr>
               <th>Carrera</th>
@@ -48,12 +59,10 @@ export default async function Page(props: {
               <th>Profesores</th>
             </tr>
           </thead>
-          <tbody>
-          </tbody>
+          <tbody></tbody>
         </table>
       </div>
     </section>
-
   );
 }
-//IO
+//IO

app/(private)/Mensajes/page.tsx

@@ -1,5 +1,6 @@
 import EnviarMensaje from "@/app/Components/EviarMensaje/EnviarMensaje";
 import AlertBox from "@/app/Components/Global/AlertBox/AlertBox";
+import ClearParams from "@/app/Components/Global/ClearParams/ClearParams";
 import Toggle from "@/app/Components/Global/Toggle/Toggle";
 
 export default async function Page(props: {
@@ -17,11 +18,17 @@ export default async function Page(props: {
   return (
     <section className="containerSection">
       {showError && (
-        <AlertBox key={Date.now()} message={showError} type="error" />
+        <>
+          <AlertBox key={Date.now()} message={showError} type="error" />
+          <ClearParams paramsToClear={["error"]} />
+        </>
       )}
 
       {showSuccess && (
-        <AlertBox key={Date.now()} message={showSuccess} type="success" />
+        <>
+          <AlertBox key={Date.now()} message={showSuccess} type="success" />
+          <ClearParams paramsToClear={["success"]} />
+        </>
       )}
 
       <h2 className="title">Enviar mensaje</h2>

app/Components/BitacoraSanciones/Sanciones.tsx

@@ -1,9 +1,10 @@
 import Information from "../Global/Information/information";
 import SearchUser from "../Global/SearchUser/searchUser";
+import TableSancion from "./TableSancion";
 
 interface Student {
-  id_cuenta: string ;
-  nombre: string ;
+  id_cuenta: string;
+  nombre: string;
 }
 
 export default async function Sanciones(props: { student?: Student }) {
@@ -13,7 +14,14 @@ export default async function Sanciones(props: { student?: Student }) {
     <>
       <SearchUser urlBase="BitacoraSanciones" value={idCuenta} />
       {props.student && (
-        <Information NoCuenta={props.student.id_cuenta} Nombre={props.student.nombre} />
+        <>
+          <Information
+            NoCuenta={props.student.id_cuenta}
+            Nombre={props.student.nombre}
+          />
+
+          <TableSancion  />
+        </>
       )}
     </>
   );

app/Components/BitacoraSanciones/TableSancion.tsx

@@ -0,0 +1,58 @@
+import styles from "./Page.module.css";
+
+interface alumno_sancion {
+  id_alumno_sancion: number;
+  fecha_inicio: string;
+  alumno: alumno;
+  sancion: sancion;
+}
+
+interface alumno {
+  id_cuenta: number;
+  nombre: string;
+  credito: number;
+}
+
+interface sancion {
+  id_sancion: number;
+  sancion: string;
+  duracion: number;
+}
+
+export default function TableSancion() {
+
+  return (
+    <>
+      <div className={styles.tableContainer}>
+        <table className={styles.machineTable}>
+          <thead>
+            <tr>
+              <th>Cuenta</th>
+              <th>Motivo de la sancion</th>
+              <th>Duracion (Semanas) </th>
+              <th>Fecha Sancion</th>
+              <th>Podra utilizar el servicio hasta</th>
+            </tr>
+          </thead>
+          <tbody>
+
+          </tbody>
+        </table>
+      </div>
+
+      <form className="containerForm">
+        <div className="groupInput">
+          <select
+          >
+            <option value="">-- Selecciona una sancion --</option>
+            <option value="sancion 1">No cerrar sesion (Una semana)</option>
+          </select>
+          <button className="button buttonSearch" type="submit">
+            Aplicar sancion
+          </button>
+        </div>
+      </form>
+    </>
+  );
+}
+//IO

app/Components/BitacoraSanciones/UbicacionEquipo.tsx

@@ -1,91 +0,0 @@
-import { useState } from "react";
-
-import styles from "./Page.module.css";
-
-interface alumno_sancion {
-  id_alumno_sancion: number;
-  fecha_inicio: string;
-  alumno: alumno;
-  sancion: sancion;
-}
-
-interface alumno {
-  id_cuenta: number;
-  nombre: string;
-  credito: number;
-}
-
-interface sancion {
-  id_sancion: number;
-  sancion: string;
-  duracion: number;
-}
-
-export default function UbicacionEquipo(sanciones:alumno_sancion[]) {
-  const [ubicacionEquipo, setUbicacionEquipo] = useState("");
-
-  return (
-    <>
-      <form className="containerForm">
-        <label className="label">Ubicacion de equipo</label>
-
-        <div
-          className="groupInput"
-          style={{ display: "flex", gap: "1rem", flexDirection: "row" }}
-        >
-          <select
-            value={ubicacionEquipo}
-            onChange={(e) => setUbicacionEquipo(e.target.value)}
-          >
-            <option value="">-- Selecciona un equipo --</option>
-            <option value="255">Equipo 255</option>
-          </select>
-          <button className="button buttonSearch" type="submit">
-            Asignar
-          </button>
-        </div>
-      </form>
-
-      <div className={styles.tableContainer}>
-        <table className={styles.machineTable}>
-          <thead>
-            <tr>
-              <th>Cuenta</th>
-              <th>Motivo de la sancion</th>
-              <th>Duracion (Semanas) </th>
-              <th>Fecha Sancion</th>
-              <th>Podra utilizar el servicio hasta</th>
-            </tr>
-          </thead>
-          <tbody>
-            {sanciones &&
-              sanciones.map((s, index) => (
-                <tr key={index}>
-                  <td>{s.sancion.id_sancion}</td>
-                  <td>{s.sancion.sancion}</td>
-                  <td>{s.fecha_inicio}</td>
-                  <td>{s.sancion.duracion}</td>
-                </tr>
-              ))}
-          </tbody>
-        </table>
-      </div>
-
-      <form className="containerForm">
-        <div className="groupInput">
-          <select
-            value={ubicacionEquipo}
-            onChange={(e) => setUbicacionEquipo(e.target.value)}
-          >
-            <option value="">-- Selecciona una sancion --</option>
-            <option value="sancion 1">No cerrar sesion (Una semana)</option>
-          </select>
-          <button className="button buttonSearch" type="submit">
-            Aplicar sancion
-          </button>
-        </div>
-      </form>
-    </>
-  );
-}
-//IO

app/Components/Global/AlertBox/AlertBox.tsx

@@ -2,6 +2,7 @@
 
 import { useEffect, useState } from "react";
 import "./AlertBox.css";
+import ClearParams from "../ClearParams/ClearParams";
 
 interface AlertBoxProps {
   message: string | null;

app/Components/Global/FormHandle.tsx

@@ -0,0 +1,40 @@
+"use client";
+
+import { ReactNode, useCallback } from "react";
+import { useRouter, usePathname, useSearchParams } from "next/navigation";
+
+interface FormHandlerProps {
+  children: ReactNode;
+  onSubmit: () => Promise<void>;
+}
+
+export default function FormHandler({ children, onSubmit }: FormHandlerProps) {
+  const router = useRouter();
+  const searchParams = useSearchParams();
+  const pathname = usePathname();
+
+  const updateParams = useCallback(
+    (updates: Record<string, string | null>) => {
+      const params = new URLSearchParams(searchParams.toString());
+
+      Object.entries(updates).forEach(([key, value]) => {
+        if (value === null) params.delete(key);
+        else params.set(key, value);
+      });
+
+      router.push(`${pathname}?${params.toString()}`);
+    },
+    [searchParams, router, pathname]
+  );
+
+  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    try {
+      await onSubmit();
+    } catch (err: any) {
+      updateParams({ error: String(err) });
+    }
+  };
+
+  return <form onSubmit={handleSubmit}>{children}</form>;
+}

app/Components/Impressions/impressions.tsx

@@ -27,25 +27,24 @@ function Impressions({ costs, numAcount }: ImpressionsProps) {
   };
 
   const handlePayment = async () => {
+    const currentUrl = new URL(window.location.href);
+    const params = new URLSearchParams();
+
+    const setError = (msg: string) => {
+      params.set("error", msg);
+      router.push(`${currentUrl}&${params.toString()}`);
+    };
+
     if (!numAcount) {
-      router.push(
-        `/Impresiones?numAcount=${numAcount}&error=Error busca denuevo al estudiante`
-      );
-      return;
+      return setError("busca de nuevo al estudiante");
     }
 
     if (!pages) {
-      router.push(
-        `/Impresiones?numAcount=${numAcount}&error=Ingresa el numero de hojas a imprimir`
-      );
-      return;
+      return setError("Ingresa el numero de hojas a imprimir");
     }
 
     if (!cost) {
-      router.push(
-        `/Impresiones?numAcount=${numAcount}&error=Selecciona un costo`
-      );
-      return;
+      return setError("Selecciona un costo");
     }
 
     const result = await PostImpressions({
@@ -57,18 +56,16 @@ function Impressions({ costs, numAcount }: ImpressionsProps) {
     if (result.error) {
       if (result.error === "Token inválido") handleLogout();
       else {
-        router.push(
-          `/Impresiones?numAcount=${numAcount}&error=${result.error}`
-        );
+        return setError(`Error: ${result.error}`);
       }
       return;
     }
 
     setPages("");
     setCost("");
-    router.push(
-      `/Impresiones?numAcount=${numAcount}&success=Impresion cobrada correctamente`
-    );
+    params.delete("error");
+    params.set("success", "Impresion cobrada correctamente");
+    router.push(`${currentUrl}&${params.toString()}`);
   };
 
   return (
@@ -109,10 +106,12 @@ function Impressions({ costs, numAcount }: ImpressionsProps) {
         </div>
 
         <div className="groupInput">
-          <label className="label">
-            Total: 
+          <label className="label">Total:</label>
+          <label
+            style={{ width: "100%", minWidth: "200px", maxWidth: "500px" }}
+          >
+            {pages && cost && `$${parseInt(cost) * parseInt(pages)}.00`}
           </label>
-          <label style={{width:"100%", minWidth:"200px", maxWidth:"500px"}}>{pages && cost && `$${parseInt(cost) * parseInt(pages)}.00`}</label>
         </div>
 
         <div className="containerButton">

app/Components/Receipt/Receipt.tsx

@@ -7,11 +7,10 @@ import { useRouter } from "next/navigation";
 import "./Receipt.css";
 
 interface ReceiptsProps {
-  urlBase: string;
   numAcount: number | null;
 }
 
-function Receipt({ urlBase, numAcount }: ReceiptsProps) {
+function Receipt({ numAcount }: ReceiptsProps) {
   const router = useRouter();
 
   const [folio, setFolio] = useState("");
@@ -29,30 +28,28 @@ function Receipt({ urlBase, numAcount }: ReceiptsProps) {
   //restrict this month//
 
   const handleSaveReceipt = async () => {
+    const currentUrl = new URL(window.location.href);
+    const params = new URLSearchParams();
+
+    const setError = (msg: string) => {
+      params.set("error", msg);
+      router.push(`${currentUrl}&${params.toString()}`);
+    };
+
     if (!numAcount) {
-      router.push(
-        `${urlBase}?numAcount=${numAcount}&error=Error busca denuevo al estudiante`
-      );
-      return;
+      return setError("busca de nuevo al estudiante");
     }
 
     if (!folio) {
-      router.push(
-        `${urlBase}?numAcount=${numAcount}&error=Ingresa el folio del tiket`
-      );
-      return;
+      return setError("Ingresa el folio del ticket");
     }
 
     if (!amount) {
-      router.push(
-        `${urlBase}?numAcount=${numAcount}&error=coloca el monto a depositar`
-      );
-      return;
+      return setError("Coloca el monto a depositar");
     }
 
     if (!date) {
-      router.push(`${urlBase}?numAcount=${numAcount}&error=coloca la fecha`);
-      return;
+      return setError("Coloca la fecha");
     }
 
     try {
@@ -67,10 +64,11 @@ function Receipt({ urlBase, numAcount }: ReceiptsProps) {
       setAmount("");
       setDate("");
 
-      router.push(`${urlBase}?numAcount=${numAcount}&success=Recibo guardado`);
+      params.delete("error");
+      params.set("success", "Recibo guardado");
+      router.push(`${currentUrl}&${params.toString()}`);
     } catch (err: any) {
-      console.error(err);
-      router.push(`${urlBase}?numAcount=${numAcount}&error=${err}`);
+      setError(String(err));
     }
   };
 
@@ -113,9 +111,10 @@ function Receipt({ urlBase, numAcount }: ReceiptsProps) {
                 if (value === "" || numericValue <= 1000) {
                   setAmount(value);
                 } else {
-                  router.push(
-                    `${urlBase}?numAcount=${numAcount}&error=El monto no puede superar $1000.00`
-                  );
+                  const currentUrl = new URL(window.location.href);
+                  const params = new URLSearchParams();
+                  params.set("error", "El monto no puede superar $1000.00");
+                  router.push(`${currentUrl}&${params.toString()}`);
                 }
               }
             }}

app/globals.css

@@ -14,6 +14,7 @@ html {
   box-sizing: border-box;
   font-size: 62.5%;
   overflow-y: auto;
+  scrollbar-width: none;
 }
 
 body {