Studio

scribe studio            # http://127.0.0.1:3600
scribe studio --port 4000

El studio es una herramienta de desarrollo local con HTML renderizado en el servidor, sin pasos de compilación ni autenticación, que lee tu árbol de trabajo en tiempo real. Aunque los agentes y las personas editan los archivos, el studio es el lugar donde los usuarios ven y verifican todo lo que Scribe gestiona. Permite explorar colecciones, inspeccionar entradas con sus relaciones resueltas y previsualizaciones de recursos, detectar imágenes faltantes o defectuosas y responder a la pregunta de «¿qué usa esto?» antes de hacer cambios. Además, integra el panel de traducción (cobertura, lista de trabajo, instantáneas por documento; consulta translation).

Explorador de colecciones

En /types/:typeId, la barra lateral muestra cada tipo de contenido con su número de entradas y un indicador global de problemas. La tabla de entradas presenta cada slug, una selección de campos clave basados en el esquema (con los enums y las relaciones en formato de etiquetas), puntos de estado de la traducción e indicadores de validación para cada entrada.

Los filtros de campos se generan mediante la introspección del esquema y se almacenan en los parámetros de consulta (lo que permite compartir las URL y renderizarlas en el servidor). Así, los campos enum se convierten en un menú desplegable, los de relaciones en una lista de slugs de destino, los booleanos en un interruptor y las cadenas de texto en una búsqueda de coincidencias.

Cualquier tipo que tenga al menos un campo de recurso (asset) puede cambiar la vista de la tabla a una cuadrícula de tarjetas de tipo galería. Cada tarjeta incluye la imagen del recurso principal junto con el slug, los campos clave y los indicadores. Los filtros funcionan exactamente igual en esta vista, que resulta ideal para el control de calidad de las imágenes generadas.

Inspector de entradas

La ruta /types/:typeId/:enSlug renderiza los campos según su tipo introspectivo:

• translatable: muestra el valor con un selector de idioma (datos extraídos del store). Si un idioma no tiene traducción, se indica claramente que se está usando el texto en inglés como respaldo.
• structural: muestra el valor en texto plano.
• relation: ofrece un enlace directo a la entrada de destino. Si la referencia está rota, aparece un indicador rojo.
• asset: presenta una previsualización de la imagen con la URL resuelta, el tamaño del archivo y las dimensiones. Si el archivo no existe, se muestra un indicador rojo.
• Used by: es una sección de referencias inversas que enumera todas las entradas (de cualquier tipo) que apuntan hacia esta.
• Body: incluye un interruptor para alternar entre texto sin formato y vista previa (?body=preview). La vista previa renderiza correctamente Markdown y GFM, y muestra los componentes JSX desconocidos como cajas etiquetadas con sus propiedades. Los tokens de relación se convierten en enlaces en los que se puede hacer clic (mostrando de forma evidente los que están rotos) y los tokens de recursos se renderizan como imágenes reales. Para los tipos con ruta, aparece un enlace de «ver en el sitio».

Las teclas de dirección permiten moverse entre las entradas. ArrowLeft y ArrowRight navegan hacia la entrada anterior o siguiente del mismo tipo según el orden predeterminado de la colección (sin volver al principio al llegar al final). Esta acción mantiene el idioma actual y los parámetros de consulta de la vista del cuerpo. Si el cursor está dentro de un campo de texto, se ignoran estas teclas.

Explorador de recursos

La ruta /assets muestra una cuadrícula de miniaturas por cada raíz gestionada. Cada recurso detalla su previsualización, ruta, tamaño, dimensiones y una lista de «referenciado por» con todas las entradas y campos que apuntan a él, calculada en tiempo real desde el entorno de ejecución en memoria. Los indicadores avisan si hay recursos sin referencias (posibles huérfanos), que faltan pero están referenciados, que superan el tamaño máximo (por encima del valor maxKB del campo) o que presentan desviaciones de formato. Consulta assets para conocer el sistema de campos subyacente.

Búsqueda global

La ruta /search?q= ejecuta una búsqueda de subcadenas (sin distinguir entre mayúsculas y minúsculas) en los slugs en inglés, en todos los valores del frontmatter y en el texto sin formato de los cuerpos MDX. Hay un formulario de búsqueda disponible en cada página. Los resultados se agrupan por tipo con un fragmento resaltado, con un límite de 20 coincidencias por categoría.

Eliminación de entradas

La barra de herramientas del inspector incluye un botón rojo de Eliminar (Delete). Al pulsarlo, se abre una página de confirmación que muestra el plan de eliminación completo desglosado en secciones (cascadas, desvinculaciones, recursos afectados, recuentos del store por idioma y cualquier posible bloqueo). A continuación, aparece un botón rojo para confirmar o, si el plan está bloqueado, se muestran los motivos del bloqueo sin opción a confirmar. Al aceptar, se ejecuta exactamente el plan establecido (eliminando el archivo de origen, sus recursos, las traducciones almacenadas y las instantáneas, además de aplicar cualquier reescritura de desvinculación) sin afectar a nada más. El modo onTargetDelete de una relación (restrict, detach o cascade) y el modo onDelete de un recurso determinan las acciones del plan. Este mismo plan está disponible en la línea de comandos mediante scribe delete. Se trata de la única ruta de mutación del studio y sigue siendo una herramienta exclusiva para el entorno de servidor local (localhost).

Lo que el studio no hace

No permite editar contenido, activar traducciones, subir imágenes, autenticarse ni renderizar componentes MDX reales. La edición sigue siendo tarea de tu editor de código y de Git. El studio es una herramienta pensada exclusivamente para revisar y verificar.