Editor semelhante ao Notion

Olá a todos,

À medida que continuamos a nos familiarizar com o Discourse e a trabalhar com ele, percebi que o Editor é facilmente o meu favorito de todos os softwares de fórum com os quais trabalhei ao longo dos anos. No entanto, acho que
O que estou recomendando é um editor baseado em blocos onde você pode usar “/” e atalhos rápidos aparecem. Um exemplo é o Notion e outro é o editor Tiptap

Aqui está uma captura de tela do Marktext, um dos meus editores de markdown de código aberto favoritos para desktop:

Muitos editores de Markdown estão se movendo na direção de atalhos de bloco, e acho que o Discourse poderia se beneficiar de tal conceito em termos de forma e função.

13 curtidas

Acho que seria um grande trabalho para fazer isso funcionar perfeitamente.

Vagamente relacionado, um plugin de editor WYSIWYG agora quebrado foi criado e discutido há algum tempo:

3 curtidas

Sim, estava apenas olhando para isso antes de postar isso, só queria fazer um pedido formal.

Notei que o @sam disse que existem essencialmente Planos™ em andamento desde outubro de 2022.

3 curtidas

Acabei de encontrar esta biblioteca de código aberto que faz comandos semelhantes aos do Notion. Não tenho certeza de quão fácil seria integrá-la ao Discourse, mas queria postar caso alguém tenha uma ideia:

6 curtidas

Parece que isso foi criado em https://tiptap.dev/ que está fechado?

1 curtida

O Tiptap é de código aberto, tanto quanto sei:

3 curtidas

Entendo, as extensões pro são pagas.
A grande coisa complicada aqui é a comunicação bidirecional. A ponte markdown <=> html. Desistir do markdown é algo que eu gostaria de evitar em quaisquer experimentos neste espaço.

5 curtidas

TipTap é um wrapper em torno do ProseMirror: https://prosemirror.net/.

2 curtidas

Concordo.

Eu o vinculei principalmente como um exemplo, acho que a experimentação neste espaço pode valer a pena, mas ainda não tenho muita certeza de como isso poderia funcionar em um nível mais técnico, especialmente quando um dos objetivos é não desistir da ponte markdown <> html.

Acredito que ainda me sinto positivo sobre isso, como fiz em julho de 2023, quando criei o tópico, pois quase tudo que uso como aplicativo onde a escrita está envolvida tem funcionalidade semelhante agora.

Vou pensar mais sobre isso nas próximas semanas e postarei de volta se pensar em algo.

No mínimo, deve incluir algum tipo de método de teclado, como digitar “/” ou algum outro símbolo designado que abra uma paleta de seleção contínua para a inserção de formatação e coisas que o Discourse considera dignas, como Notion, Tiptap, etc.

1 curtida

Parece que o prosemirror usa o Discourse (https://discuss.prosemirror.net/), então talvez eles tenham algumas opiniões sobre isso. Também vi que eles têm uma integração para markdown, mas não tenho ideia se algo disso se alinharia com o que Sam falou, apenas queria incluir caso as pessoas queiram pesquisar mais sobre isso.

3 curtidas

Seu criador também tem uma conta na Meta. Não vou mencioná-lo aqui, mas ele é o autor de um ótimo livro de Javascript: https://eloquentjavascript.net/.

Pelo que sei, seria uma tarefa realmente complexa trocar o editor atual do Discourse para algo baseado em prosemirror.

2 curtidas

Minha sugestão para este tópico não foi usar o tiptap exatamente, ele foi usado como exemplo. O que estou recomendando é a experiência de edição de blocos.

2 curtidas

Este editor parece suportar conversão de markdown para html nativamente:

2 curtidas

@thoka Testei pelo link que você passou. Funciona muito bem mesmo. Seria ótimo ver esse editor no discourse. Espero que haja uma mudança assim no futuro.

Hm. Parece funcionar à primeira vista.
Um editor adequado deve, no mínimo, suportar a conversão de ida e volta sem perdas de qualquer markdown do discourse → estado html/editor → markdown.

A demonstração vinculada falha, por exemplo, em tabelas alinhadas.

3 curtidas

Eu ainda não tentei em tabelas. Se o desenvolvimento continuar, este problema também poderá ser corrigido.

Pode valer a pena dar uma olhada no editor Lexical da Meta: Introduction | Lexical. Ele pode suportar a ponte bidirecional markdown para html: @lexical/markdown | Lexical.

Não encontrei muito para começar na documentação, mas trabalhar a partir do código do Lexical Playground é útil, pelo menos no contexto de um aplicativo React.

8 curtidas

Com certeza, o @renato experimentou um pouco com isso, é um projeto gigantesco, mas algo que estamos muito interessados em explorar.

8 curtidas

Atualmente, o Discourse usa uma mistura de markdown, bbcode e HTML como seu formato de dados subjacente. Existem planos para um formato mais unificado?

Em relação aos experimentos: é senso comum que qualquer editor visual deva, no mínimo, ser idempotente (nenhuma alteração na origem ao carregar, não editar, salvar) e localmente contido (alteração apenas na origem onde as edições foram feitas)?

3 curtidas

Aqui está a Invision anunciando o TipTap como seu novo editor:

https://invisioncommunity.com/news/invision-community/invision-community-5-the-all-new-editor-r1301/

3 curtidas