Repository navigation
Sistema visual unificado primitivas UI, onboarding por pasos, tarjetas convergentes - #189
Open
trbureiyan wants to merge 22 commits into
Open
trbureiyan wants to merge 22 commits into
trbureiyan wants to merge 22 commits into
Conversation
…nse structure Corregido codigo de estado HTTP de 500 a 422 en la validacion de motivacion del backend. Modificado errorRequest en lib/error.ts para retornar un contrato de error estable con los campos 'field', 'code' y 'message'. Creado modulo puro lib/auth/register-validation.ts conteniendo las reglas de negocio academicas y logica de mapeo. Añadidos tests unitarios en tests/registration-validation.node-test.ts cubriendo las reglas del formulario.
…-styles token map Button and LinkButton share button-styles.ts as single source of truth for variant and size tokens. StatusModal uses focus trap and restores focus to the trigger element on close, covering keyboard-only users.
AuthCarousel: accessible auto-rotating carousel with pause-on-hover. ValidationStepIndicator: visual progress for multi-step register flow. register/page and tokenRegister/page rebuilt as step-by-step wizards with per-step client validation via lib/auth/register-validation.ts. login/page updated to consume Button and LinkButton primitives.
… primitives Card.tsx: root/Header/Body/Footer compound component with shared visual tokens. EventsSection and ProjectsPreviewSection refactored to consume Card — both sections now share border, background and hover behavior. FooterConditional mirrors NavbarConditional for declarative layout chrome. Footer static links array hoisted to module scope (React Doctor — avoid re-allocation per render). LoginButton updated to consume Button primitive.
- Hacemos que la página 404 sea client-side para leer la ruta actual y mostrar “tal vez buscabas” con sugerencias cercanas (sin entrar a rutas protegidas) - Centralizamos la lógica de rutas públicas/aliases en `public-routes` y la usamos tanto en `middleware` (redirects) como en el 404 (sugerencias) - Agregamos tests unitarios para cubrir normalización de slash, redirects por alias y el comportamiento de sugerencias evitando prefijos restringidos
Contributor
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
This comment was marked as resolved.
This comment was marked as resolved.
This comment was marked as resolved.
This comment was marked as resolved.
trbureiyan
added
enhancement
Add components/auth to repo map. Add FooterConditional to layouts. Add Button, LinkButton, Card, StatusModal to ui primitives list and component conventions reuse list. Add register-validation.ts to lib/auth map. Add registration-validation to tests list.
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
This comment was marked as resolved.
This comment was marked as resolved.
Sorry, something went wrong.
- Añade `permissions: contents: read` en el workflow para seguir el principio de mínimo privilegio y reducir el riesgo de accesos innecesarios durante CI
- Agrega un límite (254) antes de validar el formato para rechazar correos demasiado largos y evitar entradas inválidas en la API. - Devuelve 422 con un error de campo cuando el correo excede el tamaño permitido.
…ueba - Cambié `assert` por utilidades de `node:assert/strict` (`ok`, `match`, `strictEqual`) para mantener aserciones más consistentes y claras. - Centralicé casos de contraseñas en constantes (válidas y no válidas) para reutilizarlas en los tests y evitar duplicación/errores al ajustar reglas.
- Amplié los JSDoc de `Card` y `LinkButton` para dejar claro el propósito/decisiones de composición y el contrato de cada subcomponente - Actualicé el comentario de `ProjectsPreviewSection` para describir su comportamiento esperado al renderizar hasta 3 proyectos - Quité el warning de formato agregando el salto de línea final del archivo
Owner
Author
|
This branch was successfully deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Contrato de API y validación de semestres
Important
El rango de semestres válidos en el frontend era 1-10. El backend acepta hasta 13. Esto producía rechazos silenciosos en registros de semestres superiores. La forma del error de API tampoco era consistente entre rutas.
lib/error.ts. Contrato de error unificado:{ error: string }en todas las rutas. Elimina variantes de forma que rompían el manejo de errores en el cliente.lib/auth/register-validation.ts. Rango corregido a 1-13. Función pura sin dependencias externas, consumida tanto por el wizard frontend como por los tests.Button, LinkButton, StatusModal
Important
Los botones y links de acción usaban clases ad hoc dispersas en cada componente. No había token compartido de variante ni tamaño. El modal de estado no tenía focus trap ni restauraba el foco al disparador.
components/ui/button-styles.ts. Mapa de tokens (variant,size) como fuente única de verdad paraButtonyLinkButton.components/ui/Button.tsx.<button>semántico con estadoloadingydisabled, consumebutton-styles.ts.components/ui/LinkButton.tsx.<a>/next/linkcon los mismos tokens visuales queButton.components/ui/StatusModal.tsx. Modal conrole="dialog",aria-modal, focus trap, cierre con Escape y restauración del foco al elemento disparador al cerrar.AuthCarousel y registro en 3 pasos
Important
El formulario de registro era monolítico: un solo paso sin guía visual, sin validación por etapa y sin contexto institucional. Un usuario podía llegar al submit con 10 errores acumulados sin ninguna indicación previa.
components/auth/AuthCarousel.tsx. Carrusel accesible conaria-live,aria-roledescription, pausa en hover y soporte deprefers-reduced-motion. Visible en ambas páginas de autenticación.components/auth/ValidationStepIndicator.tsx. Barra de progreso de 3 pasos con estado activo / completado / pendiente.app/auth/register/page.tsx. Reconstruido como wizard: paso 1 datos personales → paso 2 credenciales → paso 3 información académica. Valida por etapa antes de avanzar.app/auth/register/[tokenRegister]/page.tsx. Mismo wizard adaptado al flujo de invitación con token.app/auth/login/page.tsx. Migrado aButtonyLinkButton; estructura visual unificada con el wizard.Card y layout chrome declarativo
Note
Las tarjetas de "Últimas Noticias" y "Portafolio" compartían sección en la landing pero diferían en fondo, borde y hover. El Navbar y el Footer se controlaban con un
useEffectque mutaba el DOM según el pathname, patrón frágil y difícil de mantener.components/ui/Card.tsx. Primitiva de composición con subcomponentesCard.Header,Card.Body,Card.Footer. Token de fondo, borde y hover definidos una vez.components/landing/EventsSection.tsx. Refactorizado aCard. Agrega estado vacío explícito cuando no hay eventos.components/landing/ProjectsPreviewSection.tsx. Refactorizado aCard. Mismo comportamiento de hover y borde que la sección de eventos.components/layouts/FooterConditional.tsx. Wrapper declarativo que oculta el Footer en rutas(protected)yauth. EspejaNavbarConditional.app/layout.tsx. Simplificado — delega visibilidad aNavbarConditional+FooterConditional. Elimina eluseEffectde control de visibilidad.components/layouts/Footer.tsx. Array de links estáticos movido a scope de módulo (evita re-alocación por render).components/ui/LoginButton.tsx. Migrado a primitivaButton.Key Architectural & UX Decisions
Note
handleSubmitevalúacurrentStep < 2y avanza al siguiente paso sin validar o disparar los campos del paso final de acceso.NavbarConditionalyFooterConditionalusan coincidencia estricta o de subruta con/para evitar ocultar el chrome en rutas que solo comparten prefijo textual.errorRequesten omite el separador cuandofieldestá vacío, preservando la compatibilidad dedata.Errorlegacy.getSafeInternalRedirectevalúa de forma estricta el inicio de ruta y parsea relativo ahttp://localhostasegurando que no existan desvíos de origen o bypass de contrabarras.BACKEND_ERROR_FIELD_MAPunifica los campos tanto del wizard por pasos como del formulario de solicitud inicial en/auth/register.Checklist
pnpm build)pnpm test)npx tsc --noEmit)pnpm lint— lint-staged en cada commit)Análisis automático de CodeRabbit
Cambios principales
field,messageycode.Button,LinkButton,StatusModalyCard.AuthCarouselaccesible yValidationStepIndicator.NavbarConditionalyFooterConditional.Validación