Refactoring to CM API, fixes ts lint, WIP (language variants missing)

src/app/export/export.component.html

@@ -31,8 +31,15 @@ <h1>
                 </mat-form-field>
 
                 <mat-form-field class="push-top w-full-width">
-                        <input autocomplete="off" matInput placeholder="Languages - separated by semicolon such as 'en-US; es-ES'. Leave empty for default language." formControlName="languages">
-                    </mat-form-field>
+                    <input autocomplete="off" matInput placeholder="API Key" formControlName="sourceProjectCmApiKey"
+                        required>
+                </mat-form-field>
+
+                <mat-form-field class="push-top w-full-width">
+                    <input autocomplete="off" matInput
+                        placeholder="Languages - separated by semicolon such as 'en-US; es-ES'. Leave empty for default language."
+                        formControlName="languages">
+                </mat-form-field>
             </mat-card-content>
         </mat-card>
 

src/app/export/export.component.ts

@@ -39,6 +39,7 @@ export class ExportComponent extends BaseComponent {
     this.formGroup = this.fb.group({
       projectId: [environment.defaultProjects.sourceProjectId, Validators.required],
       languages: [environment.defaultProjects.languages],
+      sourceProjectCmApiKey: [environment.defaultProjects.sourceProjectApiKey, Validators.required],
     });
   }
 
@@ -50,7 +51,7 @@ export class ExportComponent extends BaseComponent {
       super.startLoading();
       super.detectChanges();
       super.subscribeToObservable(
-        this.dependencies.exportService.prepareAndDownloadPackage(config.projectId, this.parsedLanguages).pipe(
+        this.dependencies.exportService.prepareAndDownloadPackage(config.projectId, config.apiKey, this.parsedLanguages).pipe(
           map((result) => {
             this.dependencies.exportService.createAndDownloadZipFile(config.projectId, result, () => {
               super.stopLoading();
@@ -74,6 +75,7 @@ export class ExportComponent extends BaseComponent {
 
   private getConfig(): {
     projectId: string,
+    apiKey: string;
   } | undefined {
     const projectId = this.formGroup.controls['projectId'].value;
 
@@ -82,8 +84,16 @@ export class ExportComponent extends BaseComponent {
       return;
     }
 
+    const sourceProjectCmApiKey = this.formGroup.controls['sourceProjectCmApiKey'].value;
+
+    if (!sourceProjectCmApiKey) {
+      this.error = 'Invalid project API key';
+      return;
+    }
+
     return {
-      projectId: projectId
+      projectId: projectId,
+      apiKey: sourceProjectCmApiKey
     };
   }
 

src/app/import/import-from-file.component.html

@@ -69,7 +69,7 @@ <h1>
                         imported
                     </mat-list-item>
                     <mat-list-item role="listitem">
-                        <strong>{{ importResult.assets.length }}</strong>&nbsp;imported assets
+                        <strong>{{ importResult.importedAssets.length }}</strong>&nbsp;imported assets
                     </mat-list-item>
                     <mat-list-item role="listitem">
                         <strong>{{ importResult.publishedItems.length }}</strong>&nbsp;published content items

src/app/import/import-from-project.component.html

@@ -21,6 +21,11 @@ <h1>
                         required>
                 </mat-form-field>
 
+                <mat-form-field class="push-top w-full-width">
+                    <input autocomplete="off" matInput placeholder="API Key" formControlName="sourceProjectCmApiKey"
+                        required>
+                </mat-form-field>
+
                 <mat-form-field class="push-top w-full-width">
                     <input autocomplete="off" matInput placeholder="Languages - separated by semicolon such as 'en-US; es-ES'. Leave empty for default language." formControlName="languages">
                 </mat-form-field>
@@ -83,7 +88,7 @@ <h1>
                         imported
                     </mat-list-item>
                     <mat-list-item role="listitem">
-                        <strong>{{ importResult.assets.length }}</strong>&nbsp;imported assets
+                        <strong>{{ importResult.importedAssets.length }}</strong>&nbsp;imported assets
                     </mat-list-item>
                     <mat-list-item role="listitem">
                         <strong>{{ importResult.publishedItems.length }}</strong>&nbsp;published content items

src/app/import/import-from-project.component.ts

@@ -54,6 +54,7 @@ export class ImportFromProjectComponent extends BaseComponent {
       targetProjectId: [environment.defaultProjects.targetProjectId, Validators.required],
       languages: [environment.defaultProjects.languages],
       targetProjectCmApiKey: [environment.defaultProjects.targetProjectApiKey, Validators.required],
+      sourceProjectCmApiKey: [environment.defaultProjects.sourceProjectApiKey, Validators.required],
     });
   }
 
@@ -70,6 +71,7 @@ export class ImportFromProjectComponent extends BaseComponent {
     const sourceProjectId = this.formGroup.controls['sourceProjectId'].value;
     const targetProjectId = this.formGroup.controls['targetProjectId'].value;
     const targetProjectCmApiKey = this.formGroup.controls['targetProjectCmApiKey'].value;
+    const sourceProjectCmApiKey = this.formGroup.controls['sourceProjectCmApiKey'].value;
     const languages = this.parsedLanguages;
 
     super.startLoading();
@@ -79,6 +81,7 @@ export class ImportFromProjectComponent extends BaseComponent {
       sourceProjectId: sourceProjectId,
       targetProjectId: targetProjectId,
       targetProjectCmApiKey: targetProjectCmApiKey,
+      sourceProjectCmApiKey: sourceProjectCmApiKey
     }).pipe(
 
       map((importResult) => {

src/app/import/migrate-content-items.component.html

@@ -26,6 +26,11 @@ <h1>
                         required>
                 </mat-form-field>
 
+                <mat-form-field class="push-top w-full-width">
+                    <input autocomplete="off" matInput placeholder="API Key" formControlName="sourceProjectCmApiKey"
+                        required>
+                </mat-form-field>
+
                 <mat-form-field class="push-top w-full-width">
                     <input autocomplete="off" matInput placeholder="Languages - separated by semicolon such as 'en-US; es-ES'. Leave empty for default language." formControlName="languages">
                 </mat-form-field>

src/app/import/migrate-content-items.component.ts

@@ -54,6 +54,7 @@ export class MigrateContentItemsComponent extends BaseComponent {
       targetProjectId: [environment.defaultProjects.targetProjectId, Validators.required],
       languages: [environment.defaultProjects.languages],
       targetProjectCmApiKey: [environment.defaultProjects.targetProjectApiKey, Validators.required],
+      sourceProjectCmApiKey: [environment.defaultProjects.sourceProjectApiKey, Validators.required],
     });
   }
 
@@ -70,6 +71,7 @@ export class MigrateContentItemsComponent extends BaseComponent {
     const sourceProjectId = this.formGroup.controls['sourceProjectId'].value;
     const targetProjectId = this.formGroup.controls['targetProjectId'].value;
     const targetProjectCmApiKey = this.formGroup.controls['targetProjectCmApiKey'].value;
+    const sourceProjectCmApiKey = this.formGroup.controls['sourceProjectCmApiKey'].value;
     const languages = this.parsedLanguages;
 
     super.startLoading();
@@ -78,7 +80,8 @@ export class MigrateContentItemsComponent extends BaseComponent {
       languages: languages,
       sourceProjectId: sourceProjectId,
       targetProjectCmApiKey: targetProjectCmApiKey,
-      targetProjectId: targetProjectId
+      targetProjectId: targetProjectId,
+      sourceProjectCmApiKey: sourceProjectCmApiKey
     }).pipe(
 
       map((importResult) => {

src/environments/environment.prod.ts

@@ -3,6 +3,7 @@ export const environment = {
   appName: 'Template manager',
   defaultProjects: {
     languages: '',
+    sourceProjectApiKey: '',
     sourceProjectId: '',
     targetProjectId: '',
     targetProjectApiKey: ''
@@ -11,6 +12,8 @@ export const environment = {
   export: {
     filenames: {
       packagePrefix: 'export_',
+      assets: 'assets.json',
+      languageVariants: 'language-variants.json',
       contentItems: 'content-items.json',
       contentTypes: 'content-types.json',
       taxonomies: 'taxonomies.json',

src/environments/environment.ts

@@ -6,16 +6,21 @@ export const environment = {
   production: false,
   appName: 'Template manager',
   defaultProjects: {
-     sourceProjectId: 'f249eb83-18fd-01b8-2db7-c561bcb1ed1e',
+    sourceProjectId: 'f249eb83-18fd-01b8-2db7-c561bcb1ed1e',
+    // tslint:disable-next-line:max-line-length
+    sourceProjectApiKey: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJqdGkiOiIxM2VkMmI4ODQ1NDg0ZjIwYjVkNWVhOTRlZDVlOWY0YSIsImlhdCI6IjE1NTQzNjg0NjgiLCJleHAiOiIxODk5OTY4NDY4IiwicHJvamVjdF9pZCI6ImYyNDllYjgzMThmZDAxYjgyZGI3YzU2MWJjYjFlZDFlIiwidmVyIjoiMi4xLjAiLCJ1aWQiOiJ1c3JfMHZRWUJDcUF2cm5vNXJpZkhuaVlFRyIsImF1ZCI6Im1hbmFnZS5rZW50aWNvY2xvdWQuY29tIn0.UJ8rpJ5fKrCco4_1JvVtMFvUIyrIHr1Wo-VTRbdx34M',
     languages: 'en-US; es-ES',
     // 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: 80,
   export: {
     filenames: {
       packagePrefix: 'export_',
+      assets: 'assets.json',
+      languageVariants: 'language-variants.json',
       contentItems: 'content-items.json',
       contentTypes: 'content-types.json',
       taxonomies: 'taxonomies.json',

src/services/export/export.models.ts

@@ -1,10 +1,13 @@
-import { IEmbeddedAsset } from '../shared/shared.models';
+import { IEmbeddedAsset, ICMAssetModel } from '../shared/shared.models';
 
 export interface IExportJsonResult {
     contentTypes: string;
     contentItems: string;
     taxonomies: string;
-    assets: IEmbeddedAsset[];
+    assets: string;
+    languageVariants: string;
+
+    assetModels: ICMAssetModel[];
 }
 
 

src/services/export/export.service.ts

@@ -7,64 +7,81 @@ import { flatMap, map } from 'rxjs/operators';
 
 import { environment } from '../../environments/environment';
 import { BaseService } from '../base-service';
-import { DeliveryFetchService } from '../fetch/delivery-fetch.service';
+import { CmFetchService } from '../fetch/cm-fetch.service';
+import { IContentTypeModel } from '../shared/shared.models';
 import { IExportJsonResult } from './export.models';
 
 @Injectable()
 export class ExportService extends BaseService {
 
     constructor(
-        private deliveryFetchService: DeliveryFetchService
+        private cmFetchService: CmFetchService
     ) {
         super();
     }
 
-    prepareAndDownloadPackage(projectId: string, languageCodenames: string[]): Observable<IExportJsonResult> {
+    prepareAndDownloadPackage(projectId: string, projectApiKey: string, languageCodenames: string[]): Observable<IExportJsonResult> {
+        const contentTypes: IContentTypeModel[] = [];
         const result: IExportJsonResult = {
             contentItems: '',
             contentTypes: '',
             taxonomies: '',
-            assets: []
+            assets: '',
+            languageVariants: '',
+            assetModels: []
         };
 
-        return this.deliveryFetchService.getAllTypes(projectId, []).pipe(
+        return this.cmFetchService.getAllTypes(projectId, projectApiKey, []).pipe(
             flatMap(types => {
                 result.contentTypes = JSON.stringify(types);
+                contentTypes.push(...types);
 
-                return this.deliveryFetchService.getAllContentItems(projectId, languageCodenames);
+                return this.cmFetchService.getAllContentItems(projectId, projectApiKey, []);
             }),
             flatMap(contentItems => {
                 result.contentItems = JSON.stringify(contentItems);
 
-                for (const contentItem of contentItems) {
-                    result.assets.push(...contentItem.assets);
-                }
-                return this.deliveryFetchService.getAllTaxonomies(projectId, []);
+                return this.cmFetchService.getLanguageVariantsForContentItems(projectId, projectApiKey, {
+                    contentItems: contentItems,
+                    contentTypes: contentTypes
+                });
+            }),
+            flatMap(languageVariants => {
+                result.languageVariants = JSON.stringify(languageVariants);
+
+                return this.cmFetchService.getAllTaxonomies(projectId, projectApiKey, []);
             }),
-            map(taxonomies => {
+            flatMap(taxonomies => {
                 result.taxonomies = JSON.stringify(taxonomies);
 
+                return this.cmFetchService.getAllAssets(projectId, projectApiKey, []);
+            }),
+            map(assets => {
+                result.assets = JSON.stringify(assets);
+                result.assetModels.push(...assets);
+
                 return result;
             })
-        )
+        );
     }
 
     createAndDownloadZipFile(projectId: string, data: IExportJsonResult, callback: (() => void)): void {
-        var zip = new JSZip();
+        const zip = new JSZip();
 
         zip.file(environment.export.filenames.contentTypes, data.contentTypes);
         zip.file(environment.export.filenames.contentItems, data.contentItems);
         zip.file(environment.export.filenames.taxonomies, data.taxonomies);
+        zip.file(environment.export.filenames.assets, data.assets);
+        zip.file(environment.export.filenames.languageVariants, data.languageVariants);
 
         const assetsFolder = zip.folder(environment.export.filenames.assetsFolder);
 
-        for (const embeddedAsset of data.assets) {
-            const assetItemSubfolder = assetsFolder.folder(embeddedAsset.contentItemCodename);
-            const assetLanguageSubfolder = assetItemSubfolder.folder(embeddedAsset.languageCodename);
-            const assetFieldSubfolder = assetLanguageSubfolder.folder(embeddedAsset.fieldCodename);
-            assetFieldSubfolder.file(
-                embeddedAsset.asset.name,
-                this.urlToPromise(embeddedAsset.asset.url),
+        for (const asset of data.assetModels) {
+            const assetSubFolder = assetsFolder.folder(asset.id);
+            const assetFilename = asset.fileName;
+            assetSubFolder.file(
+                assetFilename,
+                this.urlToPromise(asset.deliveryUrl),
                 {
                     binary: true
                 });
@@ -77,8 +94,8 @@ export class ExportService extends BaseService {
     }
 
     private urlToPromise(url: string): Promise<any> {
-        return new Promise(function (resolve, reject) {
-            JSZipUtils.getBinaryContent(url, function (err: any, data: any) {
+        return new Promise((resolve, reject) => {
+            JSZipUtils.getBinaryContent(url, (err: any, data: any) => {
                 if (err) {
                     reject(err);
                 } else {
@@ -87,4 +104,4 @@ export class ExportService extends BaseService {
             });
         });
     }
-}
+}