maestrano/mno-enterprise

<div id="create-step-1">
  <div class="row">
    <div class="col-xs-12">
      <h1>Connect your customer's cloud apps</h1>

      <rd-widget class="top-buffer-2" loading="vm.isLoading">
        <rd-widget-header icon="fa-plug fa-cloud" title="{{::vm.organization.name}}'s cloud apps"></rd-widget-header>
        <rd-widget-body classes="no-padding">
          <table class="table table-layout-fixed">
            <thead>
              <tr>
                <th>App</th>
                <th style="width: 33%;">State</th>
                <th style="width: 75px;">Action</th>
              </tr>
            </thead>
            <tbody>
              <tr ng-repeat="app in vm.organization.active_apps | filter : {stack: 'connector'}">
                <td class="nowrap">
                  <img class="small-app-logo" ng-src="{{::main.trustSrc(app.app_logo)}}" alt="{{::app.name}} logo" />
                  <span class="app-name">{{::app.name}}</span>
                </td>
                <td>
                  <div ng-show="!vm.mnoAppInstances.isOauthConnected(app)">
                    <i class="fa fa-exclamation-triangle text-danger"></i>
                    <span>Not connected</span>
                  </div>
                  <div ng-show="vm.mnoAppInstances.isOauthConnected(app)">
                    <i class="fa fa-check-square-o text-success"></i>
                    <span>Connected!</span>
                  </div>
                </td>
                <td>
                  <a class="btn-connect" href="" ng-show="!vm.mnoAppInstances.isOauthConnected(app)" ng-click="vm.connectAppInstance(app)">Connect</a>
                </td>
              </tr>
            </tbody>
          </table>
        </rd-widget-body>
      </rd-widget>

      <button type="button" class="btn btn-primary pull-right top-buffer-2" ui-sref="dashboard.home.organization({ orgId: vm.orgId })">
        Next <i class="fa fa-chevron-right"></i>
      </button>
    </div>
  </div>
</div>