branding/shared/lazy/branding/branding.component.ts
| selector | c8y-branding |
| standalone | true |
| imports |
BreadcrumbComponent
BreadcrumbItemComponent
TitleComponent
HelpComponent
ActionBarItemComponent
IconDirective
C8yTranslateDirective
C8yTranslatePipe
EmptyStateComponent
LoadingComponent
DataGridComponent
NgIf
AsyncPipe
|
| 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, brandingTracking: BrandingTrackingService)
|
|||||||||||||||||||||||||||||||||||||||||||||
|
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) => {
this.brandings.openPreviewForBranding(entry.name);
}
},
{
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;
}
this.brandingTracking.deleteBrandingVariant();
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]="'cog'"
[label]="'Settings' | translate"
></c8y-breadcrumb-item>
<c8y-breadcrumb-item
[icon]="'palette'"
[label]="'Branding' | translate"
></c8y-breadcrumb-item>
<c8y-breadcrumb-item
[icon]="'palette'"
[label]="'Variants' | translate"
[path]="'/branding-editor/variants'"
></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>
<c8y-help [src]="'/docs/enterprise-tenant/customization/#to-configure-branding-settings'"></c8y-help>
<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>