Web SDK documentation
  1. Components
  2. ApplicationPluginsComponent

File

ecosystem/application-plugins/application-plugins.component.ts

Implements

OnInit OnDestroy

Metadata

selector c8y-app-plugins
templateUrl ./application-plugins.component.html

Index

Properties
Methods
Inputs

Constructor

constructor(activatedRoute: ActivatedRoute, ecosystemService: EcosystemService, bsModalService: BsModalService, modal: ModalService, translateService: TranslateService, pluginsService: PluginsService, alertService: AlertService, gainsightService: GainsightService)
Parameters :
Name Type Optional
activatedRoute ActivatedRoute No
ecosystemService EcosystemService No
bsModalService BsModalService No
modal ModalService No
translateService TranslateService No
pluginsService PluginsService No
alertService AlertService No
gainsightService GainsightService No

Inputs

appId
Type : string | number

Methods

Async cleanupOrphanedPlugins
cleanupOrphanedPlugins(plugins: ApplicationPlugin[])
Parameters :
Name Type Optional
plugins ApplicationPlugin[] No
Returns : any
getActionControls
getActionControls()
Returns : ActionControl[]
getBulkActionControls
getBulkActionControls()
Returns : BulkActionControl[]
Async installPlugins
installPlugins()
Returns : any
Async loadData
loadData()
Returns : any
ngOnDestroy
ngOnDestroy()
Returns : void
ngOnInit
ngOnInit()
Returns : void
refresh
refresh()
Returns : void
Async removePlugins
removePlugins(plugins: string[])
Parameters :
Name Type Optional
plugins string[] No
Returns : any
Async updatePlugin
updatePlugin(app: IApplication, plugin: ApplicationPlugin, downgrade)
Parameters :
Name Type Optional Default value
app IApplication No
plugin ApplicationPlugin No
downgrade No false
Returns : any

Properties

actionControls
Type : ActionControl[]
Default value : this.getActionControls()
allAvailablePlugins$
Type : BehaviorSubject<ApplicationPlugin[]>
Default value : new BehaviorSubject([])
app
Type : IApplication
bulkActionControls
Type : BulkActionControl[]
Default value : this.getBulkActionControls()
columns
Type : Column[]
Default value : [ { name: 'name', header: gettext('Plugin name'), path: 'name', filterable: true }, { name: 'Version', header: gettext('Version'), path: 'version', filterable: false }, { name: 'description', header: gettext('Description'), path: 'description', filterable: false, cellCSSClassName: 'small' }, { name: 'contextPath', header: gettext('Source'), path: 'contextPath', filterable: false, cellRendererComponent: LabelCellRendererComponent }, { name: 'status', header: gettext('Status'), path: 'status', filterable: false, cellRendererComponent: OrphanedStatusCellRendererComponent } ]
CURRENT_LOCATION
Default value : location.href
dataGrid
Type : DataGridComponent
Decorators :
@ViewChild(DataGridComponent, {static: false})
displayOptions
Type : DisplayOptions
Default value : { bordered: false, striped: true, filter: true, gridHeader: true }
exportedPlugins$
Type : BehaviorSubject<ApplicationPlugin[]>
Default value : new BehaviorSubject([])
headerActionControls
Type : HeaderActionControl[]
Default value : []
installedPlugins$
Type : Observable<ApplicationPlugin[]>
Default value : combineLatest([ this.remotePlugins$.pipe(map(remotes => this.convertInstalledRemotesToIds(remotes))), this.allAvailablePlugins$ ]).pipe( map(([remotePlugins, allPlugins]) => this.getInstalledPlugins(allPlugins, remotePlugins)), shareReplay(1) )
isLoading
Type : boolean
loadingItemsLabel
Type : string
Default value : gettext('Loading packages…')
loadMoreItemsLabel
Type : string
Default value : gettext('Load more packages')
orphanedPlugins$
Default value : this.installedPlugins$.pipe( map(plugins => plugins.filter(p => p.status === ApplicationPluginStatus.ORPHANED)) )
pagination
Type : Pagination
Default value : { pageSize: 10, currentPage: 1 }
PRODUCT_EXPERIENCE
Default value : PRODUCT_EXPERIENCE
remotePlugins$
Type : BehaviorSubject<ApplicationRemotePlugins>
Default value : new BehaviorSubject({})
title
Type : string
Default value : gettext('Installed plugins') 
<c8y-title>{{ app | humanizeAppName | async }}</c8y-title>

<c8y-breadcrumb>
  <c8y-breadcrumb-item [icon]="'c8y-atom'" [label]="'Ecosystem' | translate"></c8y-breadcrumb-item>
  <c8y-breadcrumb-item
    [icon]="'c8y-modules'"
    [label]="'Applications' | translate"
    [path]="'ecosystem/applications'"
  ></c8y-breadcrumb-item>
  <c8y-breadcrumb-item
    [icon]="'c8y-modules'"
    [label]="'All applications' | translate"
    [path]="'ecosystem/applications'"
  ></c8y-breadcrumb-item>
  <c8y-breadcrumb-item [label]="app | humanizeAppName | async"></c8y-breadcrumb-item>
  <c8y-breadcrumb-item [label]="'Plugins' | translate"></c8y-breadcrumb-item>
</c8y-breadcrumb>

<c8y-action-bar-item [placement]="'right'">
  <button
    (click)="installPlugins()"
    [ngClass]="{ 'btn-pending': isLoading }"
    class="btn btn-link"
    title="{{ 'Install plugins' | translate }}"
  >
    <i c8yIcon="plus-circle"></i>
    {{ 'Install plugins' | translate }}
  </button>
</c8y-action-bar-item>

<ng-container *ngIf="orphanedPlugins$ | async as orphanedPlugins">
  <c8y-action-bar-item *ngIf="orphanedPlugins?.length" [placement]="'right'">
    <button
      (click)="cleanupOrphanedPlugins(orphanedPlugins)"
      [ngClass]="{ 'btn-pending': isLoading }"
      class="btn btn-link"
      title="{{ 'Clean up orphaned plugins' | translate }}"
    >
      <i c8yIcon="erase"></i>
      {{ 'Clean up orphaned plugins' | translate }}
    </button>
  </c8y-action-bar-item>
</ng-container>

<div class="content-fullpage d-flex d-col border-top">
  <c8y-data-grid
    [title]="title"
    [loadMoreItemsLabel]="loadMoreItemsLabel"
    [loadingItemsLabel]="loadingItemsLabel"
    [displayOptions]="displayOptions"
    [columns]="columns"
    [rows]="installedPlugins$ | async"
    [pagination]="pagination"
    [selectable]="true"
    [actionControls]="actionControls"
    [bulkActionControls]="bulkActionControls"
    [headerActionControls]="headerActionControls"
    (onReload)="refresh()"
    class="d-contents"
  >
    <!-- No search/filtered results empty state -->
    <c8y-ui-empty-state
      *ngIf="(installedPlugins$ | async)?.length"
      [icon]="'search'"
      [title]="'No plugins to display.' | translate"
      [subtitle]="'Refine your search terms or check your spelling.' | translate"
      [horizontal]="true"
    >
    </c8y-ui-empty-state>
    <!-- No installed plugins empty state -->
    <c8y-ui-empty-state
      *ngIf="!(installedPlugins$ | async)?.length && !isLoading"
      [icon]="'plugin'"
      [title]="'No plugins installed.' | translate"
      [subtitle]="'This application doesn\'t have any plugin. Click below to install.' | translate"
      [horizontal]="true"
    >
      <div class="fit-w p-t-16">
        <button
          c8yProductExperience
          [actionName]="PRODUCT_EXPERIENCE.APPLICATIONS.EVENTS.INSTALLED_PLUGINS"
          [actionData]="{
            component: PRODUCT_EXPERIENCE.APPLICATIONS.COMPONENTS.APPLICATION_PLUGINS,
            action: PRODUCT_EXPERIENCE.APPLICATIONS.ACTIONS.INSTALL_PLUGINS,
            url: CURRENT_LOCATION
          }"
          (click)="installPlugins()"
          [ngClass]="{ 'btn-pending': isLoading }"
          class="btn btn-primary btn-sm"
          title="{{ 'Install plugins' | translate }}"
          translate
        >
          Install plugins
        </button>
      </div>
    </c8y-ui-empty-state>
  </c8y-data-grid>
</div>

results matching ""

    No results matching ""