<div class="card-pay-header-connection-button__label">
  {{@chainName}}
</div>
<Boxel::Button
  @kind={{if (or @isConnected @isInitializing) "secondary-dark" "primary"}}
  @loading={{@isInitializing}}
  class={{cn
    "card-pay-header-connection-button__button"
    card-pay-header-connection-button__button--connected=(or @isConnected @isInitializing)
  }}
  {{on "click" @onConnect}}
  data-test-card-pay-connect-button
>
  {{#if @isInitializing}}
    {{!-- just show the spinner --}}
    <span class="boxel-sr-only">Reconnecting to {{@chainName}}</span>
  {{else if @isConnected}}
    {{truncate-middle @address}}
  {{else}}
    Connect Wallet
  {{/if}}
</Boxel::Button>
