feat(editor-content): refactor upload asset #29872

core-web/libs/data-access/src/lib/dot-upload-file/dot-upload-file.service.spec.ts

@@ -1,12 +1,14 @@
 import { createHttpFactory, HttpMethod, SpectatorHttp } from '@ngneat/spectator/jest';
 
+import { DotWorkflowActionsFireService } from '@dotcms/data-access';
+
 import { DotUploadFileService } from './dot-upload-file.service';
 
 describe('DotUploadFileService', () => {
     let spectator: SpectatorHttp<DotUploadFileService>;
     const createHttp = createHttpFactory({
         service: DotUploadFileService,
-        providers: [DotUploadFileService]
+        providers: [DotUploadFileService, DotWorkflowActionsFireService]
     });
 
     beforeEach(() => (spectator = createHttp()));

core-web/libs/data-access/src/lib/dot-upload-file/dot-upload-file.service.ts

@@ -5,7 +5,7 @@ import { inject, Injectable } from '@angular/core';
 
 import { catchError, pluck, switchMap } from 'rxjs/operators';
 
-import { DotUploadService } from '@dotcms/data-access';
+import { DotUploadService, DotWorkflowActionsFireService } from '@dotcms/data-access';
 import { DotCMSContentlet, DotCMSTempFile } from '@dotcms/dotcms-models';
 
 export enum FileStatus {
@@ -32,6 +32,7 @@ export class DotUploadFileService {
     readonly #BASE_URL = '/api/v1/workflow/actions/default';
     readonly #httpClient = inject(HttpClient);
     readonly #uploadService = inject(DotUploadService);
+    readonly #workflowActionsFireService = inject(DotWorkflowActionsFireService)
 
     publishContent({
         data,
@@ -90,21 +91,10 @@ export class DotUploadFileService {
      * @param file the file to be uploaded
      * @returns an Observable that emits the created contentlet
      */
-    uploadDotAsset(file: File): Observable<DotCMSContentlet> {
+    uploadDotAsset(file: File) {
         const formData = new FormData();
         formData.append('file', file);
-        formData.append(
-            'json',
-            JSON.stringify({
-                contentlet: {
-                    file: file.name,
-                    contentType: 'dotAsset'
-                }
-            })
-        );
 
-        return this.#httpClient
-            .put<DotCMSContentlet>(`${this.#BASE_URL}/fire/NEW`, formData)
-            .pipe(pluck('entity'));
+        return this.#workflowActionsFireService.newContentlet<DotCMSContentlet>('dotAsset', { file: file.name }, formData);
     }
 }

core-web/libs/data-access/src/lib/dot-workflow-actions-fire/dot-workflow-actions-fire.service.ts

@@ -16,6 +16,7 @@ interface DotActionRequestOptions {
     data: { [key: string]: string };
     action: ActionToFire;
     individualPermissions?: { [key: string]: string[] };
+    formData?: FormData;
 }
 
 export interface DotFireActionOptions<T> {
@@ -86,8 +87,8 @@ export class DotWorkflowActionsFireService {
      *
      * @memberof DotWorkflowActionsFireService
      */
-    newContentlet<T>(contentType: string, data: { [key: string]: string }): Observable<T> {
-        return this.request<T>({ contentType, data, action: ActionToFire.NEW });
+    newContentlet<T>(contentType: string, data: { [key: string]: string }, formData?: FormData): Observable<T> {
+        return this.request<T>({ contentType, data, action: ActionToFire.NEW, formData });
     }
 
     /**
@@ -171,19 +172,29 @@ export class DotWorkflowActionsFireService {
         contentType,
         data,
         action,
-        individualPermissions
+        individualPermissions,
+        formData
     }: DotActionRequestOptions): Observable<T> {
+
+        let url = `${this.BASE_URL}/actions/default/fire/${action}`;
+
         const contentlet = contentType ? { contentType: contentType, ...data } : data;
         const bodyRequest = individualPermissions
-            ? { contentlet, individualPermissions }
-            : { contentlet };
+                ? { contentlet, individualPermissions }
+                : { contentlet };
+
+        if (data['inode']) {
+            url += `?inode=${data['inode']}`
+        }
+
+        if (formData) {
+            formData.append('json', JSON.stringify(bodyRequest));
+        }
 
         return this.httpClient
             .put(
-                `${this.BASE_URL}/actions/default/fire/${action}${
-                    data['inode'] ? `?inode=${data['inode']}` : ''
-                }`,
-                bodyRequest,
+                url,
+                formData ? formData : bodyRequest,
                 { headers: this.defaultHeaders }
             )
             .pipe(take(1), pluck('entity'));

core-web/libs/edit-content/src/lib/fields/dot-edit-content-file-field/dot-edit-content-file-field.component.ts

@@ -67,7 +67,7 @@ export class DotEditContentFileFieldComponent implements ControlValueAccessor, O
      */
     $field = input.required<DotCMSContentTypeField>({ alias: 'field' });
 
-    private onChange: (value: string | File) => void;
+    private onChange: (value: string) => void;
     private onTouched: () => void;
 
     constructor() {

core-web/libs/edit-content/src/lib/fields/dot-edit-content-file-field/store/file-field.store.ts

@@ -17,7 +17,7 @@ import { getUiMessage } from '../utils/messages';
 export interface FileFieldState {
     contentlet: DotCMSContentlet | null;
     tempFile: DotCMSTempFile | null;
-    value: string | File;
+    value: string;
     inputType: INPUT_TYPES | null;
     fileStatus: FILE_STATUS;
     dropZoneActive: boolean;