Separando funções e métodos

Fiz da forma abaixo encurtando cada chamada e generalizando um pouco mais a função e executou bem.

const html                  = document.querySelector('html');
const banner                = document.querySelector('.app__image');
const focoBt                = document.querySelector('.app__card-button--foco');
const curtoBt               = document.querySelector('.app__card-button--curto');
const longoBt               = document.querySelector('.app__card-button--longo');

function btn(btn_acao,contexto){
    btn_acao.addEventListener('click', () => { 
        html.setAttribute('data-contexto',contexto);
        banner.setAttribute('src', `imagens/${contexto}.png`);
    })
}

btn(focoBt,'foco');
btn(curtoBt,'descanso-curto');
btn(longoBt,'descanso-longo');