modified to construct the component impressions

app/(private)/Impresiones/page.tsx

@@ -33,7 +33,6 @@ export default async function Page(props: {
 
   if (numAcount) {
     const result = await GetStudentWhitoutSancion(parseInt(numAcount));
-
     if (result.error) {
       errorMessage = `${result.error}`;
     } else {
@@ -84,6 +83,7 @@ export default async function Page(props: {
         label: "Impresiones color",
         content: (
           <Impressions
+            key={2}
             costs={getCostsByService(2)}
             numAcount={student.id_cuenta}
             id_servicio={2}
@@ -95,6 +95,7 @@ export default async function Page(props: {
         label: "Plotter",
         content: (
           <Impressions
+            key={3}
             costs={getCostsByService(3)}
             numAcount={student.id_cuenta}
             id_servicio={3}

app/(private)/layout.tsx

@@ -1,6 +1,7 @@
 import { ReactNode } from "react";
 import Logout from "../Components/auth/Logout/Logout";
-import BackgroundRotator from "../Components/layout/BackgroundRotator.tsx/BackgroundRotator";
+import BackgroundRotator from "../Components/layout/BackgroundRotator/BackgroundRotator";
+
 export default async function PrivateLayout({
   children,
 }: {

app/Components/Impressions/impressions.tsx

@@ -18,7 +18,7 @@ interface ImpressionsProps {
 
 function Impressions({ costs, numAcount, id_servicio }: ImpressionsProps) {
   const [pages, setPages] = useState("");
-  const [cost, setCost] = useState("");
+  const [cost, setCost] = useState(String(costs[0].value));
 
   const router = useRouter();
 

app/creadores/page.tsx

@@ -1,11 +1,12 @@
-import "./creadores.css";
+import BackgroundRotator from "../Components/layout/BackgroundRotator/BackgroundRotator";
 import CreatorCard from "./CreatorCard";
+import "./creadores.css";
 
 export default function Page() {
     return (
         <div className="mainContainer">
-            <div className="container" style={{ display: "flex",flexDirection:"row", justifyContent: "center", gap: "3rem", flexWrap:"wrap" }}>
-                <div className="img"></div>
+            <div className="container" style={{ display: "flex", flexDirection: "row", justifyContent: "center", gap: "3rem", flexWrap: "wrap" }}>
+                <BackgroundRotator />
 
                 <CreatorCard title="IO" img="/IO.png" width={150} height={200} />
                 <CreatorCard title="CarloSpak" img="/SPAK.png" width={160} height={100} />

app/page.tsx

@@ -1,5 +1,5 @@
 import Login from "./Components/auth/Login/Login";
-import BackgroundRotator from "./Components/layout/BackgroundRotator.tsx/BackgroundRotator";
+import BackgroundRotator from "./Components/layout/BackgroundRotator/BackgroundRotator";
 import { LoginRedirect } from "./Routes/LoginRedirect";
 
 export default function Home() {

tsconfig.json

@@ -34,7 +34,7 @@
     "**/*.tsx",
     ".next/types/**/*.ts",
     ".next/dev/types/**/*.ts"
-  ],
+, "app/Components/layout/BackgroundRotator"  ],
   "exclude": [
     "node_modules"
   ]