VIBE IN PUBLIC_

Open Graph no vibe coding: busque quando o usuário cola a URL

No Bookbase, a Function busca Open Graph depois do insert e não usa para nada. Chame o fetch na modal, quando o usuário cola a URL.

No Bookbase, gerenciador de favoritos com extensão Chrome, Gabriel criou 1 Function para puxar título e descrição da URL. O fluxo chama essa Function depois que o favorito entrou no banco, e o retorno não preenche título nem descrição. Busque o Open Graph quando o usuário cola a URL na modal de adicionar o favorito.

Eu criei de function, só que ele chama de function depois que insere o dado no banco de dados. Aí ele não usa para nada.

Noutra live a Function virou endpoint HTTP fora do Next. Nesta o problema é a hora em que esse endpoint dispara.

A Function depois do insert deixa título e descrição de fora

Ele precisava implementar 1 Function que roda sob demanda, esperando alguém chamar. Criar o favorito no site exige essa chamada: acessar a URL e pegar metadados, o título da página. O outro na sala cobra o erro. Gabriel responde com o YouTube: cola o link, tenta puxar o título do vídeo para o favorito.

para salvar o forito tem que pegar os metadados da página, entendeu? Então você pôs o link do YouTube, vou tentar pegar o título do vídeo ali para pôr no favorito.

Pegar os metadados, na fala dele, entra no salvar. O favorito vai para o banco com o título do YouTube ainda por buscar. O insert grava a URL e só então o fluxo chama a Function. Se a Function devolver título e descrição, esses campos chegam depois da linha salva. Na modal o usuário confirmou um registro sem eles.

A HORA

Depois do insert

Grava a URL. Só então chama a Function. Título e descrição ficam de fora

Na hora que cola

URL no 1º campo da modal. O fetch do Open Graph preenche título e descrição antes de gravar

No teste da chamada o retorno é este:

Só tá retornando F.

F no retorno, e o favorito segue sem título e sem descrição. Na modal do site a pessoa cola 1 URL, e sem fetch nesse instante o insert grava o link com título e descrição vazios.

URL no primeiro campo, fetch na hora que cola

O outro na sala aponta o workflow, como a edge function está sendo chamada:

Acho que o problema é o workflow, como tá sendo chamada essa ed function. Acredito que o melhor seria já na modal de adicionar o favorito. A hora que o usuário colocar o RL, a gente já chama o FET para preencher os outros campos, título e descrição, por exemplo. Além disso, acho que o RL deveria ser o primeiro campo do modal.

FET no áudio é fetch. RL é URL. O fetch precisa da URL para preencher título e descrição, então a URL vai no primeiro campo. O usuário cola e o fetch dispara nesse gesto, título e descrição entram nos outros campos, e o insert leva o que a tela tem.

A live grava esse diagnóstico. Não grava o Open Graph preenchendo a modal depois do pedido. Foi o mesmo caminho de vibe coding para verificar a empresa no stripe. Isso aparece também em vibe coding para o card inteiro ser o link. Vale ver como isso terminou em crm open source.

O outro buraco da mesma live, em outro momento, é o web scraping da Function. Aqui o assunto é só quando disparar o fetch.

No vibe coding da modal, recuse a Function depois do insert

Amanhã, no vibe coding de uma modal que busca metadados, coloque a URL no primeiro campo. No gesto de colar a URL, chame o fetch do Open Graph. Espere título e descrição aparecerem antes de gravar. Se o agente colar a chamada da Function depois do insert, recuse e peça de novo: o fetch roda na modal, com a URL colada, e o insert leva o que a tela mostra.

O teste é o da live. Cole 1 link do YouTube. Veja se o título do vídeo entra no campo de título com a modal ainda aberta, antes do save. Se a Function só dispara depois do insert, o retorno continua sem uso.

Dá para assistir à live e ouvir a Function depois do insert e o fetch na hora que cola a URL.