[FE][Scans] Fixes #24

backend/.env.example

@@ -9,4 +9,4 @@ CLASSROOM_USER=user
 # Contraseña de la plataforma de aula virtual
 CLASSROOM_PASSWORD=password
 # Nivel de log de la aplicación
-RUST_LOG=debug
+RUST_LOG=info

backend/src/online_classroom/session.rs

@@ -121,7 +121,7 @@ pub async fn create_user_request(url: String, body: String) -> Result<String, St
     };
 
     if response.status() == isahc::http::StatusCode::FOUND {
-        println!("Redirected!");
+        log::info!("Redirected!");
         return Ok("".into());
     }
 

frontend/README.md

@@ -1,34 +1,19 @@
-## Usage
+# eeg-system: Front-end
 
-Those templates dependencies are maintained via [pnpm](https://pnpm.io) via `pnpm up -Lri`.
+Un SPA escrito con [SolidJS](https://www.solidjs.com/), Typescript,
+Tailwindcss y Vite.
 
-This is the reason you see a `pnpm-lock.yaml`. That being said, any package manager will work. This file can be safely be removed once you clone a template.
+Se conecta al backend para realizar todas las operaciones
 
-```bash
+## Lanzamiento
-$ npm install # or pnpm install or yarn install
-```
 
-### Learn more on the [Solid Website](https://solidjs.com) and come chat with us on our [Discord](https://discord.com/invite/solidjs)
+Para lanzar el frontend lo más importante es establecer la variable
+de entorno `VITE_BACKEND_URL` al momento de compilar.
 
-## Available Scripts
+Esta variable debe apuntar a la URL del backend.
 
-In the project directory, you can run:
+Como solo se generan archivos estáticos, se puede deployar donde sea
+(siempre y cuando se configure CORS en el backend).
 
-### `npm run dev` or `npm start`
 
-Runs the app in the development mode.<br>
-Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
 
-The page will reload if you make edits.<br>
-
-### `npm run build`
-
-Builds the app for production to the `dist` folder.<br>
-It correctly bundles Solid in production mode and optimizes the build for the best performance.
-
-The build is minified and the filenames include the hashes.<br>
-Your app is ready to be deployed!
-
-## Deployment
-
-You can deploy the `dist` folder to any static host provider (netlify, surge, now, etc.)

frontend/src/OnlineClassroom/ClassroomUserInfo/AccountExpiration.tsx

@@ -1,6 +1,6 @@
-import { createMemo, createSignal, onMount } from "solid-js";
+import { Show, createMemo, createSignal, onMount } from "solid-js";
 import { OutlinedCard } from "../../components/OutlinedCard";
-import { LoadingStatus, backend, useLoading, wait } from "../../utils/functions";
+import { LoadingStatus, backend, useLoading } from "../../utils/functions";
 import { LoadingIcon } from "../../icons/LoadingIcon";
 import { ArrowsClockwiseIcon } from "../../icons/ArrowsClockwiseIcon";
 import { JsonResult } from "../../types/JsonResult";
@@ -12,11 +12,10 @@ export function AccountExpiration(props: {userId: number}) {
 
     const loading = createMemo(() => status() === LoadingStatus.Loading);
 
-    const loadExpiration = async() => {
+    const loadExpiration = () => {
         setError("");
         setStatus(LoadingStatus.Loading);
         setExpirationDate(null);
-        if (import.meta.env.DEV) await wait(1500);
 
         backend.get<JsonResult<string>>(`/api/classroom/expiration_date/${props.userId}`)
             .then((response) => {
@@ -40,11 +39,9 @@ export function AccountExpiration(props: {userId: number}) {
             });
     };
 
-    const setExpiration = async() => {
+    const setExpiration = () => {
         setStatus(LoadingStatus.Loading);
 
-        if (import.meta.env.DEV) await wait(1500);
-
         backend.put<JsonResult<null>>(
             `/api/classroom/expiration_date/${props.userId}`,
             {date: expirationDate()},
@@ -69,6 +66,24 @@ export function AccountExpiration(props: {userId: number}) {
             </h2>
 
             <div class="px-4 py-4">
+                <p class="grid grid-cols-[auto_9rem] items-center">
+                    <span>
+                    Esta cuenta expira el:
+                    </span>
+
+                    <span>
+                        <Show when={loading()}>
+                            <LoadingIcon
+                                class="animate-spin"
+                                fill="var(--c-primary-container)"
+                            />
+                        </Show>
+                        <Show when={!loading()}>
+                            {expirationDate()}
+                        </Show>
+                    </span>
+                </p>
+
                 <p class="grid grid-cols-[auto_9rem] items-center">
                     <span>
                         Fecha de expiración:

frontend/src/OnlineClassroom/ClassroomUserInfo/Message.tsx

@@ -38,7 +38,7 @@ Saludos Cordiales.
     `.trim();
 
     return (
-        <OutlinedCard class="w-[24rem] h-[30.5rem] overflow-hidden">
+        <OutlinedCard class="w-[24rem] h-[35rem] overflow-hidden">
             <h2 class="text-xl p-3 bg-c-surface-variant text-c-on-surface-variant">
                 Generar mensajes
             </h2>
@@ -60,7 +60,7 @@ Saludos Cordiales.
                     <pre
                         class="w-full p-2 bg-c-surface text-c-on-surface
                         border border-c-outline rounded font-mono text-sm
-                        whitespace-pre-wrap max-h-40 overflow-x-scroll shadow-md"
+                        max-h-[15rem] overflow-x-scroll shadow-md"
                     >
                         {personMessage()}
                     </pre>
@@ -82,7 +82,7 @@ Saludos Cordiales.
                     <pre
                         class="w-full p-2 bg-c-surface text-c-on-surface
                         border border-c-outline rounded font-mono text-sm
-                        whitespace-pre-wrap max-h-36 overflow-x-scroll shadow-md"
+                        max-h-36 overflow-x-scroll shadow-md"
                     >
                         {companyMessage}
                     </pre>