V14: Integrations (HubSpot/Forms)

- Update form field dto
- Change some css
- Re generate api

Author: dtng95

src/Umbraco.Forms.Integrations.Crm.Hubspot/Api/Management/Controllers/Forms/GetFormFieldsController.cs

@@ -5,8 +5,8 @@
 using System.Linq;
 using System.Text;
 using System.Threading.Tasks;
-using Umbraco.Forms.Core.Models;
 using Umbraco.Forms.Core.Services;
+using Umbraco.Forms.Integrations.Crm.Hubspot.Models.Dtos;
 
 namespace Umbraco.Forms.Integrations.Crm.Hubspot.Api.Management.Controllers.Forms
 {
@@ -17,14 +17,14 @@ public GetFormFieldsController(IFormService formService) : base(formService)
         }
 
         [HttpGet("fields")]
-        [ProducesResponseType(typeof(List<Field>), StatusCodes.Status200OK)]
+        [ProducesResponseType(typeof(List<HubspotWorkflowFormFieldDto>), StatusCodes.Status200OK)]
         public IActionResult GetFormFields(string formId)
         {
-            List<Field> formFields = new List<Field>();
+            List<HubspotWorkflowFormFieldDto> formFields = new List<HubspotWorkflowFormFieldDto>();
             var result = FormService.Get(new Guid(formId));
             if (result != null)
             {
-                formFields = result.AllFields;
+                formFields = result.AllFields.Select(s => new HubspotWorkflowFormFieldDto{ Caption = s.Caption, Id = s.Id }).ToList();
             }
             return Ok(formFields);
         }

src/Umbraco.Forms.Integrations.Crm.Hubspot/Client/generated/types.gen.ts

@@ -1,11 +1,5 @@
 // This file is auto-generated by @hey-api/openapi-ts
 
-export type AllowedUploadType = {
-    type: string;
-    name: string;
-    checked: string;
-};
-
 export type AuthorizationRequest = {
     code: string;
 };
@@ -23,80 +17,9 @@ export enum EventMessageTypeModel {
     WARNING = 'Warning'
 }
 
-export type Field = {
+export type HubspotWorkflowFormFieldDto = {
     caption: string;
-    tooltip?: string | null;
-    /**
-     * @deprecated
-     */
-    placeholder?: string | null;
-    cssClass?: string | null;
-    alias: string;
-    id: string;
-    fieldTypeId: string;
-    prevalueSourceId: string;
-    dataSourceFieldKey?: string | null;
-    containsSensitiveData: boolean;
-    mandatory: boolean;
-    regex?: string | null;
-    requiredErrorMessage?: string | null;
-    invalidErrorMessage?: string | null;
-    condition?: FieldCondition | null;
-    settings: {
-        [key: string]: (string);
-    };
-    preValues: Array<(FieldPrevalue)>;
-    allowedUploadTypes?: Array<(AllowedUploadType)> | null;
-    allowMultipleFileUploads: boolean;
-};
-
-export type FieldCondition = {
-    id: string;
-    enabled: boolean;
-    actionType: FieldConditionActionType;
-    logicType: FieldConditionLogicType;
-    rules: Array<(FieldConditionRule)>;
-};
-
-export enum FieldConditionActionType {
-    SHOW = 'Show',
-    HIDE = 'Hide'
-}
-
-export enum FieldConditionLogicType {
-    ALL = 'All',
-    ANY = 'Any'
-}
-
-export type FieldConditionRule = {
     id: string;
-    field: string;
-    operator: FieldConditionRuleOperator;
-    value: string;
-};
-
-export enum FieldConditionRuleOperator {
-    IS = 'Is',
-    IS_NOT = 'IsNot',
-    GREATER_THEN = 'GreaterThen',
-    LESS_THEN = 'LessThen',
-    CONTAINS = 'Contains',
-    CONTAINS_IGNORE_CASE = 'ContainsIgnoreCase',
-    STARTS_WITH = 'StartsWith',
-    STARTS_WITH_IGNORE_CASE = 'StartsWithIgnoreCase',
-    ENDS_WITH = 'EndsWith',
-    ENDS_WITH_IGNORE_CASE = 'EndsWithIgnoreCase',
-    NOT_CONTAINS = 'NotContains',
-    NOT_CONTAINS_IGNORE_CASE = 'NotContainsIgnoreCase',
-    NOT_STARTS_WITH = 'NotStartsWith',
-    NOT_STARTS_WITH_IGNORE_CASE = 'NotStartsWithIgnoreCase',
-    NOT_ENDS_WITH = 'NotEndsWith',
-    NOT_ENDS_WITH_IGNORE_CASE = 'NotEndsWithIgnoreCase'
-}
-
-export type FieldPrevalue = {
-    value: string;
-    caption?: string | null;
 };
 
 export type NotificationHeaderModel = {
@@ -129,7 +52,7 @@ export type GetFormFieldsData = {
     formId?: string;
 };
 
-export type GetFormFieldsResponse = Array<(Field)>;
+export type GetFormFieldsResponse = Array<(HubspotWorkflowFormFieldDto)>;
 
 export type $OpenApiTs = {
     '/umbraco/hubspot/management/api/v1/contacts/auth/configured': {
@@ -190,7 +113,7 @@ export type $OpenApiTs = {
                 /**
                  * OK
                  */
-                200: Array<(Field)>;
+                200: Array<(HubspotWorkflowFormFieldDto)>;
             };
         };
     };

src/Umbraco.Forms.Integrations.Crm.Hubspot/Client/src/property-editor/hubspot-mapping.property-editor.ts

@@ -2,7 +2,7 @@ import { html, customElement, property, css, when, state, map } from '@umbraco-c
 import type { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry';
 import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
 import { HUBSPOT_CONTEXT_TOKEN } from '@umbraco-integrations/hubspot/context';
-import { Field, Property } from '@umbraco-integrations/hubspot/generated';
+import { HubspotWorkflowFormFieldDto, Property } from '@umbraco-integrations/hubspot/generated';
 import { UUIInputEvent, UUISelectEvent } from '@umbraco-cms/backoffice/external/uui';
 import { HubspotMappingValue } from '../models/hubspot.model';
 import { UMB_NOTIFICATION_CONTEXT, UmbNotificationColor } from '@umbraco-cms/backoffice/notification';
@@ -30,7 +30,7 @@ export class HubspotMappingPropertyUiElement extends UmbLitElement implements Um
   private hubspotFields: Array<Property> | undefined = [];
 
   @state()
-  private formdFields: Array<Field> | undefined = [];
+  private formdFields: Array<HubspotWorkflowFormFieldDto> | undefined = [];
 
   @state()
   private authorizationCode: string = "";
@@ -222,8 +222,9 @@ export class HubspotMappingPropertyUiElement extends UmbLitElement implements Um
           </div>
         ` 
         : html`
-          <div class="umb-forms-settings-note ng-scope">
-              Umbraco Forms is configured with a HubSpot CRM account using: <b>${this.authorizationStatus}</b></p>
+          <div class="hubspot-wf-status">
+              <span>Umbraco Forms is configured with a HubSpot CRM account using: </span>
+              <b>${this.authorizationStatus}</b></p>
           </div>
 
           <div class="hubspot-wf-button">
@@ -302,6 +303,13 @@ export class HubspotMappingPropertyUiElement extends UmbLitElement implements Um
 
   static styles = [
     css`
+      .hubspot-wf-status{
+        margin-top: 10px;
+        padding: 10px;
+        background-color: #202454;
+        color: #ffffff;
+      }
+
       .hubspot-wf-auth-link{
         cursor: pointer;
       }

src/Umbraco.Forms.Integrations.Crm.Hubspot/Models/Dtos/HubspotWorkflowFormFieldDto.cs

@@ -0,0 +1,18 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Runtime.Serialization;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace Umbraco.Forms.Integrations.Crm.Hubspot.Models.Dtos
+{
+    public class HubspotWorkflowFormFieldDto
+    {
+        [DataMember(Name = "caption")]
+        public string Caption { get; set; } = string.Empty;
+
+        [DataMember(Name = "id")]
+        public Guid Id { get; set; }
+    }
+}