branding/shared/lazy/branding/branding.component.ts
| selector | c8y-branding |
| standalone | true |
| imports |
CoreModule
DataGridModule
|
| templateUrl | ./branding.component.html |
Properties |
Methods |
|
constructor(brandings: StoreBrandingService, activatedRoute: ActivatedRoute, appState: AppStateService, applicationService: ApplicationService, zip: ZipService, staticAssets: StaticAssetsService, router: Router, modal: BsModalService, confirmModal: ModalService, brandingVersionService: BrandingVersionService, addBrandingModalService: AddBrandingModalService, alert: AlertService, brandingImportModalService: BrandingImportModalService)
|
||||||||||||||||||||||||||||||||||||||||||
|
Parameters :
|
| Async addNewVersion |
addNewVersion()
|
|
Returns :
any
|
| Async applyToApps | ||||||
applyToApps(version: BrandVersion)
|
||||||
|
Parameters :
Returns :
any
|
| Async deleteAllBrandings | ||||||
deleteAllBrandings(publicOptions?: IApplication)
|
||||||
|
Parameters :
Returns :
any
|
| Async duplicateVersion | ||||||
duplicateVersion(version: BrandVersion)
|
||||||
|
Parameters :
Returns :
any
|
| Async editBranding | ||||||
editBranding(brandingName: string)
|
||||||
|
Parameters :
Returns :
unknown
|
| Async exportBranding | ||||||
exportBranding(variant: BrandVersion)
|
||||||
|
Parameters :
Returns :
any
|
| Async getStartedUsingBranding |
getStartedUsingBranding()
|
|
Returns :
any
|
| Async importBranding |
importBranding()
|
|
Returns :
any
|
| refresh |
refresh()
|
|
Returns :
void
|
| actionControls |
Type : ActionControl[]
|
Default value : [
{
type: BuiltInActionType.Edit,
callback: (entry: BrandVersion, _reload) => {
this.editBranding(entry.name);
}
},
{
type: BuiltInActionType.Export,
callback: async (entry: BrandVersion, _reload) => {
await this.exportBranding(entry);
}
},
{
type: 'preview',
icon: 'external-link',
text: gettext('Open preview'),
callback: async (entry: BrandVersion, _reload) => {
window.open(
`/apps/${
this.appState.currentApplication.value?.contextPath || 'cockpit'
}/index.html?brandingPreview=true&dynamicOptionsUrl=/apps/public/public-options@${entry.name}/options.json`,
'_blank',
'noopener,noreferrer'
);
}
},
{
type: 'duplicate',
icon: 'copy',
text: gettext('Duplicate'),
callback: async (entry: BrandVersion, _reload) => {
await this.duplicateVersion(entry);
this.refresh();
}
},
{
type: 'apply-to-app',
icon: 'form',
text: gettext('Apply to specific apps'),
callback: async (entry: BrandVersion, _reload) => {
await this.applyToApps(entry);
this.refresh();
}
},
{
type: 'set-as-default',
icon: 'globe1',
text: gettext('Set as global'),
showIf: (entry: BrandVersion) => {
if (entry.tags?.includes('latest')) {
return false;
}
return true;
},
callback: async (entry: BrandVersion, _reload) => {
try {
await this.confirmModal.confirm(
gettext('Set as global branding'),
gettext(
'Are you sure that you want to set this variant as the global branding? By doing so, this variant will be applied to all apps that do not have a specific branding applied. Do you want to proceed?'
),
Status.INFO
);
} catch {
// did not confirm
return;
}
await this.brandings.markAsActive(entry);
this.refresh();
}
},
{
type: BuiltInActionType.Delete,
showIf: (entry: BrandVersion) => {
if (entry.tags?.includes('latest')) {
return false;
}
return true;
},
callback: async (entry: BrandVersion, _reload) => {
try {
await this.confirmModal.confirm(
gettext('Delete branding variant'),
gettext(
'You are about to delete this branding variant. This action cannot be undone. Do you want to proceed?'
),
Status.DANGER
);
} catch {
// did not confirm
return;
}
await this.applicationService.deleteVersionPackage(entry.publicOptionsApp, {
version: entry.version
});
this.refresh();
}
}
]
|
| availableBrandingVariants$ |
Type : Observable<literal type>
|
| columns |
Type : Column[]
|
Default value : [
{
name: 'name',
header: gettext('Name'),
path: 'name',
filterable: true,
cellRendererComponent: BrandingNameCellRendererComponent
},
{
name: gettext('Applied to`Applications a branding applies to (table column header)`'),
path: 'tags',
filterable: false,
cellCSSClassName: 'small',
cellRendererComponent: BrandingTagsCellRendererComponent,
headerCellRendererComponent: BrandingTagsHeaderCellRendererComponent
},
{
name: 'owner',
header: gettext('Owner'),
path: 'owner',
filterable: false
},
{
name: 'lastUpdated',
header: gettext('Last updated'),
path: 'lastUpdated',
filterable: false
}
]
|
| currentAppContextPath |
Type : string
|
Default value : 'administration'
|
| displayOptions |
Type : DisplayOptions
|
Default value : {
bordered: false,
striped: true,
filter: true,
gridHeader: true,
hover: true
}
|
| pagination |
Type : Pagination
|
Default value : {
pageSize: 10,
currentPage: 1
}
|
<c8y-title translate>Branding</c8y-title>
<c8y-breadcrumb>
<c8y-breadcrumb-item
[icon]="'palette'"
[label]="'Branding' | translate"
[path]="'/branding-editor'"
></c8y-breadcrumb-item>
</c8y-breadcrumb>
<ng-container *ngIf="availableBrandingVariants$ | async as brandingVariant; else loading">
<c8y-action-bar-item
*ngIf="brandingVariant.publicOptions"
[placement]="'right'"
[priority]="30"
>
<button
class="btn btn-link"
(click)="addNewVersion()"
data-cy="branding-add-branding-variant"
>
<i c8yIcon="plus-circle"></i>
<span translate>Add variant</span>
</button>
</c8y-action-bar-item>
<c8y-action-bar-item
[placement]="'right'"
[priority]="20"
>
<button
class="btn btn-link"
data-cy="branding-import-branding"
(click)="importBranding()"
>
<i [c8yIcon]="'data-import'"></i>
<span translate>Import variant</span>
</button>
</c8y-action-bar-item>
<c8y-action-bar-item
*ngIf="brandingVariant.publicOptions"
[placement]="'right'"
[priority]="10"
>
<button
class="btn btn-link"
(click)="deleteAllBrandings(brandingVariant.publicOptions)"
data-cy="branding-remove-all-brandings"
>
<i [c8yIcon]="'trash-o'"></i>
<span translate>Delete all variants</span>
</button>
</c8y-action-bar-item>
<div class="content-fullpage d-flex d-col border-top">
<c8y-data-grid
[title]="'Branding variants' | translate"
[columns]="columns"
[actionControls]="actionControls"
[pagination]="pagination"
[displayOptions]="displayOptions"
(onReload)="refresh()"
[rows]="brandingVariant.variants"
>
<c8y-ui-empty-state
[icon]="'palette'"
[title]="'No branding variants' | translate"
[subtitle]="
'Personalize your experience with a theme-able interface. Create a unique look that aligns
with your brand identity.'
| translate
"
*ngIf="!brandingVariant.publicOptions"
[horizontal]="false"
>
<button
class="btn btn-default"
data-cy="branding-get-started-using-branding"
(click)="getStartedUsingBranding()"
translate
>
Add branding variant
</button>
</c8y-ui-empty-state>
</c8y-data-grid>
</div>
</ng-container>
<ng-template #loading>
<c8y-loading></c8y-loading>
</ng-template>