Zapier requests updates, cleanup.

Author: acoumb

src/Umbraco.Cms.Integrations.Automation.Zapier/Api/Management/Controllers/UpdateSubscriptionHookController.cs

@@ -27,12 +27,15 @@ public UpdateSubscriptionHookController(IOptions<ZapierSettings> options,
 
         [HttpPost("subscription")]
         [ProducesResponseType(StatusCodes.Status401Unauthorized)]
+        [ProducesResponseType(StatusCodes.Status400BadRequest)]
         [ProducesResponseType(typeof(bool), StatusCodes.Status200OK)]
         public IActionResult UpdatePreferences([FromBody] SubscriptionDto dto)
         {
-            if (!IsAccessValid() || dto == null) 
+            if (!IsAccessValid())
                 return Unauthorized();
 
+            if (dto == null) return BadRequest();
+
             var result = dto.SubscribeHook
                 ? _zapierSubscriptionHookService.Add(dto.EntityId, dto.Type, dto.HookUrl)
                 : _zapierSubscriptionHookService.Delete(dto.EntityId, dto.Type, dto.HookUrl);

src/Umbraco.Cms.Integrations.Automation.Zapier/Client/generated/services.gen.ts

@@ -63,6 +63,7 @@ export class ZapierService {
             body: data.requestBody,
             mediaType: 'application/json',
             errors: {
+                400: 'Bad Request',
                 401: 'Unauthorized'
             }
         });

src/Umbraco.Cms.Integrations.Automation.Zapier/Client/generated/types.gen.ts

@@ -813,6 +813,10 @@ export type $OpenApiTs = {
                  * OK
                  */
                 200: boolean;
+                /**
+                 * Bad Request
+                 */
+                400: string;
                 /**
                  * Unauthorized
                  */

src/Umbraco.Cms.Integrations.Automation.Zapier/Client/src/dashboard/zapier-management-dashboard.element.ts

@@ -11,7 +11,7 @@ const elementName = "zapier-management-dashboard";
 export class ZapierManagementDashboardElement extends UmbLitElement {
     #zapierContext?: typeof ZAPIER_CONTEXT_TOKEN.TYPE;
     #paginationManager = new UmbPaginationManager();
-    #itemList: GetAllResponse | undefined;
+    #itemList: Array<SubscriptionDtoModel> = [];
     #isFormsExtensionInstalled: boolean | undefined = false;
 
     @state()
@@ -60,36 +60,12 @@ export class ZapierManagementDashboardElement extends UmbLitElement {
     }
 
     async getAll(){
-        debugger;
-        const data = await this.#zapierContext?.getAll();
+        const { data } = await this.#zapierContext!.getAll();
         if (!data) return;
 
-        this.#itemList = data.data;
-
-        const lst : Array<SubscriptionDtoModel> = [{
-            entityId: "docType1",
-            typeName: "Content",
-            hookUrl: "wwww.google.com",
-            id: 1,
-            subscribeHook: true,
-            type: 1
-        }, {
-            entityId: "docType1",
-            typeName: "Content",
-            hookUrl: "wwww.google.com",
-            id: 1,
-            subscribeHook: true,
-            type: 1
-        }, {
-            entityId: "docType1",
-            typeName: "Content",
-            hookUrl: "wwww.google.com",
-            id: 1,
-            subscribeHook: true,
-            type: 1
-        }];
-
-        this.#createTableItems(lst);
+        this.#itemList = data;
+
+        this.#createTableItems(this.#itemList);
     }
 
     async checkFormsExtension() {
@@ -99,75 +75,68 @@ export class ZapierManagementDashboardElement extends UmbLitElement {
         this.#isFormsExtensionInstalled = data.data;
     }
 
-    #createTableItems(products: Array<SubscriptionDtoModel>) {
-		this._tableItems = products.map((product) => {
+    #createTableItems(subscriptionHooks: Array<SubscriptionDtoModel>) {
+        this._tableItems = subscriptionHooks.map((subscriptionHook) => {
 			return {
-                id: product.id.toString(),
+                id: subscriptionHook.id.toString(),
                 data: [{
                     columnAlias: "identifer",
-                    value: product.entityId,
+                    value: subscriptionHook.entityId,
                 },
                 {
                     columnAlias: "entityType",
-                    value: product.type,
+                    value: subscriptionHook.type,
                 },
                 {
                     columnAlias: "hookUrl",
-                    value: product.hookUrl,
+                    value: subscriptionHook.hookUrl,
                 }
             ]
             }
 		});
 	}
 
     override render() {
-		return html`
-            <div class="zapier-content">
-                <umb-body-layout>
-                    <uui-box headline="Content Properties">
-                        <p>
-                            <a href="https://zapier.com/">Zapier</a> is an online platform that helps you automate workflows by connecting your apps and services you use.
-                            This allows you to automate tasks without having to build this integration yourself.
-                            When an event happens in one app, Zapier can tell another app to perform (or do) a particular action - no code necessary.
-                        </p>
-                        <p>
-                            The heart of any automation boils down to this simple command: <b>WHEN</b> <span>this happens</span> <b>THEN</b> <span>do that</span>.
-                        </p>
-                        <p>
-                            A Zap is an automated workflow that tells your apps to follow this simple command: "When this happens, do that."
-                            Every Zap has a trigger and one or more actions. A trigger is an event that starts a Zap, and an action is what your Zap does for you.
-                        </p>
+        return html`
+            <umb-body-layout>
+                <uui-box headline="Content Properties">
+                    <p>
+                        <a href="https://zapier.com/">Zapier</a> is an online platform that helps you automate workflows by connecting your apps and services you use.
+                        This allows you to automate tasks without having to build this integration yourself.
+                        When an event happens in one app, Zapier can tell another app to perform (or do) a particular action - no code necessary.
+                    </p>
+                    <p>
+                        The heart of any automation boils down to this simple command: <b>WHEN</b> <span>this happens</span> <b>THEN</b> <span>do that</span>.
+                    </p>
+                    <p>
+                        A Zap is an automated workflow that tells your apps to follow this simple command: "When this happens, do that."
+                        Every Zap has a trigger and one or more actions. A trigger is an event that starts a Zap, and an action is what your Zap does for you.
+                    </p>
+                    <p>
+                        Zap triggers use webhooks to execute the actions. Webhooks are automated messages sent from apps when something happens.
+                    </p>
+                    ${!this.#isFormsExtensionInstalled ? html`
                         <p>
-                            Zap triggers use webhooks to execute the actions. Webhooks are automated messages sent from apps when something happens.
+                            You can initiate your automation when a content item of a particular document type is published in Umbraco.
                         </p>
-                        ${!this.#isFormsExtensionInstalled ? html`
-                            <p>
-                                You can initiate your automation when a content item of a particular document type is published in Umbraco.
-                            </p>
-                            ` : html`
-                            <p>
-                                You can initiate your automation when a content item of a particular document type is published or a form is submitted in Umbraco.
-                            </p>
-                            `
-                        }
+                        ` : html`
                         <p>
-                            The integration uses Zapier subscription hook triggers, allowing Zapier to set up and remove hook subscriptions when Zaps are created or removed on the platform.
+                            You can initiate your automation when a content item of a particular document type is published or a form is submitted in Umbraco.
                         </p>
-                    </uui-box>
-                </umb-body-layout>
-            </div>
-
-            <div>
-                <umb-body-layout>
-                    <uui-box headline="Registed Subscription Hooks">
-                        <umb-table 
+                        `
+                    }
+                    <p>
+                        The integration uses Zapier subscription hook triggers, allowing Zapier to set up and remove hook subscriptions when Zaps are created or removed on the platform.
+                    </p>
+                </uui-box>
+                <uui-box id="subscriptionHooks" headline="Registed Subscription Hooks">
+                        <umb-table
                             .columns=${this._tableColumns} 
                             .items=${this._tableItems}>
                         </umb-table>
                         ${this.#renderPagination()}
                     </uui-box>
-                </umb-body-layout>
-            </div>
+            </umb-body-layout>
 		`;
 	}
 
@@ -198,8 +167,8 @@ export class ZapierManagementDashboardElement extends UmbLitElement {
     }
 
     static styles = [css`
-        .zapier-content p:first-child {
-            margin-top: 0 !important;
+        #subscriptionHooks {
+            margin-top: 20px;
         }
     `];
 }

src/Umbraco.Cms.Integrations.Automation.Zapier/Components/NewContentPublishedComponent.cs

@@ -1,15 +1,17 @@
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Text;
-using System.Threading.Tasks;
-
-namespace Umbraco.Cms.Integrations.Automation.Zapier.Configuration
+namespace Umbraco.Cms.Integrations.Automation.Zapier.Configuration
 {
     public abstract class AppSettings
     {
-        public string UserGroupAlias { get; set; }
+        public string UserGroupAlias { get; set; } = string.Empty;
+
+        public string ApiKey { get; set; } = string.Empty;
+    }
 
-        public string ApiKey { get; set; }
+    public class ZapierSettings : AppSettings
+    {
+    }
+
+    public class ZapierFormsSettings : ZapierSettings
+    {
     }
 }

src/Umbraco.Cms.Integrations.Automation.Zapier/Configuration/AppSettings.cs

@@ -9,14 +9,6 @@ public class Constants
 
         public const string TargetStateName = "zapiersubscriptionhook-db";
 
-        public const string UmbracoCmsIntegrationsAutomationZapierUserGroupAlias = "Umbraco.Cms.Integrations.Automation.Zapier.UserGroupAlias";
-
-        public const string UmbracoCmsIntegrationsAutomationZapierApiKey = "Umbraco.Cms.Integrations.Automation.Zapier.ApiKey";
-
-        public const string UmbracoFormsIntegrationsAutomationZapierUserGroupAlias = "Umbraco.Forms.Integrations.Automation.Zapier.UserGroupAlias";
-
-        public const string UmbracoFormsIntegrationsAutomationZapierApiKey = "Umbraco.Forms.Integrations.Automation.Zapier.ApiKey";
-
         public static class ManagementApi
         {
             public const string RootPath = "zapier/management/api";