<ion-view id="tab-settings" class="settings">
  <ion-nav-bar class="bar-royal">
    <ion-nav-title>{{'Settings' | translate}}</ion-nav-title>
  </ion-nav-bar>

  <ion-content>
    <div class="settings-list list">
      <div class="item item-divider"></div>
      <a class="ng-hide item item-icon-left item-icon-right" ng-hide="true">
        <i class="icon big-icon-svg">
          <img src="img/icon-exchange.svg" class="bg"/>
        </i>
        <span translate>Bitcoin Exchanges</span>
        <i class="icon bp-arrow-right"></i>
      </a>
      <a class="item item-icon-left item-icon-right" ui-sref="tabs.addressbook">
        <i class="icon big-icon-svg">
          <img src="img/icon-address-book.svg" class="bg"/>
        </i>
        <span translate>Address Book</span>
        <i class="icon bp-arrow-right"></i>
      </a>
      <a class="item item-icon-left item-icon-right" ng-click="openExternalLink('https://help.bitpay.com', true, 'BitPay Help Center', 'Help and support information is available at the BitPay Help Center website. Would you like to go there now?', 'Open Help Center', 'Go Back')">
        <i class="icon big-icon-svg">
          <img src="img/icon-help-support.svg" class="bg"/>
        </i>
        <span translate>Help &amp; Support</span>
        <i class="icon big-icon-svg">
          <img src="img/icon-link.svg" class="bg just-a-hint"/>
        </i>
      </a>
      <a class="ng-hide item item-icon-left item-icon-right" ng-hide="true">
        <i class="icon big-icon-svg">
          <img src="img/icon-send-feedback.svg" class="bg"/>
        </i>
        <span translate>Send Feedback</span>
        <i class="icon bp-arrow-right"></i>
      </a>

      <div class="item item-divider" translate>Preferences</div>

      <a class="item item-icon-left item-icon-right" ui-sref="tabs.notifications" ng-show="usePushNotifications">
        <i class="icon big-icon-svg">
          <img src="img/icon-notifications.svg" class="bg"/>
        </i>
        <span translate>Notifications</span>
        <i class="icon bp-arrow-right"></i>
      </a>
      <!--  See https://github.com/bitpay/bitpay-wallet/issues/265  -->
      <!-- <a class="item item&#45;icon&#45;left item&#45;icon&#45;right" ui&#45;sref="tabs.language"> -->
      <!--   <i class="icon big&#45;icon&#45;svg"> -->
      <!--     <img src="img/icon&#45;language.svg" class="bg"/> -->
      <!--   </i> -->
      <!--   <span translate>Language</span> -->
      <!--   <span class="item&#45;note"> -->
      <!--     {{currentLanguageName|translate}} -->
      <!--   </span> -->
      <!--   <i class="icon bp&#45;arrow&#45;right"></i> -->
      <!-- </a> -->
      <!--  -->
      <a class="item has-setting-value item-icon-left item-icon-right" ui-sref="tabs.unit">
        <i class="icon big-icon-svg">
          <img src="img/icon-unit.svg" class="bg"/>
        </i>
        <span class="setting-title" translate>Bitcoin Unit</span>
        <span class="setting-value">
          {{unitName}}
        </span>
        <i class="icon bp-arrow-right"></i>
      </a>

      <a class="item has-setting-value item-icon-left item-icon-right" ui-sref="tabs.altCurrency">
        <i class="icon big-icon-svg">
          <img src="img/icon-alternative-currency.svg" class="bg"/>
        </i>
        <span class="setting-title" translate>Alternative Currency</span>
        <span class="setting-value">
          {{selectedAlternative.name}}
        </span>
        <i class="icon bp-arrow-right"></i>
      </a>

      <a class="item has-setting-value item-icon-left item-icon-right" ui-sref="tabs.fee">
        <i class="icon big-icon-svg">
          <img src="img/icon-network.svg" class="bg"/>
        </i>
        <span class="setting-title" translate>Bitcoin Network Fee Policy</span>
        <span class="setting-value">
          {{feeOpts[currentFeeLevel]|translate}}
        </span>
        <i class="icon bp-arrow-right"></i>
      </a>

      <div class="item item-divider" ng-show="wallets[0]" translate>Wallets &amp; Integrations</div>

      <a class="item item-icon-left item-icon-right" href
           ui-sref="tabs.preferences({'walletId': item.id})"
           ng-repeat="item in wallets track by $index">
         <i class="icon big-icon-svg circle">
          <img src="img/icon-wallet.svg" ng-style="{'background-color': item.color}" class="bg"/>
        </i>
        <span>
          {{item.name || item.id}}
          <span class="size-12 text-light" ng-show="item.n > 1">
            {{item.m}}-of-{{item.n}}
          </span>
        </span>
        <span class="right text-light assertive" ng-show="!item.isComplete()" translate>
          Incomplete
        </span>
        <i class="icon bp-arrow-right"></i>
      </a>

      <div class="item item-divider"></div>

      <a class="ng-hide item item-icon-left item-icon-right" href ng-hide="true">
        <i class="icon big-icon-svg">
          <img src="img/icon-heart.svg" class="bg"/>
        </i>
        <span translate>Tell a friend</span>
        <i class="icon bp-arrow-right"></i>
      </a>

      <div class="ng-hide item item-divider" ng-hide="true"></div>

      <a class="item item-icon-right item-icon-left" href ui-sref="tabs.advanced">
        <i class="icon big-icon-svg">
          <img src="img/icon-advanced.svg" class="bg"/>
        </i>
        <span translate>Advanced</span>
        <i class="icon bp-arrow-right"></i>
      </a>
      <a class="item item-icon-left item-icon-right" href ui-sref="tabs.about">
        <i class="icon big-icon-svg">
          <img src="img/icon-about.svg" class="bg"/>
        </i>
        <span translate>About</span> {{appName}}
        <i class="icon bp-arrow-right"></i>
      </a>
      <div class="item item-divider"></div>
    </div>
  </ion-content>
</ion-view>
