Removed RuleActionComponent.

src/Squidex/app/features/rules/declarations.ts

@@ -8,7 +8,6 @@
 export * from './pages/rules/triggers/asset-changed-trigger.component';
 export * from './pages/rules/triggers/content-changed-trigger.component';
 
-export * from './pages/rules/rule-action.component';
 export * from './pages/rules/rule-element.component';
 export * from './pages/rules/rule-wizard.component';
 export * from './pages/rules/rules-page.component';

src/Squidex/app/features/rules/module.ts

@@ -14,14 +14,13 @@ import {
     SqxSharedModule
 } from '@app/shared';
 
-import actions from './pages/rules/actions';
+import * as actions from './pages/rules/actions';
 
-const actionTypes: any[] = Object.values(actions);
+const actionTypes: any = Object.values(actions);
 
 import {
     AssetChangedTriggerComponent,
     ContentChangedTriggerComponent,
-    RuleActionComponent,
     RuleElementComponent,
     RuleEventBadgeClassPipe,
     RuleEventsPageComponent,
@@ -55,14 +54,10 @@ const routes: Routes = [
         SqxSharedModule,
         RouterModule.forChild(routes)
     ],
-    entryComponents: [
-        ...actionTypes
-    ],
     declarations: [
         ...actionTypes,
         AssetChangedTriggerComponent,
         ContentChangedTriggerComponent,
-        RuleActionComponent,
         RuleElementComponent,
         RuleEventBadgeClassPipe,
         RuleEventsPageComponent,

src/Squidex/app/features/rules/pages/rules/actions/index.ts

@@ -5,22 +5,11 @@
  * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved.
  */
 
-import { AlgoliaActionComponent } from './algolia-action.component';
+export * from './algolia-action.component';
-import { AzureQueueActionComponent } from './azure-queue-action.component';
+export *  from './azure-queue-action.component';
-import { ElasticSearchActionComponent } from './elastic-search-action.component';
+export *  from './elastic-search-action.component';
-import { FastlyActionComponent } from './fastly-action.component';
+export *  from './fastly-action.component';
-import { MediumActionComponent } from './medium-action.component';
+export *  from './medium-action.component';
-import { SlackActionComponent } from './slack-action.component';
+export *  from './slack-action.component';
-import { TweetActionComponent } from './tweet-action.component';
+export *  from './tweet-action.component';
-import { WebhookActionComponent } from './webhook-action.component';
+export *  from './webhook-action.component';
-
-export default {
-    Algolia: AlgoliaActionComponent,
-    AzureQueue: AzureQueueActionComponent,
-    ElasticSearch: ElasticSearchActionComponent,
-    Fastly: FastlyActionComponent,
-    Medium: MediumActionComponent,
-    Slack: SlackActionComponent,
-    Tweet: TweetActionComponent,
-    Webhook: WebhookActionComponent
-};

src/Squidex/app/features/rules/pages/rules/rule-action.component.ts

@@ -1,61 +0,0 @@
-/*
- * Squidex Headless CMS
- *
- * @license
- * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved.
- */
-
-import { ChangeDetectionStrategy, Component, ComponentFactoryResolver, ComponentRef, Input, OnChanges, OnInit, ViewChild, ViewContainerRef } from '@angular/core';
-import { FormGroup } from '@angular/forms';
-
-import actions from './actions';
-
-@Component({
-    selector: 'sqx-rule-action',
-    template: '<div #element></div>',
-    changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class RuleActionComponent implements OnChanges, OnInit {
-    @Input()
-    public actionType: string;
-
-    @Input()
-    public action: any;
-
-    @Input()
-    public actionForm: FormGroup;
-
-    @Input()
-    public actionFormSubmitted = false;
-
-    @ViewChild('element', { read: ViewContainerRef })
-    public viewContainer: ViewContainerRef;
-
-    private component: ComponentRef<any>;
-
-    constructor(
-        private readonly componentFactoryResolver: ComponentFactoryResolver
-    ) {
-    }
-
-    public ngOnChanges() {
-        this.updateInnerValues();
-    }
-
-    public ngOnInit() {
-        const factoryType: any = actions[this.actionType];
-        const factory: any = this.componentFactoryResolver.resolveComponentFactory(factoryType);
-
-        this.component = this.viewContainer.createComponent(factory);
-
-        this.updateInnerValues();
-    }
-
-    private updateInnerValues() {
-        if (this.component) {
-            this.component.instance.action = this.action;
-            this.component.instance.actionForm = this.actionForm;
-            this.component.instance.actionFormSubmitted = this.actionFormSubmitted;
-        }
-    }
-}

src/Squidex/app/features/rules/pages/rules/rule-wizard.component.html

@@ -61,12 +61,64 @@
     
         <ng-container *ngIf="step === 4">
             <form [formGroup]="actionForm.form" (submit)="saveAction()">
-                <sqx-rule-action 
+                <ng-container [ngSwitch]="actionType">
-                    [actionType]="actionType"
+                    <ng-container *ngSwitchCase="'Algolia'">
+                        <sqx-algolia-action
                             [action]="action"
                             [actionForm]="actionForm.form"
                             [actionFormSubmitted]="actionForm.submitted | async">
-                </sqx-rule-action>
+                        </sqx-algolia-action>
+                    </ng-container>
+                    <ng-container *ngSwitchCase="'AzureQueue'">
+                        <sqx-azure-queue-action
+                            [action]="action"
+                            [actionForm]="actionForm.form"
+                            [actionFormSubmitted]="actionForm.submitted | async">
+                        </sqx-azure-queue-action>
+                    </ng-container>
+                    <ng-container *ngSwitchCase="'ElasticSearch'">
+                        <sqx-elastic-search-action
+                            [action]="action"
+                            [actionForm]="actionForm.form"
+                            [actionFormSubmitted]="actionForm.submitted | async">
+                        </sqx-elastic-search-action>
+                    </ng-container>
+                    <ng-container *ngSwitchCase="'Fastly'">
+                        <sqx-fastly-action
+                            [action]="action"
+                            [actionForm]="actionForm.form"
+                            [actionFormSubmitted]="actionForm.submitted | async">
+                        </sqx-fastly-action>
+                    </ng-container>
+                    <ng-container *ngSwitchCase="'Medium'">
+                        <sqx-medium-action
+                            [action]="action"
+                            [actionForm]="actionForm.form"
+                            [actionFormSubmitted]="actionForm.submitted | async">
+                        </sqx-medium-action>
+                    </ng-container>
+                    <ng-container *ngSwitchCase="'Slack'">
+                        <sqx-slack-action
+                            [action]="action"
+                            [actionForm]="actionForm.form"
+                            [actionFormSubmitted]="actionForm.submitted | async">
+                        </sqx-slack-action>
+                    </ng-container>
+                    <ng-container *ngSwitchCase="'Tweet'">
+                        <sqx-tweet-action
+                            [action]="action"
+                            [actionForm]="actionForm.form"
+                            [actionFormSubmitted]="actionForm.submitted | async">
+                        </sqx-tweet-action>
+                    </ng-container>
+                    <ng-container *ngSwitchCase="'Webhook'">
+                        <sqx-webhook-action        
+                            [action]="action"
+                            [actionForm]="actionForm.form"
+                            [actionFormSubmitted]="actionForm.submitted | async">
+                        </sqx-webhook-action>
+                    </ng-container>
+                </ng-container>
             </form>
         </ng-container>
     </ng-container>