Repository: CryptoBlades/cryptoblades
File: frontend/src/views/Plaza.vue (Vue)

Code before:
                :value="currentCharacterId"
                :showNftOptions="true"
                @input="setCurrentCharacter"
              />
            </div>
          </div>
        </div>
      </b-tab>
      <b-tab @click="garrisonTabActive = true" v-if="haveCharacters">
        <template #title>
          {{$t('plaza.garrison')}}
          <hint class="hint" :text="$t('plaza.garrisonHint')" />
        </template>
        <div class="row mt-3">
          <div class="col">
            <div>
              <div class="d-flex justify-content-space-between">
                <h1>{{$t('characters')}} ({{ ownedGarrisonCharacterIds.length }})</h1>
                <div class="d-flex justify-content-flex-end ml-auto">
                  <b-button
                    v-if="canClaimGarrisonXp"
                    :disabled="isClaimingXp"
                    variant="primary"
                    class="ml-3 gtag-link-others"
                    @click="onClaimGarrisonXp">
                    {{claimGarrisonXpButtonText}}
                  </b-button>
                  <b-button
                    v-if="burningEnabled"
                    :disabled="!haveCharacters"
                    variant="primary"
                    class="ml-3 gtag-link-others"
                    @click="toggleSoulCreation"
                    v-tooltip="$t('plaza.recruitNew')">
                    {{$t('plaza.burn')}} / {{$t('plaza.upgrade')}}
                  </b-button>
                  <b-button
                    v-if="ownCharacters.length === 4"
                    :disabled="!canRecruit()"
                    variant="primary"
                    class="ml-3 gtag-link-others"
                    @click="onMintCharacter"
                    v-tooltip="$t('plaza.recruitNew')" tagname="recruit_character">
                    {{$t('plaza.recruit')}} ({{ recruitCost }} NON-IGO SKILL) <i class="fas fa-plus"></i>
                  </b-button>
                </div>
              </div>

              <character-list
                :showNftOptions="true"
                :isGarrison="true"

Review comment (suggestion):
I would prefer to use conditional translations in line, but I think it's very subjective
`isClaimingXp ? $t('plaza.claiming') : $t('plaza.claimXp')`

Notice I would also move "..." to the translation directly^

Example:
![image](https://user-images.githubusercontent.com/34208222/152051365-e91364fd-e7a8-40e0-96ee-cdd48b1a1aa7.png)


Code after:
                :value="currentCharacterId"
                :showNftOptions="true"
                @input="setCurrentCharacter"
              />
            </div>
          </div>
        </div>
      </b-tab>
      <b-tab @click="garrisonTabActive = true" v-if="haveCharacters">
        <template #title>
          {{$t('plaza.garrison')}}
          <hint class="hint" :text="$t('plaza.garrisonHint')" />
        </template>
        <div class="row mt-3">
          <div class="col">
            <div>
              <div class="d-flex justify-content-space-between">
                <h1>{{$t('characters')}} ({{ ownedGarrisonCharacterIds.length }})</h1>
                <div class="d-flex justify-content-flex-end ml-auto">
                  <b-button
                    v-if="canClaimGarrisonXp"
                    :disabled="isClaimingXp"
                    variant="primary"
                    class="ml-3 gtag-link-others"
                    @click="onClaimGarrisonXp">
                    {{isClaimingXp ? `${$t('plaza.claiming')}` : $t('plaza.claimXp')}}
                  </b-button>
                  <b-button
                    v-if="burningEnabled"
                    :disabled="!haveCharacters"
                    variant="primary"
                    class="ml-3 gtag-link-others"
                    @click="toggleSoulCreation"
                    v-tooltip="$t('plaza.recruitNew')">
                    {{$t('plaza.burn')}} / {{$t('plaza.upgrade')}}
                  </b-button>
                  <b-button
                    v-if="ownCharacters.length === 4"
                    :disabled="!canRecruit()"
                    variant="primary"
                    class="ml-3 gtag-link-others"
                    @click="onMintCharacter"
                    v-tooltip="$t('plaza.recruitNew')" tagname="recruit_character">
                    {{$t('plaza.recruit')}} ({{ recruitCost }} NON-IGO SKILL) <i class="fas fa-plus"></i>
                  </b-button>
                </div>
              </div>

              <character-list
                :showNftOptions="true"
                :isGarrison="true"