Actualizar esta sección de seriación fix #195

src/components/asignaturas/detalle/AsignaturaDetailPage.tsx

@@ -7,6 +7,13 @@ import type { AsignaturaDetail } from '@/data'
 import { Button } from '@/components/ui/button'
 import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
 import { Input } from '@/components/ui/input'
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@/components/ui/select'
 import { Textarea } from '@/components/ui/textarea'
 import {
   Tooltip,
@@ -14,8 +21,8 @@ import {
   TooltipProvider,
   TooltipTrigger,
 } from '@/components/ui/tooltip'
+import { usePlanAsignaturas } from '@/data'
 import { useSubject, useUpdateAsignatura } from '@/data/hooks/useSubjects'
-import { columnParsers } from '@/lib/asignaturaColumnParsers'
 
 export interface BibliografiaEntry {
   id: string
@@ -39,10 +46,6 @@ export interface AsignaturaResponse {
   datos: AsignaturaDatos
 }
 
-function isRecord(value: unknown): value is Record<string, unknown> {
-  return typeof value === 'object' && value !== null && !Array.isArray(value)
-}
-
 type CriterioEvaluacionRow = {
   criterio: string
   porcentaje: number
@@ -64,8 +67,12 @@ export default function AsignaturaDetailPage() {
   const { asignaturaId } = useParams({
     from: '/planes/$planId/asignaturas/$asignaturaId',
   })
+  const { planId } = useParams({
+    from: '/planes/$planId/asignaturas/$asignaturaId',
+  })
   const { data: asignaturaApi } = useSubject(asignaturaId)
-
+  const { data: asignaturasApi, isLoading: loadingAsig } =
+    usePlanAsignaturas(planId)
   const [asignatura, setAsignatura] = useState<AsignaturaDetail | null>(null)
   const updateAsignatura = useUpdateAsignatura()
 
@@ -86,16 +93,54 @@ export default function AsignaturaDetailPage() {
       },
     })
   }
+
+  const asignaturaSeriada = useMemo(() => {
+    if (!asignaturaApi?.prerrequisito_asignatura_id || !asignaturasApi)
+      return null
+    return asignaturasApi.find(
+      (asig) => asig.id === asignaturaApi.prerrequisito_asignatura_id,
+    )
+  }, [asignaturaApi, asignaturasApi])
+  const requisitosFormateados = useMemo(() => {
+    if (!asignaturaSeriada) return []
+    return [
+      {
+        type: 'Pre-requisito',
+        code: asignaturaSeriada.codigo,
+        name: asignaturaSeriada.nombre,
+        id: asignaturaSeriada.id, // Guardamos el ID para el select
+      },
+    ]
+  }, [asignaturaSeriada])
+
+  const handleUpdatePrerrequisito = (newId: string | null) => {
+    updateAsignatura.mutate({
+      asignaturaId,
+      patch: {
+        prerrequisito_asignatura_id: newId,
+      },
+    })
+  }
   /* ---------- sincronizar API ---------- */
   useEffect(() => {
-    if (asignaturaApi) setAsignatura(asignaturaApi)
-  }, [asignaturaApi])
+    console.log(requisitosFormateados)
 
-  return <DatosGenerales onPersistDato={handlePersistDatoGeneral} />
+    if (asignaturaApi) setAsignatura(asignaturaApi)
+  }, [asignaturaApi, requisitosFormateados])
+
+  return (
+    <DatosGenerales
+      pre={requisitosFormateados}
+      availableSubjects={asignaturasApi}
+      onPersistDato={handlePersistDatoGeneral}
+    />
+  )
 }
 
 function DatosGenerales({
   onPersistDato,
+  pre,
+  availableSubjects,
 }: {
   onPersistDato: (clave: string, value: string) => void
 }) {
@@ -270,18 +315,19 @@ function DatosGenerales({
             <InfoCard
               title="Requisitos y Seriación"
               type="requirements"
-              initialContent={[
-                {
-                  type: 'Pre-requisito',
-                  code: 'PA-301',
-                  name: 'Programación Avanzada',
+              initialContent={pre}
+              // Pasamos las materias del plan para el Select (excluyendo la actual)
+              availableSubjects={
+                availableSubjects?.filter((a) => a.id !== asignaturaId) || []
+              }
+              onPersist={({ value }) => {
+                updateAsignatura.mutate({
+                  asignaturaId,
+                  patch: {
+                    prerrequisito_asignatura_id: value, // value ya viene como ID o null desde handleSave
                   },
-                {
-                  type: 'Co-requisito',
-                  code: 'MAT-201',
-                  name: 'Matemáticas Discretas',
-                },
-              ]}
+                })
+              }}
             />
 
             {/* Tarjeta de Evaluación */}
@@ -321,6 +367,7 @@ interface InfoCardProps {
   containerRef?: React.RefObject<HTMLDivElement | null>
   forceEditToken?: number
   highlightToken?: number
+  availableSubjects?: any
 }
 
 function InfoCard({
@@ -337,6 +384,7 @@ function InfoCard({
   containerRef,
   forceEditToken,
   highlightToken,
+  availableSubjects,
 }: InfoCardProps) {
   const [isEditing, setIsEditing] = useState(false)
   const [isHighlighted, setIsHighlighted] = useState(false)
@@ -354,7 +402,8 @@ function InfoCard({
   useEffect(() => {
     setData(initialContent)
     setTempText(initialContent)
-
+    console.log(data)
+    console.log(initialContent)
     if (type === 'evaluation') {
       const raw = Array.isArray(initialContent) ? initialContent : []
       const rows: Array<CriterioEvaluacionRowDraft> = raw
@@ -397,6 +446,8 @@ function InfoCard({
 
   const handleSave = () => {
     console.log('clave, valor:', clave, String(tempText ?? ''))
+    console.log(clave)
+    console.log(tempText)
 
     if (type === 'evaluation') {
       const cleaned: Array<CriterioEvaluacionRow> = []
@@ -427,6 +478,25 @@ function InfoCard({
       void onPersist?.({ type, clave, value: cleaned })
       return
     }
+    if (type === 'requirements') {
+      console.log('entre aqui ')
+
+      // Si tempText es un array y tiene elementos, tomamos el ID del primero
+      // Si es "none" o está vacío, mandamos null (para limpiar la seriación)
+      const prerequisiteId =
+        Array.isArray(tempText) && tempText.length > 0 ? tempText[0].id : null
+
+      setData(tempText) // Actualiza la vista local
+      setIsEditing(false)
+
+      // Mandamos el ID específico a la base de datos
+      void onPersist?.({
+        type,
+        clave: 'prerrequisito_asignatura_id', // Forzamos la columna correcta
+        value: prerequisiteId,
+      })
+      return
+    }
 
     setData(tempText)
     setIsEditing(false)
@@ -546,7 +616,52 @@ function InfoCard({
         <CardContent className="pt-4">
           {isEditing ? (
             <div className="space-y-3">
-              {type === 'evaluation' ? (
+              {/* Condicionales de edición según el tipo */}
+              {type === 'requirements' ? (
+                <div className="space-y-3">
+                  <label className="text-xs font-medium text-slate-500">
+                    Materia de Seriación
+                  </label>
+                  <Select
+                    value={tempText?.[0]?.id || 'none'}
+                    onValueChange={(val) => {
+                      const selected = availableSubjects?.find(
+                        (s) => s.id === val,
+                      )
+                      if (val === 'none' || !selected) {
+                        console.log('guardando')
+
+                        setTempText([])
+                      } else {
+                        console.log('hola')
+
+                        setTempText([
+                          {
+                            id: selected.id,
+                            type: 'Pre-requisito',
+                            code: selected.codigo,
+                            name: selected.nombre,
+                          },
+                        ])
+                      }
+                    }}
+                  >
+                    <SelectTrigger>
+                      <SelectValue placeholder="Selecciona una materia" />
+                    </SelectTrigger>
+                    <SelectContent>
+                      <SelectItem value="none">
+                        Ninguna (Sin seriación)
+                      </SelectItem>
+                      {availableSubjects?.map((asig) => (
+                        <SelectItem key={asig.id} value={asig.id}>
+                          {asig.codigo} - {asig.nombre}
+                        </SelectItem>
+                      ))}
+                    </SelectContent>
+                  </Select>
+                </div>
+              ) : type === 'evaluation' ? (
                 <div className="space-y-3">
                   <div className="space-y-2">
                     {evalRows.map((row) => (
@@ -568,85 +683,36 @@ function InfoCard({
                             )
                           }}
                         />
-
                         <Input
                           value={row.porcentaje}
                           placeholder="%"
                           type="number"
-                          min={1}
-                          max={100}
-                          step={1}
-                          inputMode="numeric"
                           onChange={(e) => {
                             const raw = e.target.value
-                            // Solo permitir '' o dígitos
                             if (raw !== '' && !/^\d+$/.test(raw)) return
 
-                            if (raw === '') {
-                              setEvalRows((prev) =>
-                                prev.map((r) =>
-                                  r.id === row.id
-                                    ? {
-                                        id: r.id,
-                                        criterio: r.criterio,
-                                        porcentaje: '',
-                                      }
-                                    : r,
-                                ),
-                              )
-                              return
-                            }
-
-                            const n = Number(raw)
-                            if (!Number.isFinite(n)) return
-                            const porcentaje = Math.trunc(n)
-                            if (porcentaje < 1 || porcentaje > 100) return
-
-                            // No permitir suma > 100
                             setEvalRows((prev) => {
                               const next = prev.map((r) =>
-                                r.id === row.id
-                                  ? {
-                                      id: r.id,
-                                      criterio: r.criterio,
-                                      porcentaje: raw,
-                                    }
-                                  : r,
+                                r.id === row.id ? { ...r, porcentaje: raw } : r,
+                              )
+                              const total = next.reduce(
+                                (acc, r) => acc + (Number(r.porcentaje) || 0),
+                                0,
                               )
-
-                              const total = next.reduce((acc, r) => {
-                                const v = String(r.porcentaje).trim()
-                                if (!v) return acc
-                                const nn = Number(v)
-                                if (!Number.isFinite(nn)) return acc
-                                const vv = Math.trunc(nn)
-                                if (vv < 1 || vv > 100) return acc
-                                return acc + vv
-                              }, 0)
-
                               return total > 100 ? prev : next
                             })
                           }}
                         />
-
-                        <div
-                          className="flex w-[1ch] items-center justify-center text-sm text-slate-600"
-                          aria-hidden
-                        >
-                          %
-                        </div>
-
+                        <div className="text-sm text-slate-600">%</div>
                         <Button
                           variant="ghost"
                           size="icon"
                           className="h-8 w-8 text-red-600 hover:bg-red-50"
-                          onClick={() => {
+                          onClick={() =>
                             setEvalRows((prev) =>
                               prev.filter((r) => r.id !== row.id),
                             )
-                          }}
-                          aria-label="Quitar renglón"
-                          title="Quitar"
+                          }
                         >
                           <Minus className="h-4 w-4" />
                         </Button>
@@ -656,22 +722,15 @@ function InfoCard({
 
                   <div className="flex items-center justify-between">
                     <span
-                      className={
-                        'text-sm ' +
-                        (evaluationTotal === 100
-                          ? 'text-muted-foreground'
-                          : 'text-destructive font-semibold')
-                      }
+                      className={`text-sm ${evaluationTotal === 100 ? 'text-muted-foreground' : 'text-destructive font-semibold'}`}
                     >
                       Total: {evaluationTotal}/100
                     </span>
-
                     <Button
                       variant="ghost"
                       size="sm"
                       className="text-emerald-700 hover:bg-emerald-50"
-                      onClick={() => {
-                        // Agregar una fila vacía (siempre permitido)
+                      onClick={() =>
                         setEvalRows((prev) => [
                           ...prev,
                           {
@@ -680,7 +739,7 @@ function InfoCard({
                             porcentaje: '',
                           },
                         ])
-                      }}
+                      }
                     >
                       <Plus className="mr-2 h-4 w-4" /> Agregar renglón
                     </Button>
@@ -694,28 +753,15 @@ function InfoCard({
                   className="min-h-30 text-sm leading-relaxed"
                 />
               )}
+
+              {/* Botones de acción comunes */}
               <div className="flex justify-end gap-2">
                 <Button
                   size="sm"
                   variant="ghost"
                   onClick={() => {
                     setIsEditing(false)
-                    if (type === 'evaluation') {
-                      const raw = Array.isArray(data) ? data : []
-                      setEvalRows(
-                        raw.map((r: CriterioEvaluacionRow) => ({
-                          id: crypto.randomUUID(),
-                          criterio:
-                            typeof r.criterio === 'string' ? r.criterio : '',
-                          porcentaje:
-                            typeof r.porcentaje === 'number'
-                              ? String(Math.trunc(r.porcentaje))
-                              : typeof r.porcentaje === 'string'
-                                ? String(Math.trunc(Number(r.porcentaje)))
-                                : '',
-                        })),
-                      )
-                    }
+                    // Lógica de reset si es necesario...
                   }}
                 >
                   Cancelar
@@ -731,6 +777,7 @@ function InfoCard({
               </div>
             </div>
           ) : (
+            /* Modo Visualización */
             <div className="text-sm leading-relaxed text-slate-600">
               {type === 'text' &&
                 (data ? (
@@ -739,9 +786,7 @@ function InfoCard({
                   <p className="text-slate-400 italic">Sin información.</p>
                 ))}
               {type === 'requirements' && <RequirementsView items={data} />}
-              {type === 'evaluation' && (
-                <EvaluationView items={data as Array<CriterioEvaluacionRow>} />
-              )}
+              {type === 'evaluation' && <EvaluationView items={data} />}
             </div>
           )}
         </CardContent>
@@ -796,3 +841,80 @@ function EvaluationView({ items }: { items: Array<CriterioEvaluacionRow> }) {
     </div>
   )
 }
+
+function isRecord(value: unknown): value is Record<string, unknown> {
+  return typeof value === 'object' && value !== null && !Array.isArray(value)
+}
+
+function parseContenidoTematicoToPlainText(value: unknown): string {
+  if (!Array.isArray(value)) return ''
+
+  const blocks: Array<string> = []
+
+  for (const item of value) {
+    if (!isRecord(item)) continue
+
+    const unidad =
+      typeof item.unidad === 'number' && Number.isFinite(item.unidad)
+        ? item.unidad
+        : undefined
+    const titulo = typeof item.titulo === 'string' ? item.titulo : ''
+
+    const header = `${unidad ?? ''}${unidad ? '.' : ''} ${titulo}`.trim()
+    if (!header) continue
+
+    const lines: Array<string> = [header]
+
+    const temas = Array.isArray(item.temas) ? item.temas : []
+    temas.forEach((tema, idx) => {
+      const temaNombre =
+        typeof tema === 'string'
+          ? tema
+          : isRecord(tema) && typeof tema.nombre === 'string'
+            ? tema.nombre
+            : ''
+      if (!temaNombre) return
+
+      if (unidad != null) {
+        lines.push(`${unidad}.${idx + 1} ${temaNombre}`.trim())
+      } else {
+        lines.push(`${idx + 1}. ${temaNombre}`)
+      }
+    })
+
+    blocks.push(lines.join('\n'))
+  }
+
+  return blocks.join('\n\n').trimEnd()
+}
+
+function parseCriteriosEvaluacionToPlainText(value: unknown): string {
+  if (!Array.isArray(value)) return ''
+
+  const lines: Array<string> = []
+  for (const item of value) {
+    if (!isRecord(item)) continue
+    const label = typeof item.criterio === 'string' ? item.criterio.trim() : ''
+    const valueNum =
+      typeof item.porcentaje === 'number'
+        ? item.porcentaje
+        : typeof item.porcentaje === 'string'
+          ? Number(item.porcentaje)
+          : NaN
+
+    if (!label) continue
+    if (!Number.isFinite(valueNum)) continue
+
+    const v = Math.trunc(valueNum)
+    if (v < 1 || v > 100) continue
+
+    lines.push(`${label}: ${v}%`)
+  }
+
+  return lines.join('\n')
+}
+
+const columnParsers: Partial<Record<string, (value: unknown) => string>> = {
+  contenido_tematico: parseContenidoTematicoToPlainText,
+  criterios_de_evaluacion: parseCriteriosEvaluacionToPlainText,
+}

src/components/asignaturas/detalle/DocumentoSEPTab.tsx

@@ -18,8 +18,7 @@ import { Card } from '@/components/ui/card'
 interface DocumentoSEPTabProps {
   pdfUrl: string | null
   isLoading: boolean
-  onDownloadPdf: () => void
-  onDownloadWord: () => void
+  onDownload: () => void
   onRegenerate: () => void
   isRegenerating: boolean
 }
@@ -27,8 +26,7 @@ interface DocumentoSEPTabProps {
 export function DocumentoSEPTab({
   pdfUrl,
   isLoading,
-  onDownloadPdf,
-  onDownloadWord,
+  onDownload,
   onRegenerate,
   isRegenerating,
 }: DocumentoSEPTabProps) {
@@ -54,23 +52,25 @@ export function DocumentoSEPTab({
         </div>
 
         <div className="flex items-center gap-2">
+          {pdfUrl && !isLoading && (
+            <Button variant="outline" onClick={onDownload}>
+              <Download className="mr-2 h-4 w-4" />
+              Descargar
+            </Button>
+          )}
+
           <AlertDialog
             open={showConfirmDialog}
             onOpenChange={setShowConfirmDialog}
           >
             <AlertDialogTrigger asChild>
-              <Button
-                variant="outline"
-                size="sm"
-                className="gap-2"
-                disabled={isRegenerating}
-              >
+              <Button disabled={isRegenerating}>
                 {isRegenerating ? (
-                  <Loader2 className="h-4 w-4 animate-spin" />
+                  <Loader2 className="mr-2 h-4 w-4 animate-spin" />
                 ) : (
-                  <RefreshCw className="h-4 w-4" />
+                  <RefreshCw className="mr-2 h-4 w-4" />
                 )}
-                {isRegenerating ? 'Generando...' : 'Regenerar'}
+                {isRegenerating ? 'Generando...' : 'Regenerar documento'}
               </Button>
             </AlertDialogTrigger>
 
@@ -91,31 +91,11 @@ export function DocumentoSEPTab({
               </AlertDialogFooter>
             </AlertDialogContent>
           </AlertDialog>
-
-          {pdfUrl && !isLoading && (
-            <>
-              <Button
-                size="sm"
-                className="gap-2 bg-teal-700 hover:bg-teal-800"
-                onClick={onDownloadWord}
-              >
-                <Download className="h-4 w-4" /> Descargar Word
-              </Button>
-              <Button
-                variant="outline"
-                size="sm"
-                className="gap-2"
-                onClick={onDownloadPdf}
-              >
-                <Download className="h-4 w-4" /> Descargar PDF
-              </Button>
-            </>
-          )}
         </div>
       </div>
 
       {/* PDF Preview */}
-      <Card className="h-200 overflow-hidden">
+      <Card className="h-[800px] overflow-hidden">
         {isLoading ? (
           <div className="flex h-full items-center justify-center">
             <Loader2 className="h-10 w-10 animate-spin" />

src/data/api/document.api.ts

@@ -1,86 +1,52 @@
 // document.api.ts
 
-import { supabaseBrowser } from '../supabase/client'
-import { invokeEdge } from '../supabase/invokeEdge'
+const DOCUMENT_PDF_URL =
+  'https://n8n.app.lci.ulsa.mx/webhook/62ca84ec-0adb-4006-aba1-32282d27d434'
 
-import { requireData, throwIfError } from './_helpers'
-
-import type { Tables } from '@/types/supabase'
-
-const EDGE = {
-  carbone_io_wrapper: 'carbone-io-wrapper',
-} as const
+const DOCUMENT_PDF_ASIGNATURA_URL =
+  'https://n8n.app.lci.ulsa.mx/webhook/041a68be-7568-46d0-bc08-09ded12d017d'
 
 interface GeneratePdfParams {
   plan_estudio_id: string
-  convertTo?: 'pdf'
 }
 interface GeneratePdfParamsAsignatura {
   asignatura_id: string
-  convertTo?: 'pdf'
 }
 
 export async function fetchPlanPdf({
   plan_estudio_id,
-  convertTo,
 }: GeneratePdfParams): Promise<Blob> {
-  return await invokeEdge<Blob>(
-    EDGE.carbone_io_wrapper,
-    {
-      action: 'downloadReport',
-      plan_estudio_id,
-      body: convertTo ? { convertTo } : {},
-    },
-    {
+  const response = await fetch(DOCUMENT_PDF_URL, {
+    method: 'POST',
     headers: {
       'Content-Type': 'application/json',
     },
-      responseType: 'blob',
-    },
-  )
+    body: JSON.stringify({ plan_estudio_id }),
+  })
+
+  if (!response.ok) {
+    throw new Error('Error al generar el PDF')
+  }
+
+  // n8n devuelve el archivo → lo tratamos como blob
+  return await response.blob()
 }
 
 export async function fetchAsignaturaPdf({
   asignatura_id,
-  convertTo,
 }: GeneratePdfParamsAsignatura): Promise<Blob> {
-  const supabase = supabaseBrowser()
-
-  const { data, error } = await supabase
-    .from('asignaturas')
-    .select('*')
-    .eq('id', asignatura_id)
-    .single()
-
-  throwIfError(error)
-
-  const row = requireData(
-    data as Pick<
-      Tables<'asignaturas'>,
-      'datos' | 'contenido_tematico' | 'criterios_de_evaluacion'
-    >,
-    'Asignatura no encontrada',
-  )
-
-  const body: Record<string, unknown> = {
-    data: row,
-  }
-  if (convertTo) body.convertTo = convertTo
-
-  return await invokeEdge<Blob>(
-    EDGE.carbone_io_wrapper,
-    {
-      action: 'downloadReport',
-      asignatura_id,
-      body: {
-        ...body,
-      },
-    },
-    {
+  const response = await fetch(DOCUMENT_PDF_ASIGNATURA_URL, {
+    method: 'POST',
     headers: {
       'Content-Type': 'application/json',
     },
-      responseType: 'blob',
-    },
-  )
+    body: JSON.stringify({ asignatura_id }),
+  })
+
+  if (!response.ok) {
+    throw new Error('Error al generar el PDF')
+  }
+
+  // n8n devuelve el archivo → lo tratamos como blob
+  return await response.blob()
 }

src/data/api/subjects.api.ts

@@ -191,7 +191,7 @@ export async function subjects_get(subjectId: UUID): Promise<AsignaturaDetail> {
     .from('asignaturas')
     .select(
       `
-      id,plan_estudio_id,estructura_id,codigo,nombre,tipo,creditos,numero_ciclo,linea_plan_id,orden_celda,estado,datos,contenido_tematico,horas_academicas,horas_independientes,asignatura_hash,tipo_origen,meta_origen,creado_por,actualizado_por,creado_en,actualizado_en,criterios_de_evaluacion,
+      id,plan_estudio_id,estructura_id,codigo,nombre,tipo,creditos,numero_ciclo,linea_plan_id,orden_celda,estado,datos,contenido_tematico,horas_academicas,horas_independientes,asignatura_hash,tipo_origen,meta_origen,creado_por,actualizado_por,creado_en,actualizado_en,criterios_de_evaluacion,prerrequisito_asignatura_id,
       planes_estudio(
         id,carrera_id,estructura_id,nombre,nivel,tipo_ciclo,numero_ciclos,datos,estado_actual_id,activo,tipo_origen,meta_origen,creado_por,actualizado_por,creado_en,actualizado_en,
         carreras(id,facultad_id,nombre,nombre_corto,clave_sep,activa, facultades(id,nombre,nombre_corto,color,icono))

src/data/supabase/invokeEdge.ts

@@ -12,7 +12,6 @@ import type { SupabaseClient } from '@supabase/supabase-js'
 export type EdgeInvokeOptions = {
   method?: 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE'
   headers?: Record<string, string>
-  responseType?: 'json' | 'text' | 'blob' | 'arrayBuffer'
 }
 
 export class EdgeFunctionError extends Error {
@@ -27,55 +26,6 @@ export class EdgeFunctionError extends Error {
   }
 }
 
-// Soporta base64 puro o data:...;base64,...
-function decodeBase64ToUint8Array(input: string): Uint8Array {
-  const trimmed = input.trim()
-  const base64 = trimmed.startsWith('data:')
-    ? trimmed.slice(trimmed.indexOf(',') + 1)
-    : trimmed
-
-  const bin = atob(base64)
-  const bytes = new Uint8Array(bin.length)
-  for (let i = 0; i < bin.length; i++) bytes[i] = bin.charCodeAt(i)
-  return bytes
-}
-
-function stripDataUrlPrefix(input: string): string {
-  const trimmed = input.trim()
-  if (!trimmed.startsWith('data:')) return trimmed
-  const commaIdx = trimmed.indexOf(',')
-  return commaIdx >= 0 ? trimmed.slice(commaIdx + 1) : trimmed
-}
-
-function looksLikeBase64(s: string): boolean {
-  const t = stripDataUrlPrefix(s).replace(/\s+/g, '').replace(/=+$/g, '')
-
-  // base64 típico: solo chars permitidos y longitud razonable
-  if (t.length < 64) return false
-  return /^[A-Za-z0-9+/]+$/.test(t)
-}
-
-function startsWithZip(bytes: Uint8Array): boolean {
-  return bytes.length >= 2 && bytes[0] === 0x50 && bytes[1] === 0x4b // "PK"
-}
-
-function startsWithPdf(bytes: Uint8Array): boolean {
-  return (
-    bytes.length >= 5 &&
-    bytes[0] === 0x25 &&
-    bytes[1] === 0x50 &&
-    bytes[2] === 0x44 &&
-    bytes[3] === 0x46 &&
-    bytes[4] === 0x2d
-  ) // "%PDF-"
-}
-
-function binaryStringToUint8Array(input: string): Uint8Array {
-  const bytes = new Uint8Array(input.length)
-  for (let i = 0; i < input.length; i++) bytes[i] = input.charCodeAt(i) & 0xff
-  return bytes
-}
-
 export async function invokeEdge<TOut>(
   functionName: string,
   body?:
@@ -92,16 +42,10 @@ export async function invokeEdge<TOut>(
 ): Promise<TOut> {
   const supabase = client ?? supabaseBrowser()
 
-  // Nota: algunas versiones/defs de @supabase/supabase-js no tipan `responseType`
-  // aunque el runtime lo soporte. Usamos `any` para no bloquear el uso de Blob.
-  const invoke: any = (supabase.functions as any).invoke.bind(
-    supabase.functions,
-  )
-  const { data, error } = await invoke(functionName, {
+  const { data, error } = await supabase.functions.invoke(functionName, {
     body,
     method: opts.method ?? 'POST',
     headers: opts.headers,
-    responseType: opts.responseType,
   })
 
   if (error) {
@@ -160,20 +104,5 @@ export async function invokeEdge<TOut>(
     throw new EdgeFunctionError(message, functionName, status, details)
   }
 
-  if (opts.responseType === 'blob') {
-    const anyData: unknown = data
-
-    if (anyData instanceof Blob) {
-      return anyData as TOut
-    }
-
-    throw new EdgeFunctionError(
-      'La Edge Function no devolvió un binario (Blob) válido.',
-      functionName,
-      undefined,
-      { receivedType: typeof anyData, received: anyData },
-    )
-  }
-
   return data as TOut
 }

src/lib/asignaturaColumnParsers.ts

@@ -1,78 +0,0 @@
-function isRecord(value: unknown): value is Record<string, unknown> {
-  return typeof value === 'object' && value !== null && !Array.isArray(value)
-}
-
-export function parseContenidoTematicoToPlainText(value: unknown): string {
-  if (!Array.isArray(value)) return ''
-
-  const blocks: Array<string> = []
-
-  for (const item of value) {
-    if (!isRecord(item)) continue
-
-    const unidad =
-      typeof item.unidad === 'number' && Number.isFinite(item.unidad)
-        ? item.unidad
-        : undefined
-    const titulo = typeof item.titulo === 'string' ? item.titulo : ''
-
-    const header = `${unidad ?? ''}${unidad ? '.' : ''} ${titulo}`.trim()
-    if (!header) continue
-
-    const lines: Array<string> = [header]
-
-    const temas = Array.isArray(item.temas) ? item.temas : []
-    temas.forEach((tema, idx) => {
-      const temaNombre =
-        typeof tema === 'string'
-          ? tema
-          : isRecord(tema) && typeof tema.nombre === 'string'
-            ? tema.nombre
-            : ''
-      if (!temaNombre) return
-
-      if (unidad != null) {
-        lines.push(`${unidad}.${idx + 1} ${temaNombre}`.trim())
-      } else {
-        lines.push(`${idx + 1}. ${temaNombre}`)
-      }
-    })
-
-    blocks.push(lines.join('\n'))
-  }
-
-  return blocks.join('\n\n').trimEnd()
-}
-
-export function parseCriteriosEvaluacionToPlainText(value: unknown): string {
-  if (!Array.isArray(value)) return ''
-
-  const lines: Array<string> = []
-  for (const item of value) {
-    if (!isRecord(item)) continue
-    const label = typeof item.criterio === 'string' ? item.criterio.trim() : ''
-    const valueNum =
-      typeof item.porcentaje === 'number'
-        ? item.porcentaje
-        : typeof item.porcentaje === 'string'
-          ? Number(item.porcentaje)
-          : NaN
-
-    if (!label) continue
-    if (!Number.isFinite(valueNum)) continue
-
-    const v = Math.trunc(valueNum)
-    if (v < 1 || v > 100) continue
-
-    lines.push(`${label}: ${v}%`)
-  }
-
-  return lines.join('\n')
-}
-
-export const columnParsers: Partial<
-  Record<string, (value: unknown) => string>
-> = {
-  contenido_tematico: parseContenidoTematicoToPlainText,
-  criterios_de_evaluacion: parseCriteriosEvaluacionToPlainText,
-}

src/routes/planes/$planId/_detalle/documento.tsx

@@ -8,11 +8,10 @@ import {
   Clock,
   FileJson,
 } from 'lucide-react'
-import { useCallback, useEffect, useRef, useState } from 'react'
+import { useCallback, useEffect, useState } from 'react'
 
 import { Button } from '@/components/ui/button'
 import { Card, CardContent } from '@/components/ui/card'
-import { usePlan } from '@/data'
 import { fetchPlanPdf } from '@/data/api/document.api'
 
 export const Route = createFileRoute('/planes/$planId/_detalle/documento')({
@@ -21,41 +20,30 @@ export const Route = createFileRoute('/planes/$planId/_detalle/documento')({
 
 function RouteComponent() {
   const { planId } = useParams({ from: '/planes/$planId/_detalle/documento' })
-  const { data: plan } = usePlan(planId)
   const [pdfUrl, setPdfUrl] = useState<string | null>(null)
-  const pdfUrlRef = useRef<string | null>(null)
-  const isMountedRef = useRef<boolean>(false)
   const [isLoading, setIsLoading] = useState(true)
 
-  const planFileBaseName = sanitizeFileBaseName(plan?.nombre ?? 'plan_estudios')
-
   const loadPdfPreview = useCallback(async () => {
     try {
-      if (isMountedRef.current) setIsLoading(true)
-      const pdfBlob = await fetchPlanPdf({
-        plan_estudio_id: planId,
-        convertTo: 'pdf',
-      })
-
-      if (!isMountedRef.current) return
+      setIsLoading(true)
+      const pdfBlob = await fetchPlanPdf({ plan_estudio_id: planId })
       const url = window.URL.createObjectURL(pdfBlob)
 
-      if (pdfUrlRef.current) window.URL.revokeObjectURL(pdfUrlRef.current)
-      pdfUrlRef.current = url
+      // Limpiar URL anterior si existe para evitar fugas de memoria
+      if (pdfUrl) window.URL.revokeObjectURL(pdfUrl)
+
       setPdfUrl(url)
     } catch (error) {
       console.error('Error cargando preview:', error)
     } finally {
-      if (isMountedRef.current) setIsLoading(false)
+      setIsLoading(false)
     }
   }, [planId])
 
   useEffect(() => {
-    isMountedRef.current = true
     loadPdfPreview()
     return () => {
-      isMountedRef.current = false
-      if (pdfUrlRef.current) window.URL.revokeObjectURL(pdfUrlRef.current)
+      if (pdfUrl) window.URL.revokeObjectURL(pdfUrl)
     }
   }, [loadPdfPreview])
 
@@ -63,13 +51,12 @@ function RouteComponent() {
     try {
       const pdfBlob = await fetchPlanPdf({
         plan_estudio_id: planId,
-        convertTo: 'pdf',
       })
 
       const url = window.URL.createObjectURL(pdfBlob)
       const link = document.createElement('a')
       link.href = url
-      link.download = `${planFileBaseName}.pdf`
+      link.download = 'plan_estudios.pdf'
       document.body.appendChild(link)
       link.click()
 
@@ -80,27 +67,6 @@ function RouteComponent() {
       alert('No se pudo generar el PDF')
     }
   }
-
-  const handleDownloadWord = async () => {
-    try {
-      const docBlob = await fetchPlanPdf({
-        plan_estudio_id: planId,
-      })
-
-      const url = window.URL.createObjectURL(docBlob)
-      const link = document.createElement('a')
-      link.href = url
-      link.download = `${planFileBaseName}.docx`
-      document.body.appendChild(link)
-      link.click()
-
-      link.remove()
-      setTimeout(() => window.URL.revokeObjectURL(url), 1000)
-    } catch (error) {
-      console.error(error)
-      alert('No se pudo generar el Word')
-    }
-  }
   return (
     <div className="flex min-h-screen flex-col gap-6 bg-slate-50/30 p-6">
       {/* HEADER DE ACCIONES */}
@@ -122,17 +88,12 @@ function RouteComponent() {
           >
             <RefreshCcw size={16} /> Regenerar
           </Button>
-          <Button
-            size="sm"
-            className="gap-2 bg-teal-700 hover:bg-teal-800"
-            onClick={handleDownloadWord}
-          >
+          <Button variant="outline" size="sm" className="gap-2">
             <Download size={16} /> Descargar Word
           </Button>
           <Button
-            variant="outline"
             size="sm"
-            className="gap-2"
+            className="gap-2 bg-teal-700 hover:bg-teal-800"
             onClick={handleDownloadPdf}
           >
             <Download size={16} /> Descargar PDF
@@ -178,7 +139,7 @@ function RouteComponent() {
           )}
         </div>
 
-        <CardContent className="flex min-h-200 justify-center bg-slate-500 p-0">
+        <CardContent className="flex min-h-[800px] justify-center bg-slate-500 p-0">
           {isLoading ? (
             <div className="flex flex-col items-center justify-center gap-4 text-white">
               <RefreshCcw size={40} className="animate-spin opacity-50" />
@@ -188,7 +149,7 @@ function RouteComponent() {
             /* 3. VISOR DE PDF REAL */
             <iframe
               src={`${pdfUrl}#toolbar=0&navpanes=0`}
-              className="h-250 w-full max-w-250 border-none shadow-2xl"
+              className="h-[1000px] w-full max-w-[1000px] border-none shadow-2xl"
               title="PDF Preview"
             />
           ) : (
@@ -202,24 +163,6 @@ function RouteComponent() {
   )
 }
 
-function sanitizeFileBaseName(input: string): string {
-  const text = String(input)
-  const withoutControlChars = Array.from(text)
-    .filter((ch) => {
-      const code = ch.charCodeAt(0)
-      return code >= 32 && code !== 127
-    })
-    .join('')
-
-  const cleaned = withoutControlChars
-    .replace(/[<>:"/\\|?*]+/g, ' ')
-    .replace(/\s+/g, ' ')
-    .trim()
-    .replace(/[. ]+$/g, '')
-
-  return (cleaned || 'documento').slice(0, 150)
-}
-
 // Componente pequeño para las tarjetas de estado superior
 function StatusCard({
   icon,

src/routes/planes/$planId/_detalle/mapa.tsx

@@ -5,6 +5,7 @@ import {
   Plus,
   ChevronDown,
   AlertTriangle,
+  GripVertical,
   Trash2,
   Pencil,
 } from 'lucide-react'
@@ -45,33 +46,16 @@ import {
   useUpdateAsignatura,
   useUpdateLinea,
 } from '@/data'
-import {
-  Tooltip,
-  TooltipContent,
-  TooltipProvider,
-  TooltipTrigger,
-} from '@/components/ui/tooltip'
 
 // --- Mapeadores (Fuera del componente para mayor limpieza) ---
-const palette = [
-  '#4F46E5', // índigo
-  '#7C3AED', // violeta
-  '#EA580C', // naranja
-  '#059669', // esmeralda
-  '#DC2626', // rojo
-  '#0891B2', // cyan
-  '#CA8A04', // ámbar
-  '#C026D3', // fucsia
-]
-
 const mapLineasToLineaCurricular = (
   lineasApi: Array<any> = [],
 ): Array<LineaCurricular> => {
-  return lineasApi.map((linea, index) => ({
+  return lineasApi.map((linea) => ({
     id: linea.id,
     nombre: linea.nombre,
     orden: linea.orden ?? 0,
-    color: palette[index % palette.length],
+    color: '#1976d2',
   }))
 }
 
@@ -137,216 +121,52 @@ function StatItem({
   )
 }
 
-import * as Icons from 'lucide-react'
-
-const estadoConfig: Record<
-  Asignatura['estado'],
-  {
-    label: string
-    dot: string
-    soft: string
-    icon: React.ComponentType<{ className?: string }>
-  }
-> = {
-  borrador: {
-    label: 'Borrador',
-    dot: 'bg-slate-500',
-    soft: 'bg-slate-100 text-slate-700',
-    icon: Icons.FileText,
-  },
-  revisada: {
-    label: 'Revisada',
-    dot: 'bg-amber-500',
-    soft: 'bg-amber-100 text-amber-700',
-    icon: Icons.ScanSearch,
-  },
-  aprobada: {
-    label: 'Aprobada',
-    dot: 'bg-emerald-500',
-    soft: 'bg-emerald-100 text-emerald-700',
-    icon: Icons.BadgeCheck,
-  },
-  generando: {
-    label: 'Generando',
-    dot: 'bg-sky-500',
-    soft: 'bg-sky-100 text-sky-700',
-    icon: Icons.LoaderCircle,
-  },
-}
-
-function hexToRgba(hex: string, alpha: number) {
-  const clean = hex.replace('#', '')
-  const bigint = parseInt(clean, 16)
-  const r = (bigint >> 16) & 255
-  const g = (bigint >> 8) & 255
-  const b = bigint & 255
-  return `rgba(${r}, ${g}, ${b}, ${alpha})`
-}
-
 function AsignaturaCardItem({
   asignatura,
-  lineaColor,
-  lineaNombre,
   onDragStart,
   isDragging,
   onClick,
 }: {
   asignatura: Asignatura
-  lineaColor: string
-  lineaNombre?: string
   onDragStart: (e: React.DragEvent, id: string) => void
   isDragging: boolean
   onClick: () => void
 }) {
-  const estado = estadoConfig[asignatura.estado] ?? estadoConfig.borrador
-  const EstadoIcon = estado.icon
-
   return (
-    <TooltipProvider delayDuration={150}>
-      <Tooltip>
-        <TooltipTrigger asChild>
     <button
       draggable
       onDragStart={(e) => onDragStart(e, asignatura.id)}
       onClick={onClick}
-            className={[
-              'group relative h-[200px] w-[272px] shrink-0 overflow-hidden rounded-[22px] border text-left',
-              'transition-all duration-300 ease-out',
-              'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/30',
-              'active:cursor-grabbing cursor-grab',
+      className={`group cursor-grab rounded-lg border bg-white p-3 shadow-sm transition-all active:cursor-grabbing ${
         isDragging
-                ? 'scale-[0.985] opacity-45 shadow-none'
-                : 'hover:-translate-y-1 hover:shadow-lg',
-            ].join(' ')}
-            style={{
-              borderColor: hexToRgba(lineaColor, 0.18),
-              background: `
-                radial-gradient(circle at top right, ${hexToRgba(lineaColor, 0.22)} 0%, transparent 34%),
-                linear-gradient(180deg, ${hexToRgba(lineaColor, 0.12)} 0%, ${hexToRgba(lineaColor, 0.04)} 42%, var(--card) 100%)
-              `,
-            }}
-            title={asignatura.nombre}
+          ? 'scale-95 opacity-40'
+          : 'hover:border-teal-400 hover:shadow-md'
+      }`}
     >
-            {/* franja */}
-            <div
-              className="absolute inset-x-0 top-0 h-2"
-              style={{ backgroundColor: lineaColor }}
-            />
-
-            {/* glow decorativo */}
-            <div
-              className="absolute -top-10 -right-10 h-28 w-28 rounded-full blur-2xl transition-transform duration-500 group-hover:scale-110"
-              style={{ backgroundColor: hexToRgba(lineaColor, 0.22) }}
-            />
-
-            <div className="relative flex h-full flex-col p-4">
-              {/* top */}
-              <div className="flex items-start justify-between gap-2">
-                <div
-                  className="inline-flex h-8 max-w-[200px] items-center gap-1.5 rounded-full border px-2.5 text-[11px] font-semibold"
-                  style={{
-                    borderColor: hexToRgba(lineaColor, 0.2),
-                    backgroundColor: hexToRgba(lineaColor, 0.1),
-                    color: lineaColor,
-                  }}
-                >
-                  <Icons.KeyRound className="h-3.5 w-3.5 shrink-0" />
-                  <span className="truncate">{asignatura.clave || 'Sin clave'}</span>
-                </div>
-
-                <div className="relative flex h-8 items-center overflow-hidden rounded-full bg-background/70 px-2 backdrop-blur-sm">
-                  <div className="flex gap-4 items-center gap-1.5 transition-transform duration-300 group-hover:-translate-x-[72px]">
-                    <span className={`h-2.5 w-2.5 rounded-full ${estado.dot}`} />
-                    <EstadoIcon
-                      className={[
-                        'h-3.5 w-3.5 text-foreground/65',
-                        asignatura.estado === 'generando' ? 'animate-spin' : '',
-                      ].join(' ')}
-                    />
-                  </div>
-                  <div
-                    className={[
-                      'absolute right-2 flex translate-x-6 items-center gap-1.5 opacity-0 transition-all duration-300',
-                      'group-hover:translate-x-0 group-hover:opacity-100'
-                    ].join(' ')}
-                  >
-                    <span className="text-[11px] font-semibold whitespace-nowrap">
-                      {estado.label}
+      <div className="mb-1 flex items-start justify-between">
+        <span className="font-mono text-[10px] font-bold text-slate-400">
+          {asignatura.clave}
         </span>
-                  </div>
-
-                </div>
-              </div>
-
-              {/* titulo */}
-              <div className="mt-4 min-h-[72px]">
-                <h3
-                  className="overflow-hidden text-[18px] leading-[1.08] font-bold text-foreground"
-                  style={{
-                    display: '-webkit-box',
-                    WebkitLineClamp: 3,
-                    WebkitBoxOrient: 'vertical',
-                  }}
+        <Badge
+          variant="outline"
+          className={`px-1 py-0 text-[9px] uppercase ${statusBadge[asignatura.estado] || ''}`}
         >
+          {asignatura.estado}
+        </Badge>
+      </div>
+      <p className="mb-1 text-xs leading-tight font-bold text-slate-700">
         {asignatura.nombre}
-                </h3>
-              </div>
-
-              {/* bottom */}
-              <div className="mt-auto grid grid-cols-3 gap-2">
-                <div className="rounded-2xl border border-white/40 bg-white/55 px-2.5 py-2 backdrop-blur-sm dark:border-white/10 dark:bg-white/5">
-                  <div className="mb-1 flex items-center gap-1.5 text-muted-foreground">
-                    <Icons.Award className="h-3.5 w-3.5" />
-                    <span className="text-[10px] font-medium uppercase tracking-wide">
-                      CR
+      </p>
+      <div className="mt-2 flex items-center justify-between">
+        <span className="text-[10px] text-slate-500">
+          {asignatura.creditos} CR • HD:{asignatura.hd} • HI:{asignatura.hi}
         </span>
-                  </div>
-                  <div className="text-sm font-bold text-foreground">
-                    {asignatura.creditos}
-                  </div>
-                </div>
-
-                <div className="rounded-2xl border border-white/40 bg-white/55 px-2.5 py-2 backdrop-blur-sm dark:border-white/10 dark:bg-white/5">
-                  <div className="mb-1 flex items-center gap-1.5 text-muted-foreground">
-                    <Icons.Clock3 className="h-3.5 w-3.5" />
-                    <span className="text-[10px] font-medium uppercase tracking-wide">
-                      HD
-                    </span>
-                  </div>
-                  <div className="text-sm font-bold text-foreground">
-                    {asignatura.hd}
-                  </div>
-                </div>
-
-                <div className="rounded-2xl border border-white/40 bg-white/55 px-2.5 py-2 backdrop-blur-sm dark:border-white/10 dark:bg-white/5">
-                  <div className="mb-1 flex items-center gap-1.5 text-muted-foreground">
-                    <Icons.BookOpenText className="h-3.5 w-3.5" />
-                    <span className="text-[10px] font-medium uppercase tracking-wide">
-                      HI
-                    </span>
-                  </div>
-                  <div className="text-sm font-bold text-foreground">
-                    {asignatura.hi}
-                  </div>
-                </div>
-              </div>
-
-              {/* drag affordance */}
-              <div className="pointer-events-none absolute right-3 bottom-3 rounded-full bg-background/70 p-1.5 opacity-0 backdrop-blur-sm transition-all duration-300 group-hover:opacity-100">
-                <Icons.GripVertical className="h-4 w-4 text-muted-foreground/55" />
-              </div>
+        <GripVertical
+          size={12}
+          className="text-slate-300 opacity-0 transition-opacity group-hover:opacity-100"
+        />
       </div>
     </button>
-        </TooltipTrigger>
-
-        <TooltipContent side="bottom">
-          <div className="text-xs">
-            {lineaNombre ? `${lineaNombre} · ` : ''}
-            {asignatura.nombre}
-          </div>
-        </TooltipContent>
-      </Tooltip>
-    </TooltipProvider>
   )
 }
 
@@ -798,7 +618,8 @@ function MapaCurricularPage() {
               return (
                 <Fragment key={linea.id}>
                   <div
-                    className={`group relative flex items-center justify-between rounded-xl border-l-4 p-4 transition-all ${lineColors[idx % lineColors.length]
+                    className={`group relative flex items-center justify-between rounded-xl border-l-4 p-4 transition-all ${
+                      lineColors[idx % lineColors.length]
                     } ${editingLineaId === linea.id ? 'bg-white ring-2 ring-teal-500/20' : ''}`}
                   >
                     <div className="flex-1 overflow-hidden">
@@ -814,7 +635,8 @@ function MapaCurricularPage() {
                             setTempNombreLinea(linea.nombre)
                           }
                         }}
-                        className={`block w-full text-xs font-bold break-words outline-none ${editingLineaId === linea.id
+                        className={`block w-full text-xs font-bold break-words outline-none ${
+                          editingLineaId === linea.id
                             ? 'cursor-text border-b border-teal-500/50 pb-1'
                             : 'cursor-pointer'
                         }`}
@@ -855,8 +677,6 @@ function MapaCurricularPage() {
                           <AsignaturaCardItem
                             key={m.id}
                             asignatura={m}
-                            lineaColor={linea.color || '#1976d2'}
-                            lineaNombre={linea.nombre}
                             isDragging={draggedAsignatura === m.id}
                             onDragStart={handleDragStart}
                             onClick={() => {
@@ -907,81 +727,45 @@ function MapaCurricularPage() {
       </div>
 
       {/* Asignaturas Sin Asignar */}
-      <div className="mt-12 rounded-[28px] border border-border bg-card/80 p-5 shadow-sm backdrop-blur-sm">
-        <div className="mb-5 flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
-          <div className="min-w-0">
-            <div className="flex items-center gap-2">
-              <div className="flex h-9 w-9 items-center justify-center rounded-2xl bg-muted text-muted-foreground">
-                <Icons.Inbox className="h-4.5 w-4.5" />
-              </div>
-
-              <div className="min-w-0">
-                <div className="flex items-center gap-2">
-                  <h3 className="text-sm font-bold tracking-wide text-foreground uppercase">
-                    Bandeja de entrada
+      <div className="mt-10 rounded-2xl border border-slate-200 bg-slate-50 p-6">
+        <div className="mb-4 flex items-center justify-between">
+          <div className="flex items-center gap-2 text-slate-600">
+            <h3 className="text-sm font-bold tracking-wider uppercase">
+              Bandeja de Entrada / Asignaturas sin asignar
             </h3>
-
-                  <div className="inline-flex h-6 min-w-6 items-center justify-center rounded-full bg-muted px-2 text-[11px] font-semibold text-muted-foreground">
-                    {unassignedAsignaturas.length}
+            <Badge variant="secondary">{unassignedAsignaturas.length}</Badge>
           </div>
-                </div>
-
-                <p className="mt-0.5 text-sm text-muted-foreground">
-                  Asignaturas sin ciclo o línea curricular
+          <p className="text-xs text-slate-400">
+            Arrastra una asignatura aquí para quitarla del mapa
           </p>
         </div>
-            </div>
-          </div>
-
-          <div className="flex items-center gap-2 rounded-full border border-dashed border-border bg-background/80 px-3 py-1.5 text-xs text-muted-foreground">
-            <Icons.MoveDown className="h-3.5 w-3.5" />
-            <span>Arrastra aquí para desasignar</span>
-          </div>
-        </div>
 
         <div
-          onDragOver={handleDragOver}
-          onDrop={(e) => handleDrop(e, null, null)}
-          className={[
-            'rounded-[24px] border-2 border-dashed p-4 transition-all duration-300',
-            'min-h-[220px]',
+          className={`flex min-h-[120px] flex-wrap gap-4 rounded-xl border-2 border-dashed p-4 transition-colors ${
             draggedAsignatura
-              ? 'border-primary/35 bg-primary/6 shadow-inner'
-              : 'border-border bg-muted/20',
-          ].join(' ')}
+              ? 'border-teal-300 bg-teal-50/50'
+              : 'border-slate-200 bg-white/50'
+          }`}
+          onDragOver={handleDragOver}
+          onDrop={(e) => handleDrop(e, null, null)} // Limpia ciclo y línea
         >
-          {unassignedAsignaturas.length > 0 ? (
-            <div className="flex flex-wrap gap-4">
           {unassignedAsignaturas.map((m) => (
-                <div key={m.id} className="w-[272px] shrink-0">
+            <div key={m.id} className="w-[200px]">
               <AsignaturaCardItem
                 asignatura={m}
-                    lineaColor="#94A3B8"
-                    lineaNombre="Sin asignar"
                 isDragging={draggedAsignatura === m.id}
                 onDragStart={handleDragStart}
                 onClick={() => {
-                      setEditingData(m)
+                  setEditingData(m) // Cargamos los datos en el estado de edición
                   setIsEditModalOpen(true)
                 }}
               />
             </div>
           ))}
-            </div>
-          ) : (
-            <div className="flex min-h-[188px] flex-col items-center justify-center rounded-[20px] border border-border/70 bg-background/70 px-6 text-center">
-              <div className="mb-3 flex h-12 w-12 items-center justify-center rounded-2xl bg-muted text-muted-foreground">
-                <Icons.CheckCheck className="h-5 w-5" />
-              </div>
-
-              <p className="text-sm font-semibold text-foreground">
-                No hay asignaturas pendientes
-              </p>
-
-              <p className="mt-1 max-w-md text-sm text-muted-foreground">
-                Todo está colocado en el mapa. Arrastra una asignatura aquí para quitarle
-                ciclo y línea curricular.
-              </p>
+          {unassignedAsignaturas.length === 0 && (
+            <div className="flex w-full items-center justify-center text-sm text-slate-400">
+              No hay asignaturas pendientes. Arrastra una asignatura aquí para
+              desasignarla.
             </div>
           )}
         </div>

src/routes/planes/$planId/asignaturas/$asignaturaId/documento.tsx

@@ -1,8 +1,7 @@
 import { createFileRoute, useParams } from '@tanstack/react-router'
-import { useCallback, useEffect, useRef, useState } from 'react'
+import { useCallback, useEffect, useState } from 'react'
 
 import { DocumentoSEPTab } from '@/components/asignaturas/detalle/DocumentoSEPTab'
-import { useSubject } from '@/data'
 import { fetchAsignaturaPdf } from '@/data/api/document.api'
 
 export const Route = createFileRoute(
@@ -16,75 +15,48 @@ function RouteComponent() {
     from: '/planes/$planId/asignaturas/$asignaturaId/documento',
   })
 
-  const { data: asignatura } = useSubject(asignaturaId)
-  const asignaturaFileBaseName = sanitizeFileBaseName(
-    asignatura?.nombre ?? 'documento_sep',
-  )
-
   const [pdfUrl, setPdfUrl] = useState<string | null>(null)
-  const pdfUrlRef = useRef<string | null>(null)
-  const isMountedRef = useRef<boolean>(false)
   const [isLoading, setIsLoading] = useState(true)
   const [isRegenerating, setIsRegenerating] = useState(false)
 
   const loadPdfPreview = useCallback(async () => {
     try {
-      if (isMountedRef.current) setIsLoading(true)
+      setIsLoading(true)
 
       const pdfBlob = await fetchAsignaturaPdf({
         asignatura_id: asignaturaId,
-        convertTo: 'pdf',
       })
 
-      if (!isMountedRef.current) return
-
       const url = window.URL.createObjectURL(pdfBlob)
 
-      if (pdfUrlRef.current) window.URL.revokeObjectURL(pdfUrlRef.current)
-      pdfUrlRef.current = url
-      setPdfUrl(url)
+      setPdfUrl((prev) => {
+        if (prev) window.URL.revokeObjectURL(prev)
+        return url
+      })
     } catch (error) {
       console.error('Error cargando PDF:', error)
     } finally {
-      if (isMountedRef.current) setIsLoading(false)
+      setIsLoading(false)
     }
   }, [asignaturaId])
 
   useEffect(() => {
-    isMountedRef.current = true
     loadPdfPreview()
 
     return () => {
-      isMountedRef.current = false
-      if (pdfUrlRef.current) window.URL.revokeObjectURL(pdfUrlRef.current)
+      if (pdfUrl) window.URL.revokeObjectURL(pdfUrl)
     }
   }, [loadPdfPreview])
 
-  const handleDownloadPdf = async () => {
+  const handleDownload = async () => {
     const pdfBlob = await fetchAsignaturaPdf({
       asignatura_id: asignaturaId,
-      convertTo: 'pdf',
     })
 
     const url = window.URL.createObjectURL(pdfBlob)
     const link = document.createElement('a')
     link.href = url
-    link.download = `${asignaturaFileBaseName}.pdf`
-    document.body.appendChild(link)
-    link.click()
-    link.remove()
-    window.URL.revokeObjectURL(url)
-  }
-
-  const handleDownloadWord = async () => {
-    const docBlob = await fetchAsignaturaPdf({
-      asignatura_id: asignaturaId,
-    })
-
-    const url = window.URL.createObjectURL(docBlob)
-    const link = document.createElement('a')
-    link.href = url
-    link.download = `${asignaturaFileBaseName}.docx`
+    link.download = 'documento_sep.pdf'
     document.body.appendChild(link)
     link.click()
     link.remove()
@@ -105,28 +77,9 @@ function RouteComponent() {
     <DocumentoSEPTab
       pdfUrl={pdfUrl}
       isLoading={isLoading}
-      onDownloadPdf={handleDownloadPdf}
-      onDownloadWord={handleDownloadWord}
+      onDownload={handleDownload}
       onRegenerate={handleRegenerate}
       isRegenerating={isRegenerating}
     />
   )
 }
-
-function sanitizeFileBaseName(input: string): string {
-  const text = String(input)
-  const withoutControlChars = Array.from(text)
-    .filter((ch) => {
-      const code = ch.charCodeAt(0)
-      return code >= 32 && code !== 127
-    })
-    .join('')
-
-  const cleaned = withoutControlChars
-    .replace(/[<>:"/\\|?*]+/g, ' ')
-    .replace(/\s+/g, ' ')
-    .trim()
-    .replace(/[. ]+$/g, '')
-
-  return (cleaned || 'documento').slice(0, 150)
-}

src/styles.css

@@ -4,145 +4,18 @@
 
 @custom-variant dark (&:is(.dark *));
 
-@font-face {
-  font-family: 'Indivisa Sans';
-  src: url('/fonts/indivisa/IndivisaTextSans-Light.otf') format('opentype');
-  font-weight: 300;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: 'Indivisa Sans';
-  src: url('/fonts/indivisa/IndivisaTextSans-LightItalic.otf')
-    format('opentype');
-  font-weight: 300;
-  font-style: italic;
-}
-
-@font-face {
-  font-family: 'Indivisa Sans';
-  src: url('/fonts/indivisa/IndivisaTextSans-Regular.otf') format('opentype');
-  font-weight: 400;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: 'Indivisa Sans';
-  src: url('/fonts/indivisa/IndivisaTextSans-RegularItalic.otf')
-    format('opentype');
-  font-weight: 400;
-  font-style: italic;
-}
-
-@font-face {
-  font-family: 'Indivisa Sans';
-  src: url('/fonts/indivisa/IndivisaTextSans-Bold.otf') format('opentype');
-  font-weight: 700;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: 'Indivisa Sans';
-  src: url('/fonts/indivisa/IndivisaTextSans-BoldItalic.otf') format('opentype');
-  font-weight: 700;
-  font-style: italic;
-}
-
-@font-face {
-  font-family: 'Indivisa Sans';
-  src: url('/fonts/indivisa/IndivisaTextSans-Black.otf') format('opentype');
-  font-weight: 900;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: 'Indivisa Sans';
-  src: url('/fonts/indivisa/IndivisaTextSans-BlackItalic.otf')
-    format('opentype');
-  font-weight: 900;
-  font-style: italic;
-}
-
-/* Serif */
-
-@font-face {
-  font-family: 'Indivisa Serif';
-  src: url('/fonts/indivisa/IndivisaTextSerif-Light.otf') format('opentype');
-  font-weight: 300;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: 'Indivisa Serif';
-  src: url('/fonts/indivisa/IndivisaTextSerif-LightItalic.otf')
-    format('opentype');
-  font-weight: 300;
-  font-style: italic;
-}
-
-@font-face {
-  font-family: 'Indivisa Serif';
-  src: url('/fonts/indivisa/IndivisaTextSerif-Regular.otf') format('opentype');
-  font-weight: 400;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: 'Indivisa Serif';
-  src: url('/fonts/indivisa/IndivisaTextSerif-RegularItalic.otf')
-    format('opentype');
-  font-weight: 400;
-  font-style: italic;
-}
-
-@font-face {
-  font-family: 'Indivisa Serif';
-  src: url('/fonts/indivisa/IndivisaTextSerif-Bold.otf') format('opentype');
-  font-weight: 700;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: 'Indivisa Serif';
-  src: url('/fonts/indivisa/IndivisaTextSerif-BoldItalic.otf')
-    format('opentype');
-  font-weight: 700;
-  font-style: italic;
-}
-
-@font-face {
-  font-family: 'Indivisa Serif';
-  src: url('/fonts/indivisa/IndivisaTextSerif-Black.otf') format('opentype');
-  font-weight: 900;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: 'Indivisa Serif';
-  src: url('/fonts/indivisa/IndivisaTextSerif-BlackItalic.otf')
-    format('opentype');
-  font-weight: 900;
-  font-style: italic;
-}
-
 body {
   @apply m-0;
-  font-family: var(--font-sans);
+  font-family:
+    -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
+    'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
 
 code {
-  font-family: var(--font-mono);
-}
-
-strong,
-b,
-.font-bold {
-  font-family: 'Indivisa Sans', serif;
-  font-weight: 900;
-  /* Inter letter space */
-  letter-spacing: -0.025em;
+  font-family:
+    source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;
 }
 
 :root {
@@ -178,9 +51,9 @@ b,
   --sidebar-accent-foreground: oklch(0.6304 0.2472 28.2698);
   --sidebar-border: oklch(0.9401 0 0);
   --sidebar-ring: oklch(0 0 0);
-  --font-sans: 'Indivisa Sans', sans-serif;
-  --font-serif: 'Indivisa Serif', serif;
-  --font-mono: 'Indivisa Sans', monospace;
+  --font-sans: Plus Jakarta Sans, sans-serif;
+  --font-serif: Lora, serif;
+  --font-mono: IBM Plex Mono, monospace;
   --radius: 1.4rem;
   --shadow-x: 0px;
   --shadow-y: 2px;
@@ -228,7 +101,7 @@ b,
   --chart-1: oklch(0.6686 0.1794 251.7436);
   --chart-2: oklch(0.6342 0.2516 22.4415);
   --chart-3: oklch(0.8718 0.1716 90.9505);
-  --chart-4: oklch(11.492% 0.00001 271.152);
+  --chart-4: oklch(0.4503 0.229 263.0881);
   --chart-5: oklch(0.8322 0.146 185.9404);
   --sidebar: oklch(0.1564 0.0688 261.2771);
   --sidebar-foreground: oklch(0.9551 0 0);
@@ -238,9 +111,9 @@ b,
   --sidebar-accent-foreground: oklch(0.6786 0.2095 24.6583);
   --sidebar-border: oklch(0.3289 0.0092 268.3843);
   --sidebar-ring: oklch(0.6048 0.2166 257.2136);
-  --font-sans: 'Indivisa Sans', sans-serif;
-  --font-serif: 'Indivisa Serif', serif;
-  --font-mono: 'Indivisa Sans', monospace;
+  --font-sans: Plus Jakarta Sans, sans-serif;
+  --font-serif: Lora, serif;
+  --font-mono: IBM Plex Mono, monospace;
   --radius: 1.4rem;
   --shadow-x: 0px;
   --shadow-y: 2px;

src/types/supabase.ts

@@ -154,9 +154,9 @@ export type Database = {
           numero_ciclo: number | null
           orden_celda: number | null
           plan_estudio_id: string
-          prerrequisito_asignatura_id: string | null
           tipo: Database['public']['Enums']['tipo_asignatura']
           tipo_origen: Database['public']['Enums']['tipo_origen'] | null
+          prerrequisito_asignatura_id?: string
         }
         Insert: {
           actualizado_en?: string
@@ -180,7 +180,6 @@ export type Database = {
           numero_ciclo?: number | null
           orden_celda?: number | null
           plan_estudio_id: string
-          prerrequisito_asignatura_id?: string | null
           tipo?: Database['public']['Enums']['tipo_asignatura']
           tipo_origen?: Database['public']['Enums']['tipo_origen'] | null
         }
@@ -206,7 +205,6 @@ export type Database = {
           numero_ciclo?: number | null
           orden_celda?: number | null
           plan_estudio_id?: string
-          prerrequisito_asignatura_id?: string | null
           tipo?: Database['public']['Enums']['tipo_asignatura']
           tipo_origen?: Database['public']['Enums']['tipo_origen'] | null
         }
@@ -260,20 +258,6 @@ export type Database = {
             referencedRelation: 'plantilla_plan'
             referencedColumns: ['plan_estudio_id']
           },
-          {
-            foreignKeyName: 'asignaturas_prerrequisito_asignatura_id_fkey'
-            columns: ['prerrequisito_asignatura_id']
-            isOneToOne: false
-            referencedRelation: 'asignaturas'
-            referencedColumns: ['id']
-          },
-          {
-            foreignKeyName: 'asignaturas_prerrequisito_asignatura_id_fkey'
-            columns: ['prerrequisito_asignatura_id']
-            isOneToOne: false
-            referencedRelation: 'plantilla_asignatura'
-            referencedColumns: ['asignatura_id']
-          },
         ]
       }
       bibliografia_asignatura: {
@@ -1393,7 +1377,6 @@ export type Database = {
         Args: { p_append: Json; p_id: string }
         Returns: undefined
       }
-      suma_porcentajes: { Args: { '': Json }; Returns: number }
       unaccent: { Args: { '': string }; Returns: string }
       unaccent_immutable: { Args: { '': string }; Returns: string }
     }