Adicionado formatador Prettier

[george-gca]

Descrição de PR

Como discutido, adicionei suporte ao formatador Prettier, tanto como pre-commit quanto como validação de PR.

Como quando uma PR é enviada não tem como automaticamente alterar o código, o que dá pra fazer é subir um HTML com o diff, mostrando as mudanças necessárias pro PR passar pela validação do formatador.

Como isso é feito: quando uma PR é feita, eu pego o código da PR e verifico com o Prettier. Se ela não tá de acordo, eu gero um diff do código pré e pós Prettier e mando renderizar com o diff2html. Daí pego esse HTML e subo pro GitHub como um comentário na PR.

Issue relacionado

• Usar alguma ferramenta para padronizar o código #222

Motivações

Manter um código limpo e asseado. E bonito.

[netlify]

✅ Deploy Preview for diciotech ready!

Name	Link
🔨 Latest commit	3594743
🔍 Latest deploy log	https://app.netlify.com/sites/diciotech/deploys/6712933f04d2110008c43078
😎 Deploy Preview	https://deploy-preview-240--diciotech.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for diciotech ready!

Name	Link
🔨 Latest commit	6bd9130
🔍 Latest deploy log	https://app.netlify.com/sites/diciotech/deploys/672a0eff8310650008bf07ad
😎 Deploy Preview	https://deploy-preview-240--diciotech.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[george-gca]

Como deu pra ver o workflow Prettier code formatter falhou. Isso é de propósito (ainda não subi o código atual formatado.

Ainda não vai aparecer certinho o diff HTML como eu espero que apareça (em um link) porque esse código ainda não tá na main, acho que quando a PR for aceita isso vai se resolver. Mas dá pra ver como é o HTML diff que ele gera.

1. Clica em Details ao lado do workflow que falhou

2. Expande o Run peter-evans/repository-dispatch@v2 dentro do passo Dispatch information to repository 🗣️

3. Baixa o arquivo que aparece no link. O arquivo é um zip com um html dentro (o GitHub não deixa ser só o HTML). Abrindo o HTML dá pra ver no browser as mudanças necessárias pro código passar pelo Prettier. Algo assim:

[george-gca]

Pronto, apliquei o Prettier no código e subi.

[george-gca]

Mudei tudo porque eu encontrei finalmente um workflow pra rodar o prettier na PR e já subir a modificação. Então toda vez que alguém criar uma PR ele já vai rodar o prettier em tudo e criar um commit extra com o código modificado.

Por algum motivo o Prettier não rodou nos arquivos sass (não sei se ele suporta) então eu mudei os sass todos pra virarem scss. No fundo é uma mudança pequena, e o scss é mais parecido com o css tradicional.

[levxyca]

Bora testar 😄 Não vejo problema também em mudar de SASS para SCSS, precisamos atualizar essa documentação aqui também nesse caso, certo @george-gca? https://github.com/levxyca/diciotech/blob/main/CONTRIBUTING.md#1-instale-um-pr%C3%A9-processador-sass