Clip To Discourse para Chrome – agora com suporte à API de usuário!

Querida Comunidade do Discourse, aqui está meu pequeno presente de Natal :wrapped_gift: para todos vocês :christmas_tree:. É simples, mas útil, e foi criado puramente porque eu quis.

Inspirado no ótimo blog do Simon Willison sobre o uso de LLMs para desenvolvimento, eu “vibe-coded” (desenvolvi de forma intuitiva e assistida por IA) isso durante o Natal, entre eventos sociais, assistindo a filmes e embrulhando presentes! Eu escrevi nenhuma linha de código, mas revisei o código e supervisionei o LLM. Tudo foi impulsionado por spec.md e roadmap.md.

Para que serve?

Eu uso um Discourse auto-hospedado e pessoal como Caderno de Notas, Diário, Blog, Currículo, Wiki, ferramenta de IA e base de conhecimento de desenvolvimento. Frequentemente, eu me vejo querendo “recortar” (clip) conteúdo da web e colocá-lo diretamente no meu Discourse, de onde posso incorporá-lo em uma Nota ou em uma entrada do Diário.

O Clip To Discourse agora suporta quatro estilos de recorte: Título da Página + URL, Título + URL + Trecho, Texto da Página Inteira e texto selecionado.

Privacidade

Recursos

  • Recorte uma página como Título + URL, Título + URL + Trecho, Texto da Página Inteira ou Seleção de Texto.
  • Crie novos Tópicos com cada recorte, ou anexe recortes como respostas a um Tópico existente.
  • Autorize-se através da API de Usuário do Discourse sem precisar que um administrador crie uma chave de API. Uma chave de API fornecida por um administrador, com escopo de usuário, continua disponível como alternativa.
  • Suporta múltiplos perfis para diferentes instâncias do Discourse, usuários, credenciais, modelos e padrões. Perfis podem ser renomeados, duplicados ou excluídos.
  • Escolha uma categoria de destino entre as categorias disponíveis para a conta conectada.
  • Personalize os modelos de título e corpo usando metadados da página, trechos, texto completo, texto selecionado e placeholders de data.
  • Escolha a aparência Sistema, Clara ou Escura.
  • Opcionalmente, altere o ícone da barra de ferramentas do Clip To Discourse para o favicon do site do perfil selecionado, para que você possa facilmente saber para onde está recortando.
  • Abra o pop-up usando Ctrl+Shift+K (Command+Shift+K no macOS), configurável em chrome://extensions/shortcuts.

Limitações

  • O site do Discourse deve permitir chaves de API de Usuário e permitir que o grupo da sua conta as autorize. Se a autorização via API de Usuário não estiver disponível, um administrador do site pode fornecer uma chave de API de usuário único com permissões granulares.
  • Claro, se a capacidade de Clip To Discourse fosse habilitada para muitos usuários, isso poderia gerar muitas publicações de baixa qualidade em uma instância do Discourse compartilhada ou pública. Portanto, eu destino principalmente esta Extensão àqueles de vocês que, assim como eu, usam o Discourse como um caderno pessoal.

Como Instalar

  • Instale no Chrome ou em outro navegador compatível baseado em Chromium, versão 127 ou superior, via Chrome Web Store: https://chromewebstore.google.com/detail/clip-to-discourse/copdhiejkkdblhdcdjapcoalldkondhi
  • Opcionalmente, “Fixe” a extensão na barra de ferramentas do navegador.
  • Clique no ícone da extensão, abra Configurações e insira a URL Base do seu Discourse.
  • Selecione API de Usuário e clique em Autorizar Clip To Discourse. Faça login na sua conta do Discourse, insira o código do dispositivo exibido, se solicitado, e aprove o acesso.
  • Se a autorização via API de Usuário não estiver disponível, use a aba Chave de API do Administrador com uma chave de API de usuário único fornecida por um administrador. Evite chaves de API globais.
  • Escolha seu estilo de recorte padrão, destino, categoria ou ID de Tópico existente, e opcionalmente personalize os modelos.
  • Salve as configurações e opcionalmente teste a conexão.
  • Feche as Configurações e recorte coisas para testar!

Autorizando o Clip To Discourse

Recortando para o Discourse

Mapa da Estrada (Roadmap)

  • Eu não planejo criar uma extensão para Firefox ou Safari (como não uso esses navegadores), mas ficaria feliz se alguém assumisse a tarefa de portar esta extensão. Poderíamos colaborar para manter tudo em um único repositório e manter a paridade de recursos.
  • Adições futuras possíveis incluem tags, atalhos de teclado adicionais e refinamentos adicionais no fluxo de trabalho de recorte.

Discussões relacionadas

Solicitação para basicamente esta ferramenta: Chrome/Firefox extension “Share to discourse” - #28 by supermathie

Um post relacionado, sugerindo recursos adicionais ao recortar um post do Discourse: Need Web Clipper for Discourse Post

Social Share é um conceito relacionado, mas usa URLs simples: Social Share

Feedback, Ideias e Contribuições

Este tópico é um bom lugar para colocar qualquer feedback que você tenha. Estou aberto a ideias de melhorias, desde que não tornem a extensão complicada e/ou menos útil para mim!

Se você quiser abrir issues ou fazer PRs, o repositório no GitHub está aqui:

Esta extensão é uma ferramenta gratuita, de código aberto e com foco em privacidade, criada para a comunidade do Discourse pela minha empresa Koloki.co

13 curtidas

Parabéns pela extensão :clap:

1 curtida

Este poderia ser o meu caso de uso também. Idealmente, ao recortar para um novo tópico, ele usaria o link em destaque, eu uso muito isso (ignore o layout personalizado):

Eu também ficaria feliz se o recorte importasse o texto atualmente selecionado na página, não tenho certeza se isso é possível.

Eu imagino o seguinte: estou em uma página com um texto interessante. Eu seleciono o texto, recorto para um novo tópico, e ele:

  • Coloca o link da página como um link em destaque
  • Define o título como o título da página recortada
  • Define o conteúdo HTML selecionado como o corpo da postagem

Edição: para os dois primeiros passos, a excelente solução do david funciona muito bem. Requer que eu publique o tópico manualmente, mas para o meu uso, acho que está bom :thinking:

1 curtida

Eu tive a mesma ideia há muito tempo, mas só consegui configurá-la há uma semana.

Separadamente do Discourse, o método que eu pessoalmente uso há muito tempo é a extensão de navegador SingleFile. Ela salva o site que você está visualizando como um único arquivo HTML, preservando-o o mais próximo possível do que você vê, para que você possa lê-lo offline. Existem inúmeros arquivos HTML guardados na minha pasta \~/Downloads.

Como a informação na internet não fica lá para sempre, a maneira mais confiável é salvar o que você vê atualmente no seu próprio computador exatamente como está.

Eu já tenho muitos arquivos HTML salvos, e muitos mais serão adicionados no futuro, então tenho pensado em um recurso que me permitiria trazer esses arquivos para o Discourse para visualizá-los e gerenciá-los lá.

Se você está planejando adicionar um recurso para “raspar” ou recortar conteúdo de sites, isso acabará se sobrepondo bastante com o que a extensão SingleFile já faz bem.

Seria ótimo se houvesse uma maneira de integrar diretamente com o SingleFile ou de importar arquivos HTML.

2 curtidas

Obrigado por compartilhar a extensão SingleFile - essa é uma ótima ferramenta e uma com a qual eu provavelmente não tentaria replicar ou sobrepor muito. Eu também tenho o mesmo caso de uso - querer simplesmente preservar uma versão funcional da página em um único arquivo HTML, então acabei de instalar o SingleFile também. Eu não sabia sobre essa ótima extensão!

Depois de ter ‘Clipped To Discourse’ você também poderia enviar esse arquivo HTML como um anexo para a Postagem. É assim que eu provavelmente usaria, como uma alternativa ao archive.org.

Para futuras versões do Clip To Discourse, acho que vou me concentrar em:

  • Intervalo de texto selecionado pelo usuário para ser recortado como o Trecho
  • Formatação Markdown aprimorada desse conteúdo do Trecho

Algumas pequenas atualizações no Clip To Discourse na versão 0.19.2

  • Melhor recorte de ‘Página Completa’ (usa o Mozilla Readability para recortar o texto da página de forma mais precisa e legível).
  • Instituído um limite de 50.000 caracteres para o texto nas postagens (o corpo do tópico do Discourse não pode ter mais de 50k caracteres ou retornará erros).

Fonte: GitHub - koloki-co/clip-to-discourse-chromium-extension
Chrome Web Store: https://chromewebstore.google.com/detail/copdhiejkkdblhdcdjapcoalldkondhi?utm_source=item-share-cb

1 curtida

Atualização: v0.19.5 - Suporte à Seleção de Texto

Acabei de lançar uma nova versão do Clip To Discourse

Novidades

  • Detecção automática de seleção: Quando você tiver texto selecionado em uma página, a extensão agora o detecta automaticamente e mostra exatamente o que será recortado (contagem de caracteres e palavras)
  • Novo estilo de recorte "Seleção de Texto": Junta as opções existentes de Título+URL, Trecho e Texto Completo como uma 4ª opção de estilo de recorte
  • Seleção automática inteligente: Quando o texto é selecionado, a extensão alterna automaticamente para o modo "Seleção de Texto" para que você saiba exatamente o que está recortando
  • Menu de contexto com botão direito: Adicionado um item simples de menu de contexto "Clip to Discourse" que abre o pop-up (funciona com ou sem seleção)
  • Modelo personalizável: O modelo de seleção de texto pode ser personalizado nas configurações, assim como os outros estilos de recorte

Isso torna muito rápido destacar uma citação ou passagem e recortá-la diretamente para o seu Discourse com o contexto apropriado (título da página + URL + seu texto selecionado).

Em Breve

Atualmente trabalhando na implementação do fluxo da API de Usuário do Discourse, que permitirá aos usuários autorizar a extensão via OAuth sem a necessidade de um Administrador criar chaves de API. Isso tornará a extensão muito mais fácil de usar em instâncias do Discourse compartilhadas ou públicas!

1 curtida

Uma atualização significativa de usabilidade: o Clip To Discourse agora suporta a Discourse User API.

Isso significa que usuários comuns do Discourse não precisam mais de um administrador para criar manualmente uma chave de API para eles. Insira sua URL do Discourse, clique em Autorizar Clip To Discourse, faça login, insira o código do dispositivo exibido, se solicitado, e aprove o acesso.

O site ainda precisa ter as chaves de API de usuário habilitadas em todo o site (escopos habilitados: read e write, e um Grupo do qual o usuário seja membro deve ser permitido para usar a User API), mas, uma vez que isso seja configurado, a experiência de onboarding é drasticamente mais simples para usuários que não são administradores.

As chaves de API com escopo de usuário fornecidas pelo administrador continuam disponíveis como alternativa para sites em que a autorização da User API não está disponível.

Clip To Discourse na Chrome Web Store