<div class="container-fluid flex-no-shrink fit-w">
  <div class="row">
    <div class="col-md-8 col-md-offset-2 col-lg-6 col-lg-offset-3 p-t-24 p-l-16 p-r-16">
      <h3
        class="text-medium l-h-base"
        translate
      >
        Plugins
      </h3>
      <p
        class="lead text-normal"
        translate
      >
        Manage the application plugins.
      </p>
    </div>
  </div>
</div>
<div class="inner-scroll flex-grow">
  @if (appId$ | async; as appId) {
    <c8y-app-plugins [appId]="appId"></c8y-app-plugins>
  }
</div>
<div class="card-footer separator d-flex gap-8 j-c-center">
  @if (stepper.selectedIndex !== 0) {
    <button
      class="btn btn-default"
      type="button"
      data-cy="c8y-plugin-setup-stepper--cancel-button"
      (click)="back()"
      translate
    >
      Previous
    </button>
  }
  <button
    class="btn btn-primary"
    type="submit"
    data-cy="c8y-plugin-setup-stepper--continue-button"
    (click)="next()"
    translate
  >
    Continue
  </button>
</div>