Quando eu tô procurando direcionamento sobre um tópico, e finalmente acho um post sobre o assunto, eu não gosto muito da mudança de tom que os gifs trazem, inseridos a cada parágrafo, tipo um comic relief desnecessário (ahem).

Daí esse snippet esconde todos os gifs e põe um botãozinho pra mostrar/esconder, aí você pode dar uma olhada e desligar a coisa.

Você pode ir "Add Bookmarks" e adicionar o seguinte, com um nome tipo "hide-medium-gifs":

javascript:(function() {const doc_imgs=document.querySelectorAll('img');function toggleImgVisibility(e){let prevSibling=e.target.previousElementSibling;while(prevSibling){if(prevSibling.classList.contains('hidden-g0f')){if(prevSibling.style.visibility=='hidden'){prevSibling.style.visibility='visible';}else{prevSibling.style.visibility='hidden';}break;}prevSibling=prevSibling.previousElementSibling;}}function createToggleBtn(){const button=document.createElement("BUTTON");button.innerText="Toggle gif visibility";button.addEventListener("click",toggleImgVisibility);return button;}doc_imgs.forEach((img) => {if (!img.src.includes('.gif')) return;img.classList.add("hidden-g0f");img.style.visibility = "hidden";img.parentElement.appendChild(createToggleBtn());});}())

Daí, em qualquer página do medium (por exemplo...), basta clicar no favorito criado, e pronto: gifs pausáveis.

Você pode ver ele funcionando clicando aqui.

Abaixo eu explico melhor a função.

O código é o seguinte:

const doc_imgs = document.querySelectorAll('img');

function toggleImgVisibility(e) { let prevSibling = e.target.previousElementSibling; while (prevSibling) { if (prevSibling.classList.contains('hidden-g0f')) { if (prevSibling.style.visibility == 'hidden') { prevSibling.style.visibility = 'visible'; } else { prevSibling.style.visibility = 'hidden'; } break; } prevSibling = prevSibling.previousElementSibling; } }

function createToggleBtn() { const button = document.createElement("BUTTON"); button.innerText = "Toggle gif visibility"; button.addEventListener("click", toggleImgVisibility); return button; }

doc_imgs.forEach((img) => { if (!img.src.includes('.gif')) return; img.classList.add("hidden-g0f"); img.style.visibility = "hidden"; img.parentElement.appendChild(createToggleBtn()); });

Eu pego todas as imagens da página na variável doc_imgs, e itero sobre elas, verificando se o src da imagem tem .gif nele.

Se tiver, eu adiciono uma classe (hidden-g0f :P), e altero a propriedade visibility pra 'hidden'. Isso esconde o gif, mas ele continua ocupando espaço na página.

Depois, pego o elemento pai e adiciono um botão, pela função createToggleBtn.

Esse botão tem um eventListener, que é chamado no clique, a função toggleImgVisibility.

Quando ela é chamada, ela itera pelos elementos irmãos do botão, e busca aquele que tiver a classe adicionada no passo anterior.

Se tiver a classe, eu alterno a propriedade visibility entre hidden e visible.

Daí fica fácil esconder/mostrar os gifs um por um.

Fica a dica, medium ヽ(￣～￣　)ノ.

Tags: bookmarklet

Eu fiquei duas semanas com problema na internet da minha máquina: por algum motivo, na rede de casa, a conexão do ubuntu ficava falhando.

Hora penava pra resolver DNSs, hora parava de funcionar completamente. Mas às vezes (geralmente quando eu pedia ajuda) ela funcionava.

Tentei desabilitar o IPV6 nas configurações de rede, desinstalar o systemd-resolved, mexer com o network manager, editar o /etc/resolv.conf diretamente.

Nada.

Em outras redes, na casa de amigos, na cafeteria, a internet funcionava. Eu cheguei a achar que meu provedor estava de sacanagem.

Até que tive que ficar num airBnb, e o problema voltou.

Olhei pro roteador, e era o mesmo d-link que eu tinha em casa. Já comecei a desenvolver uma crendice.

Acabou que não pude ir até o fim, pois um dia rodei um docker network ls e notei que tinha muita coisa na listagem.

docker network prune
 >Yes

E problema resolvido.

Se alguém souber mais sobre isso, ou como reproduzir o problema, por favor, entre em contato.

Mas lembre-se: sempre pode suas redes.

Tags: docker, dns, networking

This post serves as a collection of solutions I found (and some I've adapted) from the web. Cheers!

Correctly installing Docker under WSL

You do not (and should not) install anything Docker related inside your WSL instances. Instead, you can use the Docker Desktop WSL 2 Backend, which will take care of integrating both systems, and running Docker both in your Windows and in your WSL instances.

Make sure you have WSL 2 installed. You can check, in PowerShell, running

    wsl -l -v

If you see output like this

    PS C:\Users\guites> wsl -l -v
      NAME                   STATE           VERSION
    * Ubuntu-22.04           Running         2

It means you are all set. If your version column shows only version 1, you can follow the official documentation to upgrade your wsl from version 1 to 2.

Then, you need to change the version used by your distro (in powershell):

    wsl --set-version Ubuntu-22.04 2

Now, if you have previously installed docker directly from inside wsl, using for example the docker engine for ubuntu documentation, I strongly recommend uninstalling it completely.

This post goes into great detail about how you can completely remove old docker versions from wsl.

I found the following commands to be the only ones necessary (inside WSL):

    sudo apt-get remove docker docker-engine docker.io containerd runc
    sudo rm -rf /var/lib/docker /etc/docker /etc/apparmor.d/docker /var/run/docker.sock /usr/local/bin/docker-compose /etc/docker
    sudo groupdel docker

After removing Docker from WSL (or in case you didn't have it installed in the first place), make sure to uninstall Docker from your Windows also.

After that, proceed with the instalation of Docker Desktop WSL 2 backend on Windows.

Docker will create two distinct WSL containers, that can be seems running the following command from PowerShell:

    wsl -l -v


    PS C:\Users\guites> wsl -l -v
      NAME                   STATE           VERSION
    * Ubuntu-22.04           Running         2
      docker-desktop         Running         2
      docker-desktop-data    Running         2

They will be responsible for managing the communication between windows and wsl. You do not need to install anything Docker related inside of WSL.

Acessing localhost from within a docker container

If you have a docker container inside WSL running some application on localhost, and want to access it from another docker container inside WSL, you won't be able to reach it from http://localhost.

You will have to use your machine IP. You can find it by running

ip addr | grep eth0

: eth0: <BROADCAST,MULTICAST,UP,LOWER_UP> mtu 1500 qdisc mq state UP group default qlen 1000
    inet 174.86.26.335/20 brd 174.86.25.255 scope global eth0
    ^-------------^ ====> use this IP instead of localhost

Inside wsl. (source)

Copying files to the clipboard

You will not be able to run xclip or xsel, as you would in regular ubuntu.

Instead, you can access the .exe file responsible for copying in windows directly.

To copy the contents of a file list-of-things.txt

    cat list-of-things.txt | clip.exe

In this situations I like to create an alias so that I can call the same command name on both my linux and windows machine.

    echo "alias ,copy='clip.exe'" >> ~/.bash_aliases
    source ~/.bash_aliases

Now, you can copy the output of any command by running, for example

    ls -l | ,copy

And hit ctrl + v where you need it.

Opening files and the browser from WSL terminal

There are many possible solutions, but the most straightforward seems to be creating an alias pointing to your browser and explorer executables.

For the browser, you first need to find where the application binary lives in your Windows machine.

For firefox, you can do this by opening a new page, going to about:support and scrolling down to Application binary (right below Operational System).

Mine is C:\Program Files\Mozilla Firefox\firefox.exe. But you must make a few changes to that path.

1. Change backslashes into forward slashes: C:/Program Files/Mozilla Firefox/firefox.exe
2. Remove the : from the path: C/Program Files/Mozilla Firefox/firefox.exe
3. Escape the spaces: C/Program\ Files/Mozilla\ Firefox/firefox.exe
4. Lowercase that C: c/Program\ Files/Mozilla\ Firefox/firefox.exe
5. (First check if you need it) append /mnt to the path: /mnt/c/Program\ Files/Mozilla\ Firefox/firefox.exe

Check that you can open it by running it in the WSL terminal:

    /mnt/c/Program\ Files/Mozilla\ Firefox/firefox.exe`

If everything goes well, create an alias

    echo "alias ,firefox='/mnt/c/Program\ Files/Mozilla\ Firefox/firefox.exe'" >> ~/.bash_aliases
    source ~/.bash_aliases

Test it by opening up an URL

    ,firefox https://guilhermegarcia.dev/blog

For the files, you can simply use explorer.exe. In regular Ubuntu, you would use something like xdg-open or simply open, but the environment is not fully configured on the default WSL installation. Instead, lets create an alias!

    echo "alias ,open='explorer.exe'" >> ~/.bash_aliases
    source ~/.bash_aliases

And test it by opening some file

    echo "Contents" > file.txt
    ,open file

You should see your friendly neighborhood notepad pop up :P.

source

Disable the beep

That goddamn beep ( ` ω ´ ).

You can disable it from inside WSL by adding a set bell-style none in the /etc/inputrc file. (source)

Note that if you use vim, you will also have to add the following to your ~/.vimrc

    set visualbell
    set t_vb=

You can also disable it from outside WSL (as a brute force solution) by openning the Volme Mixer in Windows and muting each WSL terminal window.

Conclusion

These are the adjustments I've made to my WSL so far. If you have any additional tips or comments, please send them to my email address. Thanks!

Tags: windows, wsl

As coisas que eu precisei aprender a fazer foram as seguintes:

• Listar autores de um repositório
• Filtrar os commits do repositório por autor, pra ver o que cada um contribuiu
• Relacionar combinações de autores/email diferentes de um mesmo usuário (usando o arquivo .mailmap)
• Em um commit, ver quais arquivos foram alterados
• Ver o que foi alterado em um arquivo específico dentro de um commit
• Verificar o histórico de alteração de um arquivo no repositório (git log arquivo.js)
• Alterar o nome e autor de alguns commits, utilizando o git-filter-repo

Essas tarefas são ótimas pra se familiarizar (ou relembrar) com o andamento de um projeto, ver o ritmo das alterações, quantas mudanças costumam ser embaladas num mesmo commit, e criar um feeling sobre o perfil dos desenvolvedores de um projeto.

Também servem pra organizar e arrumar o histórico e os meta dados dos commits passados, e por isso eu chamo de "House cleaning".

Listar autores de um repositório

Vamos filtrar o git log em combinação com o comando sort, listando apenas as resultados não duplicados.

    git log | grep Author: | sort -u

Você vai ter um resultado nesse formato:

    Author: Guilherme Garcia <guilherme67@gmail.com>
    Author: Guilherme <guilherme@empresa.com>
    Author: guites <6653499+guites@users.noreply.github.com>
    Author: guites <guilherme67@gmail.com>
    Author: gustavo <gustavo@empresa.com>
    Author: gustavo2112 <gustavo2112@gmail.com>

No github, nem todo autor representa uma conta separada. Isso porque a pessoa pode utilizar um git config user.name e git config user.email diferente em diferentes máquinas, conectadas a mesma conta do github.

Como o identificador, no github, é o email, sabemos que o guites <guilherme67@gmail.com> e Guilherme Garcia <guilherme67@gmail.com> são a mesma conta.

Filtrar os commits do repositório por autor

Agora que temos os autores, podemos ver as contribuições de cada um usando

    git log --author=nome_ou_email

Aqui você não precisa digitar o nome ou email completo, pois ele funciona como um filtro. Usando o exemplo anterior, as seguintes combinações funcionariam:

    git log --author=gustavo #mostra resultados tanto de gustavo@empresa.com quanto gustavo2112@gmail.com
    git log --author=guites #mostra resultados tanto de guites quanto 6653499+guites@users.noreply.github.com

Relacionar combinações de autores/email diferentes de um mesmo usuário (usando o arquivo .mailmap)

No exemplo acima, um mesmo usuário tinha configurações locais diferentes, o que pode acabar dificultando a filtragem dos seus commits.

Pra resolver isso, podemos criar um arquivo .mailmap na raíz do repositório (no mesmo diretório onde se encontra o diretório .git).

A estrutura básica do mail map é a seguinte:

    Foo Name <foo@email> commit name <commit@email>
    \--------+---------/ \----------+-------------/
             |                      |
          substituir por          buscar por

No nosso exemplo, digamos que os autores

• Author: Guilherme Garcia guilherme67@gmail.com
• Author: Guilherme guilherme@empresa.com;
• Author: guites 6653499+guites@users.noreply.github.com;
• Author: guites guilherme67@gmail.com;

Sejam a mesma pessoa, configurada em diferentes computadores com nomes e emails diferentes (por ex. usando tanto o email pessoal quanto o empresarial, e em uma outra máquina não configurou o email, daí ficou com um email auto associado do github).

Podemos preencher um .mailmap com as seguintes entradas

   Guilherme Garcia <guilherme67@gmail.com> <guilherme67@gmail.com>
   Guilherme Garcia <guilherme67@gmail.com> <guilherme@empresa.com>
   Guilherme Garcia <guilherme67@gmail.com> <6653499+guites@users.noreply.github.com>

Agora, se rodarmos o filtro por autor uma segunda vez

    git log | grep Author: | sort -u

Vamos ter a seguinte saída:

    Author: Guilherme Garcia <guilherme67@gmail.com>
    Author: gustavo <gustavo@empresa.com>
    Author: gustavo2112 <gustavo2112@gmail.com>

Em um commit, ver quais arquivos foram alterados

Se você quiser saber o que foi feito num commit, pode utilizar o git show no formato abaixo

    git show <commit hash>

Ele vai mostrar na tela um diff de tudo o que foi alterado naquele commit em relação ao anterior. Para commits grandes, pode ser uma boa ideia verificar quais arquivos foram alterados, ao invés de ver quais alterações foram feitas nos arquivos. Pra isso, podemos alterar o comando

    git show <commit hash> --name-only

E vamos receber uma listagem com o nome dos arquivos alterados.

Ver o que foi alterado em um arquivo específico dentro do commit

Depois de decidir qual arquivo você quer analisar dentro do commit selecionado, você pode ver apenas as alterações feitas nele, passando-o como argumento no git show

    git show <commit hash> -- caminho/ate/o/arquivo.extensao

Verificar o histórico de alteração de um arquivo no repositório

Se você precisar do caminho contrário, ou seja, quiser saber qual a sequência de alterações pelas quais um arquivo específico passou, você pode usá-lo como argumento diretamente no git log

    git log caminho/ate/o/arquivo.extensao

E então pode ir usando git show <commit hash> -- caminho/ate/o/arquivo.extensao em cada commit da lista, pra ir acompanhando as alterações realizadas.

Alterar o nome e autor de alguns commits, utilizando o git-filter-repo

Essa é uma forma mais radical de corrigir autores e emails trocados, que envolve reescrever o histórico do repositório.

Se você estiver trabalhando em conjunto nesse repositório, ou se as alterações que você fizer forem envolver commits que já foram enviados pro remote (com o git push por exemplo), essa opção pode dificultar a vida dos outros colaboradores.

O git-filter-repo é um conjunto de scripts escrito em python que permite alterar e reescrever meta dados de um repositório.

Você pode seguir as instruções de instalação no repositório acima, e utilizar o seguinte filtro pra, por exemplo, alterar todos os commits nos quais o autor é guilherme@empresa.com para guilherme67@gmail.com.

Repare que o git possui dois campos de autoria: o autor do commit (commit.author), e a pessoa que registrou o commit (commit.committer).

No caso abaixo, estou alterando ambos os campos.

A flag --force pode ser removida e, nesse caso, o git filter-repo só permite rodar o filtro em um repositório que não possua alterações locais (ou seja, recém clonado).

    git filter-repo --force --commit-callback '
        if commit.author_email == b"guilherme@empresa.com":
            commit.author_email = b"guilherme67@gmail.com"
            commit.author_name = b"guites"
            commit.committer_email = b"guilherme67@gmail.com"
            commit.committer_name = b"guites"
    '

Considerações finais

Espero que esses comandos te ajudem a navegar em novos repositórios, tentando se familiarizar com o código existente, ou a ajustar repositórios antigos bagunçados.

Abraço!

Fontes

• https://lukasmestan.com/using-mailmap-in-git-repository/
• https://stackoverflow.com/a/750182/14427854

Tags: git