To get help with coding and structuring your projects, use [StackOverflow](https://stackoverflow.com/) to ask questions with one of the following tags:
-- [`kentico-cloud`](https://stackoverflow.com/questions/tagged/kentico-cloud)
+- [`kentico-kontent`](https://stackoverflow.com/questions/tagged/kentico-kontent)
- [`kentico`](https://stackoverflow.com/questions/tagged/kentico)
Our team members and the community monitor these channels on a regular basis.
diff --git a/README.md b/README.md
index cf3cac0..23db7bf 100644
--- a/README.md
+++ b/README.md
@@ -1,8 +1,13 @@
-## Kentico Cloud Template Manager
+## Kentico Kontent Template Manager
-[](https://kentico.github.io/cloud-template-manager/)
+[](https://kentico.github.io/kontent-template-manager/)
-[](https://travis-ci.com/Kentico/cloud-template-manager)
+[](https://github.com/Kentico/kontent-template-manager/actions/workflows/integrate.yml)
+[](https://app.netlify.com/sites/kontent-template-manager/deploys)
+
+### About
+
+This web based application can be used to `backup` & `restore` Kentico Kontent projects. Under the hood it uses [Kontent backup manager](https://github.com/Kentico/kontent-backup-manager-js) which can be used independently using CLI in case you need to automate your backup processes.
### Running application locally
@@ -15,10 +20,6 @@ npm start
Since the application is build in Angular, you can also use `ng serve` command to run application.
-#### :warning: Limitations
-
-See [a list of limitations](https://kentico.github.io/cloud-template-manager/limitations) before you get started.
-
### Publishing to GitHub pages
Under root, generate app with
@@ -30,7 +31,7 @@ npx ngh --dir=dist
## Submitting Web Template to Templates Gallery
-If you want to submit a Kentico Cloud Web Template to the [Templates Gallery](https://kentico.github.io/cloud-template-manager/templates), please make sure to follow below mentioned guidelines. Once your repository is ready, please adjust [/templates/list.json](/templates/list.json) and create a pull request.
+If you want to submit a Kentico Kontent Web Template to the [Templates Gallery](https://kentico.github.io/kontent-template-manager/templates), please make sure to follow below mentioned guidelines. Once your repository is ready, please adjust [/src/assets/templates/list.json](/src/assets/templates/list.json) and create a pull request.
### Guidelines for Web Templates
@@ -40,13 +41,17 @@ If you want to submit a Kentico Cloud Web Template to the [Templates Gallery](ht
#### Repository structure
* **/source**
+
-
-
- Error
+
+
+
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/src/app/components/messages/message.component.ts b/src/app/components/messages/message.component.ts
index 8589108..29a2fe7 100644
--- a/src/app/components/messages/message.component.ts
+++ b/src/app/components/messages/message.component.ts
@@ -10,8 +10,6 @@ import { BaseComponent } from '../../core/base.component';
})
export class MessageComponent extends BaseComponent {
- @Input() text?: string;
- @Input() html?: string;
@Input() type: 'error' | 'success' | 'warning' | 'info' = 'error';
constructor(
diff --git a/src/app/components/preview/import-data-preview.component.html b/src/app/components/preview/import-data-preview.component.html
index eac9355..653d0fd 100644
--- a/src/app/components/preview/import-data-preview.component.html
+++ b/src/app/components/preview/import-data-preview.component.html
@@ -1,104 +1,62 @@
+ report
+ info
+ check
+ warning
-
- {{ text }}
+
-
-
-
-
-
-
-
- Content types
-
-
- {{ previewData.contentTypes.length }}
-
-
-
-
- Taxonomies
-
-
- {{ previewData.taxonomies.length }}
-
-
-
-
- Assets
-
-
- {{ previewData.assets.length }}
-
-
-
-
- Content items
-
-
- {{ previewData.contentItems.length }}
-
-
-
- Language variants
-
-
- {{ previewData.languageVariants.length }}
+
+
-
+
+
+
+ {{ type.title }}
+
+
+ {{ type.getItems(previewData).length}}
+
+
-
-
+
-
-
-
-
-
-
-
-
-
-
- #{{ i + 1 }}
-
-
- Preview
-
-
- |
-
-
- {{ item.title }}
-
-
-
-
- {
- title: m.fileName,
- data: m
- }),
- contentItems: cleanupData.contentItems.map(m => {
- title: m.name,
- data: m
- }),
- contentTypes: cleanupData.contentTypes.map(m => {
- title: m.system.name,
- data: m
- }),
- languageVariants: [],
- taxonomies: cleanupData.taxonomies.map(m => {
- title: m.system.name,
- data: m
- }),
- }
- }
-
- convertFromImportData(importData: IImportData): IDataPreviewWrapper {
+ convertFromImportData(importData: IImportSource): IDataPreviewWrapper {
const files: IItemPreview[] = [];
- files.push(...importData.assets.map(m => {
- title: m.fileName,
- data: m
- }));
- files.push(...importData.assetsFromFile.map(m => {
- title: m.asset.fileName,
+ files.push(...importData.importData.assets.map(m => {
+ title: m.file_name,
data: m
}));
+ const dataInconsistencies: IItemPreview[] = [];
+ for (const typeIssue of importData.validation.type_issues) {
+ for (const issue of typeIssue.issues) {
+ dataInconsistencies.push({
+ data: issue,
+ title: `${issue.element.codename}: ${issue.messages.join(', ')}`
+ });
+ }
+ }
+ for (const typeIssue of importData.validation.variant_issues) {
+ for (const issue of typeIssue.issues) {
+ dataInconsistencies.push({
+ data: issue,
+ title: `${issue.element.codename}: ${issue.messages.join(', ')}`
+ });
+ }
+ }
+
return {
assets: files,
- taxonomies: importData.taxonomies.map(m => {
- title: m.system.name,
+ taxonomies: importData.importData.taxonomies.map(m => {
+ title: m.name,
data: m
}),
- contentItems: importData.contentItems.map(m => {
+ contentItems: importData.importData.contentItems.map(m => {
title: m.name,
data: m
}),
- contentTypes: importData.contentTypes.map(m => {
- title: m.system.name,
+ contentTypes: importData.importData.contentTypes.map(m => {
+ title: m.name,
data: m
}),
- languageVariants: importData.languageVariants.map(m => {
- title: `${m.itemCodename} [${m.languageCodename}]`,
+ languageVariants: importData.importData.languageVariants.map(m => {
+ title: `${m.item.id} [${m.language.id}]`,
data: m
- })
- };
- }
-
- convertFromImportResult(importResult: IImportResult): IDataPreviewWrapper {
- return {
- assets: importResult.importedAssets.map(m => {
- title: m.importedItem.fileName,
- data: m.importedItem
}),
- taxonomies: importResult.importedTaxonomies.map(m => {
- title: m.importedItem.system.name,
- data: m.importedItem
+ contentTypeSnippets: importData.importData.contentTypeSnippets.map(m => {
+ title: m.name,
+ data: m
}),
- contentItems: importResult.importedContentItems.map(m => {
- title: m.importedItem.name,
- data: m.importedItem
+ languages: importData.importData.languages.map(m => {
+ title: m.name,
+ data: m
}),
- contentTypes: importResult.importedContentTypes.map(m => {
- title: m.importedItem.system.name,
- data: m.importedItem
+ dataInconsistencies: dataInconsistencies,
+ assetFolders: importData.assetFolders.map(m => {
+ title: m.name,
+ data: m
}),
- languageVariants: importResult.importedLanguageVariants.map(m => {
- title: `${m.importedItem.item.id} [${m.originalItem.languageCodename}]`,
- data: m.importedItem
- })
};
}
}
-export const previewHelper = new PreviewHelper();
\ No newline at end of file
+export const previewHelper = new PreviewHelper();
diff --git a/src/app/components/preview/preview-models.ts b/src/app/components/preview/preview-models.ts
index ed662ac..a35be61 100644
--- a/src/app/components/preview/preview-models.ts
+++ b/src/app/components/preview/preview-models.ts
@@ -1,11 +1,24 @@
-export type ActiveType = 'taxonomies' | 'contentTypes' | 'assets' | 'contentItems' | 'languageVariants'
+export type ActiveType =
+ | 'taxonomies'
+ | 'contentTypes'
+ | 'assets'
+ | 'contentItems'
+ | 'languageVariants'
+ | 'languages'
+ | 'dataInconsistencies'
+ | 'contentTypeSnippets'
+ | 'assetFolders';
export interface IDataPreviewWrapper {
contentTypes: IItemPreview[];
contentItems: IItemPreview[];
languageVariants: IItemPreview[];
taxonomies: IItemPreview[];
+ contentTypeSnippets: IItemPreview[];
+ languages: IItemPreview[];
+ dataInconsistencies: IItemPreview[];
assets: IItemPreview[];
+ assetFolders: IItemPreview[];
}
export interface IItemPreview {
diff --git a/src/app/components/processed-items/processed-items.component.html b/src/app/components/processed-items/processed-items.component.html
index c85856d..43826fd 100644
--- a/src/app/components/processed-items/processed-items.component.html
+++ b/src/app/components/processed-items/processed-items.component.html
@@ -1,9 +1,18 @@
-
-
-
-
-
-
\ No newline at end of file
+ = List([]);
+ private _processedItems: List = List([]);
- public get processedItems(): IProcessingItem[] {
+ public get processedItems(): IProcessedItemTransformed[] {
return this._processedItems.toArray();
}
@@ -30,7 +30,7 @@ export class ProcessedItemsComponent extends BaseComponent implements OnInit {
this.dependencies.processingService.processedItemsChanged$.pipe(
map((items) => {
this._processedItems = this._processedItems.unshift(...items);
- super.detectChanges();
+ super.markForCheck();
})
)
);
@@ -38,8 +38,8 @@ export class ProcessedItemsComponent extends BaseComponent implements OnInit {
super.subscribeToObservable(
this.dependencies.processingService.clearProcessedItemsChanged$.pipe(
map((item) => {
- this._processedItems = List([]);
- super.detectChanges();
+ this._processedItems = List([]);
+ super.markForCheck();
})
)
);
diff --git a/src/app/core/base-page.component.ts b/src/app/core/base-page.component.ts
index 32e4819..a26af7d 100644
--- a/src/app/core/base-page.component.ts
+++ b/src/app/core/base-page.component.ts
@@ -1,32 +1,84 @@
-import { ChangeDetectorRef } from '@angular/core';
+import { ChangeDetectorRef, OnDestroy, Directive } from '@angular/core';
+import { SharedModels } from '@kentico/kontent-management';
import { ComponentDependencies } from '../../di';
import { environment } from '../../environments/environment';
import { BaseComponent } from './base.component';
+import { ILayoutConfig } from 'src/services';
type eventCategory = 'button';
-type eventAction = 'download-template' | 'export' | 'prepare-import-from-project' | 'prepare-import-from-file' | 'import-from-file' | 'import-from-project' | 'prepare-cleanup' | 'cleanup' | 'prepare-migrate-from-project' | 'migrate-from-project'
+type eventAction =
+ | 'download-template'
+ | 'direct-import-template'
+ | 'export'
+ | 'prepare-import-from-project'
+ | 'prepare-import-from-file'
+ | 'import-from-file'
+ | 'import-from-project'
+ | 'prepare-cleanup'
+ | 'cleanup'
+ | 'prepare-migrate-from-project'
+ | 'migrate-from-project';
-export abstract class BasePageComponent extends BaseComponent {
+@Directive()
+export abstract class BasePageComponent extends BaseComponent implements OnDestroy {
+ public processsing: boolean = false;
- constructor(
- protected dependencies: ComponentDependencies,
- protected cdr: ChangeDetectorRef,
- ) {
+ constructor(protected dependencies: ComponentDependencies, protected cdr: ChangeDetectorRef) {
super(dependencies, cdr);
dependencies.googleAnalyticsService.trackPageview({
pageTitle: `${environment.google.trackingPrefix}${dependencies.router.url}`,
- pagePath: `${environment.google.trackingPrefix}${dependencies.router.url}`,
+ pagePath: `${environment.google.trackingPrefix}${dependencies.router.url}`
});
}
+ ngOnDestroy(): void {
+ super.ngOnDestroy();
+ this.resetErrors();
+ }
+
+ protected async runWithErrorHandlerAsync(func: () => Promise): Promise {
+ try {
+ await func();
+ } catch (error) {
+ console.error(error);
+ this.processsing = false;
+ if (error instanceof SharedModels.ContentManagementBaseKontentError) {
+ this.setError(`${error.message} ${error.validationErrors.map(m => m.message).join(', ')}`);
+ } else {
+ this.setError(`Unhandled error. ${error}`);
+ }
+ super.markForCheck();
+ }
+ }
+
protected trackEvent(data: {
- eventCategory: eventCategory,
- eventAction: eventAction,
- eventLabel?: string,
- eventValue?: number
+ eventCategory: eventCategory;
+ eventAction: eventAction;
+ eventLabel?: string;
+ eventValue?: number;
}): void {
this.dependencies.googleAnalyticsService.logEvent(data);
}
+
+ protected setConfig(config: ILayoutConfig): void {
+ this.dependencies.layoutService.setLayoutConfig(config);
+ }
+
+ protected setIsDevMode(show: boolean): void {
+ this.dependencies.layoutService.setIsDevMode(show);
+ }
+
+ protected setError(error: string): void {
+ this.dependencies.layoutService.setError(error);
+ }
+
+ protected resetErrors(): void {
+ this.dependencies.layoutService.setError(undefined);
+ }
+
+ protected isDevMode(): boolean {
+ return this.dependencies.layoutService.isDevModeSource.getValue();
+ }
}
diff --git a/src/app/core/base.component.ts b/src/app/core/base.component.ts
index 9165b70..6168f72 100644
--- a/src/app/core/base.component.ts
+++ b/src/app/core/base.component.ts
@@ -1,19 +1,34 @@
-import { ChangeDetectorRef, OnDestroy } from '@angular/core';
+import { ChangeDetectorRef, OnDestroy, Directive } from '@angular/core';
import { Observable, Subject, throwError } from 'rxjs';
import { catchError, takeUntil } from 'rxjs/operators';
import { ComponentDependencies } from '../../di';
import { observableHelper } from '../../utilities';
import { versionInfo } from '../../version';
+import { environment } from 'src/environments/environment';
+import { NavigationExtras } from '@angular/router';
+import { DateTimeFormat } from 'src/services';
+@Directive()
export abstract class BaseComponent implements OnDestroy {
-
protected readonly ngUnsubscribe: Subject = new Subject();
+ public get backupManagerName(): string {
+ return environment.backupManagerName;
+ }
+
+ public get backupManagerUrl(): string {
+ return environment.backupManagerUrl;
+ }
+
public get version(): string {
return versionInfo.version;
}
+ public get kbmVersion(): string {
+ return versionInfo.kbmVersion;
+ }
+
public get isSmallScreen(): boolean {
if (!this.dependencies) {
return false;
@@ -26,31 +41,21 @@ export abstract class BaseComponent implements OnDestroy {
return !this.isSmallScreen;
}
- public isLoading: boolean = false;
-
- constructor(
- protected dependencies: ComponentDependencies,
- protected cdr: ChangeDetectorRef
- ) {
- }
+ constructor(protected dependencies: ComponentDependencies, protected cdr: ChangeDetectorRef) {}
ngOnDestroy(): void {
this.destroy();
}
+ formatDateVerbose(date: DateTimeFormat): string {
+ return this.dependencies.timeService.formatDateVerbose(date);
+ }
+
protected destroy(): void {
this.ngUnsubscribe.next();
this.ngUnsubscribe.complete();
}
- protected startLoading(): void {
- this.isLoading = true;
- }
-
- protected stopLoading(): void {
- this.isLoading = false;
- }
-
protected detectChanges(): void {
this.cdr.detectChanges();
}
@@ -66,16 +71,17 @@ export abstract class BaseComponent implements OnDestroy {
protected subscribeToObservable(observable: Observable): void {
observable
.pipe(
- takeUntil(this.ngUnsubscribe),
- catchError(error => {
- this.markForCheck();
+ catchError((error) => {
return throwError(error);
- })
+ }),
+ takeUntil(this.ngUnsubscribe)
)
.subscribe(() => {
this.markForCheck();
});
}
-
+ protected navigateToAction(action: string, extras?: NavigationExtras): void {
+ this.dependencies.router.navigate([action], extras);
+ }
}
diff --git a/src/app/core/core.module.ts b/src/app/core/core.module.ts
index 4376dd0..a01cccb 100644
--- a/src/app/core/core.module.ts
+++ b/src/app/core/core.module.ts
@@ -3,20 +3,16 @@ import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
-import { DependenciesModule } from '../../di';
-import { ServicesModule } from '../../services';
import { TypographyModule } from '../../typography';
import { CardModule } from '../directives/directives.module';
import { ExternalModule } from '../external';
-import { LayoutModule } from '../layout';
+import { RouterModule } from '@angular/router';
@NgModule({
exports: [
+ RouterModule,
CommonModule,
BrowserAnimationsModule,
- ServicesModule,
- DependenciesModule,
- LayoutModule,
ExternalModule,
TypographyModule,
FormsModule,
diff --git a/src/app/directives/card.directive.ts b/src/app/directives/card.directive.ts
index 4600970..e08c79d 100644
--- a/src/app/directives/card.directive.ts
+++ b/src/app/directives/card.directive.ts
@@ -1,21 +1,16 @@
-import { Directive, ElementRef, Input, OnInit, Renderer2, SimpleChanges } from '@angular/core';
+import { Directive, ElementRef, Input, OnChanges, OnInit, Renderer2, SimpleChanges } from '@angular/core';
@Directive({
- selector: '[libCard]',
+ selector: '[libCard]'
})
-export class CardDirective implements OnInit {
-
+export class CardDirective implements OnInit, OnChanges {
@Input() enableCard: boolean = true;
@Input() addPad: boolean = true;
- protected readonly padClass = 'pad';
+ protected readonly padClass = 'pad-md';
protected readonly standardCardClass = 'w-card';
-
- constructor(
- private hostElement: ElementRef,
- private renderer: Renderer2) {
- }
+ constructor(private hostElement: ElementRef, private renderer: Renderer2) {}
ngOnInit(): void {
this.processCard();
@@ -27,7 +22,6 @@ export class CardDirective implements OnInit {
private processCard(): void {
if (this.hostElement) {
-
if (this.addPad) {
this.renderer.addClass(this.hostElement.nativeElement, this.padClass);
} else {
@@ -36,4 +30,4 @@ export class CardDirective implements OnInit {
this.renderer.addClass(this.hostElement.nativeElement, this.standardCardClass);
}
}
-}
\ No newline at end of file
+}
diff --git a/src/app/directives/directives.module.ts b/src/app/directives/directives.module.ts
index a1651c1..430dc96 100644
--- a/src/app/directives/directives.module.ts
+++ b/src/app/directives/directives.module.ts
@@ -16,4 +16,4 @@ import { CardDirective } from './card.directive';
CardDirective
]
})
-export class CardModule { }
\ No newline at end of file
+export class CardModule { }
diff --git a/src/app/external/external.module.ts b/src/app/external/external.module.ts
index cb5e36f..41e38ea 100644
--- a/src/app/external/external.module.ts
+++ b/src/app/external/external.module.ts
@@ -1,27 +1,27 @@
-import { ScrollDispatchModule } from '@angular/cdk/scrolling';
+import { ScrollingModule } from '@angular/cdk/scrolling';
import { NgModule } from '@angular/core';
import { FlexLayoutModule } from '@angular/flex-layout';
-import {
- MatButtonModule,
- MatCardModule,
- MatCheckboxModule,
- MatDialogModule,
- MatDividerModule,
- MatFormFieldModule,
- MatIconModule,
- MatInputModule,
- MatListModule,
- MatProgressBarModule,
- MatSidenavModule,
- MatToolbarModule,
-} from '@angular/material';
-import { FileDropModule } from 'ngx-file-drop';
+import { MatButtonModule } from '@angular/material/button';
+import { MatCardModule } from '@angular/material/card';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import { MatDialogModule } from '@angular/material/dialog';
+import { MatDividerModule } from '@angular/material/divider';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatIconModule } from '@angular/material/icon';
+import { MatInputModule } from '@angular/material/input';
+import { MatListModule } from '@angular/material/list';
+import { MatProgressBarModule } from '@angular/material/progress-bar';
+import { MatSidenavModule } from '@angular/material/sidenav';
+import { MatToolbarModule } from '@angular/material/toolbar';
+import { MatTooltipModule } from '@angular/material/tooltip';
+import { NgxFileDropModule } from 'ngx-file-drop';
import { NgxJsonViewerModule } from 'ngx-json-viewer';
@NgModule({
imports: [
],
exports: [
+ MatTooltipModule,
MatToolbarModule,
MatSidenavModule,
FlexLayoutModule,
@@ -31,11 +31,11 @@ import { NgxJsonViewerModule } from 'ngx-json-viewer';
MatCardModule,
MatButtonModule,
MatProgressBarModule,
- ScrollDispatchModule,
+ ScrollingModule,
MatDividerModule,
MatListModule,
MatDialogModule,
- FileDropModule,
+ NgxFileDropModule,
MatCheckboxModule,
NgxJsonViewerModule
],
diff --git a/src/app/layout/layout.module.ts b/src/app/layout/layout.module.ts
index f60aab5..a2b50b7 100644
--- a/src/app/layout/layout.module.ts
+++ b/src/app/layout/layout.module.ts
@@ -1,20 +1,28 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
+import { TypographyModule } from 'src/typography/typography.module';
-import { DependenciesModule } from '../../di';
import { ExternalModule } from '../external';
import { MasterLayoutComponent } from './master-layout.component';
+import { ComponentsModule } from '../components/components.module';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { MatCheckboxModule } from '@angular/material/checkbox';
@NgModule({
declarations: [
MasterLayoutComponent
],
imports: [
+ ExternalModule,
+ MatCheckboxModule,
+ FormsModule,
+ ReactiveFormsModule,
CommonModule,
RouterModule,
- DependenciesModule,
- ExternalModule
+ ExternalModule,
+ TypographyModule,
+ ComponentsModule
],
providers: [
],
diff --git a/src/app/layout/master-layout.component.html b/src/app/layout/master-layout.component.html
index 3accba1..2fd1d92 100644
--- a/src/app/layout/master-layout.component.html
+++ b/src/app/layout/master-layout.component.html
@@ -1,73 +1,147 @@
-
-
- Item preview
-
-
- {{ activePreviewedItem.index + 1 }} | {{ activePreviewedItem.title }}
+
\ No newline at end of file
diff --git a/src/app/components/preview/import-data-preview.component.scss b/src/app/components/preview/import-data-preview.component.scss
deleted file mode 100644
index ea3951b..0000000
--- a/src/app/components/preview/import-data-preview.component.scss
+++ /dev/null
@@ -1,17 +0,0 @@
-.w-inactive-item {
- background-color: #e0e0e0;
- color: black;
- cursor: pointer;
-}
-
-.w-active-item {
- background-color: #008ae1;
- color: #ffffff;
- cursor: pointer;
-}
-
-.w-preview-link {
- color: #008ae1;
- cursor: pointer;
- font-weight: 600;
-}
\ No newline at end of file
diff --git a/src/app/components/preview/import-data-preview.component.ts b/src/app/components/preview/import-data-preview.component.ts
index bc065d0..83a412d 100644
--- a/src/app/components/preview/import-data-preview.component.ts
+++ b/src/app/components/preview/import-data-preview.component.ts
@@ -1,117 +1,134 @@
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, OnInit } from '@angular/core';
+import {
+ ChangeDetectionStrategy,
+ ChangeDetectorRef,
+ Component,
+ Input,
+ OnChanges,
+ OnInit,
+ SimpleChanges,
+} from '@angular/core';
import { ComponentDependencies } from '../../../di';
import { BaseComponent } from '../../core/base.component';
import { ActiveType, IDataPreviewWrapper, IItemPreview, IItemPreviewWithIndex } from './preview-models';
+interface ITypeInfo {
+ title: string;
+ type: ActiveType;
+ getItems: (data: IDataPreviewWrapper) => IItemPreview[];
+}
+
@Component({
- selector: 'lib-import-data-preview',
- changeDetection: ChangeDetectionStrategy.OnPush,
- templateUrl: './import-data-preview.component.html',
- styleUrls: ['./import-data-preview.component.scss']
+ selector: 'lib-import-data-preview',
+ changeDetection: ChangeDetectionStrategy.OnPush,
+ templateUrl: './import-data-preview.component.html'
})
-export class ImportDataPreview extends BaseComponent implements OnInit {
-
- @Input() previewData?: IDataPreviewWrapper;
- @Input() showTypes: 'all' | 'contentItemsImport' = 'all';
-
- private _activeType?: ActiveType;
-
- public get activeType(): ActiveType {
- if (this._activeType) {
- return this._activeType;
- }
-
- if (this.showTypes === 'all') {
- return 'contentTypes';
+export class ImportDataPreviewComponent extends BaseComponent implements OnInit, OnChanges {
+ @Input() previewData?: IDataPreviewWrapper;
+
+ public activeType?: ActiveType;
+ public previewedItem?: IItemPreviewWithIndex;
+
+ public get activePreviewedItem(): IItemPreviewWithIndex | undefined {
+ if (this.previewedItem) {
+ return this.previewedItem;
+ }
+
+ if (!this.activeItems) {
+ return undefined;
+ }
+
+ if (this.activeItems.length > 0) {
+ const firstItem = this.activeItems[0];
+ return {
+ data: firstItem.data,
+ index: 0,
+ title: firstItem.title
+ };
+ }
+ return undefined;
}
- return 'assets';
- }
-
- public previewedItem?: IItemPreviewWithIndex;
-
- public get activePreviewedItem(): IItemPreviewWithIndex | undefined {
- if (this.previewedItem) {
- return this.previewedItem;
+ public readonly types: ITypeInfo[] = [
+ {
+ title: 'Content types',
+ type: 'contentTypes',
+ getItems: (data) => data.contentTypes
+ },
+ {
+ title: 'Content type snippets',
+ type: 'contentTypeSnippets',
+ getItems: (data) => data.contentTypeSnippets
+ },
+ {
+ title: 'Content items',
+ type: 'contentItems',
+ getItems: (data) => data.contentItems
+ },
+ {
+ title: 'Taxonomies',
+ type: 'taxonomies',
+ getItems: (data) => data.taxonomies
+ },
+ {
+ title: 'Languages',
+ type: 'languages',
+ getItems: (data) => data.languages
+ },
+ {
+ title: 'Language variants',
+ type: 'languageVariants',
+ getItems: (data) => data.languageVariants
+ },
+ {
+ title: 'Assets',
+ type: 'assets',
+ getItems: (data) => data.assets
+ },
+ {
+ title: 'Asset folders',
+ type: 'assetFolders',
+ getItems: (data) => data.assetFolders
+ },
+ {
+ title: 'Data inconsistencies',
+ type: 'dataInconsistencies',
+ getItems: (data) => data.dataInconsistencies
+ }
+ ];
+
+ public activeItems: IItemPreview[] = [];
+
+ constructor(dependencies: ComponentDependencies, cdr: ChangeDetectorRef) {
+ super(dependencies, cdr);
}
- if (!this.activeItems) {
- return undefined;
- }
+ ngOnInit(): void {}
- if (this.activeItems.length > 0) {
- const firstItem = this.activeItems[0];
- return {
- data: firstItem.data,
- index: 0,
- title: firstItem.title
- }
+ ngOnChanges(simpleChanges: SimpleChanges): void {
+ if (this.previewData && !this.activeType) {
+ this.activeItems = this.previewData.contentTypes;
+ this.activeType = 'contentTypes';
+ }
}
- return undefined;
- }
- public get activeItems(): IItemPreview[] | undefined {
- if (!this.previewData) {
- return undefined;
+ previewItem(item: IItemPreview, index: number): void {
+ this.previewedItem = {
+ data: item.data,
+ index: index,
+ title: item.title
+ };
+ super.markForCheck();
}
- if (this.activeType === 'contentTypes') {
- return this.previewData.contentTypes;
- }
+ setType(type: ITypeInfo): void {
+ if (!this.previewData) {
+ return;
+ }
- if (this.activeType === 'assets') {
- return this.previewData.assets;
+ this.activeType = type.type;
+ this.previewedItem = undefined;
+ this.activeItems = type.getItems(this.previewData);
+ super.markForCheck();
}
-
- if (this.activeType === 'taxonomies') {
- return this.previewData.taxonomies;
- }
-
- if (this.activeType === 'contentItems') {
- return this.previewData.contentItems;
- }
-
- if (this.activeType === 'languageVariants') {
- return this.previewData.languageVariants;
- }
- }
-
- constructor(
- dependencies: ComponentDependencies,
- cdr: ChangeDetectorRef) {
- super(dependencies, cdr);
- }
-
- ngOnInit(): void {
- }
-
- showType(type: ActiveType): boolean {
- if (this.showTypes === 'all') {
- return true;
- }
-
- if (this.showTypes === 'contentItemsImport') {
- const allowedTypes: ActiveType[] = ['assets', 'contentItems', 'languageVariants'];
-
- return allowedTypes.includes(type);
- }
-
- throw Error(`Unsupported show type`);
- }
-
- previewItem(item: IItemPreview, index: number): void {
- this.previewedItem = {
- data: item.data,
- index: index,
- title: item.title
- };
- super.detectChanges();
- }
-
- setType(type: ActiveType): void {
- this._activeType = type;
- this.previewedItem = undefined;
- super.detectChanges();
- }
}
diff --git a/src/app/components/preview/preview-helper.ts b/src/app/components/preview/preview-helper.ts
index 4a2c187..d75f6bd 100644
--- a/src/app/components/preview/preview-helper.ts
+++ b/src/app/components/preview/preview-helper.ts
@@ -1,86 +1,66 @@
-import { ICleanupData, IImportData, IImportResult } from '../../../services';
import { IDataPreviewWrapper, IItemPreview } from './preview-models';
+import { IImportSource } from '@kentico/kontent-backup-manager';
export class PreviewHelper {
- convertFromCleanupData(cleanupData: ICleanupData): IDataPreviewWrapper {
- return {
- assets: cleanupData.assets.map(m =>
+
+
+
-
+
+
+
+
+
+ #{{ i + 1 }}
+
+
+ Preview
+
+
+ {{ item.title }}
+
+
-
- No item is selected
-
+
+
-
+
+
+
+ No item is selected
+
+
+
- {{ processedItem.action }} {{ processedItem.type }}: {{ processedItem.name }} -
-
+
+
+
\ No newline at end of file
diff --git a/src/app/components/processed-items/processed-items.component.ts b/src/app/components/processed-items/processed-items.component.ts
index 5f950fb..35beb6e 100644
--- a/src/app/components/processed-items/processed-items.component.ts
+++ b/src/app/components/processed-items/processed-items.component.ts
@@ -3,8 +3,8 @@ import { List } from 'immutable';
import { map } from 'rxjs/operators';
import { ComponentDependencies } from '../../../di';
-import { IProcessingItem } from '../../../services';
import { BaseComponent } from '../../core/base.component';
+import { IProcessedItemTransformed } from '../../../services';
@Component({
selector: 'lib-processed-items',
@@ -13,9 +13,9 @@ import { BaseComponent } from '../../core/base.component';
})
export class ProcessedItemsComponent extends BaseComponent implements OnInit {
- private _processedItems: List
+
+
+
+ {{ processedItem.title }}
+
+
+ {{ processedItem.title }}
+
+
+
+ {{ processedItem.type }}
+
+
-
- menu
-
-
- {{ appName }}
-
-
-
-
-
- v{{ version }}
+
-
+
+
+
+
+
+
-
-
+
diff --git a/src/app/pages/cleanup/cleanup.component.ts b/src/app/pages/cleanup/cleanup.component.ts
new file mode 100644
index 0000000..cbfbe31
--- /dev/null
+++ b/src/app/pages/cleanup/cleanup.component.ts
@@ -0,0 +1,143 @@
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { MatDialog } from '@angular/material/dialog';
+import { CleanService } from '@kentico/kontent-backup-manager';
+import { map, switchMap } from 'rxjs/operators';
+import { environment } from 'src/environments/environment';
+import { IProjectCheck } from 'src/services';
+
+import { ComponentDependencies } from '../../../di';
+import { BasePageComponent } from '../../core/base-page.component';
+import { ConfirmationDialogComponent } from '../dialogs/confirmation-dialog.component';
+
+@Component({
+ changeDetection: ChangeDetectionStrategy.OnPush,
+ templateUrl: './cleanup.component.html'
+})
+export class CleanupComponent extends BasePageComponent implements OnInit {
+ public formGroup: FormGroup;
+ public success: boolean = false;
+
+ public project?: IProjectCheck;
+
+ public get canClean(): boolean {
+ if (this.formGroup.invalid) {
+ return false;
+ }
+ if (!this.project) {
+ return false;
+ }
+
+ return true;
+ }
+
+ constructor(
+ dependencies: ComponentDependencies,
+ cdr: ChangeDetectorRef,
+ private fb: FormBuilder,
+ private dialog: MatDialog
+ ) {
+ super(dependencies, cdr);
+
+ this.formGroup = this.fb.group({
+ projectId: ['', Validators.required],
+ apiKey: ['', Validators.required]
+ });
+ }
+
+ openConfirmation(): void {
+ const dialogRef = this.dialog.open(ConfirmationDialogComponent, {
+ width: '400px',
+ data: {}
+ });
+
+ dialogRef.afterClosed().subscribe((result) => {
+ if (dialogRef.componentInstance.confirmed) {
+ }
+ });
+ }
+
+ ngOnInit(): void {
+ super.setConfig({
+ title: 'Clean',
+ showDevMode: false
+ });
+
+ this.initForm();
+ }
+
+ async deleteWithConfirm(): Promise {
+ if (!this.canClean) {
+ return;
+ }
+
+ const dialogRef = this.dialog.open(ConfirmationDialogComponent, {
+ width: '400px',
+ data: {
+ text: 'Are you sure to delete all data in given project? This action is not reversible.'
+ }
+ });
+
+ dialogRef.afterClosed().subscribe(async (result) => {
+ if (dialogRef.componentInstance.confirmed) {
+ // confirmed
+ await this.handleDelete();
+ }
+ });
+ }
+
+ private async handleDelete(): Promise {
+ await super.runWithErrorHandlerAsync(async () => {
+ if (this.formGroup.invalid || this.processsing) {
+ return;
+ }
+
+ this.processsing = true;
+ super.markForCheck();
+
+ super.trackEvent({
+ eventCategory: 'button',
+ eventAction: 'export'
+ });
+
+ const cleanService = new CleanService({
+ projectId: this.formGroup.controls['projectId'].value,
+ apiKey: this.formGroup.controls['apiKey'].value,
+ onDelete: (item) => {
+ this.dependencies.processingService.addProcessedItem(item);
+ }
+ });
+
+ await cleanService.cleanAllAsync();
+
+ this.processsing = false;
+ this.success = true;
+ super.markForCheck();
+ });
+ }
+
+ private initForm(): void {
+ super.subscribeToObservable(
+ this.formGroup.valueChanges.pipe(
+ switchMap((form) => {
+ const projectId = form.projectId;
+ const apiKey = form.apiKey;
+
+ return this.dependencies.projectService.validateProject({
+ projectId: projectId,
+ apiKey: apiKey
+ });
+ }),
+ map((result) => {
+ this.project = result;
+ super.markForCheck();
+ })
+ )
+ );
+
+ const defaultProjectId = environment.defaultProjects.targetProjectId;
+ const defaultApiKey = environment.defaultProjects.targetProjectApiKey;
+
+ this.formGroup.setValue({ projectId: defaultProjectId, apiKey: defaultApiKey });
+ }
+}
diff --git a/src/app/pages/dialogs/confirmation-dialog.component.html b/src/app/pages/dialogs/confirmation-dialog.component.html
new file mode 100644
index 0000000..d6568af
--- /dev/null
+++ b/src/app/pages/dialogs/confirmation-dialog.component.html
@@ -0,0 +1,18 @@
+,
+ public dialogRef: MatDialogRef,
@Inject(MAT_DIALOG_DATA) public data: any,
dependencies: ComponentDependencies,
cdr: ChangeDetectorRef) {
super(dependencies, cdr);
+ if (data.text) {
+ this.text = data.text;
+ }
}
close(): void {
diff --git a/src/app/pages/export/export.component.html b/src/app/pages/export/export.component.html
index 64e6021..62d5e37 100644
--- a/src/app/pages/export/export.component.html
+++ b/src/app/pages/export/export.component.html
@@ -1,60 +1,62 @@
-
-
+
-
+
-
+
-
+
-
-
-
+
+
+ v{{ version }}
+ © {{ year }}
+
- {{ item.icon }}
-
-
- {{ item.title}}
-
-
-
-
+
diff --git a/src/app/layout/master-layout.component.scss b/src/app/layout/master-layout.component.scss
deleted file mode 100644
index 2692123..0000000
--- a/src/app/layout/master-layout.component.scss
+++ /dev/null
@@ -1,56 +0,0 @@
-@import '../../assets/styles/styles-core.scss';
-.w-layout-container {
- position: absolute;
- top: 64px;
- bottom: 0;
- left: 0;
- right: 0;
- background: rgb(240, 240, 240);
-}
-
-.w-layout-side-menu {
- width: 270px;
-}
-
-.w-layout-content {
- margin: 16px;
-}
-
-.w-layout-github-logo {
- height: 40px;
-}
-
-.w-layout-side-item {
- display: block;
- text-decoration: none;
- padding: 12px;
- color: rgb(95, 95, 95);
- font-size: 14px;
- cursor: pointer;
- &:hover {
- /* background-color: $accentColor; */
- color: $primaryColor;
- }
-
- &.active {
- /* background-color: rgb(238, 238, 238); */
- color: $primaryColor;
- background: rgb(240, 240, 240);
- }
-
-}
-
-.w-layout-side-section {
- display: block;
- text-align: left;
- text-decoration: none;
- font-weight: 600;
- padding: 12px;
- font-size: 12px;
- color :rgb(43, 43, 43);
- border-top: solid 1px rgb(201, 201, 201);
-}
-
-.w-layout-version {
- font-size: 12px;
-}
\ No newline at end of file
diff --git a/src/app/layout/master-layout.component.ts b/src/app/layout/master-layout.component.ts
index ece2e93..60a359f 100644
--- a/src/app/layout/master-layout.component.ts
+++ b/src/app/layout/master-layout.component.ts
@@ -1,138 +1,181 @@
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';
+import { map } from 'rxjs/operators';
import { ComponentDependencies } from '../../di';
import { environment } from '../../environments/environment';
import { stringHelper } from '../../utilities';
import { BaseComponent } from '../core/base.component';
+import { ILayoutConfig } from 'src/services';
+import { MatCheckboxChange } from '@angular/material/checkbox';
interface INavigationItem {
- routerLink?: string;
- title: string;
- icon?: string;
- type: 'link' | 'section'
+ routerLink?: string;
+ title: string;
+ icon?: string;
+ type: 'link' | 'section';
+}
+
+interface ILayoutOptions {
+ fixed: boolean;
+ topGap: number;
+ bottomGap: number;
}
@Component({
- changeDetection: ChangeDetectionStrategy.OnPush,
- templateUrl: './master-layout.component.html',
- styleUrls: [
- './master-layout.component.scss'
- ]
+ changeDetection: ChangeDetectionStrategy.OnPush,
+ templateUrl: './master-layout.component.html'
})
export class MasterLayoutComponent extends BaseComponent implements OnInit {
+ public appName: string = environment.appName;
+ public config?: ILayoutConfig;
+ public error?: string;
+ public showDevMode: boolean = false;
+ public isDevMode: boolean;
+ public year: number = new Date().getFullYear();
+ public navbarId: string = 'template-manager-navbar';
+ private readonly headerScrollPixelsThreshold: number = 5;
+ private readonly headerScrolledClass: string = 'navbar-scrolled';
+
+ private readonly isDevModeStorage: string = 'isDevMode';
+ private readonly isDevModeStorageSource: string = 'master';
+
+ public navigationItems: INavigationItem[] = [
+ {
+ title: 'Home',
+ routerLink: '/',
+ icon: 'home',
+ type: 'link'
+ },
+ {
+ title: 'Export',
+ routerLink: '/export',
+ icon: 'cloud_download',
+ type: 'link'
+ },
+ {
+ title: 'Import',
+ routerLink: '/import',
+ icon: 'settings_backup_restore',
+ type: 'link'
+ },
+ {
+ title: 'Cleanup',
+ routerLink: '/cleanup',
+ icon: 'delete',
+ type: 'link'
+ },
+ {
+ title: 'Templates',
+ routerLink: '/templates',
+ icon: 'dashboard',
+ type: 'link'
+ },
+ {
+ title: 'FAQ',
+ routerLink: '/faq',
+ icon: 'help',
+ type: 'link'
+ }
+ ];
+
+ public readonly layoutOptions: ILayoutOptions = {
+ fixed: true,
+ topGap: 64,
+ bottomGap: 0
+ };
+
+ constructor(dependencies: ComponentDependencies, cdr: ChangeDetectorRef) {
+ super(dependencies, cdr);
+
+ this.isDevMode = this.getStoredIsDevMode();
+ }
- public appName: string = environment.appName;
-
- public navigationItems: INavigationItem[] = [
- {
- title: 'Import & export',
- type: 'section'
- },
- {
- title: 'Import from project',
- routerLink: '/',
- icon: 'settings_backup_restore',
- type: 'link'
- },
- {
- title: 'Import from file',
- routerLink: '/import-from-file',
- icon: 'settings_backup_restore',
- type: 'link'
- },
- {
- title: 'Migrate items between projects',
- routerLink: '/migrate-content-items',
- icon: 'sync',
- type: 'link'
- },
- {
- title: 'Export',
- routerLink: '/export',
- icon: 'cloud_download',
- type: 'link'
- },
- {
- title: 'Common',
- type: 'section'
- },
- {
- title: 'Cleanup',
- routerLink: '/cleanup',
- icon: 'delete',
- type: 'link'
- },
- {
- title: 'Gallery',
- type: 'section'
- },
- {
- title: 'Templates',
- routerLink: '/templates',
- icon: 'list',
- type: 'link'
- },
- {
- title: 'FAQ',
- type: 'section'
- },
- {
- title: 'Limitations',
- routerLink: '/limitations',
- icon: 'help',
- type: 'link'
+ ngAfterViewChecked(): void {
+ const navbar = document.getElementById(this.navbarId);
+ if (navbar) {
+ window.onscroll = () => {
+ if (window.scrollY > this.headerScrollPixelsThreshold) {
+ navbar.classList.add(this.headerScrolledClass);
+ } else {
+ navbar.classList.remove(this.headerScrolledClass);
+ }
+ };
+ }
}
- ];
- constructor(
- dependencies: ComponentDependencies,
- cdr: ChangeDetectorRef) {
- super(dependencies, cdr);
- }
+ ngOnInit(): void {
+ super.subscribeToObservable(
+ this.dependencies.layoutService.layoutConfigChanged.pipe(
+ map((config) => {
+ this.config = config;
+ super.detectChanges();
+ })
+ )
+ );
+
+ super.subscribeToObservable(
+ this.dependencies.layoutService.errorChanged$.pipe(
+ map((error) => {
+ this.error = error;
+ super.detectChanges();
+ })
+ )
+ );
+ }
+
+ handleIsDevModechange(event: MatCheckboxChange): void {
+ this.dependencies.layoutService.setIsDevMode(event.checked);
+ this.storeIsDevMode(event.checked);
+ }
- ngOnInit(): void {
- }
+ menuItemIsActive(path: string, exactMatch: boolean = true): boolean {
+ const currentUrlWithoutQueryString = this.removeQueryStringFromUrl(this.dependencies.router.url);
- menuItemIsActive(path: string, exactMatch: boolean = true): boolean {
- const currentUrlWithoutQueryString = this.removeQueryStringFromUrl(this.dependencies.router.url);
+ // get urls to compare
+ const processedCurrentUrl = this.getActionUrl(currentUrlWithoutQueryString);
+ const processedItemUrl = this.getActionUrl(path);
- // get urls to compare
- const processedCurrentUrl = this.getActionUrl(currentUrlWithoutQueryString);
- const processedItemUrl = this.getActionUrl(path);
+ if (exactMatch) {
+ return processedCurrentUrl.toLowerCase() === processedItemUrl.toLowerCase();
+ }
- if (exactMatch) {
- return processedCurrentUrl.toLowerCase() === processedItemUrl.toLowerCase();
+ return processedCurrentUrl.startsWith(processedItemUrl);
}
- return processedCurrentUrl.startsWith(processedItemUrl);
- }
+ getActionUrl(action: string | undefined): string {
+ if (!action) {
+ return '';
+ }
- getActionUrl(action: string | undefined): string {
- if (!action) {
- return '';
- }
+ // prepare route url
+ let routeUrl = action;
- // prepare route url
- let routeUrl = action;
+ // add starting '/'
+ if (!routeUrl.startsWith('/')) {
+ routeUrl = '/' + routeUrl;
+ }
- // add starting '/'
- if (!routeUrl.startsWith('/')) {
- routeUrl = '/' + routeUrl;
- }
+ // remove '/' from end
+ if (routeUrl.endsWith('/')) {
+ routeUrl = routeUrl.substring(0, routeUrl.length - 1);
+ }
- // remove '/' from end
- if (routeUrl.endsWith('/')) {
- routeUrl = routeUrl.substring(0, routeUrl.length - 1);
+ return routeUrl;
}
- return routeUrl;
- }
+ protected removeQueryStringFromUrl(url: string): string {
+ if (!url) {
+ return '';
+ }
- protected removeQueryStringFromUrl(url: string): string {
- if (!url) {
- return '';
+ return stringHelper.removeEverythingAfterIncludingSeparator(url, '?');
}
- return stringHelper.removeEverythingAfterIncludingSeparator(url, '?');
- }
+ private storeIsDevMode(isDevMode: boolean): void {
+ this.dependencies.storageService.set(this.isDevModeStorageSource, this.isDevModeStorage, isDevMode);
+ }
+
+ private getStoredIsDevMode(): boolean {
+ return this.dependencies.storageService.get(this.isDevModeStorageSource, this.isDevModeStorage) ?? false;
+ }
}
diff --git a/src/app/pages/cleanup/cleanup.component.html b/src/app/pages/cleanup/cleanup.component.html
new file mode 100644
index 0000000..39b60fb
--- /dev/null
+++ b/src/app/pages/cleanup/cleanup.component.html
@@ -0,0 +1,61 @@
+
- {{ item.title }}
-
+
+
+
+
+ {{ config.title }}
-
-
+
+ Dev mode
+
+
-
+
+
+
+ {{ error }}
+
-
\ No newline at end of file
+
+ Data in given project were deleted
+
+
+
+
+
++ This feature deletes everything from a given project. This action is not reversible. +
+ + + +Confirmation
+
+
+{{ text }}
+
+
\ No newline at end of file
diff --git a/src/app/pages/shared/cleanup/cleanup-confirm.component.ts b/src/app/pages/dialogs/confirmation-dialog.component.ts
similarity index 57%
rename from src/app/pages/shared/cleanup/cleanup-confirm.component.ts
rename to src/app/pages/dialogs/confirmation-dialog.component.ts
index 828ad7b..e85fc8e 100644
--- a/src/app/pages/shared/cleanup/cleanup-confirm.component.ts
+++ b/src/app/pages/dialogs/confirmation-dialog.component.ts
@@ -1,23 +1,27 @@
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Inject } from '@angular/core';
-import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
+import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
-import { ComponentDependencies } from '../../../../di';
-import { BaseComponent } from '../../../core/base.component';
+import { ComponentDependencies } from '../../../di';
+import { BaseComponent } from '../../core/base.component';
@Component({
changeDetection: ChangeDetectionStrategy.OnPush,
- templateUrl: './cleanup-confirm.component.html',
+ templateUrl: './confirmation-dialog.component.html',
})
-export class CleanupConfirmComponent extends BaseComponent {
+export class ConfirmationDialogComponent extends BaseComponent {
public confirmed: boolean = false;
+ public text: string = 'Are you sure to continue?';
constructor(
- public dialogRef: MatDialogRef
+
+
+
+
+
+
+
+
+ Continue
+
+
+
-
-
-- Export data -
- -- This function enables you to create json export package of data from given project -
- -
-
-
-
-
-
-
-
-
-
-
-
+
-
-
-
-
-
+ Project data successfully exported
+
-
-
+
-
-
+
+
-
-
-
\ No newline at end of file
diff --git a/src/app/pages/export/export.component.ts b/src/app/pages/export/export.component.ts
index a9a63b8..e3399a7 100644
--- a/src/app/pages/export/export.component.ts
+++ b/src/app/pages/export/export.component.ts
@@ -1,136 +1,126 @@
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component } from '@angular/core';
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
-import { CloudError } from 'kentico-cloud-core';
-import { throwError } from 'rxjs';
-import { catchError, map } from 'rxjs/operators';
+import { ExportService, ZipService } from '@kentico/kontent-backup-manager';
+import { saveAs } from 'filesaver.js';
+import { map, switchMap } from 'rxjs/operators';
+import { IProjectCheck } from 'src/services';
import { ComponentDependencies } from '../../../di';
import { environment } from '../../../environments/environment';
-import { IImportData } from '../../../services';
-import { previewHelper } from '../../components/preview/preview-helper';
-import { IDataPreviewWrapper } from '../../components/preview/preview-models';
import { BasePageComponent } from '../../core/base-page.component';
@Component({
- changeDetection: ChangeDetectionStrategy.OnPush,
- templateUrl: './export.component.html',
+ changeDetection: ChangeDetectionStrategy.OnPush,
+ templateUrl: './export.component.html'
})
-export class ExportComponent extends BasePageComponent {
+export class ExportComponent extends BasePageComponent implements OnInit {
+ public formGroup: FormGroup;
+ public success: boolean = false;
+ public project?: IProjectCheck;
+
+ public get canExport(): boolean {
+ if (this.formGroup.invalid) {
+ return false;
+ }
+ if (!this.project) {
+ return false;
+ }
+
+ return true;
+ }
- public formGroup: FormGroup;
- public error?: string;
- public importData?: IImportData;
- public step: 'initial' | 'exporting' | 'completed' = 'initial';
+ constructor(dependencies: ComponentDependencies, cdr: ChangeDetectorRef, private fb: FormBuilder) {
+ super(dependencies, cdr);
- public get importPreviewData(): IDataPreviewWrapper | undefined {
- if (!this.importData) {
- return undefined;
+ this.formGroup = this.fb.group({
+ projectId: ['', Validators.required],
+ apiKey: ['', Validators.required]
+ });
}
- return previewHelper.convertFromImportData(this.importData);
- }
- public get canSubmit(): boolean {
- return this.formGroup.valid;
- }
+ ngOnInit(): void {
+ super.setConfig({
+ title: 'Export project data',
+ showDevMode: true
+ });
- public get parsedLanguages(): string[] {
- const languagesValue = this.formGroup.controls['languages'].value as string | undefined;
- if (!languagesValue) {
- return [];
+ this.initForm();
}
- return languagesValue.split(';').map(m => m.trim());
- }
- public get showDownloadButton(): boolean {
- if (this.importData) {
- return true;
- }
- return false;
- }
-
- constructor(
- dependencies: ComponentDependencies,
- cdr: ChangeDetectorRef,
- private fb: FormBuilder) {
- super(dependencies, cdr);
-
- this.formGroup = this.fb.group({
- projectId: [environment.defaultProjects.sourceProjectId, Validators.required],
- languages: [environment.defaultProjects.languages],
- });
- }
-
- handleDownloadFile(): void {
- const config = this.getConfig();
-
- if (config && this.importData) {
- this.dependencies.exportService.createAndDownloadZipFile(config.projectId, this.importData, () => {
- super.stopLoading();
- this.step = 'completed';
- super.detectChanges();
- });
- }
- }
-
- handleExport(): void {
- const config = this.getConfig();
- this.resetErrors();
-
- if (config) {
- this.step = 'exporting';
-
- // track gEvent
- super.trackEvent({
- eventCategory: 'button',
- eventAction: 'export',
- });
-
- super.startLoading();
- super.detectChanges();
- super.subscribeToObservable(
- this.dependencies.exportService.getImportDataWithDeliveryApi({
- languages: this.parsedLanguages,
- publishAllItems: false,
- sourceProjectId: config.projectId,
- targetProjectCmApiKey: 'xxx',
- targetProjectId: 'xxx',
- depth: 1
- }).pipe(
- map((result) => {
- this.importData = result;
-
- this.handleDownloadFile();
- }),
- catchError((err) => {
- if (err instanceof CloudError) {
- this.error = err.message;
- } else {
- this.error = err;
+ handleDownloadFile(): void {}
+
+ async handleExport(): Promise {
+ await super.runWithErrorHandlerAsync(async () => {
+ if (this.formGroup.invalid || this.processsing || !this.project) {
+ return;
}
- super.stopLoading();
- return throwError(err);
- })
- ),
- )
- }
- }
- private getConfig(): {
- projectId: string,
- } | undefined {
- const projectId = this.formGroup.controls['projectId'].value;
+ this.processsing = true;
+ super.markForCheck();
+
+ super.trackEvent({
+ eventCategory: 'button',
+ eventAction: 'export'
+ });
+
+ const exportService = new ExportService({
+ projectId: this.formGroup.controls['projectId'].value,
+ apiKey: this.formGroup.controls['apiKey'].value,
+ onExport: (item) => {
+ this.dependencies.processingService.addProcessedItem(item);
+ }
+ });
- if (!projectId) {
- this.error = 'Invalid project id';
- return;
+ const exportData = await exportService.exportAllAsync();
+
+ const zipService = new ZipService({
+ context: 'browser',
+ enableLog: this.isDevMode()
+ });
+
+ const fileName = this.getDefaultBackupFilename(this.project) + '.zip';
+
+ // create zip file
+ const zipFile = await zipService.createZipAsync(exportData);
+
+ this.processsing = false;
+ this.success = true;
+ super.markForCheck();
+
+ // download file
+ saveAs(zipFile, fileName);
+ });
}
- return {
- projectId: projectId,
- };
- }
+ private getDefaultBackupFilename(project: IProjectCheck): string {
+ const date = new Date();
+ return `kontent-backup-${project.projectName}-${date.getDate()}-${
+ date.getMonth() + 1
+ }-${date.getFullYear()}-${date.getHours()}-${date.getMinutes()}`;
+ }
- private resetErrors(): void {
- this.error = undefined;
- }
+ private initForm(): void {
+ super.subscribeToObservable(
+ this.formGroup.valueChanges.pipe(
+ switchMap((form) => {
+ const projectId = form.projectId;
+ const apiKey = form.apiKey;
+
+ return this.dependencies.projectService.validateProject({
+ projectId: projectId,
+ apiKey: apiKey
+ });
+ }),
+ map((result) => {
+ this.project = result;
+ super.markForCheck();
+ })
+ )
+ );
+
+ const defaultProjectId = environment.defaultProjects.sourceProjectId;
+ const defaultApiKey = environment.defaultProjects.sourceProjectApiKey;
+
+ this.formGroup.setValue({ projectId: defaultProjectId, apiKey: defaultApiKey });
+ }
}
diff --git a/src/app/pages/faq/limitations.component.html b/src/app/pages/faq/limitations.component.html
index 3c28c22..75f27c0 100644
--- a/src/app/pages/faq/limitations.component.html
+++ b/src/app/pages/faq/limitations.component.html
@@ -1,37 +1,14 @@
-
+ This feature creates a zip package with all data (including asset binaries) from a given project +
+ + +
-
-- Limitations -
+
+
-
\ No newline at end of file
diff --git a/src/app/pages/faq/limitations.component.ts b/src/app/pages/faq/limitations.component.ts
index 2bfd95b..6b8be0d 100644
--- a/src/app/pages/faq/limitations.component.ts
+++ b/src/app/pages/faq/limitations.component.ts
@@ -1,14 +1,19 @@
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component } from '@angular/core';
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';
import { ComponentDependencies } from '../../../di';
-import { BaseComponent } from '../../core/base.component';
import { BasePageComponent } from '../../core/base-page.component';
@Component({
changeDetection: ChangeDetectionStrategy.OnPush,
templateUrl: './limitations.component.html',
})
-export class LimitationsComponent extends BasePageComponent {
+export class LimitationsComponent extends BasePageComponent implements OnInit {
+
+ public limitations: string[] = [
+ `CM API does not support deleting languages which is why 'clean' action does not delete any.`,
+ `External id values will be overwritten for all imported & exported objets using this tool. The value of 'external_id' property will equal to original system id of the object. This is used to preserve references between objects.`,
+ `This tool should primarily be used to import data into clean (empty) projects as to avoid issues with existing content`,
+ ];
constructor(
dependencies: ComponentDependencies,
@@ -16,4 +21,11 @@ export class LimitationsComponent extends BasePageComponent {
) {
super(dependencies, cdr);
}
+
+ ngOnInit(): void {
+ super.setConfig({
+ title: 'FAQ',
+ showDevMode: false
+ });
+ }
}
diff --git a/src/app/pages/home/home.component.html b/src/app/pages/home/home.component.html
new file mode 100644
index 0000000..53cc815
--- /dev/null
+++ b/src/app/pages/home/home.component.html
@@ -0,0 +1,87 @@
+
-
-
-- Currently, the export package is created using Delivery API, and as such it cannot - make - an - identical copy of your project. Some information is not available through Delivery API and is lost during - export/import process. Once the Content managemenent API is mature enough, this application - will switch to it to create better export packages with more information. -
-
-
+Current limitations include:
- -
-
- 1) Content type snippets are not preserved, but data is not lost. Instead,
- these
- elements are created on each content type separately.
- 2) Components in rich text elements are created as standalone linked items
- (they
- are preserved correctly in rich text values)
- 3) Content type configuration is lost (e.g. size limitations for assets,
- allowed content types for linked item elements...). After importing you should go through the content types and add necessary configuration.
- 4) Only published items are exported
- 5) Assets folder categorization is not preserved and assets are created in
- flat structure
- 6) API does not allow setting specific codenames and it may happen that
- certain items/types/assets will have different codename and in some cases name (e.g. asset name might not be present in Delivery response)
- 7) API does not allow to set the element guidelines, this information is not preserved.
-
+
-
+
+ {{ i + 1}})
+
+
+ {{ limitation}}
+
+
+
\ No newline at end of file
diff --git a/src/app/pages/home/home.component.ts b/src/app/pages/home/home.component.ts
new file mode 100644
index 0000000..b7c9423
--- /dev/null
+++ b/src/app/pages/home/home.component.ts
@@ -0,0 +1,21 @@
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';
+
+import { ComponentDependencies } from '../../../di';
+import { BasePageComponent } from '../../core/base-page.component';
+
+@Component({
+ changeDetection: ChangeDetectionStrategy.OnPush,
+ templateUrl: './home.component.html'
+})
+export class HomeComponent extends BasePageComponent implements OnInit {
+ constructor(dependencies: ComponentDependencies, cdr: ChangeDetectorRef) {
+ super(dependencies, cdr);
+ }
+
+ ngOnInit(): void {
+ super.setConfig({
+ title: 'Welcome',
+ showDevMode: false
+ });
+ }
+}
diff --git a/src/app/pages/import/import-from-file.component.html b/src/app/pages/import/import-from-file.component.html
index 2ad89df..5e1bf66 100644
--- a/src/app/pages/import/import-from-file.component.html
+++ b/src/app/pages/import/import-from-file.component.html
@@ -1,99 +1,204 @@
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Export
+
+
+ Create a backup file with full project data, including physical files.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Import
+
+
+ Restore previously exported data into a new Kentico Kontent project.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Templates
+
+
+ Download pre-build templates for Kentico Kontent in various technologies
+
+
+
+
+
+
+
+ About
+
+
+ Primary goal of this application is to be able to easily backup & import data from / to Kentico Kontent projects.
+
+
+ This tool is build using the Kontent backup manager, and can also be used independently using CLI.
+
+ - Import from export package -
+
-
-
-
+ Data successfully imported
-
- Target Project
-
-
-
-
-
-
-
-
-
-
+
+
-
-
-
-
-
- Or select file
+
+
+
+
-
+ You are attempting to import .zip package exported using Kontent Backup manager on
+ version '{{ importDataVersion }}', but this web based tool is currently using version '{{
+ kbmVersion
+ }}'.
-
-
- {{ file.name }}
+
+
+ You can still try importing data, but it may fail due to possible inconsistencies in package versions.
+ You can also download specific version of
+ {{ backupManagerName }} and run import using CLI.
-
- Configuration
+
+
+ Project contains data inconsistencies. You may proceed with import, but it is possible that import will
+ fail.
+
-
- Publish imported items
-
-
-
+
\ No newline at end of file
+ {
+ super.resetErrors();
+ if (this.formGroup.invalid || this.processsing || !this.importData) {
+ return;
+ }
+
+ const projectId = this.formGroup.controls['projectId'].value;
+ const apiKey = this.formGroup.controls['apiKey'].value;
+
+ const importedVariants: IVariantWithTitle[] = [];
+
+ this.processsing = true;
+ super.markForCheck();
+
+ const importService = new ImportService({
+ enableLog: this.isDevMode(),
+ fixLanguages: true,
+ projectId: projectId,
+ enablePublish: this.publishVariants,
+ apiKey: apiKey,
+ onImport: (item) => {
+ this.dependencies.processingService.addProcessedItem(item);
+
+ if (
+ item.type === 'languageVariant' &&
+ item.data instanceof LanguageVariantModels.ContentItemLanguageVariant
+ ) {
+ importedVariants.push({
+ title: item.title,
+ variant: item.data
+ });
+ }
+ }
+ });
+ await super.runWithErrorHandlerAsync(async () => {
+ if (!this.importData) {
+ return;
+ }
- private getConfig(): IImportFromFileConfig | undefined {
- const projectId = this.formGroup.controls['projectId'].value;
- const cmApiKey = this.formGroup.controls['cmApiKey'].value;
- const publishAllItems = this.formGroup.controls['publishAllItems'].value;
+ await importService.importAsync(this.importData);
- if (!projectId) {
- this.error = 'Invalid project id';
- return;
+ this.success = true;
+ this.processsing = false;
+
+ super.markForCheck();
+ });
}
- if (!cmApiKey) {
- this.error = 'Invalid api key';
- return;
+ async handlePreview(): Promise {
+ if (!this.canPrepareImport) {
+ return;
+ }
+
+ // track gEvent
+ super.trackEvent({
+ eventCategory: 'button',
+ eventAction: 'prepare-import-from-file'
+ });
+
+ this.processsing = true;
+ super.markForCheck();
+
+ const zipService = new ZipService({
+ context: 'browser',
+ enableLog: this.isDevMode()
+ });
+
+ const data = await zipService.extractZipAsync(this.file);
+ this.importData = data;
+
+ this.processsing = false;
+ super.markForCheck();
}
- if (!this.file) {
- this.error = 'File is not uploaded';
- return;
+ private initFromPackageUrl(packageUrl: string): void {
+ this.processsing = true;
+ super.subscribeToObservable(
+ this.dependencies.templatesService.getTemplates().pipe(
+ switchMap((templates) => {
+ const templateToPrefill = templates.find((m) => m.exportPackageUrl === packageUrl);
+
+ if (templateToPrefill) {
+ this.templateToImport = templateToPrefill;
+
+ return this.dependencies.templatesService
+ .getTemplateFile(templateToPrefill.exportPackageUrl)
+ .pipe(
+ map((file) => {
+ this.file = file;
+ super.markForCheck();
+ })
+ );
+ }
+
+ return of(undefined);
+ }),
+ map((result) => {
+ this.processsing = false;
+ super.markForCheck();
+ })
+ )
+ );
}
- // store values
- this.dependencies.importDataStorageService.updateImportData({
- targetProjectApiKey: cmApiKey,
- publishContentItems: publishAllItems,
- targetProjectId: projectId,
- depth: 0 // not required when importing from file
- });
-
- return {
- apiKey: cmApiKey,
- projectId: projectId,
- file: this.file,
- publishAllItems: publishAllItems,
- };
- }
-
- private resetErrors(): void {
- this.error = undefined;
- }
+ private initForm(): void {
+ super.subscribeToObservable(
+ this.formGroup.valueChanges.pipe(
+ switchMap((form) => {
+ const projectId = form.projectId;
+ const apiKey = form.apiKey;
+
+ return this.dependencies.projectService.validateProject({
+ projectId: projectId,
+ apiKey: apiKey
+ });
+ }),
+ map((result) => {
+ this.project = result;
+ super.markForCheck();
+ })
+ )
+ );
+
+ const defaultProjectId = environment.defaultProjects.targetProjectId;
+ const defaultApiKey = environment.defaultProjects.targetProjectApiKey;
+
+ this.formGroup.setValue({ projectId: defaultProjectId, apiKey: defaultApiKey });
+ }
}
diff --git a/src/app/pages/import/import-from-project.component.html b/src/app/pages/import/import-from-project.component.html
deleted file mode 100644
index 047ec98..0000000
--- a/src/app/pages/import/import-from-project.component.html
+++ /dev/null
@@ -1,107 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/src/app/pages/import/import-from-project.component.ts b/src/app/pages/import/import-from-project.component.ts
deleted file mode 100644
index ad25d3e..0000000
--- a/src/app/pages/import/import-from-project.component.ts
+++ /dev/null
@@ -1,223 +0,0 @@
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component } from '@angular/core';
-import { FormBuilder, FormGroup, Validators } from '@angular/forms';
-import { CloudError } from 'kentico-cloud-core';
-import { throwError } from 'rxjs';
-import { catchError, map } from 'rxjs/operators';
-
-import { ComponentDependencies } from '../../../di';
-import { environment } from '../../../environments/environment';
-import { IImportData, IImportFromProjectWithDeliveryConfig, IImportResult } from '../../../services';
-import { previewHelper } from '../../components/preview/preview-helper';
-import { IDataPreviewWrapper } from '../../components/preview/preview-models';
-import { BasePageComponent } from '../../core/base-page.component';
-
-@Component({
- changeDetection: ChangeDetectionStrategy.OnPush,
- templateUrl: './import-from-project.component.html',
-})
-export class ImportFromProjectComponent extends BasePageComponent {
-
- public formGroup: FormGroup;
- public error?: string;
- public importData?: IImportData;
- public step: 'initial' | 'preview' | 'importing' | 'completed' = 'initial'
-
- public get importPreviewData(): IDataPreviewWrapper | undefined {
- if (!this.importData) {
- return undefined;
- }
- return previewHelper.convertFromImportData(this.importData);
- }
-
- public get resultPreviewData(): IDataPreviewWrapper | undefined {
- if (!this.importResult) {
- return undefined;
- }
- return previewHelper.convertFromImportResult(this.importResult);
- }
-
- public get canSubmit(): boolean {
- return this.formGroup.valid;
- }
-
- public get parsedLanguages(): string[] {
- const languagesValue = this.formGroup.controls['languages'].value as string | undefined;
- if (!languagesValue) {
- return [];
- }
- return languagesValue.split(';').map(m => m.trim());
- }
-
- public get languagesWarningMessage(): string | undefined {
- if (this.parsedLanguages.length === 0) {
- return undefined;
- }
-
- const languagesListHtml = `{
- languages: languages,
- publishAllItems: publishAllItems,
- sourceProjectId: sourceProjectId,
- targetProjectCmApiKey: targetProjectCmApiKey,
- targetProjectId: targetProjectId,
- depth: depth
- };
- }
-
- private resetErrors(): void {
- this.error = undefined;
- }
-}
diff --git a/src/app/pages/import/migrate-content-items.component.html b/src/app/pages/import/migrate-content-items.component.html
deleted file mode 100644
index 3334f5c..0000000
--- a/src/app/pages/import/migrate-content-items.component.html
+++ /dev/null
@@ -1,114 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/src/app/pages/import/migrate-content-items.component.ts b/src/app/pages/import/migrate-content-items.component.ts
deleted file mode 100644
index f4451fb..0000000
--- a/src/app/pages/import/migrate-content-items.component.ts
+++ /dev/null
@@ -1,222 +0,0 @@
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component } from '@angular/core';
-import { FormBuilder, FormGroup, Validators } from '@angular/forms';
-import { CloudError } from 'kentico-cloud-core';
-import { throwError } from 'rxjs';
-import { catchError, map } from 'rxjs/operators';
-
-import { ComponentDependencies } from '../../../di';
-import { environment } from '../../../environments/environment';
-import { IImportData, IImportFromProjectWithDeliveryConfig, IImportResult } from '../../../services';
-import { previewHelper } from '../../components/preview/preview-helper';
-import { IDataPreviewWrapper } from '../../components/preview/preview-models';
-import { BasePageComponent } from '../../core/base-page.component';
-
-@Component({
- changeDetection: ChangeDetectionStrategy.OnPush,
- templateUrl: './migrate-content-items.component.html',
-})
-export class MigrateContentItemsComponent extends BasePageComponent {
-
- public formGroup: FormGroup;
- public error?: string;
- public step: 'initial' | 'preview' | 'importing' | 'completed' = 'initial'
-
- public get importPreviewData(): IDataPreviewWrapper | undefined {
- if (!this.importData) {
- return undefined;
- }
- return previewHelper.convertFromImportData(this.importData);
- }
-
- public get resultPreviewData(): IDataPreviewWrapper | undefined {
- if (!this.importResult) {
- return undefined;
- }
- return previewHelper.convertFromImportResult(this.importResult);
- }
-
- public get canSubmit(): boolean {
- return this.formGroup.valid;
- }
-
- public get parsedLanguages(): string[] {
- const languagesValue = this.formGroup.controls['languages'].value as string | undefined;
- if (!languagesValue) {
- return [];
- }
- return languagesValue.split(';').map(m => m.trim());
- }
-
- public get languagesWarningMessage(): string | undefined {
- if (this.parsedLanguages.length === 0) {
- return undefined;
- }
-
- const languagesListHtml = `{
- languages: languages,
- publishAllItems: publishAllItems,
- sourceProjectId: sourceProjectId,
- targetProjectCmApiKey: targetProjectCmApiKey,
- targetProjectId: targetProjectId,
- depth: depth
- };
- }
-
- private resetErrors(): void {
- this.error = undefined;
- }
-}
diff --git a/src/app/pages/pages.module.ts b/src/app/pages/pages.module.ts
index 434e94d..5ee0e8b 100644
--- a/src/app/pages/pages.module.ts
+++ b/src/app/pages/pages.module.ts
@@ -1,39 +1,29 @@
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { NgxFileDropModule } from 'ngx-file-drop';
import { ComponentsModule } from '../components/components.module';
import { CoreModule } from '../core/core.module';
+import { CleanupComponent } from './cleanup/cleanup.component';
+import { ConfirmationDialogComponent } from './dialogs/confirmation-dialog.component';
import { ExportComponent } from './export/export.component';
import { LimitationsComponent } from './faq/limitations.component';
+import { HomeComponent } from './home/home.component';
import { ImportFromFileComponent } from './import/import-from-file.component';
-import { ImportFromProjectComponent } from './import/import-from-project.component';
-import { MigrateContentItemsComponent } from './import/migrate-content-items.component';
-import { CleanupConfirmComponent } from './shared/cleanup/cleanup-confirm.component';
-import { CleanupComponent } from './shared/cleanup/cleanup.component';
import { TemplateListComponent } from './templates/template-list.component';
@NgModule({
- declarations: [
- ImportFromProjectComponent,
- ExportComponent,
- ImportFromFileComponent,
- MigrateContentItemsComponent,
- ExportComponent,
- CleanupComponent,
- CleanupConfirmComponent,
- MigrateContentItemsComponent,
- TemplateListComponent,
- LimitationsComponent
- ],
- entryComponents: [
- CleanupConfirmComponent
- ],
- imports: [
- BrowserModule,
- BrowserAnimationsModule,
- CoreModule,
- ComponentsModule
- ],
+ declarations: [
+ ExportComponent,
+ ImportFromFileComponent,
+ ExportComponent,
+ CleanupComponent,
+ ConfirmationDialogComponent,
+ TemplateListComponent,
+ LimitationsComponent,
+ HomeComponent
+ ],
+ imports: [BrowserModule, BrowserAnimationsModule, CoreModule, ComponentsModule, NgxFileDropModule]
})
-export class PagesModule { }
+export class PagesModule {}
diff --git a/src/app/pages/shared/cleanup/cleanup-confirm.component.html b/src/app/pages/shared/cleanup/cleanup-confirm.component.html
deleted file mode 100644
index f6f19ab..0000000
--- a/src/app/pages/shared/cleanup/cleanup-confirm.component.html
+++ /dev/null
@@ -1,9 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/src/app/pages/shared/cleanup/cleanup.component.ts b/src/app/pages/shared/cleanup/cleanup.component.ts
deleted file mode 100644
index 02b3d95..0000000
--- a/src/app/pages/shared/cleanup/cleanup.component.ts
+++ /dev/null
@@ -1,195 +0,0 @@
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component } from '@angular/core';
-import { FormBuilder, FormGroup, Validators } from '@angular/forms';
-import { MatDialog } from '@angular/material';
-import { CloudError } from 'kentico-cloud-core';
-import { throwError } from 'rxjs';
-import { catchError, map } from 'rxjs/operators';
-
-import { ComponentDependencies } from '../../../../di';
-import { environment } from '../../../../environments/environment';
-import { ICleanupData } from '../../../../services';
-import { previewHelper } from '../../../components/preview/preview-helper';
-import { IDataPreviewWrapper } from '../../../components/preview/preview-models';
-import { BasePageComponent } from '../../../core/base-page.component';
-import { CleanupConfirmComponent } from './cleanup-confirm.component';
-
-@Component({
- changeDetection: ChangeDetectionStrategy.OnPush,
- templateUrl: './cleanup.component.html',
-})
-export class CleanupComponent extends BasePageComponent {
-
- public formGroup: FormGroup;
- public error?: string;
- public cleanupData?: ICleanupData;
- public step: 'initial' | 'cleaning' | 'completed' | 'preview' = 'initial';
-
- public get previewData(): IDataPreviewWrapper | undefined {
- if (!this.cleanupData) {
- return undefined;
- }
- return previewHelper.convertFromCleanupData(this.cleanupData);
- }
-
- public get canSubmit(): boolean {
- return this.formGroup.valid;
- }
-
- public projectContainsSomeData(): boolean {
- if (!this.cleanupData) {
- return false;
- }
-
- if (this.cleanupData.assets.length > 0) {
- return true;
- }
-
- if (this.cleanupData.contentItems.length > 0) {
- return true;
- }
- if (this.cleanupData.contentTypes.length > 0) {
- return true;
- }
- if (this.cleanupData.taxonomies.length > 0) {
- return true;
- }
-
- return false;
- }
-
- constructor(
- dependencies: ComponentDependencies,
- cdr: ChangeDetectorRef,
- private fb: FormBuilder,
- private dialog: MatDialog) {
- super(dependencies, cdr);
-
- this.formGroup = this.fb.group({
- projectId: [environment.defaultProjects.targetProjectId, Validators.required],
- cmApiKey: [environment.defaultProjects.targetProjectApiKey, Validators.required],
- });
- }
-
- prepareCleanup(): void {
- const config = this.getConfig();
- if (config) {
- // track gEvent
- super.trackEvent({
- eventCategory: 'button',
- eventAction: 'cleanup',
- });
-
- this.step = 'preview';
-
- super.startLoading();
- super.detectChanges();
-
- super.subscribeToObservable(
- this.dependencies.cleanupService.prepareCleanup(config.projectId, config.apiKey).pipe(
- map((cleanupData) => {
- this.cleanupData = cleanupData;
- super.stopLoading();
- super.detectChanges();
- }),
- catchError((error) => {
- super.stopLoading();
- if (error instanceof CloudError) {
- this.error = error.message;
- } else {
- this.error = 'Preparing cleanup data failed. See console for full error.';
- }
-
- // cleanup data because something might have been deleted already and same item
- // cannot be deleted twice
- this.cleanupData = undefined;
-
- super.detectChanges();
- return throwError(error);
- })
- )
- );
- }
- }
-
- cleanup(): void {
- const config = this.getConfig();
-
- if (config && this.cleanupData) {
- this.step = 'cleaning';
- super.startLoading();
- super.detectChanges();
-
- super.subscribeToObservable(
- this.dependencies.cleanupService.cleanupProject(config.projectId, config.apiKey, this.cleanupData).pipe(
- map((cleanupData) => {
- super.stopLoading();
- this.step = 'completed';
- super.detectChanges();
- }),
- catchError((error) => {
- super.stopLoading();
- if (error instanceof CloudError) {
- this.error = error.message;
- } else {
- this.error = 'Cleaning project data failed. See console for full error.';
- }
-
- super.detectChanges();
- return throwError(error);
- })
- )
- );
- }
- }
-
- openConfirmation(): void {
- this.resetErrors();
-
- const config = this.getConfig();
-
- if (config) {
- const dialogRef = this.dialog.open(CleanupConfirmComponent, {
- width: '400px',
- data: {}
- });
-
- dialogRef.afterClosed().subscribe(result => {
- if (dialogRef.componentInstance.confirmed) {
-
- if (!this.cleanupData) {
- throw Error(`Invalid cleanup data`);
- }
-
- this.cleanup();
- }
- });
- }
- }
-
- private getConfig(): {
- projectId: string,
- apiKey: string
- } | undefined {
- const projectId = this.formGroup.controls['projectId'].value;
- const cmApiKey = this.formGroup.controls['cmApiKey'].value;
-
- if (!projectId) {
- this.error = 'Invalid project id';
- return;
- }
-
- if (!cmApiKey) {
- this.error = 'Invalid api key';
- return;
- }
-
- return {
- apiKey: cmApiKey,
- projectId: projectId
- };
- }
-
- private resetErrors(): void {
- this.error = undefined;
- }
-}
diff --git a/src/app/pages/templates/template-list.component.html b/src/app/pages/templates/template-list.component.html
index e5a076c..c37fbaa 100644
--- a/src/app/pages/templates/template-list.component.html
+++ b/src/app/pages/templates/template-list.component.html
@@ -1,49 +1,79 @@
-
-
-
+
-
-
+
+
-
-
-
+
-
+ Import data
+
-
-
-
-
-
-
-
-
- Import data preview
+
* This will import data to target project. This action is not reversible.
This page enables you to import data previously exported .zip package.
+ +
+
+
+ Prepare for import
+
+
+
+ * Data will not yet be imported. You will be able to confirm import after reviewing data.
+
+
+
diff --git a/src/app/pages/import/import-from-file.component.ts b/src/app/pages/import/import-from-file.component.ts
index a24e9a7..bdb6a0b 100644
--- a/src/app/pages/import/import-from-file.component.ts
+++ b/src/app/pages/import/import-from-file.component.ts
@@ -1,247 +1,306 @@
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component } from '@angular/core';
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
-import { CloudError } from 'kentico-cloud-core';
-import { FileSystemFileEntry, UploadEvent } from 'ngx-file-drop';
-import { throwError } from 'rxjs';
-import { catchError, map } from 'rxjs/operators';
+import { MatDialog } from '@angular/material/dialog';
+import { IImportSource, ImportService, ZipService } from '@kentico/kontent-backup-manager';
+import { FileSystemFileEntry, NgxFileDropEntry } from 'ngx-file-drop';
+import { previewHelper } from 'src/app/components/preview/preview-helper';
+import { IDataPreviewWrapper } from 'src/app/components/preview/preview-models';
import { ComponentDependencies } from '../../../di';
import { environment } from '../../../environments/environment';
-import { IImportData, IImportFromFileConfig, IImportResult } from '../../../services';
-import { zipHelper } from '../../../utilities';
-import { previewHelper } from '../../components/preview/preview-helper';
-import { IDataPreviewWrapper } from '../../components/preview/preview-models';
import { BasePageComponent } from '../../core/base-page.component';
+import { ConfirmationDialogComponent } from '../dialogs/confirmation-dialog.component';
+import { LanguageVariantModels } from '@kentico/kontent-management';
+import { IProjectCheck, ITemplate } from 'src/services';
+import { ActivatedRoute } from '@angular/router';
+import { map, switchMap } from 'rxjs/operators';
+import { of } from 'rxjs';
+
+interface IVariantWithTitle {
+ variant: LanguageVariantModels.ContentItemLanguageVariant;
+ title: string;
+}
@Component({
- changeDetection: ChangeDetectionStrategy.OnPush,
- templateUrl: './import-from-file.component.html',
+ changeDetection: ChangeDetectionStrategy.OnPush,
+ templateUrl: './import-from-file.component.html'
})
-export class ImportFromFileComponent extends BasePageComponent {
-
- public formGroup: FormGroup;
- public error?: string;
- public file?: File;
- public importData?: IImportData;
-
- public step: 'initial' | 'preview' | 'importing' | 'completed' = 'initial';
+export class ImportFromFileComponent extends BasePageComponent implements OnInit {
+ public templateToImport?: ITemplate;
+ public formGroup: FormGroup;
+ public success: boolean = false;
+ public file?: File;
+ public importData?: IImportSource;
+
+ public get importPreviewData(): IDataPreviewWrapper | undefined {
+ if (!this.importData) {
+ return undefined;
+ }
+ return previewHelper.convertFromImportData(this.importData);
+ }
- public get importPreviewData(): IDataPreviewWrapper | undefined {
- if (!this.importData) {
- return undefined;
+ public get displayInconsistenciesNotice(): boolean {
+ if (!this.importData) {
+ return false;
+ }
+ if (this.importData.validation.type_issues.length || this.importData.validation.variant_issues.length) {
+ return true;
+ }
+ return false;
}
- return previewHelper.convertFromImportData(this.importData);
- }
- public get resultPreviewData(): IDataPreviewWrapper | undefined {
- if (!this.importResult) {
- return undefined;
+ public get importDataVersion(): string {
+ return this.importData?.metadata.version ?? '';
}
- return previewHelper.convertFromImportResult(this.importResult);
- }
- public get canSubmit(): boolean {
- return this.formGroup.valid && (this.file ? true : false);
- }
+ public get mismatchVersionImport(): boolean {
+ if (!this.importData) {
+ return false;
+ }
+
+ if (this.importData.metadata.version !== this.kbmVersion) {
+ return true;
+ }
- public get requiredLanguagesWarningMessage(): string | undefined {
- if (!this.importData || this.importData.requiredLanguages.length === 0) {
- return undefined;
+ return false;
}
- const languagesListHtml = `- ${this.importData.requiredLanguages.map(m => `
- ${m} `).join('')}
- Import from project -
- -
-
-
-
- Source Project
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Target Project
-
-
-
-
-
-
-
-
-
-
-
-
-
- Configuration
-
-
-
- Publish imported items
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Import data preview
-
-
-
- Processed items
-
-
-
-
-
- Imported data:
-
-
-
-
-
-- ${this.parsedLanguages.map(m => `
- ${m} `).join('')}
- Migrate content items -
- -- Use this to migrate data (content items & assets) from one project to another. - Requirement for this to work is to have matching content types and taxonomies. -
- -
-
-
-
- Source Project
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Target Project
-
-
-
-
-
-
-
-
-
-
-
-
-
- Configuration
-
-
-
- Publish imported items
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Import data preview
-
-
-
- Processed items
-
-
-
-
-
- Overview of imported items:
-
-
-
-
-
-
-
-- ${this.parsedLanguages.map(m => `
- ${m} `).join('')}
Confirmation
-
-
-This will delete given data from your project. There is no going back. Continue?
-
-
-
-
\ No newline at end of file
diff --git a/src/app/pages/shared/cleanup/cleanup.component.html b/src/app/pages/shared/cleanup/cleanup.component.html
deleted file mode 100644
index d82e663..0000000
--- a/src/app/pages/shared/cleanup/cleanup.component.html
+++ /dev/null
@@ -1,82 +0,0 @@
-- Cleanup project -
- -
-
-
-This action will delete all data in your project. Proceed with caution.
- -
-
-
-
-
-
- Project
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Following will be deleted from your project
-
-
-
-
-
-
-
-
-
-
-- Browse templates -
+
+
-
+
+
+
+
+
-
-
-
- ![]()
-
- {{ template.name }}
-
-
-
-
-
- By {{ template.author.name }}
+
+
+
+ Kentico Cloud Manager
- Kentico Kontent Template Manager
+ {
- const client = this.getContentManagementClient({
- projectId: projectId,
- apiKey: apiKey
- });
-
- return this.deleteContentItems(client, cleanupData.contentItems)
- .pipe(
- delay(this.cmRequestDelay),
- flatMap(() => {
- return this.deleteAssets(client, cleanupData.assets);
- }),
- delay(this.cmRequestDelay),
- flatMap(() => {
- return this.deleteTaxonomies(client, cleanupData.taxonomies)
- }),
- delay(this.cmRequestDelay),
- flatMap(() => {
- return this.deleteContentTypes(client, cleanupData.contentTypes)
- }),
- catchError(error => {
- if (error instanceof SharedModels.ContentManagementCloudError) {
- // errorCode = item / object is used and cannot be deleted = try again
- if (error.errorCode === 0) {
- numberOfRetries++;
- console.warn(`Deleting item failed with message '${error.message}'. Retrying for the '${numberOfRetries}' time with ${this.maxNumberOfRetries - numberOfRetries} retries remaining.`);
- return this.prepareCleanup(projectId, apiKey).pipe(
- flatMap(cleanupData => {
- return this.cleanupProject(projectId, apiKey, cleanupData)
- })
- )
- }
- }
- return throwError(error);
- })
- );
- }
-
- prepareCleanup(projectId: string, apiKey: string): Observable {
- const result: ICleanupData = {
- assets: [],
- contentItems: [],
- contentTypes: [],
- taxonomies: []
- }
-
- return this.cmFetchService.getAllAssets(projectId, apiKey, []).pipe(
- flatMap(assets => {
- result.assets = assets;
-
- return this.cmFetchService.getAllContentItems(projectId, apiKey, [])
- }),
- flatMap(contentItems => {
- result.contentItems = contentItems;
-
- return this.cmFetchService.getAllTaxonomies(projectId, apiKey, []);
- }),
- flatMap(taxonomies => {
- result.taxonomies = taxonomies;
-
- return this.cmFetchService.getAllTypes(projectId, apiKey, []);
- }),
- map(contentTypes => {
- result.contentTypes = contentTypes;
-
- return result;
- })
- );
- }
-
- private getContentManagementClient(config: IContentManagementClientConfig): IContentManagementClient {
- return new ContentManagementClient(config);
- }
-
- private deleteAssets(client: IContentManagementClient, assets: IAssetModel[]): Observable {
- const obs: Observable[] = [];
-
- for (const asset of assets) {
- obs.push(
- client.deleteAsset().byAssetId(asset.id).toObservable()
- .pipe(
- delay(this.cmRequestDelay),
- map((response) => {
- this.processingService.addProcessedItem(
- {
- data: asset.fileName,
- type: 'asset',
- action: 'delete',
- name: asset.fileName
- }
- );
- })
- ));
- }
-
- return observableHelper.flatMapObservables(obs, this.cmRequestDelay);
- }
-
- private deleteContentTypes(client: IContentManagementClient, contentTypes: IContentTypeModel[]): Observable {
- const obs: Observable[] = [];
-
- for (const type of contentTypes) {
- obs.push(
- client.deleteContentType().byTypeCodename(type.system.codename).toObservable()
- .pipe(
- map((response) => {
- this.processingService.addProcessedItem(
- {
- data: type.system.codename,
- type: 'content type',
- action: 'delete',
- name: type.system.codename
- }
- );
- })
- ));
- }
-
- return observableHelper.flatMapObservables(obs, this.cmRequestDelay);
- }
-
- private deleteTaxonomies(client: IContentManagementClient, taxonomies: ITaxonomyModel[]): Observable {
- const obs: Observable[] = [];
-
- for (const taxonomy of taxonomies) {
- obs.push(
- client.deleteTaxonomy().byTaxonomyCodename(taxonomy.system.codename).toObservable()
- .pipe(
- delay(this.cmRequestDelay),
- map((response) => {
- this.processingService.addProcessedItem(
- {
- data: taxonomy.system.codename,
- type: 'taxonomy',
- action: 'delete',
- name: taxonomy.system.codename
- }
- );
- })
- ));
- }
-
- return observableHelper.flatMapObservables(obs, this.cmRequestDelay);
- }
-
-
- private deleteContentItems(client: IContentManagementClient, contentItems: ISlimContentItemModel[]): Observable {
- const obs: Observable[] = [];
-
- for (const item of contentItems) {
- obs.push(
- client.deleteContentItem().byItemCodename(item.codename).toObservable()
- .pipe(
- delay(this.cmRequestDelay),
- map((response) => {
- this.processingService.addProcessedItem(
- {
- data: item.codename,
- type: 'content item',
- action: 'delete',
- name: item.codename
- }
- );
- })
- ));
- }
-
- return observableHelper.flatMapObservables(obs, this.cmRequestDelay);
- }
-
-}
\ No newline at end of file
diff --git a/src/services/export/export.service.ts b/src/services/export/export.service.ts
deleted file mode 100644
index 06ffb4e..0000000
--- a/src/services/export/export.service.ts
+++ /dev/null
@@ -1,353 +0,0 @@
-import { Injectable } from '@angular/core';
-import { saveAs } from 'filesaver.js';
-import * as JSZip from 'jszip';
-import * as JSZipUtils from 'jszip-utils';
-import {
- ContentManagementClient,
- IContentManagementClient,
- IContentManagementClientConfig,
-} from 'kentico-cloud-content-management';
-import { from, Observable } from 'rxjs';
-import { flatMap, map } from 'rxjs/operators';
-
-import { environment } from '../../environments/environment';
-import { observableHelper, zipHelper } from '../../utilities';
-import { versionInfo } from '../../version';
-import { BaseService } from '../base-service';
-import { CmFetchService } from '../fetch/cm-fetch.service';
-import { DeliveryFetchService } from '../fetch/delivery-fetch.service';
-import {
- IAssetFromFile,
- IImportData,
- IImportFromFileConfig,
- IImportFromProjectWithCMConfig,
- IImportFromProjectWithDeliveryConfig,
-} from '../import/import.models';
-import {
- IAssetModel,
- IContentTypeModel,
- ILanguageVariantModel,
- ISlimContentItemModel,
- ITaxonomyModel,
-} from '../shared/shared.models';
-
-@Injectable({
- providedIn: 'root'
-})
-export class ExportService extends BaseService {
-
- constructor(
- private cmFetchService: CmFetchService,
- private deliveryFetchService: DeliveryFetchService
- ) {
- super();
- }
-
- createAndDownloadZipFile(projectId: string, data: IImportData, callback: (() => void)): void {
- const zip = new JSZip();
-
- zip.file(environment.export.filenames.contentTypes, JSON.stringify(data.contentTypes));
- zip.file(environment.export.filenames.contentItems, JSON.stringify(data.contentItems));
- zip.file(environment.export.filenames.taxonomies, JSON.stringify(data.taxonomies));
- zip.file(environment.export.filenames.assets, JSON.stringify(data.assets));
- zip.file(environment.export.filenames.languageVariants, JSON.stringify(data.languageVariants));
- zip.file(environment.export.filenames.metadata, JSON.stringify(data.metadata));
-
- const assetsFolder = zip.folder(environment.export.filenames.assetsFolder);
-
- for (const asset of data.assets) {
- const assetIdShortFolder = assetsFolder.folder(asset.id.substr(0, 3));
- const assetIdFolder = assetIdShortFolder.folder(asset.id);
- const assetFilename = asset.fileName;
- assetIdFolder.file(
- assetFilename,
- this.urlToPromise(asset.deliveryUrl),
- {
- binary: true
- }
- );
- }
-
- zip.generateAsync({ type: 'blob' }).then((content: any) => {
- saveAs(content, `${environment.export.filenames.packagePrefix}${projectId}.zip`);
- callback();
- });
- }
-
- getImportDataWithDeliveryApi(config: IImportFromProjectWithDeliveryConfig): Observable {
- const targetContentManagementClient = this.getContentManagementClient({
- projectId: config.targetProjectId,
- apiKey: config.targetProjectCmApiKey
- });
-
- const data: IImportData = {
- targetClient: targetContentManagementClient,
- contentTypes: [],
- contentItems: [],
- taxonomies: [],
- languageVariants: [],
- assets: [],
- targetProjectId: config.targetProjectId,
- assetsFromFile: [],
- requiredLanguages: [],
- metadata: {
- version: versionInfo.version,
- }
- };
-
- return this.deliveryFetchService.getAllTypes(config.sourceProjectId, [], {
- useProcessingService: true
- }).pipe(
- flatMap(types => {
- data.contentTypes.push(...types);
- return this.deliveryFetchService.getAllContentItems(config.sourceProjectId, config.languages, {
- useProcessingService: true,
- depth: config.depth
- });
- }),
- flatMap(contentItemsResult => {
- data.assets.push(...contentItemsResult.assets);
- data.contentItems.push(...contentItemsResult.contentItems);
- data.languageVariants.push(...contentItemsResult.languageVariants);
-
- // find all languages used for language variants
- const languages: string[] = [];
- for (const languageVariant of contentItemsResult.languageVariants) {
- if (!languages.includes(languageVariant.languageCodename)) {
- languages.push(languageVariant.languageCodename);
- }
- }
-
- data.requiredLanguages.push(...languages);
-
- return this.deliveryFetchService.getAllTaxonomies(config.sourceProjectId, [], {
- useProcessingService: true
- });
- }),
- map(taxonomies => {
- data.taxonomies.push(...taxonomies);
-
- return data;
- })
- );
- }
-
- getImportDataFromFile(config: IImportFromFileConfig): Observable {
- const targetClient = this.getContentManagementClient({
- apiKey: config.apiKey,
- projectId: config.projectId
- });
-
- return from(JSZip.loadAsync(config.file)).pipe(
- flatMap((fileContents: any) => {
- const obs: Observable[] = [];
-
- const importData: IImportData = {
- contentItems: [],
- contentTypes: [],
- taxonomies: [],
- targetClient,
- languageVariants: [],
- assets: [],
- targetProjectId: config.projectId,
- assetsFromFile: [],
- requiredLanguages: [],
- metadata: {
- version: versionInfo.version,
- }
- };
-
- // taxonomies
- obs.push(
- this.readJsonFile(fileContents, environment.export.filenames.taxonomies).pipe(
- map(taxonomiesString => {
- const taxonomies = JSON.parse(taxonomiesString) as ITaxonomyModel[];
- importData.taxonomies = taxonomies;
- })
- )
- );
-
- // content types
- obs.push(
- this.readJsonFile(fileContents, environment.export.filenames.contentTypes).pipe(
- map(contentTypesString => {
- const contentTypes = JSON.parse(contentTypesString) as IContentTypeModel[];
- importData.contentTypes = contentTypes;
- })
- )
- );
-
- // content items
- obs.push(
- this.readJsonFile(fileContents, environment.export.filenames.contentItems).pipe(
- map(contentItemsString => {
- const contentItems = JSON.parse(contentItemsString) as ISlimContentItemModel[];
- importData.contentItems = contentItems;
- })
- )
- );
-
- // assets
- obs.push(
- this.readJsonFile(fileContents, environment.export.filenames.assets).pipe(
- flatMap(assetsString => {
- const assets = JSON.parse(assetsString) as IAssetModel[];
-
- return this.getAssetBinariesFromFile(fileContents, assets);
- }),
- map((assetsFromFile) => {
- importData.assetsFromFile = assetsFromFile;
-
- })
- )
- );
-
- // language variants
- obs.push(
- this.readJsonFile(fileContents, environment.export.filenames.languageVariants).pipe(
- map(languageVariantsString => {
- const languageVariants = JSON.parse(languageVariantsString) as ILanguageVariantModel[];
- importData.languageVariants = languageVariants;
-
- // find all languages used for language variants
- const languages: string[] = [];
- for (const languageVariant of languageVariants) {
- if (!languages.includes(languageVariant.languageCodename)) {
- languages.push(languageVariant.languageCodename);
- }
- }
-
- importData.requiredLanguages.push(...languages);
- }),
-
- )
- );
-
- return observableHelper.zipObservables(obs).pipe(
- map(() => {
- return importData;
- })
- );
- }),
- map(result => {
- return result;
- })
- );
- }
-
- getImportDataWithCMApi(config: IImportFromProjectWithCMConfig): Observable {
- const targetContentManagementClient = this.getContentManagementClient({
- projectId: config.targetProjectId,
- apiKey: config.targetProjectCmApiKey
- });
-
- const data: IImportData = {
- targetClient: targetContentManagementClient,
- contentTypes: [],
- contentItems: [],
- taxonomies: [],
- languageVariants: [],
- assets: [],
- targetProjectId: config.targetProjectId,
- assetsFromFile: [],
- requiredLanguages: [],
- metadata: {
- version: versionInfo.version,
- }
- };
-
- const obs: Observable[] = [
- this.cmFetchService.getAllAssets(config.sourceProjectId, config.sourceProjectCmApiKey, []).pipe(
- map((response) => {
- data.assets = response;
- })
- ),
- this.cmFetchService.getAllTypes(config.sourceProjectId, config.sourceProjectCmApiKey, []).pipe(
- map((response) => {
- data.contentTypes = response;
- })
- ),
- this.cmFetchService.getAllContentItems(config.sourceProjectId, config.sourceProjectCmApiKey, []).pipe(
- map((response) => {
- data.contentItems = response;
- })
- ),
- this.cmFetchService.getAllTaxonomies(config.sourceProjectId, config.sourceProjectCmApiKey, []).pipe(
- map((response) => {
- data.taxonomies = response;
- })
- ),
- ];
-
- return observableHelper.zipObservables(obs).pipe(
- flatMap(() => {
- return this.cmFetchService.getLanguageVariantsForContentItems(config.sourceProjectId, config.sourceProjectCmApiKey, {
- contentItems: data.contentItems,
- contentTypes: data.contentTypes
- });
- }),
- map(response => {
- data.languageVariants = response;
- return data;
- })
- );
- }
-
- private getContentManagementClient(config: IContentManagementClientConfig): IContentManagementClient {
- return new ContentManagementClient(config);
- }
-
- private getAssetBinariesFromFile(fileContents: any, assets: IAssetModel[]): Observable {
- const obs: Observable[] = [];
- const assetsFromFile: IAssetFromFile[] = [];
-
- if (!fileContents) {
- throw Error(`Invalid zip file'`);
- }
-
- const files = fileContents.files;
-
- for (const asset of assets) {
- const assetFile = files[zipHelper.getFullAssetPath(asset.id, asset.fileName)];
- obs.push(
- from(assetFile.async('blob')).pipe(
- map(data => {
- assetsFromFile.push({
- asset: asset,
- data: data as Blob
- })
- })
- ))
- }
-
- return observableHelper.zipObservables(obs).pipe(
- map(() => assetsFromFile)
- )
- }
-
-
- private readJsonFile(fileContents: any, filename: string): Observable {
- const files = fileContents.files;
- const file = files[filename];
-
- if (!file) {
- throw Error(`Invalid file '${filename}'`);
- }
-
- return from(file.async('text')).pipe(
- map(data => data as string)
- );
- }
-
- private urlToPromise(url: string): Promise {
- return new Promise((resolve, reject) => {
- JSZipUtils.getBinaryContent(url, (err: any, data: any) => {
- if (err) {
- reject(err);
- } else {
- resolve(data);
- }
- });
- });
- }
-}
diff --git a/src/services/fetch/cm-fetch.service.ts b/src/services/fetch/cm-fetch.service.ts
deleted file mode 100644
index d703e09..0000000
--- a/src/services/fetch/cm-fetch.service.ts
+++ /dev/null
@@ -1,308 +0,0 @@
-import { Injectable } from '@angular/core';
-import {
- ContentManagementClient,
- ElementModels,
- IContentManagementClient,
- IContentManagementClientConfig,
-} from 'kentico-cloud-content-management';
-import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
-
-import { observableHelper } from '../../utilities';
-import { BaseService } from '../base-service';
-import {
- IAssetModel,
- IContentItemElement,
- IContentTypeElementModel,
- IContentTypeModel,
- ILanguageVariantModel,
- ISlimContentItemModel,
- ITaxonomyModel,
-} from '../shared/shared.models';
-import { DeliveryFetchService } from './delivery-fetch.service';
-
-@Injectable({
- providedIn: 'root'
-})
-export class CmFetchService extends BaseService {
-
- constructor(
- private deliveryFetchService: DeliveryFetchService
- ) {
- super()
- }
-
- getAllContentItems(projectId: string, apiKey: string, contentItems: ISlimContentItemModel[], nextPageUrl?: string): Observable {
- const query = this.getContentManagementClient(
- {
- projectId: projectId,
- apiKey: apiKey
- }
- ).listContentItems();
-
- if (nextPageUrl) {
- query.withUrl(nextPageUrl);
- }
-
- return query
- .toObservable()
- .pipe(
- map(response => {
- contentItems.push(...response.data.items.map(m => {
- return {
- codename: m.codename,
- externalId: m.externalId,
- id: m.id,
- name: m.name,
- sitemapLocations: m.sitemapLocations,
- type: m.type,
- typeId: m.type.id,
- typeCodename: 'notSupported'
- };
- }));
-
- if (response.data.pagination.nextPage) {
- this.getAllContentItems(projectId, apiKey, contentItems, response.data.pagination.nextPage);
- }
- return contentItems;
- })
- );
- }
-
- getLanguageVariantsForContentItems(projectId: string, apiKey: string, prerequisities: {
- contentItems: ISlimContentItemModel[],
- contentTypes: IContentTypeModel[],
- }): Observable {
- const client = this.getContentManagementClient(
- {
- projectId: projectId,
- apiKey: apiKey
- }
- );
-
- const languageVariants: ILanguageVariantModel[] = [];
- const obs: Observable[] = [];
-
- for (const contentItem of prerequisities.contentItems) {
- obs.push(
-
- client.listLanguageVariants()
- .byItemCodename(contentItem.codename)
- .toObservable()
- .pipe(
- map(response => {
- languageVariants.push(...response.data.variants.map(variant => {
- return {
- elements: variant.elements.map(element => {
- const contentType = prerequisities.contentTypes.find(s => s.system.codename === contentItem.typeCodename);
- if (!contentType) {
- throw Error(`Could not find content type for content item '${contentItem.codename}'`);
- }
-
- const contentTypeElement = contentType.elements.find(s => s.id === element.element.id);
-
- if (!contentTypeElement) {
- throw Error(`Could not find content type element for content item '${contentItem.codename}' with id '${element.element.id}'`);
- }
-
- let fieldValue: undefined | string | number | string[];
-
- if (Array.isArray(element.value)) {
- fieldValue = element.value.map(m => {
- if (!m.codename) {
- throw Error(`Codename is required`);
- }
- return m.codename;
- });
- } else {
- fieldValue = element.value;
- }
-
- return {
- value: fieldValue,
- elementModel: contentTypeElement,
- elementCodename: element.element.codename,
- };
- }),
- itemCodename: contentItem.codename,
- itemId: contentItem.id,
- lastModified: variant.lastModified,
- languageCodename: 'notSupported'
- };
- }));
- })
- ));
- }
-
- return observableHelper.flatMapObservables(obs, this.cmRequestDelay).pipe(map(() => {
- return languageVariants;
- }));
- }
-
- getAllAssets(projectId: string, apiKey: string, assets: IAssetModel[], nextPageUrl?: string): Observable {
- const query = this.getContentManagementClient(
- {
- projectId: projectId,
- apiKey: apiKey
- }
- ).listAssets();
-
- if (nextPageUrl) {
- query.withUrl(nextPageUrl);
- }
-
- return query
- .toObservable()
- .pipe(
- map(response => {
- assets.push(...response.data.items.map(m => {
- return {
- externalId: m.externalId,
- fileName: m.fileName,
- id: m.id,
- title: m.title,
- type: m.type,
- deliveryUrl: this.constructDeliveryAssetUrl(projectId, m.fileReference.id, m.fileName)
- };
- }));
-
- if (response.data.pagination.nextPage) {
- this.getAllAssets(projectId, apiKey, assets, response.data.pagination.nextPage);
- }
- return assets;
- })
- );
- }
-
- getAllTypes(projectId: string, apiKey: string, allTypes: IContentTypeModel[], nextPageUrl?: string): Observable {
- const query = this.getContentManagementClient(
- {
- projectId: projectId,
- apiKey: apiKey
- }
- ).listContentTypes();
-
- if (nextPageUrl) {
- query.withUrl(nextPageUrl);
- }
-
- return query
- .toObservable()
- .pipe(
- map(response => {
- allTypes.push(...response.data.types.map(m => {
- const elements: IContentTypeElementModel[] = [];
-
- m.elements.forEach(originalElement => {
- let processed = false;
- if (originalElement instanceof ElementModels.ElementModel) {
- elements.push({
- codename: originalElement.codename,
- name: originalElement.name,
- options: [],
- taxonomyGroup: undefined,
- type: originalElement.type,
- id: originalElement.id,
- mode: undefined
- });
- processed = true;
- }
- if (originalElement instanceof ElementModels.MultipleChoiceElementModel) {
- elements.push({
- codename: originalElement.codename,
- name: originalElement.name,
- options: originalElement.options,
- taxonomyGroup: undefined,
- type: originalElement.type,
- id: originalElement.id,
- mode: originalElement.mode
- });
- processed = true;
- }
-
- if (!processed) {
- throw Error(`Unsupported element type for '${m.codename}' content type`);
- }
-
- });
-
- return {
- system: {
- codename: m.codename,
- id: m.id,
- name: m.name,
- },
- elementsWithOriginalCodename: [],
- elements: elements
- };
- }));
-
- if (response.data.pagination.nextPage) {
- this.getAllTypes(projectId, apiKey, allTypes, response.data.pagination.nextPage);
- }
- return allTypes;
- })
- );
- }
-
- getAllTaxonomies(projectId: string, apiKey: string, taxonomies: ITaxonomyModel[]): Observable {
- const query = this.getContentManagementClient(
- {
- projectId: projectId,
- apiKey: apiKey
- }
- ).listTaxonomies();
-
- return query
- .toObservable()
- .pipe(
- map(response => {
- taxonomies.push(...response.data.map(m => {
- return {
- system: m,
- terms: m.terms
- };
- }));
-
- return taxonomies;
- })
- );
- }
-
- getContentManagementClient(config: IContentManagementClientConfig): IContentManagementClient {
- return new ContentManagementClient(config);
- }
-
- private getDataCenterFromProject(projectId: string): 'EU' | 'US' | 'AU' {
- const dataCenterIdentifier = projectId.substr(14, 2);
-
- if (dataCenterIdentifier === '00') {
- return 'US';
- }
-
- if (dataCenterIdentifier === '01') {
- return 'EU';
- }
-
- if (dataCenterIdentifier === '02') {
- return 'AU';
- }
-
- return 'US';
- }
-
- private constructDeliveryAssetUrl(projectId: string, fileId: string, assetFilename: string): string {
- const dataCenter = this.getDataCenterFromProject(projectId);
- let dataCenterIdentifier = 'us-01';
-
- if (dataCenter === 'EU') {
- dataCenterIdentifier = 'eu-01';
- }
- if (dataCenter === 'AU') {
- dataCenterIdentifier = 'au-01';
- }
-
- return `https://assets-${dataCenterIdentifier}.kc-usercontent.com/${projectId}/${fileId}/${assetFilename}`;
- }
-
-}
diff --git a/src/services/fetch/delivery-fetch.service.ts b/src/services/fetch/delivery-fetch.service.ts
deleted file mode 100644
index 65097cf..0000000
--- a/src/services/fetch/delivery-fetch.service.ts
+++ /dev/null
@@ -1,459 +0,0 @@
-import { Injectable } from '@angular/core';
-import {
- DeliveryClient,
- FieldContracts,
- FieldType,
- IContentItem,
- IDeliveryClient,
- IDeliveryClientConfig,
- ItemResponses,
-} from 'kentico-cloud-delivery';
-import { getType } from 'mime';
-import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
-
-import { observableHelper, stringHelper, zipHelper } from '../../utilities';
-import { IProcessingItem } from '../processing/processing-models';
-import { ProcessingService } from '../processing/processing.service';
-import {
- ElementType,
- IAssetElementValue,
- IAssetModel,
- IContentItemElement,
- IContentItemModel,
- IContentTypeModel,
- IDeliveryContentItemsResult,
- IElementValue,
- IEmbeddedAsset,
- ILanguageVariantModel,
- IMultipleChoiceElementValue,
- IRawAssetModel,
- ISlimContentItemModel,
- ITaxonomyModel,
-} from '../shared/shared.models';
-import { IContentItemsFetchConfig, IFetchConfig } from './fetch-models';
-
-@Injectable({
- providedIn: 'root'
-})
-export class DeliveryFetchService {
-
- constructor(
- private processingService: ProcessingService
- ) { }
-
- getAllTypes(projectId: string, allTypes: IContentTypeModel[], config: IFetchConfig, nextPageUrl?: string): Observable {
- const query = this.getDeliveryClient({
- projectId: projectId
- }).types();
-
- if (nextPageUrl) {
- query.withUrl(nextPageUrl);
- }
-
- return query
- .toObservable()
- .pipe(
- map(response => {
- allTypes.push(...response.types.map(m => {
- return {
- elements: m.elements,
- system: {
- codename: m.system.codename,
- id: m.system.id,
- name: m.system.name
- }
-
- }
- }));
-
- if (config.useProcessingService) {
- this.processingService.addProcessedItems(response.types.map(m => {
- return {
- type: 'content type',
- action: 'get',
- data: m,
- name: m.system.name
- }
- }))
- }
-
- if (response.pagination.nextPage) {
- this.getAllTypes(projectId, allTypes, config, response.pagination.nextPage);
- }
- return allTypes;
- })
- );
- }
-
- getAllTaxonomies(projectId: string, taxonomies: ITaxonomyModel[], config: IFetchConfig, nextPageUrl?: string): Observable {
- const query = this.getDeliveryClient({
- projectId: projectId
- }).taxonomies();
-
- if (nextPageUrl) {
- query.withUrl(nextPageUrl);
- }
-
- return query
- .toObservable()
- .pipe(
- map(response => {
- taxonomies.push(...response.taxonomies.map(m => {
- return {
- system: m.system,
- terms: m.terms
- }
- }));
-
- if (config.useProcessingService) {
- this.processingService.addProcessedItems(response.taxonomies.map(m => {
- return {
- type: 'taxonomy',
- action: 'get',
- data: m,
- name: m.system.name
- }
- }))
- }
-
- if (response.pagination.nextPage) {
- this.getAllTaxonomies(projectId, taxonomies, config, response.pagination.nextPage);
- }
- return taxonomies;
- })
- );
- }
-
- getAllContentItems(projectId: string, languageCodenames: string[], config: IContentItemsFetchConfig): Observable {
- const contentItems: IContentItemModel[] = [];
- const obs: Observable[] = [];
-
- if (languageCodenames.length === 0) {
- // get content items in default language withous specifying any language param
- return this.getContentItemsForLanguage(projectId, contentItems, config, undefined, undefined).pipe(
- map(result => {
- return this.processContentItemsResult(result);
- })
- );
- }
-
- for (const languageCodename of languageCodenames) {
- obs.push(
- this.getContentItemsForLanguage(projectId, [], config, languageCodename, undefined).pipe(
- map(response => {
- contentItems.push(...response);
- })
- )
- );
- }
-
- return observableHelper.flatMapObservables(obs, 50).pipe(
- map(() => {
- return this.processContentItemsResult(contentItems);
- })
- )
- }
-
- getContentItemByCodename(projectId: string, codename: string): Observable {
- return this.getDeliveryClient({
- projectId: projectId
- })
- .item(codename)
- .toObservable().pipe(
- map(response => {
- const item = response.item;
-
- return {
- elements: item.debug.rawElements,
- system: item.system,
- assets: this.extractAssets(item),
- linkedItemCodenames: this.extractLinkedItemCodenames(item)
- };
- })
- )
- }
-
- getDeliveryClient(config: IDeliveryClientConfig): IDeliveryClient {
- return new DeliveryClient(config);
- }
-
- private processContentItemsResult(contentItems: IContentItemModel[]): IDeliveryContentItemsResult {
- const assets: IAssetModel[] = [];
- const slimContentItems: ISlimContentItemModel[] = [];
- const languageVariants: ILanguageVariantModel[] = [];
-
- for (const contentItem of contentItems) {
-
- assets.push(...contentItem.assets.map(m => {
- // delivery API does not return asset/file in all cases - use custom generated one for such scenarios
- const assetId = !m.id ? stringHelper.newGuid() : m.id;
-
- return {
- deliveryUrl: m.asset.url,
- fileName: m.asset.name,
- id: assetId,
- type: m.asset.type,
- description: m.asset.description,
- size: m.size,
- zipFilePath: zipHelper.getFullAssetPath(assetId, m.asset.name),
- externalId: undefined, // N/A Delivery API
- title: m.name // N/A Delivery API
- }
- }));
-
- slimContentItems.push(
- {
- codename: contentItem.system.codename,
- id: contentItem.system.id,
- name: contentItem.system.name,
- typeId: undefined,
- typeCodename: contentItem.system.type
- }
- )
-
- languageVariants.push(this.extractLanguageVariant(contentItem));
- }
-
- return {
- assets: assets,
- contentItems: this.filterIdenticalContentItems(slimContentItems),
- languageVariants: languageVariants
- }
- }
-
- private extractLanguageVariant(contentItem: IContentItemModel): ILanguageVariantModel {
- if (!contentItem.system.language) {
- throw Error(`Invalid or missing language for content item '${contentItem.system.codename}'`);
- }
-
- const elements: IContentItemElement[] = [];
- for (const elementCodename of Object.keys(contentItem.elements)) {
- const field = contentItem.elements[elementCodename];
- let fieldValue: IElementValue = undefined;
-
- if (field.type.toLowerCase() === FieldType.Asset.toLowerCase()) {
- const assetFieldValue = field.value as FieldContracts.IAssetContract[];
- fieldValue = assetFieldValue;
-
- }
- if (field.type.toLowerCase() === FieldType.MultipleChoice.toLowerCase()) {
- const multipleFieldValue = field.value as FieldContracts.IMultipleChoiceOptionContract[];
- fieldValue = multipleFieldValue;
- }
- else {
- fieldValue = field.value;
- }
-
- elements.push({
- value: fieldValue,
- elementCodename: elementCodename,
- elementModel: {
- codename: elementCodename,
- type: field.type as ElementType,
- mode: undefined,
- name: field.name,
- options: [],
- taxonomyGroup: field.taxonomy_group
- }
- })
- }
-
- return {
- itemCodename: contentItem.system.codename,
- itemId: contentItem.system.id,
- languageCodename: contentItem.system.language,
- elements: elements
- }
- }
-
- private filterIdenticalContentItems(contentItems: ISlimContentItemModel[]): ISlimContentItemModel[] {
- return contentItems.reduce((unique: ISlimContentItemModel[], item) => {
- const existingItem = unique.find(m => m.codename === item.codename);
- return existingItem ? unique : [...unique, item]
- }, []);
- }
-
- private addLinkedItemsToResponse(linkedItemCodenames: string[], response: ItemResponses.DeliveryItemListingResponse, contentItems: IContentItemModel[]): void {
- for (const linkedItemCodename of linkedItemCodenames) {
- const existingItem = contentItems.find(m => m.system.codename === linkedItemCodename);
-
- if (!existingItem) {
- // item is component, add it from response
- const linkedItem = response.linkedItems[linkedItemCodename];
-
- if (!linkedItem) {
- throw Error(`Could not find linked item with codename '${linkedItemCodename}' in response`);
- }
-
- contentItems.push({
- elements: linkedItem.debug.rawElements,
- system: linkedItem.system,
- assets: this.extractAssets(linkedItem),
- linkedItemCodenames: this.extractLinkedItemCodenames(linkedItem)
- });
- }
- }
- }
-
- private addContentItem(config: IContentItemsFetchConfig, response: ItemResponses.DeliveryItemListingResponse, sourceItem: IContentItem, contentItems: IContentItemModel[]): void {
- const contentItem = {
- elements: sourceItem.debug.rawElements,
- system: sourceItem.system,
- assets: this.extractAssets(sourceItem),
- linkedItemCodenames: this.extractLinkedItemCodenames(sourceItem)
- };
-
- contentItems.push(contentItem);
-
- if (config.useProcessingService) {
- this.processingService.addProcessedItem({
- type: 'content item',
- action: 'get',
- data: sourceItem,
- name: `[${sourceItem.system.language}] ${sourceItem.system.name}`
- }
- );
- }
-
- // make sure that components are added to result as well - needed because of components in rich text elements
- this.addLinkedItemsToResponse(contentItem.linkedItemCodenames, response, contentItems);
- }
-
- private getContentItemsForLanguage(projectId: string, contentItems: IContentItemModel[], config: IContentItemsFetchConfig, languageCodename?: string, nextPageUrl?: string): Observable {
- const query = this.getDeliveryClient({
- projectId: projectId
- }).items();
-
- if (languageCodename) {
- query.languageParameter(languageCodename);
- }
-
- if (nextPageUrl) {
- query.withUrl(nextPageUrl);
- }
-
- return query
- .depthParameter(config.depth)
- .toObservable()
- .pipe(
- map(response => {
- for (const item of response.items) {
- // process main items
- if (!contentItems.find(m => m.system.codename === item.system.codename)) {
- this.addContentItem(config, response, item, contentItems);
- }
- }
-
- // process linked items that are part of 'modular_items_ response
- const linkedItemCodenames = Object.keys(response.linkedItems);
- for (const linkedItemCodename of linkedItemCodenames) {
- if (!contentItems.find(m => m.system.codename === linkedItemCodename)) {
- const item = response.linkedItems[linkedItemCodename];
- this.addContentItem(config, response, item, contentItems);
- }
- }
-
- if (response.pagination.nextPage) {
- this.getContentItemsForLanguage(projectId, contentItems, config, languageCodename, response.pagination.nextPage);
- }
- return contentItems;
- })
- );
- }
-
- private extractLinkedItemCodenames(contentItem: IContentItem): string[] {
- const linkedItems: string[] = [];
-
- for (const elementCodename of Object.keys(contentItem.debug.rawElements)) {
- const element = contentItem.debug.rawElements[elementCodename];
- if (element.type.toLowerCase() === FieldType.ModularContent.toLowerCase()) {
- const modularContent = element.value as string[];
- for (const modularItem of modularContent) {
- if (!linkedItems.includes(modularItem)) {
- linkedItems.push(modularItem);
- }
- }
- }
-
- if (element.type.toLowerCase() === FieldType.RichText.toLowerCase()) {
- const modularContent = (element as any)['modular_content'] as string[];
- for (const modularItem of modularContent) {
- if (!linkedItems.includes(modularItem)) {
- linkedItems.push(modularItem);
- }
- }
- }
- }
-
- return linkedItems;
- }
-
- private extractAssets(contentItem: IContentItem): IEmbeddedAsset[] {
- const assets: IEmbeddedAsset[] = [];
-
- for (const elementCodename of Object.keys(contentItem.debug.rawElements)) {
- const element = contentItem.debug.rawElements[elementCodename];
-
- // process asset elements
- if (element.type.toLowerCase() === FieldType.Asset.toLowerCase()) {
- const fieldAssets = element.value as IRawAssetModel[];
- for (const asset of fieldAssets) {
- assets.push({
- assetSource: 'assetElement',
- languageCodename: contentItem.system.language,
- asset: asset,
- contentItemCodename: contentItem.system.codename,
- contentItemId: contentItem.system.id,
- fieldCodename: elementCodename,
- description: asset.description,
- size: asset.size || 0,
- type: asset.type,
- name: asset.name,
- id: false,
- });
- }
- }
-
- // process rich text elements
- if (element.type.toLowerCase() === FieldType.RichText.toLowerCase()) {
- const richTextElement = element as FieldContracts.IRichTextFieldContract;
- for (const imageKey of Object.keys(richTextElement.images)) {
- const image = richTextElement.images[imageKey];
-
- const fileType = this.extractMimeTypeFromUrl(image.url);
-
- if (!fileType) {
- throw Error(`Cannot determine type of asset from '${image.url}'. This is referenced by '${contentItem.system.codename}' content item in element '${element.name}'`);
- }
-
- assets.push({
- assetSource: 'richTexElementtImages',
- asset: {
- description: image.description || '',
- name: image.image_id,
- size: 0, // not available
- type: fileType,
- url: image.url,
- },
- contentItemCodename: contentItem.system.codename,
- contentItemId: contentItem.system.id,
- fieldCodename: elementCodename,
- description: image.description,
- size: 0, // not available
- type: fileType,
- name: image.image_id,
- languageCodename: contentItem.system.language,
- id: image.image_id
- });
- }
- }
- }
-
- return assets;
- }
-
- private extractMimeTypeFromUrl(url: string): string | null {
- return getType(url);
- }
-}
diff --git a/src/services/fetch/fetch-models.ts b/src/services/fetch/fetch-models.ts
deleted file mode 100644
index ae39aa0..0000000
--- a/src/services/fetch/fetch-models.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-export interface IFetchConfig {
- useProcessingService: boolean,
-}
-
-export interface IContentItemsFetchConfig extends IFetchConfig {
- depth: number
-}
diff --git a/src/services/google/google-analytics.service.ts b/src/services/google/google-analytics.service.ts
index e341d41..e01b207 100644
--- a/src/services/google/google-analytics.service.ts
+++ b/src/services/google/google-analytics.service.ts
@@ -7,10 +7,9 @@ declare var gtag: any;
declare var window: any;
@Injectable({
- providedIn: 'root',
+ providedIn: 'root'
})
export class GoogleAnalyticsService {
-
private readonly gTagParam = 'gtag';
/**
@@ -25,21 +24,14 @@ export class GoogleAnalyticsService {
private renderer2: Renderer2;
- constructor(
- rendererFactory2: RendererFactory2,
- ) {
+ constructor(rendererFactory2: RendererFactory2) {
this.renderer2 = rendererFactory2.createRenderer(null, null);
}
/**
* Logs event activity as per https://developers.google.com/analytics/devguides/collection/analyticsjs/events
*/
- logEvent(data: {
- eventCategory: string,
- eventAction: string,
- eventLabel?: string,
- eventValue?: number
- }): void {
+ logEvent(data: { eventCategory: string; eventAction: string; eventLabel?: string; eventValue?: number }): void {
if (!environment.google.enableTracking) {
// tracking is disabled
return;
@@ -68,15 +60,15 @@ export class GoogleAnalyticsService {
/**
* The page's title.
*/
- pageTitle: string,
+ pageTitle: string;
/**
* The page's URL.
*/
- pageLocation?: string,
+ pageLocation?: string;
/**
* The path portion of location. This value must start with a slash (/) character.
*/
- pagePath?: string,
+ pagePath?: string;
}): void {
if (!environment.google.enableTracking) {
// tracking is disabled
@@ -91,12 +83,11 @@ export class GoogleAnalyticsService {
gtag('config', environment.google.googleAnalyticsTrackingId, {
page_title: data.pageTitle,
page_location: data.pageLocation,
- page_path: data.pagePath,
+ page_path: data.pagePath
});
} else {
throw Error(`gtag is not available and cannot log page`);
}
-
}
private ensureGoogleAnalyticsScript(): void {
@@ -127,4 +118,4 @@ export class GoogleAnalyticsService {
document.getElementsByTagName('head')[0].appendChild(executionScriptElem);
}
-}
\ No newline at end of file
+}
diff --git a/src/services/import/import.models.ts b/src/services/import/import.models.ts
deleted file mode 100644
index 2cebc63..0000000
--- a/src/services/import/import.models.ts
+++ /dev/null
@@ -1,131 +0,0 @@
-import {
- AssetModels,
- ContentItemModels,
- IContentManagementClient,
- LanguageVariantModels,
-} from 'kentico-cloud-content-management';
-
-import {
- IAssetModel,
- IContentItemModel,
- IContentTypeModel,
- ILanguageVariantModel,
- ISlimContentItemModel,
- ITaxonomyModel,
-} from '../shared/shared.models';
-
-export interface IImportFromFileConfig extends IImportConfig {
- projectId: string;
- apiKey: string;
- file: File;
-}
-
-export interface IImportFromProjectWithCMConfig extends IImportConfig {
- languages: string[];
- targetProjectId: string;
- targetProjectCmApiKey: string;
- sourceProjectId: string;
- sourceProjectCmApiKey: string;
-}
-
-export interface IImportFromProjectWithDeliveryConfig extends IImportConfig {
- depth: number;
- languages: string[];
- targetProjectId: string;
- targetProjectCmApiKey: string;
- sourceProjectId: string;
-}
-
-// tslint:disable-next-line:no-empty-interface
-export interface IImportConfig {
- publishAllItems: boolean;
- depth: number;
-}
-
-export interface IContentTypeImportPrerequisities {
- taxonomies: IImportTaxonomyResult[];
-}
-
-export interface IContentItemImportPrerequisities {
- taxonomies: IImportTaxonomyResult[];
- contentTypes: IImportContentTypeResult[];
-}
-
-export interface ILanguageVariantsImportPrerequisities {
- assets: IImportAssetResult[];
- contentItems: IImportContentItemResult[];
- taxonomies: IImportTaxonomyResult[];
- contentTypes: IImportContentTypeResult[];
-}
-
-export interface IImportContentItemResult {
- originalItem: ISlimContentItemModel;
- importedItem: ContentItemModels.ContentItem;
-}
-
-export interface IImportContentTypeResult {
- originalItem: IContentTypeModel;
- importedItem: IContentTypeModel;
-}
-
-export interface IImportTaxonomyResult {
- originalItem: ITaxonomyModel;
- importedItem: ITaxonomyModel;
-}
-
-export interface IImportAssetResult {
- importedItem: AssetModels.Asset;
- originalItem: IAssetModel;
-}
-
-export interface IImportLanguageVariantsResult {
- importedItem: LanguageVariantModels.ContentItemLanguageVariant;
- originalItem: ILanguageVariantModel;
-}
-
-export interface IImportResult {
- importedContentTypes: IImportContentTypeResult[];
- importedContentItems: IImportContentItemResult[];
- importedLanguageVariants: IImportLanguageVariantsResult[];
- importedTaxonomies: IImportTaxonomyResult[];
- publishedItems: IPublishItemRequest[];
- importedAssets: IImportAssetResult[];
-}
-
-export interface IPublishItemRequest {
- itemId: string;
- languageId: string;
-}
-
-export interface IAssetFromFile {
- data: Blob;
- asset: IAssetModel;
-}
-
-export interface IImportMetadata {
- version: string;
-}
-
-export interface IImportData {
- targetProjectId: string;
- targetClient: IContentManagementClient;
- contentTypes: IContentTypeModel[];
- contentItems: ISlimContentItemModel[];
- languageVariants: ILanguageVariantModel[];
- taxonomies: ITaxonomyModel[];
- assets: IAssetModel[];
- assetsFromFile: IAssetFromFile[];
- metadata: IImportMetadata;
- requiredLanguages: string[];
-}
-
-export interface IMigrateContentItemsData {
- contentItemsToMigrate: IContentItemModel[];
- targetTaxonomies: ITaxonomyModel[];
- targetContentTypes: IContentTypeModel[];
-}
-
-export interface IGetAssetData {
- blob: Blob;
- asset: IAssetModel;
-}
diff --git a/src/services/import/import.service.ts b/src/services/import/import.service.ts
deleted file mode 100644
index 32a7a3e..0000000
--- a/src/services/import/import.service.ts
+++ /dev/null
@@ -1,180 +0,0 @@
-import { Injectable } from '@angular/core';
-import { IContentManagementClient } from 'kentico-cloud-content-management';
-import { Observable, of } from 'rxjs';
-import { flatMap, map } from 'rxjs/operators';
-
-import { WorkflowService } from '../workflow/workflow.service';
-import {
- IImportConfig,
- IImportContentTypeResult,
- IImportData,
- IImportLanguageVariantsResult,
- IImportResult,
- IImportTaxonomyResult,
- IPublishItemRequest,
-} from './import.models';
-import { AssetsImportService } from './types/assets-import.service';
-import { ContentItemsImportService } from './types/content-items-import.service';
-import { ContentTypesImportService } from './types/content-types-import.service';
-import { LanguageVariantsImportService } from './types/language-variants-import.service';
-import { TaxonomiesImportService } from './types/taxonomies-import.service';
-
-@Injectable({
- providedIn: 'root'
-})
-export class ImportService {
-
- constructor(
- private contentTypesImportService: ContentTypesImportService,
- private contentItemsImportService: ContentItemsImportService,
- private taxonomiesImportService: TaxonomiesImportService,
- private workflowService: WorkflowService,
- private languageVariantsImportService: LanguageVariantsImportService,
- private assetsImportService: AssetsImportService
- ) {
- }
-
- importContentItemsOnly(data: IImportData, config: IImportConfig): Observable {
- const result: IImportResult = {
- importedContentItems: [],
- importedContentTypes: [],
- importedLanguageVariants: [],
- importedTaxonomies: [],
- publishedItems: [],
- importedAssets: []
- };
-
- return this.contentItemsImportService.importContentItems(
- data.targetClient,
- data.contentItems,
- {
- contentTypes: data.contentTypes.map(m => {
- importedItem: m,
- originalItem: m
- }),
- taxonomies: data.taxonomies.map(m => {
- importedItem: m,
- originalItem: m
- })
- }, config).pipe(
- flatMap(response => {
- result.importedContentItems = response;
-
- return this.assetsImportService.importAssetsByUrl(data.targetClient, data.assets, data.assetsFromFile, config);
-
- }),
- flatMap(response => {
- result.importedAssets = response;
-
- return this.languageVariantsImportService.importLanguageVariants(data.targetClient, data.languageVariants, {
- assets: result.importedAssets,
- contentItems: result.importedContentItems,
- contentTypes: data.contentTypes.map(m => {
- importedItem: m,
- originalItem: m
- }),
- taxonomies: data.taxonomies.map(m => {
- importedItem: m,
- originalItem: m
- })
- }, config)
- }),
- flatMap((response) => {
- result.importedLanguageVariants = response;
-
- if (config.publishAllItems) {
- return this.getPublishObservable(data.targetClient, config, result.importedLanguageVariants);
- }
- return of(undefined);
- }),
- map((response) => {
- if (response) {
- result.publishedItems = response;
- }
- return result;
- })
- );
- }
-
- import(data: IImportData, config: IImportConfig): Observable {
- const result: IImportResult = {
- importedContentItems: [],
- importedContentTypes: [],
- importedLanguageVariants: [],
- importedTaxonomies: [],
- publishedItems: [],
- importedAssets: []
- };
- return this.taxonomiesImportService.importTaxonomies(data.targetClient, data.taxonomies, config).pipe(
- flatMap((response) => {
- result.importedTaxonomies = response;
-
- return this.contentTypesImportService.importContentTypes(data.targetClient, data.contentTypes, {
- taxonomies: response
- }, config).pipe(
- map((contentTypes) => {
- result.importedContentTypes = contentTypes;
- })
- );
- }),
- flatMap(() => {
- return this.assetsImportService.importAssetsByUrl(data.targetClient, data.assets, data.assetsFromFile, config).pipe(
- map((response) => {
- result.importedAssets = response;
- })
- );
- }),
- flatMap(() => {
- return this.contentItemsImportService.importContentItems(data.targetClient, data.contentItems, {
- contentTypes: result.importedContentTypes,
- taxonomies: result.importedTaxonomies
- }, config).pipe(
- map((response) => {
- result.importedContentItems = response;
- })
- );
- }),
- flatMap(() => {
- return this.languageVariantsImportService.importLanguageVariants(data.targetClient, data.languageVariants, {
- contentTypes: result.importedContentTypes,
- taxonomies: result.importedTaxonomies,
- contentItems: result.importedContentItems,
- assets: result.importedAssets
- }, config).pipe(
- map((response) => {
- result.importedLanguageVariants = response;
- })
- )
- }),
- flatMap(() => {
- if (config.publishAllItems) {
- return this.getPublishObservable(data.targetClient, config, result.importedLanguageVariants);
- }
- return of(undefined);
- }),
- map((response) => {
- if (response) {
- result.publishedItems = response;
- }
-
- // all finished
- return result;
- })
- );
- }
-
- private getPublishObservable(client: IContentManagementClient, config: IImportConfig, importedLanguageVariants: IImportLanguageVariantsResult[]): Observable {
- return this.workflowService.publishContentItems(importedLanguageVariants.map(languageVariantResult => {
- if (!languageVariantResult.importedItem.item.id) {
- throw Error(`Cannot publish item because item id is missing`);
- }
- if (!languageVariantResult.importedItem.language.id) {
- throw Error(`Cannot publish item because language id is missing for item '${languageVariantResult.importedItem.item.id}'`);
- }
- return {
- itemId: languageVariantResult.importedItem.item.id,
- languageId: languageVariantResult.importedItem.language.id
- };
- }), client, config);
- }
-}
diff --git a/src/services/import/types/assets-import.service.ts b/src/services/import/types/assets-import.service.ts
deleted file mode 100644
index b8f4055..0000000
--- a/src/services/import/types/assets-import.service.ts
+++ /dev/null
@@ -1,191 +0,0 @@
-import { Injectable } from '@angular/core';
-import { IContentManagementClient } from 'kentico-cloud-content-management';
-import { from, Observable } from 'rxjs';
-import { delay, flatMap, map } from 'rxjs/operators';
-
-import { observableHelper } from '../../../utilities';
-import { BaseService } from '../../base-service';
-import { ProcessingService } from '../../processing/processing.service';
-import { IAssetModel } from '../../shared/shared.models';
-import { IAssetFromFile, IGetAssetData, IImportAssetResult, IImportConfig } from '../import.models';
-
-@Injectable({
- providedIn: 'root'
-})
-export class AssetsImportService extends BaseService {
-
- constructor(
- private processingService: ProcessingService
- ) {
- super();
- }
-
- importAssetsByUrl(targetClient: IContentManagementClient, assets: IAssetModel[], assetsFromFile: IAssetFromFile[], config: IImportConfig): Observable {
- const importedAssets: IImportAssetResult[] = [];
-
- return observableHelper.flatMapObservables([
- this.importAssetsByUrlInternal(targetClient, assets).pipe(
- map((createdAssets) => {
- importedAssets.push(...createdAssets);
- })
- ),
- this.importAssetsFromFileInternal(targetClient, assetsFromFile).pipe(
- map((createdAssets) => {
- importedAssets.push(...createdAssets);
- })
- ),
- ], this.cmRequestDelay).pipe(
- map(() => {
- return importedAssets;
- })
- )
- }
-
- private importAssetsByUrlInternal(targetClient: IContentManagementClient, assets: IAssetModel[]): Observable {
- const createdAssets: IImportAssetResult[] = [];
- const assetsToCreateObs: Observable[] = [];
- const obs: Observable[] = [];
-
- for (const asset of assets) {
- assetsToCreateObs.push(this.getAssetBlobFromUrl(asset.deliveryUrl).pipe(
- map(response => {
- return {
- blob: response.blob,
- asset: asset
- };
- })
- ));
- }
-
- for (const assetObs of assetsToCreateObs) {
- obs.push(
- assetObs.pipe(
- delay(this.cmRequestDelay),
- flatMap(data => {
- const asset = data.asset;
- const contentType = asset.type;
- const fileBinary = data.blob;
-
- return targetClient.uploadBinaryFile()
- .withData({
- binaryData: fileBinary,
- contentType,
- filename: asset.fileName
- }).toObservable().pipe(
- delay(this.cmRequestDelay),
- flatMap(response => {
- this.processingService.addProcessedItem({
- data: response.data.id,
- type: 'binary file',
- action: 'upload',
- name: `[${response.data.type}] - ${asset.fileName}`
- });
-
- return targetClient.addAsset().withData({
- title: asset.title,
- descriptions: [],
- fileReference: {
- id: response.data.id,
- type: response.data.type
- },
- // externalId: asset.url,
- }).toObservable();
- }),
- map((response) => {
- this.processingService.addProcessedItem({
- data: response.data.fileName,
- type: 'asset',
- action: 'add',
- name: `[${response.data.type}] - ${response.data.fileName}`
- });
-
- createdAssets.push(
- {
- importedItem: response.data,
- originalItem: data.asset
- }
- );
- })
- );
- }
- )
- ));
- }
-
- return observableHelper.flatMapObservables(obs, this.cmRequestDelay).pipe(
- map(() => {
- return createdAssets;
- })
- );
- }
-
- private getAssetBlobFromUrl(url: string): Observable {
- return from(new Promise((resolve, reject) => {
- const xhr = new XMLHttpRequest();
- xhr.open('GET', url);
- xhr.responseType = 'blob';
- xhr.onload = () => {
- resolve({
- blob: xhr.response,
- });
- };
- xhr.send();
- })) as Observable;
- }
-
- private importAssetsFromFileInternal(targetClient: IContentManagementClient, assets: IAssetFromFile[]): Observable {
- const createdAssets: IImportAssetResult[] = [];
- const obs: Observable[] = [];
-
- for (const assetFromFile of assets) {
- const contentType = assetFromFile.asset.type;
- const fileBinary = assetFromFile.data;
-
- obs.push(targetClient.uploadBinaryFile()
- .withData({
- binaryData: fileBinary,
- contentType: contentType,
- filename: assetFromFile.asset.fileName
- }).toObservable().pipe(
- delay(this.cmRequestDelay),
- flatMap(response => {
- this.processingService.addProcessedItem({
- data: response.data.id,
- type: 'binary file',
- action: 'upload',
- name: `${assetFromFile.asset.fileName} [${assetFromFile.asset.size}B]`
- });
-
- return targetClient.addAsset().withData({
- title: assetFromFile.asset.fileName,
- descriptions: [],
- fileReference: {
- id: response.data.id,
- type: response.data.type
- },
- }).toObservable();
- }),
- map((response) => {
- this.processingService.addProcessedItem({
- data: response.data.fileName,
- type: 'asset',
- action: 'add',
- name: `[${response.data.type}] - ${response.data.fileName}`
- });
-
- createdAssets.push(
- {
- importedItem: response.data,
- originalItem: assetFromFile.asset
- }
- );
- })
- ));
- }
-
- return observableHelper.flatMapObservables(obs, this.cmRequestDelay).pipe(
- map(() => createdAssets)
- );
- }
-
-}
diff --git a/src/services/import/types/content-items-import.service.ts b/src/services/import/types/content-items-import.service.ts
deleted file mode 100644
index b6db0cc..0000000
--- a/src/services/import/types/content-items-import.service.ts
+++ /dev/null
@@ -1,90 +0,0 @@
-import { Injectable } from '@angular/core';
-import { ContentItemResponses, IContentManagementClient } from 'kentico-cloud-content-management';
-import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
-
-import { observableHelper } from '../../../utilities';
-import { BaseService } from '../../base-service';
-import { ProcessingService } from '../../processing/processing.service';
-import { ISlimContentItemModel } from '../../shared/shared.models';
-import { IContentItemImportPrerequisities, IImportConfig, IImportContentItemResult } from '../import.models';
-
-@Injectable({
- providedIn: 'root'
-})
-export class ContentItemsImportService extends BaseService {
-
- constructor(
- private processingService: ProcessingService
- ) {
- super();
- }
-
- importContentItems(
- targetClient: IContentManagementClient,
- contentItems: ISlimContentItemModel[],
- prerequisities: IContentItemImportPrerequisities,
- config: IImportConfig): Observable {
- return this.prepareAllContentItemsWithoutLanguageVariants(targetClient, contentItems, prerequisities).pipe(
- map((createdContentItems) => {
- return createdContentItems;
- })
- );
- }
-
- private prepareAllContentItemsWithoutLanguageVariants(
- targetClient: IContentManagementClient,
- contentItems: ISlimContentItemModel[],
- prerequisities: IContentItemImportPrerequisities): Observable {
- const createdContentItems: IImportContentItemResult[] = [];
- const obs: Observable[] = [];
-
- for (const item of contentItems) {
- obs.push(this.addContentItem(targetClient, item, prerequisities).pipe(
- map(response => {
- createdContentItems.push({
- importedItem: response.data,
- originalItem: item
- });
- })
- ));
- }
-
- return observableHelper.flatMapObservables(obs, this.cmRequestDelay).pipe(
- map(() => {
- return createdContentItems;
- })
- );
- }
-
- private addContentItem(
- targetClient: IContentManagementClient,
- contentItem: ISlimContentItemModel,
- prerequisities: IContentItemImportPrerequisities): Observable {
- const candidateContentType = prerequisities.contentTypes.find(m => m.originalItem.system.codename === contentItem.typeCodename);
- if (!candidateContentType) {
- throw Error(`Could not find candidate content type '${contentItem.typeCodename}'. This was required by '${contentItem.codename}' content item.`);
- }
-
- return targetClient.addContentItem()
- .withData({
- name: contentItem.name,
- type: {
- codename: candidateContentType.importedItem.system.codename
- },
- })
- .toObservable()
- .pipe(
- map(response => {
- this.processingService.addProcessedItem({
- data: contentItem,
- type: 'content item',
- action: 'add',
- name: response.data.codename
- });
-
- return response;
- })
- );
- }
-}
diff --git a/src/services/import/types/content-types-import.service.ts b/src/services/import/types/content-types-import.service.ts
deleted file mode 100644
index f4bf000..0000000
--- a/src/services/import/types/content-types-import.service.ts
+++ /dev/null
@@ -1,211 +0,0 @@
-import { Injectable } from '@angular/core';
-import {
- ContentTypeModels,
- ElementModels,
- IContentManagementClient,
- SharedContracts,
-} from 'kentico-cloud-content-management';
-import { FieldType } from 'kentico-cloud-delivery';
-import { Observable } from 'rxjs';
-import { delay, map } from 'rxjs/operators';
-
-import { observableHelper, stringHelper } from '../../../utilities';
-import { BaseService } from '../../base-service';
-import { ProcessingService } from '../../processing/processing.service';
-import { ElementType, IContentTypeElementModel, IContentTypeModel } from '../../shared/shared.models';
-import { IContentTypeImportPrerequisities, IImportConfig, IImportContentTypeResult } from '../import.models';
-
-@Injectable({
- providedIn: 'root'
-})
-export class ContentTypesImportService extends BaseService {
-
- constructor(
- private processingService: ProcessingService
- ) {
- super();
- }
-
- importContentTypes(targetClient: IContentManagementClient, contentTypes: IContentTypeModel[], prerequisities: IContentTypeImportPrerequisities, config: IImportConfig): Observable {
- const obs: Observable[] = [];
- const importedTypes: IImportContentTypeResult[] = [];
-
- contentTypes.forEach(contentType => {
- obs.push(this.createType(contentType, targetClient, prerequisities, config).pipe(
- map(importedType => {
- importedTypes.push({
- importedItem: importedType,
- originalItem: contentType
- })
- })
- ));
- });
-
- return observableHelper.flatMapObservables(obs, this.cmRequestDelay).pipe(
- map(() => importedTypes)
- );
- }
-
- private mapElementType(element: IContentTypeElementModel): ElementModels.ElementType | undefined {
- const type = element.type;
-
- if (type === ElementType.text) {
- return ElementModels.ElementType.text;
- }
- if (type === ElementType.number) {
- return ElementModels.ElementType.number;
- }
- if (type === ElementType.asset) {
- return ElementModels.ElementType.asset;
- }
- if (type === ElementType.dateTime) {
- return ElementModels.ElementType.dateTime;
- }
- if (type === ElementType.richText) {
- return ElementModels.ElementType.richText;
- }
- if (type === ElementType.urlSlug) {
- return ElementModels.ElementType.urlSlug;
- }
- if (type === ElementType.multipleChoice) {
- return ElementModels.ElementType.multipleChoice;
- }
- if (type === ElementType.modularContent) {
- return ElementModels.ElementType.modularContent;
- }
- if (type === ElementType.taxonomy) {
- return ElementModels.ElementType.taxonomy;
- }
-
- console.warn(`Mapping of element type '${element.type}' is not yet supported. Skipping element.`);
- return undefined;
- }
-
- private getElementMultipleChoiceOptions(element: IContentTypeElementModel): ContentTypeModels.IAddContentTypeElementMultipleChoiceElementOptionsData[] {
- return element.options.map(m => {
- return {
- name: m.name
- };
- });
- }
-
- private fixUrlSlugElem(elements: ContentTypeModels.IAddContentTypeElementData[]): void {
- for (const element of elements) {
- let dependsOn: ContentTypeModels.IAddContentTypeElementDependsOnData | undefined = undefined;
-
- if (element.type === ElementType.urlSlug) {
- if (element.depends_on) {
- dependsOn = element.depends_on;
- } else {
- // try finding first text field to use as depends on reference
- const textElem = elements.find(m => m.type.toLowerCase() === FieldType.Text.toLowerCase());
- if (textElem) {
- dependsOn = {
- element: {
- external_id: textElem.external_id
- }
- }
- }
- }
-
- if (!dependsOn) {
- throw Error(`Could not get any depending element for url slug field`);
- }
-
- element.depends_on = dependsOn;
- }
- }
- }
-
- private getElementData(element: IContentTypeElementModel, prerequisities: IContentTypeImportPrerequisities): ContentTypeModels.IAddContentTypeElementData | undefined {
- const elementType = this.mapElementType(element);
-
- if (elementType) {
- let mode: ElementModels.ElementMode | undefined = undefined;
- let options: ContentTypeModels.IAddContentTypeElementMultipleChoiceElementOptionsData[] | undefined;
- let externalId = stringHelper.newGuid();
- let taxonomyGroup: SharedContracts.IReferenceObjectContract | undefined;
-
- if (elementType === ElementModels.ElementType.multipleChoice) {
- mode = ElementModels.ElementMode.single;
- options = this.getElementMultipleChoiceOptions(element);
- }
-
- if (elementType === ElementModels.ElementType.modularContent) {
- mode = ElementModels.ElementMode.multiple;
- }
-
- if (elementType === ElementModels.ElementType.taxonomy) {
- if (!element.taxonomyGroup) {
- throw Error(`Element '${element.codename}' does not have taxonomy group assigned`);
- }
-
- const candidateTaxonomyGroup = prerequisities.taxonomies.find(m => m.originalItem.system.codename === element.taxonomyGroup);
-
- if (!candidateTaxonomyGroup) {
- throw Error(`Cannto find candidate taxonomy group for element '${element.codename}' with taxonomy group set to '${element.taxonomyGroup}'`);
- }
-
- taxonomyGroup = {
- codename: candidateTaxonomyGroup.importedItem.system.codename
- };
- }
-
- return {
- name: element.name,
- mode: mode,
- guidelines: '',
- options: options,
- type: elementType,
- external_id: externalId,
- taxonomy_group: taxonomyGroup
- }
- }
-
- return undefined;
- }
-
- private createType(contentType: IContentTypeModel, targetClient: IContentManagementClient, prerequisities: IContentTypeImportPrerequisities, data: IImportConfig): Observable {
- const mappedElements: ContentTypeModels.IAddContentTypeElementData[] = [];
- contentType.elements.forEach(sourceElement => {
- const mappedElementData = this.getElementData(sourceElement, prerequisities);
- if (mappedElementData) {
- mappedElements.push(mappedElementData);
- }
- });
-
- // fixes url slug elem
- this.fixUrlSlugElem(mappedElements);
-
- return targetClient.addContentType()
- .withData({
- name: contentType.system.name,
- elements: mappedElements
- })
- .toObservable()
- .pipe(
- delay(this.cmRequestDelay),
- map((response) => {
- this.processingService.addProcessedItem(
- {
- data: contentType,
- type: 'content type',
- action: 'add',
- name: response.data.codename
- }
- );
-
- return {
- elements: response.data.elements,
- system: {
- codename: response.data.codename,
- id: response.data.id,
- name: response.data.name
- }
- };
- })
- );
- }
-
-
-}
\ No newline at end of file
diff --git a/src/services/import/types/language-variants-import.service.ts b/src/services/import/types/language-variants-import.service.ts
deleted file mode 100644
index 7227556..0000000
--- a/src/services/import/types/language-variants-import.service.ts
+++ /dev/null
@@ -1,448 +0,0 @@
-import { Injectable } from '@angular/core';
-import { element } from '@angular/core/src/render3';
-import { IContentManagementClient, LanguageVariantModels, SharedContracts } from 'kentico-cloud-content-management';
-import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
-
-import { observableHelper } from '../../../utilities';
-import { BaseService } from '../../base-service';
-import { ProcessingService } from '../../processing/processing.service';
-import {
- ElementType,
- IAssetElementValue,
- IContentItemElement,
- ILanguageVariantModel,
- IMultipleChoiceElementValue,
- ITaxonomyTermModel,
- ITaxonomyTermsFieldValueModel,
-} from '../../shared/shared.models';
-import {
- IImportConfig,
- IImportContentItemResult,
- IImportContentTypeResult,
- IImportLanguageVariantsResult,
- ILanguageVariantsImportPrerequisities,
-} from '../import.models';
-
-@Injectable({
- providedIn: 'root'
-})
-export class LanguageVariantsImportService extends BaseService {
-
- constructor(
- private processingService: ProcessingService
- ) {
- super();
- }
-
- importLanguageVariants(
- targetClient: IContentManagementClient,
- languageVariants: ILanguageVariantModel[],
- prerequisities: ILanguageVariantsImportPrerequisities,
- config: IImportConfig): Observable {
-
- const obs: Observable[] = [];
- const importedLanguageVariants: IImportLanguageVariantsResult[] = [];
-
- for (const languageVariant of languageVariants) {
- obs.push(this.createLanguageVariants({
- languageVariant: languageVariant,
- targetClient: targetClient,
- config: config,
- prerequisities: prerequisities
- }).pipe(
- map((importResult) => {
- importedLanguageVariants.push(importResult);
- })
- ));
- }
-
- return observableHelper.flatMapObservables(obs, this.cmRequestDelay).pipe(
- map(() => {
- return importedLanguageVariants;
- })
- );
- }
-
- private createLanguageVariants(
- data: {
- languageVariant: ILanguageVariantModel,
- targetClient: IContentManagementClient,
- config: IImportConfig,
- prerequisities: ILanguageVariantsImportPrerequisities
- }
-
- ): Observable {
- const candidateContentItemForLanguageVariant = data.prerequisities.contentItems.find(m => m.originalItem.codename === data.languageVariant.itemCodename);
-
- if (!candidateContentItemForLanguageVariant) {
- throw Error(`Cannot find candidate content item (parent) for language variant with id '${data.languageVariant.itemCodename}' `);
- }
-
- const languageCodename = data.languageVariant.languageCodename
-
- if (!languageCodename) {
- throw Error(`Invalid language for language variant '${data.languageVariant.itemCodename}'`);
- }
-
- return data.targetClient.upsertLanguageVariant()
- .byItemId(candidateContentItemForLanguageVariant.importedItem.id)
- .byLanguageCodename(languageCodename)
- .withElementCodenames(this.getElements(candidateContentItemForLanguageVariant, data.languageVariant, data.prerequisities))
- .toObservable().pipe(
- map(response => {
- this.processingService.addProcessedItem({
- data: data.languageVariant,
- type: 'language variant',
- action: 'add',
- name: `${data.languageVariant.itemCodename} [${data.languageVariant.languageCodename}]`
- });
-
- return {
- importedItem: response.data,
- originalItem: data.languageVariant
- }
- })
- )
- }
-
- private processRichTextItems(htmlCollection: HTMLCollection, prerequisities: ILanguageVariantsImportPrerequisities): void {
- if (!htmlCollection || htmlCollection.length === 0) {
- // there are no more nodes
- } else {
- for (let i = 0; i < htmlCollection.length; i++) {
- const element = htmlCollection[i];
-
- // process links
- if (element.nodeName.toLowerCase() === 'a'.toLowerCase()) {
- const linkAttributes = element.attributes;
- // remove attributes not allowed by CM API
- if (linkAttributes.getNamedItem('rel')) {
- linkAttributes.removeNamedItem('rel');
- }
-
- if (linkAttributes.getNamedItem('target')) {
- linkAttributes.removeNamedItem('target');
- }
-
- // transform links for linked items
- const dataItemIdAttribute = linkAttributes.getNamedItem('data-item-id');
- if (dataItemIdAttribute) {
- // find original item
- const linkedItem = prerequisities.contentItems.find(m => m.originalItem.id === dataItemIdAttribute.value);
- if (!linkedItem) {
- throw Error(`Could not find linked item with id '${dataItemIdAttribute.value}'. This item is required by rich text element.`);
- }
- dataItemIdAttribute.value = linkedItem.importedItem.id;
-
- linkAttributes.removeNamedItem('href');
- }
-
- const dataItemExternalIdAttribute = linkAttributes.getNamedItem('data-item-external-id');
- if (dataItemExternalIdAttribute) {
- // find original item
- const linkedItem = prerequisities.contentItems.find(m => m.originalItem.externalId === dataItemExternalIdAttribute.value);
- if (!linkedItem) {
- throw Error(`Could not find linked item with external id '${dataItemExternalIdAttribute.value}'. This item is required by rich text element.`);
- }
- dataItemExternalIdAttribute.value = linkedItem.importedItem.id;
-
- linkAttributes.removeNamedItem('href');
- }
- }
-
- // process assets
- if (element.nodeName.toLowerCase() === 'figure'.toLowerCase()) {
- const assetAttributes = element.getAttributeNames();
- // remove attributes not allowed by CM API
- const allowedAttributes: string[] = ['data-asset-id', 'data-asset-external-id'];
-
- for (const assetAttribute of assetAttributes) {
- if (!allowedAttributes.includes(assetAttribute)) {
- element.attributes.removeNamedItem(assetAttribute);
- }
- }
-
- const dataAssetId = element.attributes.getNamedItem('data-asset-id');
- const dataImageExternalId = element.attributes.getNamedItem('data-asset-external-id');
-
- if (dataAssetId) {
- // get imported asset
- const asset = prerequisities.assets.find(m => m.originalItem.id === dataAssetId.value);
-
-
- if (!asset) {
- throw Error(`Asset with id '${dataAssetId.value}' could not be found in source data`);
- }
- element.attributes.removeNamedItem('data-asset-id')
- element.setAttribute('data-asset-id', asset.importedItem.id);
- }
-
- if (dataImageExternalId) {
- // get imported asset
- const asset = prerequisities.assets.find(m => m.originalItem.externalId === dataImageExternalId.value);
-
- if (!asset) {
- throw Error(`Asset with external id '${dataImageExternalId.value}' could not be found in source data`);
- }
-
- const externalIdOfImportedAsset = asset.importedItem.externalId;
-
- if (!externalIdOfImportedAsset) {
- throw Error(`ExternalId of asset is not set`);
- }
- element.attributes.removeNamedItem('data-asset-exgternal-id')
- element.setAttribute('data-asset-external-id', externalIdOfImportedAsset);
- }
- }
-
- // process images
- if (element.nodeName.toLowerCase() === 'img'.toLowerCase()) {
- const dataImageId = element.attributes.getNamedItem('data-image-id');
- const dataImageExternalId = element.attributes.getNamedItem('data-image-external-id');
-
- if (dataImageId) {
- // get imported asset
- const asset = prerequisities.assets.find(m => m.originalItem.id === dataImageId.value);
-
- if (!asset) {
- throw Error(`Asset with id '${dataImageId.value}' could not be found in source data`);
- }
- element.setAttribute('data-asset-id', asset.importedItem.id);
- element.attributes.removeNamedItem('data-image-id')
- }
-
- if (dataImageExternalId) {
- // get imported asset
- const asset = prerequisities.assets.find(m => m.originalItem.externalId === dataImageExternalId.value);
-
- if (!asset) {
- throw Error(`Asset with external id '${dataImageExternalId.value}' could not be found in source data`);
- }
-
- const externalIdOfImportedAsset = asset.importedItem.externalId;
-
- if (!externalIdOfImportedAsset) {
- throw Error(`ExternalId of asset is not set`);
- }
- element.setAttribute('data-asset-external-id', externalIdOfImportedAsset);
- element.attributes.removeNamedItem('data-image-externa-id')
- }
-
- const allowedAttributes: string[] = ['data-asset-id', 'data-asset-external-id'];
- const assetAttributes = element.getAttributeNames();
-
- for (const assetAttribute of assetAttributes) {
- if (!allowedAttributes.includes(assetAttribute)) {
- element.attributes.removeNamedItem(assetAttribute);
- }
- }
- }
-
- const typeAttribute = element.attributes ? element.attributes.getNamedItem('type') : undefined;
-
- // process linked items (modular items)
- if (element.attributes && typeAttribute && typeAttribute.value && typeAttribute.value.toLowerCase() === 'application/kenticocloud'.toLowerCase()) {
- const dataCodenameAttribute = element.attributes.getNamedItem('data-codename');
- const dataTypeAttribute = element.attributes.getNamedItem('data-type');
-
- if (!dataCodenameAttribute) {
- throw Error('Missing data codename attribute. This is likely an error caused by invalid response.');
- }
-
- if (!dataTypeAttribute) {
- throw Error('Missing data type attribute. This is likely an error caused by invalid response.');
- }
-
- // find linked item
- const importedLinkedItem = prerequisities.contentItems.find(m => m.originalItem.codename === dataCodenameAttribute.value);
-
- if (!importedLinkedItem) {
- throw Error(`Linked item in rich text field with codename '${dataCodenameAttribute.value}' could not be found`);
- }
-
- // see https://developer.kenticocloud.com/reference#section-rich-text-content-items for syntax details
-
- // remove data-codename attribute
- element.attributes.removeNamedItem('data-codename')
- element.attributes.removeNamedItem('data-rel')
-
- // add data-id attribute with imported item id
- element.setAttribute('data-id', importedLinkedItem.importedItem.id);
- }
-
- if (element.children && element.children.length > 0) {
- this.processRichTextItems(element.children, prerequisities);
- }
- }
- }
- }
-
- private getRichTextHtmlElement(html: string): HTMLElement {
- const element = document.createElement('p');
- element.innerHTML = html;
- return element;
- }
-
- private fixInvalidHtmlInRichTextField(html: string): string {
- // because sample project contains invalid html
- return html.replace(new RegExp('
', 'g'), ''); - } - - private mapElementValue(contentType: IImportContentTypeResult, languageVariant: ILanguageVariantModel, field: IContentItemElement, prerequisities: ILanguageVariantsImportPrerequisities): any { - if (field.elementModel.type === ElementType.modularContent) { - const linkedItemCodenames = field.value as string[]; - const newLinkedItems: SharedContracts.IReferenceObjectContract[] = []; - for (const currentLinkedItem of linkedItemCodenames) { - const candidateLinkedItem = prerequisities.contentItems.find(m => m.originalItem.codename === currentLinkedItem); - - if (!candidateLinkedItem) { - throw Error(`Cannot find linked item '${currentLinkedItem}'. This was requested by '${languageVariant.itemCodename}'`); - } - - newLinkedItems.push({ - codename: candidateLinkedItem.importedItem.codename - }); - } - - return newLinkedItems; - } - - const value = field.value; - - if (field.elementModel.type === ElementType.richText) { - const richTextValueWithFixedHtml = this.fixInvalidHtmlInRichTextField(field.value as string); - const doc = this.getRichTextHtmlElement(richTextValueWithFixedHtml); - this.processRichTextItems(doc.children, prerequisities); - return doc.innerHTML; - } - - if (field.elementModel.type === ElementType.taxonomy) { - const currentTaxonomyTerms = field.value as ITaxonomyTermsFieldValueModel[]; - const newTaxonomyTerms: SharedContracts.IReferenceObjectContract[] = []; - - if (!field.elementModel.taxonomyGroup) { - throw Error(`Taxonomy is not set for field '${field.elementCodename}' referenced by '${contentType.originalItem.system.codename}' content type - and used by '${languageVariant.itemCodename}' language variant with language '${languageVariant.languageCodename}'`); - } - - const candidateTaxonomy = prerequisities.taxonomies.find(m => m.originalItem.system.codename === field.elementModel.taxonomyGroup); - - if (!candidateTaxonomy) { - throw Error(`Could not find candidate taxonomy group '${field.elementModel.taxonomyGroup}' for field '${field.elementCodename}' referenced by '${contentType.originalItem.system.codename}' content type - and used by '${languageVariant.itemCodename}' language variant with language '${languageVariant.languageCodename}'`); - } - - for (const currentTaxonomyTerm of currentTaxonomyTerms) { - const candidateTaxonomyTerm = this.findTaxonomyTermRecursively(currentTaxonomyTerm.codename, candidateTaxonomy.originalItem.terms); - if (!candidateTaxonomyTerm) { - console.log(prerequisities.taxonomies); - console.log(candidateTaxonomy); - console.log(currentTaxonomyTerm); - throw Error(`Cannot find taxonomy term '${currentTaxonomyTerm.codename}' for taxonomy group '${candidateTaxonomy.originalItem.system.codename}' referenced by field '${field.elementCodename}' in '${contentType.originalItem.system.codename}' content type - and used by '${languageVariant.itemCodename}' language variant with language '${languageVariant.languageCodename}'`); - } - - newTaxonomyTerms.push({ - codename: candidateTaxonomyTerm.codename - }); - } - - return newTaxonomyTerms; - } - - if (field.elementModel.type === ElementType.multipleChoice) { - const currentOptions = field.value as IMultipleChoiceElementValue[]; - const newOptions: SharedContracts.IReferenceObjectContract[] = []; - - const originalElement = contentType.originalItem.elements.find(m => m.codename === field.elementModel.codename); - if (!originalElement) { - throw Error(`Invalid original element`); - } - - for (const currentOption of currentOptions) { - newOptions.push({ - codename: currentOption.codename - }); - } - - return newOptions; - } - - if (field.elementModel.type === ElementType.asset) { - const currentAssets = field.value as IAssetElementValue[]; - const newAssets: SharedContracts.IReferenceObjectContract[] = []; - - for (const currentAsset of currentAssets) { - const candidateAsset = prerequisities.assets.find(m => m.originalItem.deliveryUrl === currentAsset.url); - - if (!candidateAsset) { - throw Error(`Cannot find asset with url '${currentAsset.url}'`); - } - - newAssets.push({ - id: candidateAsset.importedItem.id - }); - } - - return newAssets; - } - - return value; - } - - private findTaxonomyTermRecursively(taxonomyTermToFind: string, originalTerms: ITaxonomyTermModel[]): ITaxonomyTermModel | undefined { - const foundTerm = originalTerms.find(m => m.codename.toLowerCase() === taxonomyTermToFind.toLowerCase()); - - if (foundTerm) { - return foundTerm; - } - - for (const taxonomyTerm of originalTerms) { - return this.findTaxonomyTermRecursively(taxonomyTermToFind, taxonomyTerm.terms); - } - } - - private getElements(contentItem: IImportContentItemResult, languageVariant: ILanguageVariantModel, prerequisities: ILanguageVariantsImportPrerequisities): LanguageVariantModels.ILanguageVariantElementCodename[] { - const contentItemElements: LanguageVariantModels.ILanguageVariantElementCodename[] = []; - - const candidateContentType = prerequisities.contentTypes.find(m => m.originalItem.system.codename === contentItem.originalItem.typeCodename); - - if (!candidateContentType) { - throw Error(`Could not find candidate content type '${contentItem.originalItem.typeCodename}'. This type is required by content item '${languageVariant.itemCodename}'`); - } - - const originalElements = candidateContentType.originalItem.elements; - const importedElements = candidateContentType.importedItem.elements; - - for (const elementData of languageVariant.elements) { - const originalElement = originalElements.find(m => m.codename === elementData.elementModel.codename); - - if (!originalElement) { - throw Error(`Cannot find element '${elementData.elementModel.codename}' in original elements`); - } - - const originalElementIndex = originalElements.findIndex(m => m.codename === elementData.elementModel.codename); - - if (originalElementIndex === -1) { - throw Error(`Cannot find element with index '${originalElementIndex}' in original elements`); - } - - // This is very dangerous because we are mapping elements based on their index - // and if KC API changes order of elements, this will be broken. - const importedElement = importedElements[originalElementIndex]; - - if (!importedElement) { - throw Error(`Could not find candidate import element for element with codename '${originalElement.codename}'`); - } - - contentItemElements.push({ - codename: importedElement.codename, - value: this.mapElementValue(candidateContentType, languageVariant, elementData, prerequisities) - }); - } - - return contentItemElements; - } - -} diff --git a/src/services/import/types/taxonomies-import.service.ts b/src/services/import/types/taxonomies-import.service.ts deleted file mode 100644 index 699533b..0000000 --- a/src/services/import/types/taxonomies-import.service.ts +++ /dev/null @@ -1,73 +0,0 @@ -import { Injectable } from '@angular/core'; -import { IContentManagementClient } from 'kentico-cloud-content-management'; -import { Observable } from 'rxjs'; -import { delay, map } from 'rxjs/operators'; - -import { observableHelper } from '../../../utilities'; -import { BaseService } from '../../base-service'; -import { ProcessingService } from '../../processing/processing.service'; -import { ITaxonomyModel } from '../../shared/shared.models'; -import { IImportConfig, IImportTaxonomyResult } from '../import.models'; - -@Injectable({ - providedIn: 'root' -}) -export class TaxonomiesImportService extends BaseService { - - constructor( - private processingService: ProcessingService - ) { - super(); - } - - importTaxonomies(targetClient: IContentManagementClient, taxonomies: ITaxonomyModel[], config: IImportConfig): Observable {
- const obs: Observable[] = [];
- const importedTaxonomies: IImportTaxonomyResult[] = [];
-
- taxonomies.forEach(taxonomy => {
- obs.push(this.createTaxonomy(taxonomy, targetClient, config).pipe(
- map((importedTaxonomy) => {
- importedTaxonomies.push({
- importedItem: importedTaxonomy,
- originalItem: taxonomy
- });
- })
- ));
- });
-
- return observableHelper.flatMapObservables(obs, this.cmRequestDelay).pipe(
- map(() => {
- return importedTaxonomies;
- })
- );
- }
-
- private createTaxonomy(taxonomy: ITaxonomyModel, targetClient: IContentManagementClient, data: IImportConfig): Observable {
- return targetClient.addTaxonomy()
- .withData({
- name: taxonomy.system.name,
- terms: taxonomy.terms,
- })
- .toObservable()
- .pipe(
- delay(this.cmRequestDelay),
- map((response) => {
- this.processingService.addProcessedItem({
- data: taxonomy,
- type: 'taxonomy',
- action: 'add',
- name: response.data.codename
- });
- return {
- system: {
- codename: response.data.codename,
- id: response.data.id,
- name: response.data.name
- },
- terms: response.data.terms
- };
- })
- );
- }
-
-}
diff --git a/src/services/index.ts b/src/services/index.ts
index 1940215..9f5aeba 100644
--- a/src/services/index.ts
+++ b/src/services/index.ts
@@ -1,18 +1,9 @@
-export * from './services.module';
-export * from './import/import.service';
-export * from './import/import.models';
-export * from './import/types/content-types-import.service';
-export * from './fetch/delivery-fetch.service';
-export * from './fetch/cm-fetch.service';
-export * from './workflow/workflow.service';
-export * from './cleanup/cleanup.service';
-export * from './cleanup/cleanup.models';
-export * from './export/export.service';
export * from './processing/processing.service';
-export * from './processing/processing-models';
-export * from './import/types/content-items-import.service';
export * from './templates/templates.service';
export * from './templates/template.models';
export * from './google/google-analytics.service';
export * from './storage/storage.service';
export * from './storage/import-data-storage.service';
+export * from './layout/layout.service';
+export * from './time/time.service';
+export * from './kontent/project.service';
diff --git a/src/services/kontent/project.service.ts b/src/services/kontent/project.service.ts
new file mode 100644
index 0000000..0f7feec
--- /dev/null
+++ b/src/services/kontent/project.service.ts
@@ -0,0 +1,45 @@
+import { Injectable } from '@angular/core';
+import { ManagementClient } from '@kentico/kontent-management';
+import { from, Observable, of } from 'rxjs';
+import { catchError, map } from 'rxjs/operators';
+
+export interface IProjectCheck {
+ projectName?: string;
+}
+
+@Injectable({
+ providedIn: 'root'
+})
+export class ProjectService {
+ constructor() {}
+
+ validateProject(data: { projectId?: string; apiKey?: string }): Observable {
+ if (!data.projectId || !data.apiKey) {
+ return of(undefined);
+ }
+
+ const client = new ManagementClient({
+ projectId: data.projectId,
+ apiKey: data.apiKey,
+ retryStrategy: {
+ addJitter: false,
+ canRetryError: (err) => false,
+ deltaBackoffMs: 0,
+ maxAttempts: 3
+ }
+ });
+
+ return from(client.projectInformation().toPromise()).pipe(
+ map((response) => {
+ const projectCheck: IProjectCheck = {
+ projectName: response.data.project.name
+ };
+
+ return projectCheck;
+ }),
+ catchError((error) => {
+ return of(undefined);
+ })
+ );
+ }
+}
diff --git a/src/services/layout/layout.service.ts b/src/services/layout/layout.service.ts
new file mode 100644
index 0000000..3b23cb7
--- /dev/null
+++ b/src/services/layout/layout.service.ts
@@ -0,0 +1,38 @@
+import { Injectable } from '@angular/core';
+import { BehaviorSubject } from 'rxjs';
+
+export interface ILayoutConfig {
+ title: string;
+ showDevMode: boolean;
+}
+
+@Injectable({
+ providedIn: 'root',
+})
+export class LayoutService {
+
+ public readonly isDevModeSource = new BehaviorSubject(false);
+ public readonly isDevModeChanged$ = this.isDevModeSource.asObservable();
+
+ public readonly layoutConfigSource = new BehaviorSubject(undefined);
+ public readonly layoutConfigChanged = this.layoutConfigSource.asObservable();
+
+ public readonly errorSource = new BehaviorSubject(undefined);
+ public readonly errorChanged$ = this.errorSource.asObservable();
+
+ constructor(
+ ) {
+ }
+
+ setLayoutConfig(config?: ILayoutConfig): void {
+ this.layoutConfigSource.next(config);
+ }
+
+ setError(error?: string): void {
+ this.errorSource.next(error);
+ }
+
+ setIsDevMode(show: boolean): void {
+ this.isDevModeSource.next(show);
+ }
+}
diff --git a/src/services/processing/processing-models.ts b/src/services/processing/processing-models.ts
deleted file mode 100644
index e9890bb..0000000
--- a/src/services/processing/processing-models.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-export type ProcessingItemAction = 'publish' | 'add' | 'delete' | 'upload' | 'get';
-export type ProcessingItemType = 'binary file' | 'content type' | 'content item' | 'taxonomy' | 'language variant' | 'asset'
-
-export interface IProcessingItem {
- data: any;
- type: ProcessingItemType;
- action: ProcessingItemAction;
- name: string;
-}
diff --git a/src/services/processing/processing.service.ts b/src/services/processing/processing.service.ts
index a86fe24..ffc2a91 100644
--- a/src/services/processing/processing.service.ts
+++ b/src/services/processing/processing.service.ts
@@ -2,29 +2,32 @@ import { Injectable } from '@angular/core';
import { Subject } from 'rxjs';
import { BaseService } from '../base-service';
-import { IProcessingItem } from './processing-models';
+
+export interface IProcessedItemTransformed {
+ title: string;
+ type: string;
+ }
@Injectable({
providedIn: 'root'
})
export class ProcessingService extends BaseService {
- private readonly processedItemsSource = new Subject();
+ private readonly processedItemsSource = new Subject();
private readonly clearProcessedItemsSource = new Subject();
public readonly processedItemsChanged$ = this.processedItemsSource.asObservable();
public readonly clearProcessedItemsChanged$ = this.clearProcessedItemsSource.asObservable();
- addProcessedItem(item: IProcessingItem): void {
+ addProcessedItem(item: IProcessedItemTransformed): void {
this.processedItemsSource.next([item]);
}
- addProcessedItems(items: IProcessingItem[]): void {
+ addProcessedItems(items: IProcessedItemTransformed[]): void {
this.processedItemsSource.next(items);
}
-
clearProcessedItems(): void {
this.clearProcessedItemsSource.next();
}
-}
\ No newline at end of file
+}
diff --git a/src/services/services.module.ts b/src/services/services.module.ts
deleted file mode 100644
index b8686b4..0000000
--- a/src/services/services.module.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { NgModule } from '@angular/core';
-
-@NgModule({
- declarations: [
- ],
- imports: [
- ],
- providers: [
-
- ],
-})
-export class ServicesModule { }
diff --git a/src/services/shared/shared.models.ts b/src/services/shared/shared.models.ts
deleted file mode 100644
index 2a57fc9..0000000
--- a/src/services/shared/shared.models.ts
+++ /dev/null
@@ -1,189 +0,0 @@
-
-export interface ITaxonomyTermModel {
- name: string;
- codename: string;
- terms: ITaxonomyTermModel[];
-}
-
-export interface ITaxonomyModel {
- system: {
- id: string,
- name: string,
- codename: string
- };
- terms: ITaxonomyTermModel[];
-}
-
-export interface IContentTypeModel {
- system: {
- id: string,
- name: string,
- codename: string,
- };
- elements: IContentTypeElementModel[];
-}
-
-export interface IAssetModel {
- id: string;
- fileName: string;
- title?: string;
- type: string;
- externalId?: string;
- deliveryUrl: string;
- description?: string;
- size: number;
- zipFilePath: string;
-}
-
-export interface IContentTypeElementModel {
- [key: string]: any;
- codename: string;
- type: ElementType;
- name?: string;
- taxonomyGroup?: string;
- options: IElementOptionModel[];
- mode?: ElementMode;
-}
-
-export enum ElementMode {
- single = 'single',
- multiple = 'multiple'
-}
-export enum ElementType {
- text = 'text',
- richText = 'rich_text',
- number = 'number',
- multipleChoice = 'multiple_choice',
- dateTime = 'date_time',
- asset = 'asset',
- modularContent = 'modular_content',
- taxonomy = 'taxonomy',
- urlSlug = 'url_slug',
- guidelines = 'guidelines',
- snippet = 'snippet',
- custom = 'custom'
-}
-
-export interface IElementOptionModel {
- name: string;
- codename: string;
-}
-
-export interface IContentItemFieldModel {
- name: string;
- type: string;
- value: any;
- taxonomy_group?: string;
-}
-
-export interface IContentItemElementModel {
- [key: string]: IContentItemFieldModel;
-}
-
-export interface ISlimContentItemModel {
- id: string;
- name: string;
- codename: string;
- typeId?: string;
- typeCodename: string;
- externalId?: string;
-}
-
-export interface IDeliveryContentItemsResult {
- contentItems: ISlimContentItemModel[];
- assets: IAssetModel[];
- languageVariants: ILanguageVariantModel[];
-}
-
-export interface IContentItemModel {
- [key: string]: any;
- system: {
- id: string,
- name: string,
- codename: string,
- type: string,
- language?: string,
- sitemapLocations: string[]
- };
- elements: IContentItemElementModel;
- assets: IEmbeddedAsset[];
- linkedItemCodenames: string[];
-}
-
-export interface IAssetFieldModel extends IFieldModel {
- value: IAssetModel[];
-}
-
-export interface IMultipleChoiceOptionModel {
- name: string;
- codename: string;
-}
-
-export interface ITaxonomyTermsFieldValueModel {
- codename: string;
- name: string;
-}
-
-export interface IReferenceModel {
- id?: string;
- codename?: string;
- externalId?: string;
-}
-
-export interface ILanguageVariantModel {
- itemId: string;
- itemCodename: string;
- languageCodename: string;
- elements: IContentItemElement[];
-}
-
-export interface IAssetElementValue {
- name: string;
- type: string;
- size: number;
- description: string;
- url: string;
-}
-
-export interface IMultipleChoiceElementValue {
- codename: string;
- name: string;
-}
-
-export type IElementValue = undefined | string | number | string[] | IMultipleChoiceElementValue[] | IAssetElementValue[];
-
-export interface IContentItemElement {
- elementCodename: string;
- value: IElementValue;
- elementModel: IContentTypeElementModel;
-}
-
-export interface IFieldModel {
- name: string;
- type: string;
- value: any;
-}
-
-export type EmbeddedAssetTypeSource = 'assetElement' | 'richTexElementtImages';
-
-export interface IEmbeddedAsset {
- assetSource: EmbeddedAssetTypeSource;
- languageCodename: string;
- asset: IRawAssetModel;
- fieldCodename: string;
- contentItemCodename: string;
- contentItemId: string;
- type: string;
- size: number;
- name: string;
- description?: string;
- id: string | false;
-}
-
-export interface IRawAssetModel {
- name: string;
- type: string;
- size?: number;
- description?: string;
- url: string;
-}
diff --git a/src/services/storage/import-data-storage.service.ts b/src/services/storage/import-data-storage.service.ts
index 0815af4..c711be6 100644
--- a/src/services/storage/import-data-storage.service.ts
+++ b/src/services/storage/import-data-storage.service.ts
@@ -9,6 +9,7 @@ export interface IImporDataStorage {
targetProjectId?: string;
targetProjectApiKey?: string;
publishContentItems?: boolean;
+ sourceProjectSecureApiKey?: string;
}
@Injectable({
@@ -31,4 +32,4 @@ export class ImportDataStorageService {
getImportData(): IImporDataStorage | undefined {
return this.storageService.get(this.storageSource, this.dataName);
}
-}
\ No newline at end of file
+}
diff --git a/src/services/storage/storage.service.ts b/src/services/storage/storage.service.ts
index ab9224e..8c63030 100644
--- a/src/services/storage/storage.service.ts
+++ b/src/services/storage/storage.service.ts
@@ -73,5 +73,4 @@ export class StorageService {
private saveCurrentObj(): void {
storage.setItem(this.storageName, JSON.stringify(this.storageObj));
}
-
-}
\ No newline at end of file
+}
diff --git a/src/services/templates/template.models.ts b/src/services/templates/template.models.ts
index ba97833..decc648 100644
--- a/src/services/templates/template.models.ts
+++ b/src/services/templates/template.models.ts
@@ -6,7 +6,7 @@ export interface ITemplate {
imageUrl: string;
author: {
name: string;
- email: String;
+ email: string;
};
forVersion: string;
technology: string;
diff --git a/src/services/templates/templates.service.ts b/src/services/templates/templates.service.ts
index afb7c98..9079b42 100644
--- a/src/services/templates/templates.service.ts
+++ b/src/services/templates/templates.service.ts
@@ -19,10 +19,31 @@ export class TemplatesService extends BaseService {
}
getTemplates(): Observable {
- return this.httpClient.get(environment.templatesSourceUrl + '?t=' + new Date().valueOf()).pipe(
+ return this.httpClient.get(environment.basePath + environment.templatesSourceUrl + '?t=' + new Date().valueOf()).pipe(
map((response) => {
- return response as ITemplate[];
+ const templates = response as ITemplate[];
+ for (const template of templates) {
+ template.exportPackageUrl = environment.basePath + template.exportPackageUrl + '?t=' + new Date().valueOf();
+ }
+ return templates;
})
);
}
+
+ getTemplateFile(exportPackageUrl: string): Observable {
+ return this.httpClient.get(environment.basePath + exportPackageUrl, {
+ responseType: 'blob'
+ }).pipe(
+ map((response) => {
+ return this.blobToFile(response, 'import.zip');
+ })
+ );
+ }
+
+ private blobToFile(theBlob: Blob, fileName: string): File {
+ const b: any = theBlob;
+ b.lastModifiedDate = new Date();
+ b.name = fileName;
+ return theBlob;
+ }
}
diff --git a/src/services/time/time.service.ts b/src/services/time/time.service.ts
new file mode 100644
index 0000000..94f42ff
--- /dev/null
+++ b/src/services/time/time.service.ts
@@ -0,0 +1,44 @@
+import { Injectable } from '@angular/core';
+import { BaseService } from '../base-service';
+import { DateTime, DateTimeFormatOptions } from 'luxon';
+
+export type DateTimeFormat = string | number | Date | number | DateTime | object;
+
+@Injectable({
+ providedIn: 'root'
+})
+export class TimeService extends BaseService {
+
+ formatDateVerbose(date: DateTimeFormat): string {
+ return this.format(date, 'DDDD');
+ }
+
+ format(date: DateTimeFormat, format: string, options?: DateTimeFormatOptions): string {
+ return this.getDateTime(date).toFormat(format, options);
+ }
+
+ getDateTime(date: DateTimeFormat): DateTime {
+
+ if (date instanceof DateTime) {
+ return date;
+ }
+
+ if (typeof date === 'string') {
+ return DateTime.fromISO(date);
+ }
+
+ if (typeof date === 'number') {
+ return DateTime.fromMillis(date);
+ }
+
+ if (date instanceof Date) {
+ return DateTime.fromJSDate(date);
+ }
+
+ if (typeof date === 'object') {
+ return DateTime.fromObject({ ...date});
+ }
+
+ throw Error(`Cannot parse date to Luxon DateTime. Value to be parsed is: ${date}`);
+ }
+}
diff --git a/src/services/workflow/workflow.service.ts b/src/services/workflow/workflow.service.ts
deleted file mode 100644
index bdd73dc..0000000
--- a/src/services/workflow/workflow.service.ts
+++ /dev/null
@@ -1,50 +0,0 @@
-import { Injectable } from '@angular/core';
-import { IContentManagementClient } from 'kentico-cloud-content-management';
-import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
-
-import { observableHelper } from '../../utilities';
-import { BaseService } from '../base-service';
-import { IImportConfig, IPublishItemRequest } from '../import/import.models';
-import { ProcessingService } from '../processing/processing.service';
-
-@Injectable({
- providedIn: 'root'
-})
-export class WorkflowService extends BaseService {
-
- constructor(
- private processingService: ProcessingService
- ) {
- super();
- }
-
- publishContentItems(items: IPublishItemRequest[], client: IContentManagementClient, config: IImportConfig): Observable {
- const obs: Observable[] = [];
- for (const item of items) {
- obs.push(
- client.publishOrScheduleLanguageVariant()
- .byItemId(item.itemId)
- .byLanguageId(item.languageId)
- .withData(undefined as any)
- .toObservable()
- .pipe(
- map(() => {
- this.processingService.addProcessedItem({
- data: item.itemId,
- type: 'content item',
- action: 'publish',
- name: `${item.itemId} [${item.languageId}]`
- });
- })
- )
- );
- }
-
- return observableHelper.flatMapObservables(obs, this.cmRequestDelay).pipe(
- map(() => {
- return items;
- })
- );
- }
-}
diff --git a/src/styles.scss b/src/styles.scss
deleted file mode 100644
index fe3eb43..0000000
--- a/src/styles.scss
+++ /dev/null
@@ -1,99 +0,0 @@
-@import './assets/styles/material-theme.scss';
-
-body {
- margin: 0;
- font-family: 'Roboto', sans-serif;
-
- a:focus,
- button:focus,
- input:focus,
- textarea:focus {
- outline: none;
- }
-}
-
-.w-full-width {
- width: 100%;
-}
-
-.w-cursor-pointer {
- cursor: pointer;
-}
-
-.w-import-viewport {
- width: 100%;
- height: 380px;
-}
-
-.w-text-center {
- text-align: center;
-}
-
-.w-message {
-
- &.error {
- background-color: #F44336;
- color: white;
-
- .title {
- font-size: 22px;
- padding: 8px 12px;
- display: block;
- background-color: darken(#F44336, 10);
- }
-
- .text {
- padding: 8px 12px;
- }
- }
-
- &.info {
- background-color: rgb(74, 86, 195);
- color: white;
-
- .title {
- font-size: 22px;
- padding: 8px 12px;
- display: block;
- background-color: darken(rgb(74, 86, 195), 10);
- }
-
- .text {
- padding: 8px 12px;
- }
- }
-
- &.success {
- background-color: #8BC34A;
- color: white;
-
- .title {
- font-size: 22px;
- padding: 8px 12px;
- display: block;
- background-color: darken(#8BC34A, 10);
- }
-
- .text {
- padding: 8px 12px;
- }
- }
-
- &.warning {
- background-color: #FFC107;
- color: black;
-
- .title {
- font-size: 22px;
- padding: 8px 12px;
- display: block;
- background-color: darken(#FFC107, 10);
- }
-
- .text {
- padding: 8px 12px;
- }
- }
-
-
-}
\ No newline at end of file
diff --git a/src/tsconfig.app.json b/src/tsconfig.app.json
index 190fd30..c255275 100644
--- a/src/tsconfig.app.json
+++ b/src/tsconfig.app.json
@@ -4,6 +4,11 @@
"outDir": "../out-tsc/app",
"types": []
},
+ "files": [
+ "main.ts",
+ "polyfills.ts",
+ "ambient.d.ts",
+ ],
"exclude": [
"test.ts",
"**/*.spec.ts"
diff --git a/src/typography/basic/text.ts b/src/typography/basic/text.ts
index bf72ca8..e5e0cf2 100644
--- a/src/typography/basic/text.ts
+++ b/src/typography/basic/text.ts
@@ -32,6 +32,21 @@ export class Text2Directive {
}
+@Directive({
+ selector: '[libText3]'
+})
+export class Text3Directive {
+
+ constructor(
+ private renderer: Renderer2,
+ private hostElement: ElementRef
+ ) {
+ addClass(this.renderer, this.hostElement, 'w-text-3');
+ }
+
+}
+
+
@Directive({
selector: '[libTextCaption]'
})
diff --git a/src/typography/typography.module.ts b/src/typography/typography.module.ts
index 413330d..601c3b1 100644
--- a/src/typography/typography.module.ts
+++ b/src/typography/typography.module.ts
@@ -10,6 +10,7 @@ import {
TextDisplay2Directive,
TextDisplay3Directive,
TextDisplay4Directive,
+ Text3Directive,
} from './basic/text';
import { Title1Directive, Title2Directive, Title3Directive, Title4Directive } from './basic/titles';
@@ -27,6 +28,7 @@ import { Title1Directive, Title2Directive, Title3Directive, Title4Directive } fr
// Text
Text1Directive,
Text2Directive,
+ Text3Directive,
TextCaptionDirective,
// Display
TextDisplay1Directive,
@@ -43,6 +45,7 @@ import { Title1Directive, Title2Directive, Title3Directive, Title4Directive } fr
// Text
Text1Directive,
Text2Directive,
+ Text3Directive,
TextCaptionDirective,
// Display
TextDisplay1Directive,
diff --git a/src/utilities/observable-helper.ts b/src/utilities/observable-helper.ts
index 607296b..ccdb6a2 100644
--- a/src/utilities/observable-helper.ts
+++ b/src/utilities/observable-helper.ts
@@ -1,8 +1,7 @@
import { forkJoin, Observable, of, zip } from 'rxjs';
-import { flatMap, delay } from 'rxjs/operators';
+import { delay, flatMap } from 'rxjs/operators';
export class ObservableHelper {
-
/**
* Returns true if given parameter is an Observable, false otherwise
* @param value Value to check
@@ -15,9 +14,9 @@ export class ObservableHelper {
}
/**
- * https://www.learnrxjs.io/operators/combination/zip.html
- * @param observables Observables to zip
- */
+ * https://www.learnrxjs.io/operators/combination/zip.html
+ * @param observables Observables to zip
+ */
zipObservables(observables: Observable[]): Observable {
if (!observables) {
throw Error(`Given observables are not valid`);
@@ -68,11 +67,11 @@ export class ObservableHelper {
for (let i = 1; i < observables.length; i++) {
const currentObservable = observables[i];
- flatMappedObs = flatMappedObs.pipe(
+ flatMappedObs = flatMappedObs.pipe(
delay(delayMs),
flatMap((x) => {
return currentObservable;
- }),
+ })
);
}
@@ -80,9 +79,9 @@ export class ObservableHelper {
}
/**
- * https://www.learnrxjs.io/operators/combination/forkjoin.html
- * @param observables Observables to fork join
- */
+ * https://www.learnrxjs.io/operators/combination/forkjoin.html
+ * @param observables Observables to fork join
+ */
forkJoinObservables(observables: Observable[]): Observable {
if (!observables) {
throw Error(`Given observables are not valid`);
@@ -100,4 +99,4 @@ export class ObservableHelper {
}
}
-export const observableHelper = new ObservableHelper();
\ No newline at end of file
+export const observableHelper = new ObservableHelper();
diff --git a/src/utilities/string-helper.ts b/src/utilities/string-helper.ts
index 4b46c19..de5f48e 100644
--- a/src/utilities/string-helper.ts
+++ b/src/utilities/string-helper.ts
@@ -1,7 +1,6 @@
export class StringHelper {
-
extractEverythingBefore(text: string, beforeString: string): string {
- return text.substring(0, text.indexOf(beforeString))
+ return text.substring(0, text.indexOf(beforeString));
}
/**
@@ -58,7 +57,7 @@ export class StringHelper {
/**
* Removes everything after some separator. Includes the separator itself.
- * @param text Text
+ * @param text Text
* @param separator Everything after this will be removed (included separator itself)
*/
removeEverythingAfterIncludingSeparator(text: string, separator: string): string {
@@ -74,7 +73,10 @@ export class StringHelper {
* @param text text to hash
*/
getHash(text: string): number {
- let hash = 0, i, chr;
+ // tslint:disable-next-line: one-variable-per-declaration
+ let hash = 0,
+ i,
+ chr;
if (!text) {
return hash;
}
@@ -82,7 +84,7 @@ export class StringHelper {
for (i = 0; i < text.length; i++) {
chr = text.charCodeAt(i);
// tslint:disable-next-line:no-bitwise
- hash = ((hash << 5) - hash) + chr;
+ hash = (hash << 5) - hash + chr;
// tslint:disable-next-line:no-bitwise
hash |= 0; // Convert to 32bit integer
}
@@ -102,23 +104,23 @@ export class StringHelper {
}
/**
- * Returns true if text contains all of the given inputs
- * @param text text
- * @param contains text array
- */
+ * Returns true if text contains all of the given inputs
+ * @param text text
+ * @param contains text array
+ */
containsAll(text: string, containsArr: string[]): boolean {
if (!text || !containsArr || !Array.isArray(containsArr)) {
return false;
}
- return containsArr.every(m => text.toLowerCase().includes(m.toLowerCase()));
+ return containsArr.every((m) => text.toLowerCase().includes(m.toLowerCase()));
}
/**
- * Returns true if text contains one of the given inputs
- * @param text text
- * @param contains text array
- */
+ * Returns true if text contains one of the given inputs
+ * @param text text
+ * @param contains text array
+ */
containsAny(text: string, containsArr: string[]): boolean {
if (!text || !containsArr || !Array.isArray(containsArr)) {
return false;
@@ -126,7 +128,7 @@ export class StringHelper {
let result = false;
- containsArr.forEach(contains => {
+ containsArr.forEach((contains) => {
const textContainsResult = text.toLowerCase().indexOf(contains.toLowerCase()) !== -1;
if (textContainsResult) {
result = true;
@@ -153,7 +155,7 @@ export class StringHelper {
* @param text Text
*/
stripHtmlTags(text: string): string | undefined {
- if ((text === null) || (text === '')) {
+ if (text === null || text === '') {
return undefined;
} else {
text = text.toString();
@@ -162,13 +164,14 @@ export class StringHelper {
}
newGuid(): string {
- return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
- // tslint:disable-next-line:no-bitwise triple-equals
- const r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
+ return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {
+ // tslint:disable-next-line: no-bitwise
+ const r = (Math.random() * 16) | 0,
+ // tslint:disable-next-line: no-bitwise
+ v = c === 'x' ? r : (r & 0x3) | 0x8;
return v.toString(16);
});
}
-
}
-export const stringHelper = new StringHelper();
\ No newline at end of file
+export const stringHelper = new StringHelper();
diff --git a/src/utilities/zip-helper.ts b/src/utilities/zip-helper.ts
index 320bd65..dd4c0f2 100644
--- a/src/utilities/zip-helper.ts
+++ b/src/utilities/zip-helper.ts
@@ -1,11 +1,6 @@
-import { environment } from '../environments/environment';
export class ZipHelper {
- getFullAssetPath(assetId: string, filename: string): string {
- return `${environment.export.filenames.assetsFolder}/${assetId.substr(0, 3)}/${assetId}/${filename}`;
- }
-
getZipFileTypes(): string[] {
return ['application/zip', 'application/x-zip-compressed'];
}
diff --git a/src/version-generator.js b/src/version-generator.js
index 07e767b..1339629 100644
--- a/src/version-generator.js
+++ b/src/version-generator.js
@@ -2,6 +2,7 @@ const colors = require('colors/safe');
const path = require('path');
const fs = require('fs');
const appVersion = require('../package.json').version;
+const kbmVersion = require('../package.json').dependencies["@kentico/kontent-backup-manager"];
exports.createVersionFile = (filePath, appVersion) => {
@@ -9,7 +10,8 @@ exports.createVersionFile = (filePath, appVersion) => {
const src = `
export const versionInfo = {
- version: '${appVersion}'
+ version: '${appVersion}',
+ kbmVersion: '${kbmVersion}'
};
`;
@@ -20,6 +22,7 @@ export const versionInfo = {
}
console.log(colors.green(`Updating application version ${colors.yellow(appVersion)}`));
+ console.log(colors.green(`Updating kontent backup manager version ${colors.yellow(kbmVersion)}`));
console.log(`${colors.green('Writing version module to ')}${colors.yellow(filePath)}\n`);
});
}
diff --git a/src/version.ts b/src/version.ts
index 99a11cf..1c5c0cf 100644
--- a/src/version.ts
+++ b/src/version.ts
@@ -1,4 +1,5 @@
export const versionInfo = {
- version: '0.0.8'
+ version: '1.9.1',
+ kbmVersion: '3.0.1'
};
diff --git a/templates/list.json b/templates/list.json
deleted file mode 100644
index f7bf4c1..0000000
--- a/templates/list.json
+++ /dev/null
@@ -1,44 +0,0 @@
-[
- {
- "name": "Multiverse",
- "description": "Multiverse by HTML5UP.net",
- "repoUrl": "https://github.com/ondrabus/kc-template-multiverse",
- "exportPackageUrl": "https://github.com/ondrabus/kc-template-multiverse/archive/master.zip",
- "imageUrl": "https://raw.githubusercontent.com/ondrabus/kc-template-multiverse/master/template.jpg",
- "author": {
- "name": "ondrabus",
- "email": "ondrejp@kentico.com"
- },
- "lastUpdate": "2019-05-16T15:53:00.000Z",
- "forVersion": "0.0.3",
- "technology": "Vue.js"
- },
- {
- "name": "Grayscale",
- "description": "Grayscale by Start Bootstrap",
- "repoUrl": "https://github.com/ondrabus/kc-template-grayscale",
- "exportPackageUrl": "https://github.com/ondrabus/kc-template-grayscale/archive/master.zip",
- "imageUrl": "https://raw.githubusercontent.com/ondrabus/kc-template-grayscale/master/template.jpg",
- "author": {
- "name": "ondrabus",
- "email": "ondrejp@kentico.com"
- },
- "lastUpdate": "2019-05-16T16:03:00.000Z",
- "forVersion": "0.0.3",
- "technology": "Vue.js"
- },
- {
- "name": "GatsbyJs Photon",
- "description": "Kentico Cloud & GatsbyJs template based on Photon",
- "repoUrl": "https://github.com/Simply007/cloud-template-gatsby",
- "exportPackageUrl": "https://github.com/Simply007/cloud-template-gatsby/archive/master.zip",
- "imageUrl": "https://raw.githubusercontent.com/Simply007/cloud-template-gatsby/master/template.jpg",
- "author": {
- "name": "Ondřej Chrastina",
- "email": "ondrej.chrastina@kentico.com"
- },
- "lastUpdate": "2019-05-20T16:00:00.000Z",
- "forVersion": "1",
- "technology": "GatsbyJs"
- }
-]
diff --git a/tsconfig.json b/tsconfig.json
index a719468..cc865af 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,41 +1,46 @@
{
- "compileOnSave": false,
- "compilerOptions": {
- "baseUrl": "./",
- "outDir": "./dist/out-tsc",
- "sourceMap": true,
- "declaration": false,
- "module": "es2015",
- "moduleResolution": "node",
- "emitDecoratorMetadata": true,
- "experimentalDecorators": true,
- "importHelpers": true,
- "alwaysStrict": true,
- "strictNullChecks": true,
- "strictFunctionTypes": true,
- "strictPropertyInitialization": true,
- "noImplicitAny": true,
- "target": "es5",
- "typeRoots": [
- "node_modules/@types",
- ],
- "lib": [
- "es2018",
- "dom"
- ],
- "paths": {
- "*": [
- "types/*"
- ],
- "core-js/es7/reflect": [
- "./node_modules/core-js/proposals/reflect-metadata"
- ],
- "core-js/es6/*": [
- "./node_modules/core-js/es"
- ],
- "jszip": [
- "node_modules/jszip/dist/jszip.min.js"
- ]
+ "compileOnSave": false,
+ "angularCompilerOptions": {
+ "fullTemplateTypeCheck": true,
+ "preserveWhiteSpace": false,
+ "enableIvy": true,
+ "strictInjectionParameters": true,
+ "strictTemplates": true,
+ "strictInputAccessModifiers": true
+ },
+ "compilerOptions": {
+ "types": [],
+ "rootDir": "",
+ "outDir": "./dist/out-tsc",
+ "baseUrl": "./",
+ "allowSyntheticDefaultImports": true,
+ "resolveJsonModule": true,
+ "sourceMap": true,
+ "declaration": false,
+ "moduleResolution": "node",
+ "experimentalDecorators": true,
+ "strictNullChecks": true,
+ "noImplicitReturns": true,
+ "noUnusedLocals": true,
+ "noStrictGenericChecks": false,
+ "allowUnreachableCode": false,
+ "alwaysStrict": true,
+ "noImplicitAny": true,
+ "forceConsistentCasingInFileNames": true,
+ "noUnusedParameters": false,
+ "noImplicitUseStrict": false,
+ "strictPropertyInitialization": true,
+ "strict": true,
+ "allowUnusedLabels": false,
+ "strictFunctionTypes": true,
+ "noErrorTruncation": true,
+ "noImplicitThis": true,
+ "noEmitOnError": false,
+ "isolatedModules": true,
+ "skipLibCheck": true,
+ "target": "es2015",
+ "typeRoots": ["node_modules/@types"],
+ "module": "es2020",
+ "lib": ["es2018", "dom"]
}
- }
-}
\ No newline at end of file
+}
diff --git a/tslint.json b/tslint.json
index f787b40..11c5962 100644
--- a/tslint.json
+++ b/tslint.json
@@ -1,23 +1,43 @@
{
- "extends": "tslint:recommended",
+ "extends": [
+ "tslint:recommended",
+ "rxjs-tslint-rules",
+ "tslint-angular"
+ ],
"rulesDirectory": [
"codelyzer"
],
"rules": {
- "array-type": false,
- "arrow-parens": false,
+ "rxjs-no-unsafe-takeuntil": {
+ "severity": "error"
+ },
+ "arrow-return-shorthand": true,
+ "callable-types": true,
+ "class-name": true,
+ "comment-format": [
+ true,
+ "check-space"
+ ],
+ "curly": true,
"deprecation": {
"severity": "warn"
},
+ "eofline": true,
+ "forin": true,
"import-blacklist": [
true,
"rxjs/Rx"
],
- "interface-name": false,
- "max-classes-per-file": false,
+ "import-spacing": true,
+ "indent": [
+ true,
+ "spaces"
+ ],
+ "interface-over-type-literal": true,
+ "label-position": true,
"max-line-length": [
true,
- 180
+ 1000
],
"member-access": false,
"member-ordering": [
@@ -31,7 +51,8 @@
]
}
],
- "no-consecutive-blank-lines": false,
+ "no-arg": true,
+ "no-bitwise": true,
"no-console": [
true,
"debug",
@@ -40,39 +61,124 @@
"timeEnd",
"trace"
],
+ "one-variable-per-declaration": false,
+ "no-construct": true,
+ "no-debugger": true,
+ "no-duplicate-super": true,
"no-empty": false,
+ "no-empty-interface": true,
+ "no-eval": true,
"no-inferrable-types": [
false,
"ignore-params"
],
+ "no-misused-new": true,
"no-non-null-assertion": true,
"no-redundant-jsdoc": true,
+ "no-shadowed-variable": true,
+ "no-string-literal": false,
+ "no-string-throw": true,
"no-switch-case-fall-through": true,
- "no-use-before-declare": true,
- "no-var-requires": false,
- "object-literal-key-quotes": [
+ "no-trailing-whitespace": true,
+ "no-unnecessary-initializer": true,
+ "no-unused-expression": true,
+ "no-var-keyword": true,
+ "object-literal-sort-keys": false,
+ "one-line": [
true,
- "as-needed"
+ "check-open-brace",
+ "check-catch",
+ "check-else",
+ "check-whitespace"
],
- "object-literal-sort-keys": false,
- "ordered-imports": false,
+ "prefer-const": true,
"quotemark": [
true,
"single"
],
- "trailing-comma": false,
+ "prefer-for-of": false,
+ "radix": true,
+ "semicolon": [true, "always", "strict-bound-class-methods"],
+ "triple-equals": [
+ true,
+ "allow-null-check"
+ ],
+ "typedef-whitespace": [
+ true,
+ {
+ "call-signature": "nospace",
+ "index-signature": "nospace",
+ "parameter": "nospace",
+ "property-declaration": "nospace",
+ "variable-declaration": "nospace"
+ }
+ ],
+ "unified-signatures": true,
+ "variable-name": false,
+ "whitespace": [
+ true,
+ "check-branch",
+ "check-decl",
+ "check-operator",
+ "check-separator",
+ "check-type"
+ ],
"no-output-on-prefix": true,
- "use-input-property-decorator": true,
- "use-output-property-decorator": true,
- "use-host-property-decorator": true,
"no-input-rename": true,
"no-output-rename": true,
- "use-life-cycle-interface": true,
"use-pipe-transform-interface": true,
"component-class-suffix": true,
- "directive-class-suffix": true,
- "no-angle-bracket-type-assertion": false,
+ "directive-class-suffix": false,
+ "directive-selector": [
+ true,
+ "attribute",
+ [
+ "mod",
+ "lib",
+ "layout"
+ ],
+ "camelCase"
+ ],
+ "component-selector": [
+ true,
+ "element",
+ [
+ "mod",
+ "page",
+ "lib",
+ "root",
+ "layout"
+ ],
+ "kebab-case"
+ ],
+ "arrow-parens": false,
"object-literal-shorthand": false,
- "no-string-literal": false,
+ "array-type": [
+ true,
+ "array"
+ ],
+ "no-angle-bracket-type-assertion": false,
+ "object-literal-key-quotes": [
+ false,
+ "as-needed"
+ ],
+ "max-classes-per-file": [
+ true,
+ 30
+ ],
+ "angular-whitespace": [false, "check-interpolation"],
+ "trailing-comma": [
+ false,
+ {
+ "multiline": {
+ "objects": "always",
+ "arrays": "always",
+ "functions": "never",
+ "typeLiterals": "ignore"
+ },
+ "esSpecCompliant": true
+ }
+ ],
+ "ordered-imports": false
}
-}
+}
\ No newline at end of file
+
diff --git a/src/app/pages/templates/template-list.component.ts b/src/app/pages/templates/template-list.component.ts
index 315a72c..cc4f8de 100644
--- a/src/app/pages/templates/template-list.component.ts
+++ b/src/app/pages/templates/template-list.component.ts
@@ -4,37 +4,87 @@ import { map } from 'rxjs/operators';
import { ComponentDependencies } from '../../../di';
import { ITemplate } from '../../../services/templates/template.models';
import { BasePageComponent } from '../../core/base-page.component';
+import { FormControl } from '@angular/forms';
@Component({
- changeDetection: ChangeDetectionStrategy.OnPush,
- templateUrl: './template-list.component.html',
+ changeDetection: ChangeDetectionStrategy.OnPush,
+ templateUrl: './template-list.component.html'
})
export class TemplateListComponent extends BasePageComponent implements OnInit {
+ public templates?: ITemplate[];
+ public searchControl = new FormControl();
- public templates?: ITemplate[];
-
- constructor(
- dependencies: ComponentDependencies,
- cdr: ChangeDetectorRef) {
- super(dependencies, cdr);
- }
-
- ngOnInit(): void {
- super.subscribeToObservable(
- this.dependencies.templatesService.getTemplates().pipe(
- map(templates => {
- this.templates = templates;
- })
- )
- )
- }
-
- handleDownloadClick(template: ITemplate): void {
- // track gEvent
- super.trackEvent({
- eventCategory: 'button',
- eventAction: 'download-template',
- eventLabel: template.name,
- });
- }
+ public filteredTemplates: ITemplate[] = [];
+
+ constructor(dependencies: ComponentDependencies, cdr: ChangeDetectorRef) {
+ super(dependencies, cdr);
+ }
+
+ ngOnInit(): void {
+ super.setConfig({
+ title: 'Templates',
+ showDevMode: false
+ });
+
+ super.subscribeToObservable(
+ this.dependencies.templatesService.getTemplates().pipe(
+ map((templates) => {
+ this.templates = templates;
+ this.filteredTemplates = templates;
+ })
+ )
+ );
+
+ super.subscribeToObservable(
+ this.searchControl.valueChanges.pipe(
+ map((search) => {
+ this.filteredTemplates =
+ this.templates?.filter((m) => {
+ const lowercaseSearch = search?.toLowerCase();
+ if (m.author.email?.toLowerCase().includes(lowercaseSearch)) {
+ return m;
+ }
+ if (m.author.name?.toLowerCase().includes(lowercaseSearch)) {
+ return m;
+ }
+ if (m.description?.toLowerCase().includes(lowercaseSearch)) {
+ return m;
+ }
+ if (m.name?.toLowerCase().includes(lowercaseSearch)) {
+ return m;
+ }
+ if (m.technology?.toLowerCase().includes(lowercaseSearch)) {
+ return m;
+ }
+ return false;
+ }) ?? [];
+ })
+ )
+ );
+ }
+
+ handleDownloadClick(template: ITemplate): void {
+ // track google Event
+ super.trackEvent({
+ eventCategory: 'button',
+ eventAction: 'download-template',
+ eventLabel: template.name
+ });
+ }
+
+ handleImportClick(template: ITemplate): void {
+ // track google Event
+ super.trackEvent({
+ eventCategory: 'button',
+ eventAction: 'direct-import-template',
+ eventLabel: template.name
+ });
+
+ // navigate to import page & prefill template
+ super.navigateToAction('import', {
+ queryParams: {
+ packageUrl: template.exportPackageUrl
+ }
+ });
+ }
}
diff --git a/src/app/styles/components/_button.scss b/src/app/styles/components/_button.scss
new file mode 100644
index 0000000..b9972f2
--- /dev/null
+++ b/src/app/styles/components/_button.scss
@@ -0,0 +1,79 @@
+@mixin button($theme) {
+ .w-button-large {
+ a {
+ text-decoration: none;
+ display: block;
+ color: inherit;
+
+ &:hover {
+ color: inherit;
+ }
+ }
+
+ min-height: 40px;
+ line-height: 40px;
+ padding-left: 50px;
+ padding-right: 50px;
+ border-radius: 5px;
+ text-align: center;
+ font-size: 15px;
+ font-weight: 400;
+ cursor: pointer;
+ text-decoration: none;
+
+ &.disabled {
+ cursor: not-allowed;
+ }
+
+ &.primary {
+ color: map-get($theme, primaryColorContrast);
+ background: map-get($theme, primaryColor);
+ background: linear-gradient(90deg, map-get($theme, primaryColor) 0%, map-get($theme, primaryColorGradient) 100%);
+
+ &:hover {
+ background: map-get($theme, primaryColorGradient);
+ background: linear-gradient(90deg, map-get($theme, primaryColorGradient) 0%, map-get($theme, primaryColor) 100%);
+ }
+ }
+
+ &.accent {
+ color: map-get($theme, accentColorContrast);
+ background: map-get($theme, accentColor);
+ background: linear-gradient(90deg, map-get($theme, accentColor) 0%, map-get($theme, accentColorGradient) 100%);
+
+ &:hover {
+ background: map-get($theme, accentColorGradient);
+ background: linear-gradient(90deg, map-get($theme, accentColorGradient) 0%, map-get($theme, accentColor) 100%);
+ }
+ }
+
+ &.disabled {
+ color: map-get($theme, disabledColorContrast);
+ background: map-get($theme, disabledColor);
+ background: linear-gradient(90deg, map-get($theme, disabledColor) 0%, map-get($theme, disabledColorGradient) 100%);
+
+ &:hover {
+ background: map-get($theme, disabledColorGradient);
+ background: linear-gradient(90deg, map-get($theme, disabledColorGradient) 0%, map-get($theme, disabledColor) 100%);
+ }
+ }
+
+ &.success {
+ color: white;
+ background: rgb(98, 170, 15);
+
+ &:hover {
+ background: darken(rgb(98, 170, 15), 10);
+ }
+ }
+
+ &.error {
+ color: white;
+ background: rgb(223, 46, 33);
+
+ &:hover {
+ background: darken( rgb(223, 46, 33), 10);
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/app/styles/components/_message.scss b/src/app/styles/components/_message.scss
new file mode 100644
index 0000000..29b0d45
--- /dev/null
+++ b/src/app/styles/components/_message.scss
@@ -0,0 +1,44 @@
+@mixin message($theme) {
+ .w-message {
+ padding: 16px 32px;
+ border-radius: 5px;
+
+ &.error {
+ background-color: rgb(223, 46, 33);
+ color: white;
+
+ .text {
+ font-size: 16px;
+ }
+ }
+
+ &.info {
+ background-color: rgb(74, 86, 195);
+ color: white;
+
+ .text {
+ font-size: 14px;
+ }
+ }
+
+ &.success {
+ background-color: rgb(98, 170, 15);
+ color: white;
+
+ .text {
+ font-size: 16px;
+ }
+ }
+
+ &.warning {
+ background-color: rgb(250, 208, 83);
+ color: black;
+
+ .text {
+ font-size: 16px;
+ }
+ }
+
+
+ }
+}
\ No newline at end of file
diff --git a/src/app/styles/components/_preview-data.scss b/src/app/styles/components/_preview-data.scss
new file mode 100644
index 0000000..0ff32ff
--- /dev/null
+++ b/src/app/styles/components/_preview-data.scss
@@ -0,0 +1,23 @@
+@mixin preview-data($theme) {
+
+ $color: #fff;
+
+ .w-inactive-item {
+ background-color: darken($color, 10);
+ color: black;
+ cursor: pointer;
+ border-radius: 5px;
+ }
+
+ .w-active-item {
+ background-color: darken($color, 30);
+ cursor: pointer;
+ border-radius: 5px;
+ }
+
+ .w-preview-link {
+ color: map-get($theme, primaryColor);
+ cursor: pointer;
+ font-weight: 400;
+ }
+}
\ No newline at end of file
diff --git a/src/app/styles/components/_uploader.scss b/src/app/styles/components/_uploader.scss
new file mode 100644
index 0000000..51dc8ce
--- /dev/null
+++ b/src/app/styles/components/_uploader.scss
@@ -0,0 +1,21 @@
+@mixin uploader($theme) {
+ .w-uploader {
+ .w-uploader-dropzone {
+ border: dotted 2px darken(map-get($theme, cardDackgroundColor), 20);
+ background: darken(map-get($theme, cardDackgroundColor), 0);
+ border-radius: 30px;
+ padding: 32px 16px;
+
+ &.ngx-file-drop__drop-zone--over {
+ border: dotted 2px map-get($theme, primaryColor);
+ background: darken(map-get($theme, cardDackgroundColor), 5);
+ }
+ }
+
+ .w-uploader-content {
+ font-weight: 300;
+ font-size: 18px;
+ color: map-get($theme, primaryColor);
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/app/styles/default-theme.scss b/src/app/styles/default-theme.scss
new file mode 100644
index 0000000..8655540
--- /dev/null
+++ b/src/app/styles/default-theme.scss
@@ -0,0 +1,125 @@
+@mixin default-theme() {
+ $primaryColor: #f05a22;
+ $primaryColorGradient: darken($primaryColor, 10);
+ $primaryColorContrast: white;
+ $accentColor: rgba(0, 0, 0, 0.87);
+ $accentColorGradient: lighten($accentColor, 20);
+ $accentColorContrast: white;
+ $disabledColor: #424242;
+ $disabledColorContrast: #ffffff;
+ $cardBackgroundColor: #ffffff;
+ $disabledColorGradient: #292929;
+ $headerBackground: transparent;
+
+ $backgroundColor: #f3f3f3;
+ $backgroundImage: linear-gradient(135deg, #f3f4f5, #d3dff3);
+
+ $textColor: #2b2b2b;
+ $textColorContrast: darken(#ffffff, 10);
+ $lightTextColor: #777777;
+
+ $siteTheme: (
+ primaryColor: $primaryColor,
+ primaryColorContrast: $primaryColorContrast,
+ primaryColorGradient: $primaryColorGradient,
+ accentColor: darken($accentColor, 5),
+ accentColorContrast: $accentColorContrast,
+ accentColorGradient: $accentColorGradient,
+ textColor: $textColor,
+ textColorContrast: $textColorContrast,
+ disabledColor: $disabledColor,
+ disabledColorContrast: $disabledColorContrast,
+ disabledColorGradient: $disabledColorGradient,
+ lightTextColor: $lightTextColor,
+ backgroundColor: $backgroundColor,
+ backgroundImage: $backgroundImage,
+ cardDackgroundColor: $cardBackgroundColor,
+ sideBackgroundColor: transparent,
+ sideTextColor: lighten($textColor, 10),
+ headerBackgroundColor: $headerBackground,
+ headerBackground: linear-gradient(90deg, $headerBackground 0%, lighten($headerBackground, 15) 100%),
+ headerTextColor: $textColor
+ );
+
+ // below defines your custom color to build a theme palette from
+ $primary: (
+ 50: lighten($primaryColor, 25),
+ 100: lighten($primaryColor, 20),
+ 200: lighten($primaryColor, 15),
+ 300: lighten($primaryColor, 10),
+ 400: lighten($primaryColor, 5),
+ 500: lighten($primaryColor, 0),
+ 600: lighten($primaryColor, 0),
+ 700: lighten($primaryColor, 0),
+ 800: lighten($primaryColor, 0),
+ 900: lighten($primaryColor, 0),
+ A100: $primaryColor,
+ A200: $primaryColor,
+ A400: $primaryColor,
+ A700: $primaryColor,
+ contrast: (
+ 50: $primaryColorContrast,
+ 100: $primaryColorContrast,
+ 200: $primaryColorContrast,
+ 300: $primaryColorContrast,
+ 400: $primaryColorContrast,
+ 500: $primaryColorContrast,
+ 600: $primaryColorContrast,
+ 700: $primaryColorContrast,
+ 800: $primaryColorContrast,
+ 900: $primaryColorContrast,
+ A100: $primaryColorContrast,
+ A200: $primaryColorContrast,
+ A400: $primaryColorContrast,
+ A700: $primaryColorContrast
+ )
+ );
+
+ $accent: (
+ 50: lighten($accentColor, 25),
+ 100: lighten($accentColor, 20),
+ 200: lighten($accentColor, 15),
+ 300: lighten($accentColor, 10),
+ 400: lighten($accentColor, 5),
+ 500: lighten($accentColor, 0),
+ 600: lighten($accentColor, 0),
+ 700: lighten($accentColor, 0),
+ 800: lighten($accentColor, 0),
+ 900: lighten($accentColor, 0),
+ A100: $accentColor,
+ A200: $accentColor,
+ A400: $accentColor,
+ A700: $accentColor,
+ contrast: (
+ 50: $accentColorContrast,
+ 100: $accentColorContrast,
+ 200: $accentColorContrast,
+ 300: $accentColorContrast,
+ 400: $accentColorContrast,
+ 500: $accentColorContrast,
+ 600: $accentColorContrast,
+ 700: $accentColorContrast,
+ 800: $accentColorContrast,
+ 900: $accentColorContrast,
+ A100: $accentColorContrast,
+ A200: $accentColorContrast,
+ A400: $accentColorContrast,
+ A700: $accentColorContrast
+ )
+ );
+
+ // Define the palettes for your theme using the Material Design palettes available in palette.scss
+ // (imported above). For each palette, you can optionally specify a default, lighter, and darker
+ // hue. Available color palettes: https://material.io/design/color/
+ $app-primary: mat-palette($primary);
+ $app-accent: mat-palette($accent, A200, A100, A400);
+
+ // The warn palette is optional (defaults to red).
+ $app-warn: mat-palette($mat-red);
+
+ // Create the theme object (a Sass map containing all of the palettes).
+ $app-theme: mat-light-theme($app-primary, $app-accent, $app-warn);
+
+ @include angular-material-theme($app-theme);
+ @include site-theme($siteTheme);
+}
diff --git a/src/assets/styles/directives/_card.scss b/src/app/styles/directives/_card.scss
similarity index 59%
rename from src/assets/styles/directives/_card.scss
rename to src/app/styles/directives/_card.scss
index 2c811f1..6715ac0 100644
--- a/src/assets/styles/directives/_card.scss
+++ b/src/app/styles/directives/_card.scss
@@ -1,8 +1,8 @@
-@mixin card() {
+@mixin card($theme) {
.w-card {
border-radius: 5px;
box-shadow: rgb(221, 229, 234) 0px 2px 15px;
- background-color: #ffffff;
+ background-color: map-get($theme, cardDackgroundColor);
color: inherit;
}
}
\ No newline at end of file
diff --git a/src/app/styles/global/_global.scss b/src/app/styles/global/_global.scss
new file mode 100644
index 0000000..e8832f6
--- /dev/null
+++ b/src/app/styles/global/_global.scss
@@ -0,0 +1,51 @@
+@mixin global($theme) {
+ body {
+ margin: 0;
+ color: map-get($theme, textColor);
+ background: map-get($theme, backgroundColor);
+ background-image: map-get($theme, backgroundImage);
+ height: 100vh;
+ overflow-y: scroll;
+
+ a:focus,
+ button:focus,
+ input:focus,
+ textarea:focus {
+ outline: none;
+ }
+
+ a {
+ color: map-get($theme, textColor);
+ }
+ }
+
+ .w-no-underline {
+ text-decoration: none;
+ }
+
+ .w-full-width {
+ width: 100%;
+ }
+
+ .w-cursor-pointer {
+ cursor: pointer;
+ }
+
+ .w-import-viewport {
+ width: 100%;
+ height: 380px;
+ }
+
+ .w-text-center {
+ text-align: center;
+ }
+
+ .w-text-3 {
+ color: map-get($theme, lightTextColor);
+ font-size: 13px;
+ }
+
+ .w-button-link {
+ text-decoration: none;
+ }
+}
diff --git a/src/app/styles/global/_overrides.scss b/src/app/styles/global/_overrides.scss
new file mode 100644
index 0000000..54cc3fd
--- /dev/null
+++ b/src/app/styles/global/_overrides.scss
@@ -0,0 +1,6 @@
+@mixin overrides($theme) {
+
+ .mat-title, .mat-subheading-2, .mat-display-1, .mat-display-2 {
+ margin: 0!important;
+ }
+}
\ No newline at end of file
diff --git a/src/app/styles/layout/_layout.scss b/src/app/styles/layout/_layout.scss
new file mode 100644
index 0000000..38f5d6a
--- /dev/null
+++ b/src/app/styles/layout/_layout.scss
@@ -0,0 +1,118 @@
+@mixin layout($theme) {
+
+
+ /**
+ Background is set on the tag, but it also has to be here so that it overrides default color of sidenav
+ */
+ .w-layout-background,
+ .mat-drawer-container {
+ background-color: unset !important;
+ }
+
+ .w-layout-fixed-toolbar {
+ height: 64px;
+ z-index: 2;
+ position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ background-color: map-get($theme, headerBackgroundColor);
+ background: map-get($theme, headerBackground);
+ color: map-get($theme, headerTextColor);
+
+ &.navbar-scrolled {
+ background: white;
+ }
+
+
+ a {
+ color: map-get($theme, headerTextColor);
+ text-decoration: none;
+ font-size: 26px;
+ font-weight: 600;
+
+ &:hover {
+ color: map-get($theme, headerTextColor);
+ }
+ }
+
+ .w-submit-template-link {
+ font-size: 14px;
+ }
+
+ .mat-button-wrapper {
+ font-size: 14px;
+ }
+ }
+
+ .w-layout-container-push {
+ margin-top: 64px;
+ }
+
+ .w-layout-subheader {
+ font-size: 22px;
+ font-weight: 300;
+ }
+
+ .w-layout-side-menu {
+ background-color: map-get($theme, sideBackgroundColor);
+ border: solid 1px darken(map-get($theme, sideBackgroundColor), 5);
+
+ &.small-screen {
+ background-color: white;
+ }
+
+ .w-layout-side-item {
+ margin: 8px 16px;
+ text-align: center;
+ display: block;
+ text-decoration: none;
+ color: map-get($theme, sideTextColor);
+ font-size: 13px;
+ font-weight: 400;
+ padding: 8px;
+ border-radius: 5px;
+ cursor: pointer;
+
+ .mat-icon {
+ color: lighten(map-get($theme, sideTextColor), 20);
+ }
+
+ &:hover {
+ color: map-get($theme, sideTextColor);
+ background: darken(map-get($theme, sideBackgroundColor), 9);
+
+ mat-icon {
+ color: map-get($theme, sideTextColor);
+ }
+ }
+
+ &.active {
+ color: map-get($theme, sideTextColor);
+ background: white;
+ border-radius: 5px;
+ box-shadow: rgb(0 0 0 / 3%) 0px 0px 8px, rgb(16 33 60 / 16%) 0px 8px 14px;
+
+ mat-icon {
+ color: map-get($theme, sideTextColor);
+ }
+ }
+ }
+ }
+
+ .w-layout-height-spacer {
+ align-self: stretch;
+ flex: 1;
+ }
+
+ .w-layout-content {
+ }
+
+ .w-layout-github-logo {
+ height: 40px;
+ }
+
+ .w-layout-version {
+ font-size: 12px;
+ }
+}
\ No newline at end of file
diff --git a/src/app/styles/site-theme.scss b/src/app/styles/site-theme.scss
new file mode 100644
index 0000000..7be495a
--- /dev/null
+++ b/src/app/styles/site-theme.scss
@@ -0,0 +1,25 @@
+@import './utilities/push';
+@import './utilities/pad';
+@import './directives/card';
+@import './global/_global';
+@import './global/_overrides';
+@import './layout/_layout';
+@import './components/_button';
+@import './components/_message';
+@import './components/_uploader';
+@import './components/_preview-data';
+
+@mixin site-theme($theme) {
+
+ @include pad();
+ @include push();
+ @include global($theme);
+ @include layout($theme);
+ @include card($theme);
+ @include message($theme);
+ @include preview-data($theme);
+ @include button($theme);
+ @include uploader($theme);
+ @include overrides($theme);
+}
+
diff --git a/src/app/styles/theme.scss b/src/app/styles/theme.scss
new file mode 100644
index 0000000..c869b6d
--- /dev/null
+++ b/src/app/styles/theme.scss
@@ -0,0 +1,67 @@
+@import '~@angular/material/theming';
+
+// site theme
+@import './site-theme.scss';
+
+// themes
+@import './default-theme.scss';
+
+// Font declarations
+@font-face {
+ font-family: 'GT Walsheim Pro';
+ src: url(/assets/fonts/GT-Walsheim-Bold.woff2) format('woff2'),
+ url(/assets/fonts/GT-Walsheim-Bold.woff) format('woff'),
+ url(/assets/fonts/GT-Walsheim-Bold.eot) format('embedded-opentype'),
+ url(/assets/fonts/GT-Walsheim-Bold.ttf) format('truetype');
+ font-weight: 700;
+ font-style: normal;
+ font-display: swap;
+}
+
+@font-face {
+ font-family: 'GT Walsheim Pro';
+ src: url(/assets/fonts/GT-Walsheim-Medium.woff2) format('woff2'),
+ url(/assets/fonts/GT-Walsheim-Medium.woff) format('woff'),
+ url(/assets/fonts/GT-Walsheim-Medium.eot) format('embedded-opentype'),
+ url(/assets/fonts/GT-Walsheim-Medium.ttf) format('truetype');
+ font-weight: 500;
+ font-style: normal;
+ font-display: swap;
+}
+
+@font-face {
+ font-family: 'GT Walsheim Pro';
+ src: url(/assets/fonts/GT-Walsheim-Regular.woff2) format('woff2'),
+ url(/assets/fonts/GT-Walsheim-Regular.woff) format('woff'),
+ url(/assets/fonts/GT-Walsheim-Regular.eot) format('embedded-opentype'),
+ url(/assets/fonts/GT-Walsheim-Regular.ttf) format('truetype');
+ font-weight: 400;
+ font-style: normal;
+ font-display: swap;
+}
+
+@font-face {
+ font-family: 'GT Walsheim Pro';
+ src: url(/assets/fonts/GT-Walsheim-Light.woff2) format('woff2'),
+ url(/assets/fonts/GT-Walsheim-Light.woff) format('woff'),
+ url(/assets/fonts/GT-Walsheim-Light.eot) format('embedded-opentype'),
+ url(/assets/fonts/GT-Walsheim-Light.ttf) format('truetype');
+ font-weight: 300;
+ font-style: normal;
+ font-display: swap;
+}
+
+$custom-typography: mat-typography-config(
+ $font-family: "'GT Walsheim Pro', sans-serif",
+ $subheading-2: mat-typography-level(20px, 20px, 700),
+ $subheading-1: mat-typography-level(18px, 18px, 700)
+);
+
+// Include the common styles for Angular Material. We include this here so that you only
+// have to load a single css file for Angular Material in your app.
+// Be sure that you only ever include this mixin once!
+@include mat-core($custom-typography);
+
+.w-default-theme {
+ @include default-theme();
+}
diff --git a/src/assets/styles/utilities/pad.scss b/src/app/styles/utilities/pad.scss
similarity index 100%
rename from src/assets/styles/utilities/pad.scss
rename to src/app/styles/utilities/pad.scss
diff --git a/src/assets/styles/utilities/push.scss b/src/app/styles/utilities/push.scss
similarity index 100%
rename from src/assets/styles/utilities/push.scss
rename to src/app/styles/utilities/push.scss
diff --git a/src/assets/fonts/GT-Walsheim-Bold.eot b/src/assets/fonts/GT-Walsheim-Bold.eot
new file mode 100644
index 0000000..71e6061
Binary files /dev/null and b/src/assets/fonts/GT-Walsheim-Bold.eot differ
diff --git a/src/assets/fonts/GT-Walsheim-Bold.ttf b/src/assets/fonts/GT-Walsheim-Bold.ttf
new file mode 100644
index 0000000..45dab6a
Binary files /dev/null and b/src/assets/fonts/GT-Walsheim-Bold.ttf differ
diff --git a/src/assets/fonts/GT-Walsheim-Bold.woff b/src/assets/fonts/GT-Walsheim-Bold.woff
new file mode 100644
index 0000000..a099ae4
Binary files /dev/null and b/src/assets/fonts/GT-Walsheim-Bold.woff differ
diff --git a/src/assets/fonts/GT-Walsheim-Bold.woff2 b/src/assets/fonts/GT-Walsheim-Bold.woff2
new file mode 100644
index 0000000..3845bf6
Binary files /dev/null and b/src/assets/fonts/GT-Walsheim-Bold.woff2 differ
diff --git a/src/assets/fonts/GT-Walsheim-Light.eot b/src/assets/fonts/GT-Walsheim-Light.eot
new file mode 100644
index 0000000..19ad9c9
Binary files /dev/null and b/src/assets/fonts/GT-Walsheim-Light.eot differ
diff --git a/src/assets/fonts/GT-Walsheim-Light.ttf b/src/assets/fonts/GT-Walsheim-Light.ttf
new file mode 100644
index 0000000..4559b38
Binary files /dev/null and b/src/assets/fonts/GT-Walsheim-Light.ttf differ
diff --git a/src/assets/fonts/GT-Walsheim-Light.woff b/src/assets/fonts/GT-Walsheim-Light.woff
new file mode 100644
index 0000000..4db2186
Binary files /dev/null and b/src/assets/fonts/GT-Walsheim-Light.woff differ
diff --git a/src/assets/fonts/GT-Walsheim-Light.woff2 b/src/assets/fonts/GT-Walsheim-Light.woff2
new file mode 100644
index 0000000..edd41be
Binary files /dev/null and b/src/assets/fonts/GT-Walsheim-Light.woff2 differ
diff --git a/src/assets/fonts/GT-Walsheim-Medium.eot b/src/assets/fonts/GT-Walsheim-Medium.eot
new file mode 100644
index 0000000..957f8ff
Binary files /dev/null and b/src/assets/fonts/GT-Walsheim-Medium.eot differ
diff --git a/src/assets/fonts/GT-Walsheim-Medium.ttf b/src/assets/fonts/GT-Walsheim-Medium.ttf
new file mode 100644
index 0000000..4372d6a
Binary files /dev/null and b/src/assets/fonts/GT-Walsheim-Medium.ttf differ
diff --git a/src/assets/fonts/GT-Walsheim-Medium.woff b/src/assets/fonts/GT-Walsheim-Medium.woff
new file mode 100644
index 0000000..75f962d
Binary files /dev/null and b/src/assets/fonts/GT-Walsheim-Medium.woff differ
diff --git a/src/assets/fonts/GT-Walsheim-Medium.woff2 b/src/assets/fonts/GT-Walsheim-Medium.woff2
new file mode 100644
index 0000000..e23d21e
Binary files /dev/null and b/src/assets/fonts/GT-Walsheim-Medium.woff2 differ
diff --git a/src/assets/fonts/GT-Walsheim-Regular.eot b/src/assets/fonts/GT-Walsheim-Regular.eot
new file mode 100644
index 0000000..6e170e1
Binary files /dev/null and b/src/assets/fonts/GT-Walsheim-Regular.eot differ
diff --git a/src/assets/fonts/GT-Walsheim-Regular.ttf b/src/assets/fonts/GT-Walsheim-Regular.ttf
new file mode 100644
index 0000000..86e58ba
Binary files /dev/null and b/src/assets/fonts/GT-Walsheim-Regular.ttf differ
diff --git a/src/assets/fonts/GT-Walsheim-Regular.woff b/src/assets/fonts/GT-Walsheim-Regular.woff
new file mode 100644
index 0000000..b2637e8
Binary files /dev/null and b/src/assets/fonts/GT-Walsheim-Regular.woff differ
diff --git a/src/assets/fonts/GT-Walsheim-Regular.woff2 b/src/assets/fonts/GT-Walsheim-Regular.woff2
new file mode 100644
index 0000000..f1ebea9
Binary files /dev/null and b/src/assets/fonts/GT-Walsheim-Regular.woff2 differ
diff --git a/src/assets/fonts/kentico-icons.eot b/src/assets/fonts/kentico-icons.eot
new file mode 100644
index 0000000..16b28f5
Binary files /dev/null and b/src/assets/fonts/kentico-icons.eot differ
diff --git a/src/assets/fonts/kentico-icons.svg b/src/assets/fonts/kentico-icons.svg
new file mode 100644
index 0000000..67fd77c
--- /dev/null
+++ b/src/assets/fonts/kentico-icons.svg
@@ -0,0 +1,398 @@
+
+
+
\ No newline at end of file
diff --git a/src/assets/fonts/kentico-icons.ttf b/src/assets/fonts/kentico-icons.ttf
new file mode 100644
index 0000000..9815b92
Binary files /dev/null and b/src/assets/fonts/kentico-icons.ttf differ
diff --git a/src/assets/fonts/kentico-icons.woff b/src/assets/fonts/kentico-icons.woff
new file mode 100644
index 0000000..ff5d709
Binary files /dev/null and b/src/assets/fonts/kentico-icons.woff differ
diff --git a/src/assets/fonts/readme.txt b/src/assets/fonts/readme.txt
new file mode 100644
index 0000000..e210ef4
--- /dev/null
+++ b/src/assets/fonts/readme.txt
@@ -0,0 +1 @@
+Folder location for any custom global fonts. Fonts located in this folder can be accessed in the theme by using the 'fonts/' file path.
diff --git a/src/assets/styles/material-theme.scss b/src/assets/styles/material-theme.scss
deleted file mode 100644
index 563e574..0000000
--- a/src/assets/styles/material-theme.scss
+++ /dev/null
@@ -1,92 +0,0 @@
-@import '~@angular/material/theming';
-@import './styles-core.scss';
-
-
-// Include the common styles for Angular Material. We include this here so that you only
-// have to load a single css file for Angular Material in your app.
-// Be sure that you only ever include this mixin once!
-@include mat-core();
-
-// below defines your custom color to build a theme palette from
-$primary: (
- 50: lighten($primaryColor, 25),
- 100: lighten($primaryColor, 20),
- 200: lighten($primaryColor, 15),
- 300: lighten($primaryColor, 10),
- 400: lighten($primaryColor, 5),
- 500: lighten($primaryColor, 0),
- 600: lighten($primaryColor, 0),
- 700: lighten($primaryColor, 0),
- 800: lighten($primaryColor, 0),
- 900: lighten($primaryColor, 0),
- A100: $primaryColor,
- A200: $primaryColor,
- A400: $primaryColor,
- A700: $primaryColor,
- contrast: (
- 50: $primaryColorContrast,
- 100: $primaryColorContrast,
- 200: $primaryColorContrast,
- 300: $primaryColorContrast,
- 400: $primaryColorContrast,
- 500: $primaryColorContrast,
- 600: $primaryColorContrast,
- 700: $primaryColorContrast,
- 800: $primaryColorContrast,
- 900: $primaryColorContrast,
- A100: $primaryColorContrast,
- A200: $primaryColorContrast,
- A400: $primaryColorContrast,
- A700: $primaryColorContrast,
- )
-);
-
-$accent: (
- 50: lighten($accentColor, 25),
- 100: lighten($accentColor, 20),
- 200: lighten($accentColor, 15),
- 300: lighten($accentColor, 10),
- 400: lighten($accentColor, 5),
- 500: lighten($accentColor, 0),
- 600: lighten($accentColor, 0),
- 700: lighten($accentColor, 0),
- 800: lighten($accentColor, 0),
- 900: lighten($accentColor, 0),
- A100: $accentColor,
- A200: $accentColor,
- A400: $accentColor,
- A700: $accentColor,
- contrast: (
- 50: $accentColorContrast,
- 100: $accentColorContrast,
- 200: $accentColorContrast,
- 300: $accentColorContrast,
- 400: $accentColorContrast,
- 500: $accentColorContrast,
- 600: $accentColorContrast,
- 700: $accentColorContrast,
- 800: $accentColorContrast,
- 900: $accentColorContrast,
- A100: $accentColorContrast,
- A200: $accentColorContrast,
- A400: $accentColorContrast,
- A700: $accentColorContrast,
- )
-);
-
-// Define the palettes for your theme using the Material Design palettes available in palette.scss
-// (imported above). For each palette, you can optionally specify a default, lighter, and darker
-// hue. Available color palettes: https://material.io/design/color/
-$app-primary: mat-palette($primary);
-$app-accent: mat-palette($accent, A200, A100, A400);
-
-// The warn palette is optional (defaults to red).
-$app-warn: mat-palette($mat-red);
-
-// Create the theme object (a Sass map containing all of the palettes).
-$app-theme: mat-light-theme($app-primary, $app-accent, $app-warn);
-
-// Include theme styles for core and each component used in your app.
-// Alternatively, you can import and @include the theme mixins for each component
-// that you are using.
-@include angular-material-theme($app-theme);
\ No newline at end of file
diff --git a/src/assets/styles/styles-core.scss b/src/assets/styles/styles-core.scss
deleted file mode 100644
index 845a9ca..0000000
--- a/src/assets/styles/styles-core.scss
+++ /dev/null
@@ -1,12 +0,0 @@
-@import './utilities/push';
-@import './utilities/pad';
-@import './directives/card';
-
-@include pad-utilities();
-@include push-utilities();
-@include card();
-
-$primaryColor: #008ae1;
-$accentColor: #f05a22;
-$primaryColorContrast: white;
-$accentColorContrast: white;
diff --git a/src/assets/templates/list.json b/src/assets/templates/list.json
new file mode 100644
index 0000000..549244e
--- /dev/null
+++ b/src/assets/templates/list.json
@@ -0,0 +1,170 @@
+[
+ {
+ "name": "Multiverse",
+ "description": "Multiverse by HTML5UP.net",
+ "repoUrl": "https://github.com/ondrabus/kc-template-multiverse",
+ "exportPackageUrl": "/assets/templates/packages/kc-template-multiverse-master.zip",
+ "imageUrl": "https://raw.githubusercontent.com/ondrabus/kc-template-multiverse/master/template.jpg",
+ "author": {
+ "name": "ondrabus",
+ "email": "ondrejp@kentico.com"
+ },
+ "lastUpdate": "2019-05-16T15:53:00.000Z",
+ "forVersion": "0.0.3",
+ "technology": "Vue.js"
+ },
+ {
+ "name": "Grayscale",
+ "description": "Grayscale by Start Bootstrap",
+ "repoUrl": "https://github.com/ondrabus/kc-template-grayscale",
+ "exportPackageUrl": "/assets/templates/packages/kc-template-grayscale-master.zip",
+ "imageUrl": "https://raw.githubusercontent.com/ondrabus/kc-template-grayscale/master/template.jpg",
+ "author": {
+ "name": "ondrabus",
+ "email": "ondrejp@kentico.com"
+ },
+ "lastUpdate": "2019-05-16T16:03:00.000Z",
+ "forVersion": "0.0.3",
+ "technology": "Vue.js"
+ },
+ {
+ "name": "GatsbyJs Photon",
+ "description": "Kentico Kontent & GatsbyJs template based on Photon",
+ "repoUrl": "https://github.com/Simply007/kontent-template-gatsby-landing-page-photon",
+ "exportPackageUrl": "/assets/templates/packages/gatsby-starter-kontent-master.zip",
+ "imageUrl": "https://raw.githubusercontent.com/Simply007/kontent-template-gatsby-landing-page-photon/master/template.jpg",
+ "author": {
+ "name": "Ondřej Chrastina",
+ "email": "ondrej.chrastina@kentico.com"
+ },
+ "lastUpdate": "2019-11-04T16:00:00.000Z",
+ "forVersion": "1.0.0",
+ "technology": "GatsbyJs"
+ },
+ {
+ "name": "ASP.NET Core MVC",
+ "description": "Kentico Kontent web template built with ASP.NET Core MVC",
+ "repoUrl": "https://github.com/Simply007/cloud-template-dotnet-core",
+ "exportPackageUrl": "/assets/templates/packages/cloud-template-dotnet-core-master.zip",
+ "imageUrl": "https://raw.githubusercontent.com/Simply007/cloud-template-dotnet-core/master/template.jpg",
+ "author": {
+ "name": "Ondřej Chrastina",
+ "email": "ondrej.chrastina@kentico.com"
+ },
+ "lastUpdate": "2019-06-11T16:00:00.000Z",
+ "forVersion": "1.0.0",
+ "technology": ".NET Core MVC"
+ },
+ {
+ "name": "Freelancer",
+ "description": "Start Bootstrap Freelancer template based on ASP.NET Core Blazor",
+ "repoUrl": "https://github.com/petrsvihlik/StartBootstrap.Freelancer.Blazor",
+ "exportPackageUrl": "/assets/templates/packages/StartBootstrap.Freelancer.Blazor-master.zip",
+ "imageUrl": "https://repository-images.githubusercontent.com/194238112/db381080-9b34-11e9-961a-89b79eaeb650",
+ "author": {
+ "name": "Petr Å vihlÃk",
+ "email": "petr.svihlik@kentico.com"
+ },
+ "lastUpdate": "2019-06-30T16:00:00.000Z",
+ "forVersion": "0.0.8",
+ "technology": "ASP.NET Core Blazor"
+ },
+ {
+ "name": "Statiq Starter Kontent Lumen",
+ "description": "Lumen is a lightweight starter for creating blogs using Statiq and Kentico Kontent.",
+ "repoUrl": "https://github.com/petrsvihlik/statiq-starter-kontent-lumen",
+ "exportPackageUrl": "/assets/templates/packages/statiq-starter-kontent-lumen.zip",
+ "imageUrl": "https://i.imgur.com/vLBpkl6.png",
+ "author": {
+ "name": "Petr Å vihlÃk",
+ "email": "petr.svihlik@kentico.com"
+ },
+ "lastUpdate": "2020-10-20T16:00:00.000Z",
+ "forVersion": "1.6.0",
+ "technology": "Statiq"
+ },
+ {
+ "name": "Nerd Cafe",
+ "description": "Kentico Kontent web template built with Svelte and Sapper",
+ "repoUrl": "https://github.com/Simply007/kontent-sample-app-svelte-sapper",
+ "exportPackageUrl": "/assets/templates/packages/kontent-sample-app-svelte-sapper-master.zip",
+ "imageUrl": "https://raw.githubusercontent.com/Simply007/kontent-sample-app-svelte-sapper/master/template.jpg",
+ "author": {
+ "name": "Ondřej Chrastina",
+ "email": "ondrej.chrastina@kentico.com"
+ },
+ "lastUpdate": "2019-11-22T14:00:00.000Z",
+ "forVersion": "1.0.0",
+ "technology": "Svelte & Sapper"
+ },
+ {
+ "name": "GatsbyJs Lumen",
+ "description": "Kentico Kontent & GatsbyJs template based on Lumen",
+ "repoUrl": "https://github.com/Kentico/gatsby-starter-kontent-lumen",
+ "exportPackageUrl": "/assets/templates/packages/gatsby-starter-kontent-lumen-master.zip",
+ "imageUrl": "https://camo.githubusercontent.com/9e7bbeb7cfd30f29cf4285e8866ae1277d01314f/68747470733a2f2f692e696d6775722e636f6d2f6a56496d7154322e6a7067",
+ "author": {
+ "name": "Martin Makarský",
+ "email": "martinm@kentico.com"
+ },
+ "lastUpdate": "2020-04-06T16:00:00.000Z",
+ "forVersion": "1.0.0",
+ "technology": "GatsbyJs"
+ },
+ {
+ "name": "Gatsby default starter",
+ "description": "Kentico Kontent & GatsbyJs simple starter.",
+ "repoUrl": "https://github.com/Kentico/gatsby-starter-kontent",
+ "exportPackageUrl": "/assets/templates/packages/gatsby-starter-kontent-master.zip",
+ "imageUrl": "https://raw.githubusercontent.com/Kentico/gatsby-starter-kontent/master/template.jpg",
+ "author": {
+ "name": "Ondřej Chrastina",
+ "email": "ondrej.chrastina@kentico.com"
+ },
+ "lastUpdate": "2020-05-13T09:13:05.794Z",
+ "forVersion": "1.0.0",
+ "technology": "GatsbyJs"
+ },
+ {
+ "name": "Travel Blog",
+ "description": "A sample travel blog built with VueJS and Kentico Kontent.",
+ "repoUrl": "https://github.com/Kentico/kontent-sample-blog-travel-vue",
+ "exportPackageUrl": "/assets/templates/packages/kontent-sample-blog-travel-vue-master.zip",
+ "imageUrl": "https://raw.githubusercontent.com/Kentico/kontent-sample-blog-travel-vue/master/template.jpg",
+ "author": {
+ "name": "Christopher Jennings",
+ "email": "devrel@kentico.com"
+ },
+ "lastUpdate": "2020-06-03T15:05:19.733Z",
+ "forVersion": "1.4.0",
+ "technology": "Vue.js"
+ },
+ {
+ "name": "GatsbyJs Material UI template",
+ "description": "Showcase of Kentico Kontent Intranet admin UI using Material design and Gatsby.",
+ "repoUrl": "https://github.com/Simply007/kontent-sample-app-gatsby-intranet",
+ "exportPackageUrl": "/assets/templates/packages/kontent-sample-app-gatsby-intranet-master.zip",
+ "imageUrl": "https://raw.githubusercontent.com/Simply007/kontent-sample-app-gatsby-intranet/master/template.jpg",
+ "author": {
+ "name": "Ondřej Chrastina",
+ "email": "ondrej.chrastina@kentico.com"
+ },
+ "lastUpdate": "2020-06-15T08:56:00.734Z",
+ "forVersion": "1.4.0",
+ "technology": "GatsbyJs"
+ },
+ {
+ "name": "Memoirs",
+ "description": "A complete template for blogging and pages with Kontent and Statiq",
+ "repoUrl": "https://github.com/alanta/memoirs-theme",
+ "exportPackageUrl": "/assets/templates/packages/memoirs-kontent-statiq.zip",
+ "imageUrl": "https://github.com/alanta/memoirs-theme/raw/main/template.jpg",
+ "author": {
+ "name": "Marnix van Valen",
+ "email": "marnix@alanta.nl"
+ },
+ "lastUpdate": "2020-11-25T15:00:00.000Z",
+ "forVersion": "1.6.0",
+ "technology": "Statiq"
+ }
+]
diff --git a/src/assets/templates/packages/StartBootstrap.Freelancer.Blazor-master.zip b/src/assets/templates/packages/StartBootstrap.Freelancer.Blazor-master.zip
new file mode 100644
index 0000000..2759357
Binary files /dev/null and b/src/assets/templates/packages/StartBootstrap.Freelancer.Blazor-master.zip differ
diff --git a/src/assets/templates/packages/cloud-template-dotnet-core-master.zip b/src/assets/templates/packages/cloud-template-dotnet-core-master.zip
new file mode 100644
index 0000000..df2b8d9
Binary files /dev/null and b/src/assets/templates/packages/cloud-template-dotnet-core-master.zip differ
diff --git a/src/assets/templates/packages/gatsby-starter-kontent-lumen-master.zip b/src/assets/templates/packages/gatsby-starter-kontent-lumen-master.zip
new file mode 100644
index 0000000..6696dcd
Binary files /dev/null and b/src/assets/templates/packages/gatsby-starter-kontent-lumen-master.zip differ
diff --git a/src/assets/templates/packages/gatsby-starter-kontent-master.zip b/src/assets/templates/packages/gatsby-starter-kontent-master.zip
new file mode 100644
index 0000000..6608493
Binary files /dev/null and b/src/assets/templates/packages/gatsby-starter-kontent-master.zip differ
diff --git a/src/assets/templates/packages/kc-template-grayscale-master.zip b/src/assets/templates/packages/kc-template-grayscale-master.zip
new file mode 100644
index 0000000..d7b6116
Binary files /dev/null and b/src/assets/templates/packages/kc-template-grayscale-master.zip differ
diff --git a/src/assets/templates/packages/kc-template-multiverse-master.zip b/src/assets/templates/packages/kc-template-multiverse-master.zip
new file mode 100644
index 0000000..f9d5847
Binary files /dev/null and b/src/assets/templates/packages/kc-template-multiverse-master.zip differ
diff --git a/src/assets/templates/packages/kontent-sample-app-gatsby-intranet-master.zip b/src/assets/templates/packages/kontent-sample-app-gatsby-intranet-master.zip
new file mode 100644
index 0000000..804dfe1
Binary files /dev/null and b/src/assets/templates/packages/kontent-sample-app-gatsby-intranet-master.zip differ
diff --git a/src/assets/templates/packages/kontent-sample-app-svelte-sapper-master.zip b/src/assets/templates/packages/kontent-sample-app-svelte-sapper-master.zip
new file mode 100644
index 0000000..4b728a7
Binary files /dev/null and b/src/assets/templates/packages/kontent-sample-app-svelte-sapper-master.zip differ
diff --git a/src/assets/templates/packages/kontent-sample-blog-travel-vue-master.zip b/src/assets/templates/packages/kontent-sample-blog-travel-vue-master.zip
new file mode 100644
index 0000000..fa0bb8e
Binary files /dev/null and b/src/assets/templates/packages/kontent-sample-blog-travel-vue-master.zip differ
diff --git a/src/assets/templates/packages/kontent-template-gatsby-landing-page-photon-master.zip b/src/assets/templates/packages/kontent-template-gatsby-landing-page-photon-master.zip
new file mode 100644
index 0000000..d985063
Binary files /dev/null and b/src/assets/templates/packages/kontent-template-gatsby-landing-page-photon-master.zip differ
diff --git a/src/assets/templates/packages/memoirs-kontent-statiq.zip b/src/assets/templates/packages/memoirs-kontent-statiq.zip
new file mode 100644
index 0000000..ac0f073
Binary files /dev/null and b/src/assets/templates/packages/memoirs-kontent-statiq.zip differ
diff --git a/src/assets/templates/packages/statiq-starter-kontent-lumen.zip b/src/assets/templates/packages/statiq-starter-kontent-lumen.zip
new file mode 100644
index 0000000..a616571
Binary files /dev/null and b/src/assets/templates/packages/statiq-starter-kontent-lumen.zip differ
diff --git a/src/di/component-dependencies.ts b/src/di/component-dependencies.ts
index bcf928d..0969738 100644
--- a/src/di/component-dependencies.ts
+++ b/src/di/component-dependencies.ts
@@ -3,29 +3,30 @@ import { MediaObserver } from '@angular/flex-layout';
import { Router } from '@angular/router';
import {
- CleanupService,
- ExportService,
GoogleAnalyticsService,
ImportDataStorageService,
- ImportService,
- ProcessingService,
TemplatesService,
+ ProcessingService,
+ LayoutService,
+ StorageService,
+ TimeService,
+ ProjectService
} from '../services';
@Injectable({
providedIn: 'root'
})
export class ComponentDependencies {
-
constructor(
- public importService: ImportService,
- public cleanupService: CleanupService,
- public exportService: ExportService,
public processingService: ProcessingService,
public media: MediaObserver,
public router: Router,
public templatesService: TemplatesService,
public googleAnalyticsService: GoogleAnalyticsService,
public importDataStorageService: ImportDataStorageService,
- ) { }
+ public layoutService: LayoutService,
+ public storageService: StorageService,
+ public timeService: TimeService,
+ public projectService: ProjectService
+ ) {}
}
diff --git a/src/di/dependencies.module.ts b/src/di/dependencies.module.ts
deleted file mode 100644
index 86878d9..0000000
--- a/src/di/dependencies.module.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { NgModule } from '@angular/core';
-import { RouterModule } from '@angular/router';
-
-import { ExternalModule } from '../app/external';
-import { ServicesModule } from '../services';
-
-@NgModule({
- imports: [
- RouterModule,
- ServicesModule,
- ExternalModule
- ],
- providers: [
-
- ],
-})
-export class DependenciesModule { }
diff --git a/src/di/index.ts b/src/di/index.ts
index 207af10..dd83eb2 100644
--- a/src/di/index.ts
+++ b/src/di/index.ts
@@ -1,2 +1 @@
export * from './component-dependencies';
-export * from './dependencies.module';
diff --git a/src/environments/environment.prod.ts b/src/environments/environment.prod.ts
index 7096c67..ffb27b6 100644
--- a/src/environments/environment.prod.ts
+++ b/src/environments/environment.prod.ts
@@ -1,33 +1,21 @@
export const environment = {
production: true,
- appName: 'Template manager',
- templatesSourceUrl: 'https://raw.githubusercontent.com/Kentico/cloud-template-manager/master/templates/list.json',
+ appName: 'Kontent Template Manager',
+ basePath: '/kontent-template-manager',
+ templatesSourceUrl: '/assets/templates/list.json',
+ backupManagerName: 'Kontent backup manager',
+ backupManagerUrl: 'https://github.com/Kentico/kontent-backup-manager-js',
+ google: {
+ enableTracking: true,
+ trackingPrefix: '/kontent-template-manager',
+ googleAnalyticsTrackingId: 'UA-69014260-7',
+ },
defaultProjects: {
- depth: 10,
- languages: '',
- sourceProjectApiKey: '',
sourceProjectId: '',
+ sourceProjectApiKey: '',
targetProjectId: '',
targetProjectApiKey: ''
},
- requestDelay: 80,
- export: {
- filenames: {
- packagePrefix: 'export_',
- assets: 'assets.json',
- languageVariants: 'language-variants.json',
- contentItems: 'content-items.json',
- contentTypes: 'content-types.json',
- taxonomies: 'taxonomies.json',
- assetsFolder: 'assets',
- metadata: 'metadata.json'
- }
- },
- google: {
- enableTracking: true,
- trackingPrefix: '/cloud-template-manager',
- googleAnalyticsTrackingId: 'UA-69014260-7',
- },
storage: {
storageName: 'templateManagerData'
}
diff --git a/src/environments/environment.ts b/src/environments/environment.ts
index 057bf74..56a2661 100644
--- a/src/environments/environment.ts
+++ b/src/environments/environment.ts
@@ -2,37 +2,26 @@
// `ng build --prod` replaces `environment.ts` with `environment.prod.ts`.
// The list of file replacements can be found in `angular.json`.
+
export const environment = {
production: false,
- appName: 'Template manager',
- templatesSourceUrl: 'https://raw.githubusercontent.com/Kentico/cloud-template-manager/master/templates/list.json',
+ appName: 'Kontent Template Manager',
+ basePath: '',
+ templatesSourceUrl: '/assets/templates/list.json',
+ backupManagerName: 'Kontent backup manager',
+ backupManagerUrl: 'https://github.com/Kentico/kontent-backup-manager-js',
defaultProjects: {
- depth: 10,
sourceProjectId: 'f249eb83-18fd-01b8-2db7-c561bcb1ed1e',
// tslint:disable-next-line:max-line-length
- sourceProjectApiKey: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJqdGkiOiIxM2VkMmI4ODQ1NDg0ZjIwYjVkNWVhOTRlZDVlOWY0YSIsImlhdCI6IjE1NTQzNjg0NjgiLCJleHAiOiIxODk5OTY4NDY4IiwicHJvamVjdF9pZCI6ImYyNDllYjgzMThmZDAxYjgyZGI3YzU2MWJjYjFlZDFlIiwidmVyIjoiMi4xLjAiLCJ1aWQiOiJ1c3JfMHZRWUJDcUF2cm5vNXJpZkhuaVlFRyIsImF1ZCI6Im1hbmFnZS5rZW50aWNvY2xvdWQuY29tIn0.UJ8rpJ5fKrCco4_1JvVtMFvUIyrIHr1Wo-VTRbdx34M',
- languages: 'en-US; es-ES',
+ sourceProjectApiKey: 'ew0KICAiYWxnIjogIkhTMjU2IiwNCiAgInR5cCI6ICJKV1QiDQp9.ew0KICAianRpIjogIjEzZWQyYjg4NDU0ODRmMjBiNWQ1ZWE5NGVkNWU5ZjRhIiwNCiAgImlhdCI6ICIxNTU0MzY4NDY4IiwNCiAgImV4cCI6ICIxODk5OTY4NDY4IiwNCiAgInByb2plY3RfaWQiOiAiZjI0OWViODMxOGZkMDFiODJkYjdjNTYxYmNiMWVkMWUiLA0KICAidmVyIjogIjIuMS4wIiwNCiAgInVpZCI6ICJ1c3JfMHZRWUJDcUF2cm5vNXJpZkhuaVlFRyIsDQogICJhdWQiOiAibWFuYWdlLmtlbnRpY29jbG91ZC5jb20iDQp9.mrlstpy1goa7pCWd1RnJGRygdn0HrwsZ6_mrYYFpbfM',
// sourceProjectId: 'b062c2f0-1a33-0070-794f-b48fa8bc1899',
targetProjectId: 'ede994d8-bb05-01b5-9c33-8b65e7372306',
// tslint:disable-next-line:max-line-length
- targetProjectApiKey: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJqdGkiOiI0Yjg1NmJmMTEyYTA0ODcwYjRiMDBjNGQ3OTZkZGUxNyIsImlhdCI6IjE1NTI2NDk3NjUiLCJleHAiOiIxODk4MjQ5NzY1IiwicHJvamVjdF9pZCI6ImVkZTk5NGQ4YmIwNTAxYjU5YzMzOGI2NWU3MzcyMzA2IiwidmVyIjoiMi4xLjAiLCJ1aWQiOiJ1c3JfMHZRWUJDcUF2cm5vNXJpZkhuaVlFRyIsImF1ZCI6Im1hbmFnZS5rZW50aWNvY2xvdWQuY29tIn0.d5ynvZh06reXR2JRSR86Vp9jhFFqmX1mJlD_jzuHG84'
- },
- requestDelay: 0,
- export: {
- filenames: {
- packagePrefix: 'export_',
- assets: 'assets.json',
- languageVariants: 'language-variants.json',
- contentItems: 'content-items.json',
- contentTypes: 'content-types.json',
- taxonomies: 'taxonomies.json',
- assetsFolder: 'assets',
- metadata: 'metadata.json'
- }
+ targetProjectApiKey: 'ew0KICAiYWxnIjogIkhTMjU2IiwNCiAgInR5cCI6ICJKV1QiDQp9.ew0KICAianRpIjogIjRiODU2YmYxMTJhMDQ4NzBiNGIwMGM0ZDc5NmRkZTE3IiwNCiAgImlhdCI6ICIxNTUyNjQ5NzY1IiwNCiAgImV4cCI6ICIxODk4MjQ5NzY1IiwNCiAgInByb2plY3RfaWQiOiAiZWRlOTk0ZDhiYjA1MDFiNTljMzM4YjY1ZTczNzIzMDYiLA0KICAidmVyIjogIjIuMS4wIiwNCiAgInVpZCI6ICJ1c3JfMHZRWUJDcUF2cm5vNXJpZkhuaVlFRyIsDQogICJhdWQiOiAibWFuYWdlLmtlbnRpY29jbG91ZC5jb20iDQp9.Pb7cpftOuzWFsppX1lPjZWkOviC5jDOuZyHKwYgPWNU'
},
google: {
enableTracking: false,
- trackingPrefix: '/cloud-template-manager',
+ trackingPrefix: '/kontent-template-manager',
googleAnalyticsTrackingId: 'UA-69014260-7',
},
storage: {
diff --git a/src/favicon.ico b/src/favicon.ico
index 504f952..1a47972 100644
Binary files a/src/favicon.ico and b/src/favicon.ico differ
diff --git a/src/index.html b/src/index.html
index b1a9420..8fd4d4d 100644
--- a/src/index.html
+++ b/src/index.html
@@ -1,16 +1,16 @@
-
-
-
-
-
+ ![]()
+
\ No newline at end of file
+
+ {{ template.name }}
+
+
+
-
+
-
+
-
+ By {{ template.author.name }}
+
+
+ {{ template.technology }}
+
+
+ {{ template.lastUpdate ? formatDateVerbose(template.lastUpdate) : 'never' }}
+
- {{ template.technology }}
+
+ {{ template.description }}
-
- {{ template.lastUpdate }}
+
+
-
- {{ template.description }}
-
-
-', 'g'), ''); - } - - private mapElementValue(contentType: IImportContentTypeResult, languageVariant: ILanguageVariantModel, field: IContentItemElement, prerequisities: ILanguageVariantsImportPrerequisities): any { - if (field.elementModel.type === ElementType.modularContent) { - const linkedItemCodenames = field.value as string[]; - const newLinkedItems: SharedContracts.IReferenceObjectContract[] = []; - for (const currentLinkedItem of linkedItemCodenames) { - const candidateLinkedItem = prerequisities.contentItems.find(m => m.originalItem.codename === currentLinkedItem); - - if (!candidateLinkedItem) { - throw Error(`Cannot find linked item '${currentLinkedItem}'. This was requested by '${languageVariant.itemCodename}'`); - } - - newLinkedItems.push({ - codename: candidateLinkedItem.importedItem.codename - }); - } - - return newLinkedItems; - } - - const value = field.value; - - if (field.elementModel.type === ElementType.richText) { - const richTextValueWithFixedHtml = this.fixInvalidHtmlInRichTextField(field.value as string); - const doc = this.getRichTextHtmlElement(richTextValueWithFixedHtml); - this.processRichTextItems(doc.children, prerequisities); - return doc.innerHTML; - } - - if (field.elementModel.type === ElementType.taxonomy) { - const currentTaxonomyTerms = field.value as ITaxonomyTermsFieldValueModel[]; - const newTaxonomyTerms: SharedContracts.IReferenceObjectContract[] = []; - - if (!field.elementModel.taxonomyGroup) { - throw Error(`Taxonomy is not set for field '${field.elementCodename}' referenced by '${contentType.originalItem.system.codename}' content type - and used by '${languageVariant.itemCodename}' language variant with language '${languageVariant.languageCodename}'`); - } - - const candidateTaxonomy = prerequisities.taxonomies.find(m => m.originalItem.system.codename === field.elementModel.taxonomyGroup); - - if (!candidateTaxonomy) { - throw Error(`Could not find candidate taxonomy group '${field.elementModel.taxonomyGroup}' for field '${field.elementCodename}' referenced by '${contentType.originalItem.system.codename}' content type - and used by '${languageVariant.itemCodename}' language variant with language '${languageVariant.languageCodename}'`); - } - - for (const currentTaxonomyTerm of currentTaxonomyTerms) { - const candidateTaxonomyTerm = this.findTaxonomyTermRecursively(currentTaxonomyTerm.codename, candidateTaxonomy.originalItem.terms); - if (!candidateTaxonomyTerm) { - console.log(prerequisities.taxonomies); - console.log(candidateTaxonomy); - console.log(currentTaxonomyTerm); - throw Error(`Cannot find taxonomy term '${currentTaxonomyTerm.codename}' for taxonomy group '${candidateTaxonomy.originalItem.system.codename}' referenced by field '${field.elementCodename}' in '${contentType.originalItem.system.codename}' content type - and used by '${languageVariant.itemCodename}' language variant with language '${languageVariant.languageCodename}'`); - } - - newTaxonomyTerms.push({ - codename: candidateTaxonomyTerm.codename - }); - } - - return newTaxonomyTerms; - } - - if (field.elementModel.type === ElementType.multipleChoice) { - const currentOptions = field.value as IMultipleChoiceElementValue[]; - const newOptions: SharedContracts.IReferenceObjectContract[] = []; - - const originalElement = contentType.originalItem.elements.find(m => m.codename === field.elementModel.codename); - if (!originalElement) { - throw Error(`Invalid original element`); - } - - for (const currentOption of currentOptions) { - newOptions.push({ - codename: currentOption.codename - }); - } - - return newOptions; - } - - if (field.elementModel.type === ElementType.asset) { - const currentAssets = field.value as IAssetElementValue[]; - const newAssets: SharedContracts.IReferenceObjectContract[] = []; - - for (const currentAsset of currentAssets) { - const candidateAsset = prerequisities.assets.find(m => m.originalItem.deliveryUrl === currentAsset.url); - - if (!candidateAsset) { - throw Error(`Cannot find asset with url '${currentAsset.url}'`); - } - - newAssets.push({ - id: candidateAsset.importedItem.id - }); - } - - return newAssets; - } - - return value; - } - - private findTaxonomyTermRecursively(taxonomyTermToFind: string, originalTerms: ITaxonomyTermModel[]): ITaxonomyTermModel | undefined { - const foundTerm = originalTerms.find(m => m.codename.toLowerCase() === taxonomyTermToFind.toLowerCase()); - - if (foundTerm) { - return foundTerm; - } - - for (const taxonomyTerm of originalTerms) { - return this.findTaxonomyTermRecursively(taxonomyTermToFind, taxonomyTerm.terms); - } - } - - private getElements(contentItem: IImportContentItemResult, languageVariant: ILanguageVariantModel, prerequisities: ILanguageVariantsImportPrerequisities): LanguageVariantModels.ILanguageVariantElementCodename[] { - const contentItemElements: LanguageVariantModels.ILanguageVariantElementCodename[] = []; - - const candidateContentType = prerequisities.contentTypes.find(m => m.originalItem.system.codename === contentItem.originalItem.typeCodename); - - if (!candidateContentType) { - throw Error(`Could not find candidate content type '${contentItem.originalItem.typeCodename}'. This type is required by content item '${languageVariant.itemCodename}'`); - } - - const originalElements = candidateContentType.originalItem.elements; - const importedElements = candidateContentType.importedItem.elements; - - for (const elementData of languageVariant.elements) { - const originalElement = originalElements.find(m => m.codename === elementData.elementModel.codename); - - if (!originalElement) { - throw Error(`Cannot find element '${elementData.elementModel.codename}' in original elements`); - } - - const originalElementIndex = originalElements.findIndex(m => m.codename === elementData.elementModel.codename); - - if (originalElementIndex === -1) { - throw Error(`Cannot find element with index '${originalElementIndex}' in original elements`); - } - - // This is very dangerous because we are mapping elements based on their index - // and if KC API changes order of elements, this will be broken. - const importedElement = importedElements[originalElementIndex]; - - if (!importedElement) { - throw Error(`Could not find candidate import element for element with codename '${originalElement.codename}'`); - } - - contentItemElements.push({ - codename: importedElement.codename, - value: this.mapElementValue(candidateContentType, languageVariant, elementData, prerequisities) - }); - } - - return contentItemElements; - } - -} diff --git a/src/services/import/types/taxonomies-import.service.ts b/src/services/import/types/taxonomies-import.service.ts deleted file mode 100644 index 699533b..0000000 --- a/src/services/import/types/taxonomies-import.service.ts +++ /dev/null @@ -1,73 +0,0 @@ -import { Injectable } from '@angular/core'; -import { IContentManagementClient } from 'kentico-cloud-content-management'; -import { Observable } from 'rxjs'; -import { delay, map } from 'rxjs/operators'; - -import { observableHelper } from '../../../utilities'; -import { BaseService } from '../../base-service'; -import { ProcessingService } from '../../processing/processing.service'; -import { ITaxonomyModel } from '../../shared/shared.models'; -import { IImportConfig, IImportTaxonomyResult } from '../import.models'; - -@Injectable({ - providedIn: 'root' -}) -export class TaxonomiesImportService extends BaseService { - - constructor( - private processingService: ProcessingService - ) { - super(); - } - - importTaxonomies(targetClient: IContentManagementClient, taxonomies: ITaxonomyModel[], config: IImportConfig): Observable