Extensión de Chrome 'Clip To Discourse'

Estimada Comunidad de Discourse, aquí tenéis mi pequeño regalo :wrapped_gift: de Navidad :christmas_tree: para todos vosotros. Es sencillo pero útil, y fue construido puramente porque yo lo quería.

Inspirado por el genial blog de Simon Willison sobre el uso de LLMs para el desarrollo, codifiqué esto por “vibra” durante Navidad, entre eventos sociales, ver películas y envolver regalos. Yo no escribí nada del código, pero revisé el código y supervisé al LLM. Todo fue impulsado por spec.md y roadmap.md.

¿Para qué sirve?

Utilizo una instancia de Discourse personal y autoalojada como Cuaderno de notas, Diario, Blog, CV, Wiki, herramienta de IA y base de conocimiento para desarrolladores. Frecuentemente me encuentro queriendo ‘recortar’ contenido de la web (título de la página + URL) y soltarlo directamente en mi Discourse, desde donde puedo incorporarlo en una Nota o una entrada del Diario.

Mis necesidades son simples, así que esto es bastante básico, solo publica el Título de la Página y la URL, aunque en el futuro me gustaría añadir ‘Incluir extracto de la página’ y ‘Recortar página completa’ como opciones.

Privacidad

Características

  • Recorta el título de la página y la URL. Opcionalmente se implementan ‘extracto de la página’ o ‘texto completo de la página’, pero es un poco poco sofisticado (¿aunque la IA de tu Discourse podría resumirlo más tarde en tu instancia de Discourse?..).
  • Crea Nuevos Temas con cada recorte, o añade recortes como respuestas a un Tema existente.
  • Soporta múltiples perfiles, permitiéndote almacenar múltiples claves API, instancias de Discourse de destino y configuraciones predeterminadas, para diferentes casos de uso.
  • El icono Clip To Discourse cambiará automáticamente para reflejar el favicon del sitio del Perfil actualmente seleccionado, ¡así puedes saber fácilmente a dónde estás recortando!

Limitaciones

  • La principal limitación es que un Administrador necesita crear una clave API con ámbito de usuario para ti, en la instancia de Discourse a la que estás recortando. Para mí esto no es un problema ya que soy el Administrador principal en todos los Discourse que pretendo usar esto.

  • Es evidente que si la capacidad de Clip To Discourse se habilitara para demasiados usuarios, podría producir muchas publicaciones de baja calidad, en una instancia de Discourse compartida o pública. Así que mi objetivo principal con esta Extensión es para aquellos de vosotros que, como yo, utilizáis Discourse como un cuaderno de notas personal.

Cómo Instalar

  • Instala en cualquier navegador basado en Chromium (Chrome, Edge, Brave, etc.) a través del enlace a Chrome Web Store https://chromewebstore.google.com/detail/clip-to-discourse/copdhiejkkdblhdcdjapcoalldkondhi

  • (Opcional pero recomendado) ‘Fija’ la extensión a la barra de herramientas del navegador.

  • Crea una clave API de Usuario Único con los siguientes ámbitos granulares: Temas: read (solo se usa para la prueba de conexión), write y update

  • Determina a qué Categoría quieres que vayan los Recortes. Si quieres que cada recorte sea un nuevo Tema, entonces solo necesitas el CategoryID. Al ver la Categoría, este ID está en la URL así: https://discourse.tudominio.com/c/NombreDeLaCategoria/CategoryID (Nota: CategoryID es el número al final)

  • También puedes configurar un Tema al que responder, y todos los Recortes se adjuntarán como nuevas respuestas a este Tema. Para obtener el TopicID, también lo obtienes de la URL: Al ver el Tema, este ID está en la URL así: https://discourse.tudominio.com/t/TituloDelTema/TopicID (Nota: TopicID es el número al final)

  • Haz clic en el icono de la extensión para ver la ventana emergente, y ve a Configuración para configurar la clave API y establecer tus valores predeterminados. Ten en cuenta que puedes tener múltiples ‘perfiles’ para varios Discourse diferentes que podrías querer usar.

  • Guarda la configuración y (opcionalmente) prueba la conexión, que leerá un tema para asegurar que la conexión API funciona.

  • ¡Cierra la Configuración y recorta cosas para probar!

Imágenes

Clipping Settings
Demo Clip to New Topic
Demo Clipped Topic
Demo Clipped as a Reply

Hoja de Ruta (Roadmap)

  • ‘Incluir extracto de la página’ y ‘Recortar página completa’ podrían necesitar algo de prueba y refinamiento. Alternativamente, esta característica podría permitir al usuario seleccionar el área de texto a recortar como extracto.

  • No estoy planeando una extensión para Firefox o Safari (ya que no uso esos navegadores), pero estaría encantado de que alguien se encargara de la tarea de portar esta extensión. Podríamos colaborar para mantenerlo todo en un solo repositorio y conservar la paridad de características.

  • Podría considerar implementar el flujo de API de Usuario de Discourse, para que los Administradores no tengan que crear claves API, sin embargo, la API de Usuario funciona a través de un flujo OAuth, por lo que no sería una alternativa de reemplazo directo.

Discusiones relacionadas

Solicitud de básicamente esta herramienta: https://meta.discourse.org/t/chrome-firefox-extension-share-to-discourse/21104/28

Una publicación relacionada, que sugiere características adicionales al recortar un Discourse: https://meta.discourse.org/t/need-web-clipper-for-discourse-post/45105

Social Share es un concepto relacionado, pero utiliza URLs simples https://meta.discourse.org/t/social-share/89980

Comentarios, Ideas y Contribuciones

Este tema es un lugar bastante bueno para poner cualquier comentario que tengáis. Estoy abierto a ideas de mejoras siempre y cuando no compliquen demasiado la extensión y/o la hagan menos útil para mí.

Si queréis abrir incidencias (issues) o hacer PRs (Pull Requests), el repositorio de GitHub está aquí:

Esta extensión es una herramienta gratuita, de código abierto y centrada en la privacidad, creada para la comunidad de Discourse por mi empresa Koloki.co

12 Me gusta

Bravo por esta extensión :clap:

1 me gusta

Este podría ser también mi caso de uso. Idealmente, al recortar a un tema nuevo, usaría el enlace destacado, hago un uso intensivo de esto (ignorar el diseño personalizado):

También estaría contento si al recortar se importara el texto actualmente seleccionado en la página, no estoy seguro de si esto es posible.

Me lo imagino así: estoy en una página con un texto interesante. Selecciono el texto, recorto a un tema nuevo y hace lo siguiente:

  • Pone el enlace de la página como enlace destacado
  • Establece el título como el título de la página recortada
  • Establece el contenido HTML seleccionado como el cuerpo de la publicación

Edición: para los dos primeros pasos, la excelente solución de david funciona muy bien. Requiere que publique el tema manualmente, pero para mi uso creo que está bien :thinking:

1 me gusta

Tuve la misma idea hace mucho tiempo, pero solo logré configurarla hace una semana.

Por separado de Discourse, el método que he utilizado personalmente durante mucho tiempo es la extensión de navegador SingleFile. Guarda el sitio que estás viendo actualmente como un único archivo HTML, preservándolo lo más fielmente posible a lo que ves, para que puedas leerlo sin conexión. Hay innumerables archivos HTML durmiendo en mi carpeta \~/Descargas.

Debido a que la información en internet no permanece allí para siempre, la forma más confiable es guardar lo que ves actualmente en tu propia computadora exactamente como está.

Ya tengo muchos archivos HTML guardados, y se añadirán muchos más en el futuro, por lo que he estado pensando en una característica que me permita importar estos archivos a Discourse para verlos y gestionarlos allí.

Si planean añadir una función para “raspar” o recortar contenido de sitios web, terminará superponiéndose bastante con lo que la extensión SingleFile ya hace bien.

Sería genial si hubiera una forma de integrarse directamente con SingleFile o de importar archivos HTML.

2 Me gusta

Gracias por compartir la extensión SingleFile - es una gran herramienta y una con la que probablemente no intentaría replicar o superponerme demasiado. Yo también tengo el mismo caso de uso: querer simplemente preservar una versión funcional de la página en un único archivo HTML, así que acabo de instalar SingleFile también. ¡No conocía esta gran extensión!

Una vez que tengas ‘Clipped To Discourse’ también podrías subir ese archivo HTML como un adjunto a la Publicación. Así es como probablemente lo usaría, como una alternativa a archive.org.

Para futuras versiones de Clip To Discourse, creo que me centraré en:

  • Rango de texto seleccionado por el usuario para ser recortado como Extracto
  • Formato Markdown mejorado de ese contenido del Extracto