From 9d7201065a38fdafb7faeaa6b63c1a73727028c5 Mon Sep 17 00:00:00 2001 From: Guillermo Arrieta Medina Date: Wed, 28 Jan 2026 12:56:08 -0600 Subject: [PATCH] Fallback elegante de vista no encontrada MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit close #44: Se creó la NotFoundPage y se utiliza en __root con el notFoundComponent. Se agregó la lógica del loader tanto de plan de estudios como de asignaturas. Se agregó el NotFoundComponent para el detalle de plan de estudios y el de asignaturas --- .../planes/wizard/WizardControls.tsx | 26 +++++------ src/components/ui/NotFoundPage.tsx | 44 +++++++++++++++++++ src/data/api/plans.api.ts | 4 +- src/data/hooks/usePlans.ts | 5 ++- src/routeTree.gen.ts | 12 ----- src/routes/__root.tsx | 4 ++ src/routes/planes/$planId/_detalle/datos.tsx | 4 +- .../planes/$planId/_detalle/materias.tsx | 12 ++--- src/routes/planes/$planId/_detalle/route.tsx | 35 +++++++++++++-- .../planes/$planId/asignaturas/route.tsx | 27 +++++++++++- 10 files changed, 132 insertions(+), 41 deletions(-) create mode 100644 src/components/ui/NotFoundPage.tsx diff --git a/src/components/planes/wizard/WizardControls.tsx b/src/components/planes/wizard/WizardControls.tsx index e40492b..f70cf35 100644 --- a/src/components/planes/wizard/WizardControls.tsx +++ b/src/components/planes/wizard/WizardControls.tsx @@ -118,7 +118,10 @@ export function WizardControls({ } return ( -
+
+
{errorMessage && ( @@ -126,20 +129,15 @@ export function WizardControls({ )}
-
- - {isLastStep ? ( - - ) : ( - - )} -
+ ) : ( + + )}
) } diff --git a/src/components/ui/NotFoundPage.tsx b/src/components/ui/NotFoundPage.tsx new file mode 100644 index 0000000..0980008 --- /dev/null +++ b/src/components/ui/NotFoundPage.tsx @@ -0,0 +1,44 @@ +import { Link, useRouter } from '@tanstack/react-router' +import { FileQuestion, Home, ArrowLeft } from 'lucide-react' + +import { Button } from './button' + +interface NotFoundPageProps { + title?: string + message?: string + children?: React.ReactNode +} + +export function NotFoundPage({ + title = 'Página no encontrada', + message = 'Lo sentimos, no pudimos encontrar lo que buscabas. Es posible que la página haya sido movida o eliminada.', + children, +}: NotFoundPageProps) { + const router = useRouter() + + return ( +
+
+ +
+ +

{title}

+

{message}

+ +
+ + + + {children} +
+
+ ) +} diff --git a/src/data/api/plans.api.ts b/src/data/api/plans.api.ts index d162771..f5618b1 100644 --- a/src/data/api/plans.api.ts +++ b/src/data/api/plans.api.ts @@ -123,6 +123,8 @@ export async function plans_list( } export async function plans_get(planId: UUID): Promise { + console.log('plans_get') + const supabase = supabaseBrowser() const { data, error } = await supabase @@ -350,7 +352,7 @@ export async function plans_update_fields( patch: PlansUpdateFieldsPatch, ): Promise { const supabase = supabaseBrowser() - + const { data, error } = await supabase .from('planes_estudio') .update(patch) diff --git a/src/data/hooks/usePlans.ts b/src/data/hooks/usePlans.ts index 7e9dae0..1625ed6 100644 --- a/src/data/hooks/usePlans.ts +++ b/src/data/hooks/usePlans.ts @@ -53,7 +53,10 @@ export function usePlanes(filters: PlanListFilters) { export function usePlan(planId: UUID | null | undefined) { return useQuery({ queryKey: planId ? qk.plan(planId) : ['planes', 'detail', null], - queryFn: () => plans_get(planId as UUID), + queryFn: () => { + console.log('usePlan') + return plans_get(planId as UUID) + }, enabled: Boolean(planId), }) } diff --git a/src/routeTree.gen.ts b/src/routeTree.gen.ts index 5cb8118..745bd1a 100644 --- a/src/routeTree.gen.ts +++ b/src/routeTree.gen.ts @@ -169,10 +169,6 @@ export interface FileRoutesByTo { '/login': typeof LoginRoute '/planes': typeof PlanesListaRouteRouteWithChildren '/demo/tanstack-query': typeof DemoTanstackQueryRoute -<<<<<<< HEAD - '/planes/PlanesListRoute': typeof PlanesPlanesListRouteRoute -======= ->>>>>>> 4950f7efbf664bbd31ac8a673fe594af5baf07f6 '/planes/$planId': typeof PlanesPlanIdIndexRoute '/planes/nuevo': typeof PlanesListaNuevoRoute '/planes/$planId/asignaturas/$asignaturaId': typeof PlanesPlanIdAsignaturasAsignaturaIdRouteRoute @@ -325,15 +321,7 @@ declare module '@tanstack/react-router' { '/planes/$planId/': { id: '/planes/$planId/' path: '/planes/$planId' -<<<<<<< HEAD -<<<<<<< HEAD fullPath: '/planes/$planId/' -======= - fullPath: '/planes/$planId' ->>>>>>> 4950f7efbf664bbd31ac8a673fe594af5baf07f6 -======= - fullPath: '/planes/$planId/' ->>>>>>> cbe4e54 (Se cierran incidencias #10, #21, #24, #25; se añade generación manual de planes) preLoaderRoute: typeof PlanesPlanIdIndexRouteImport parentRoute: typeof rootRouteImport } diff --git a/src/routes/__root.tsx b/src/routes/__root.tsx index df2ae01..5ee62f5 100644 --- a/src/routes/__root.tsx +++ b/src/routes/__root.tsx @@ -7,6 +7,8 @@ import TanStackQueryDevtools from '../integrations/tanstack-query/devtools' import type { QueryClient } from '@tanstack/react-query' +import { NotFoundPage } from '@/components/ui/NotFoundPage' + interface MyRouterContext { queryClient: QueryClient } @@ -31,6 +33,8 @@ export const Route = createRootRouteWithContext()({ ), + notFoundComponent: () => , + errorComponent: ({ error, reset }) => { return (
diff --git a/src/routes/planes/$planId/_detalle/datos.tsx b/src/routes/planes/$planId/_detalle/datos.tsx index 93b4bef..d0b8231 100644 --- a/src/routes/planes/$planId/_detalle/datos.tsx +++ b/src/routes/planes/$planId/_detalle/datos.tsx @@ -160,7 +160,7 @@ function DatosGeneralesPage() {