• 1. Legacy Conditions
• 2. PFE Conditions Service
  • 2.1. Register Condition Evaluator
  • 2.2. Usage
• 3. PFE Default Condition Evaluators
  • 3.1. PFE_AND
  • 3.2. PFE_OR
  • 3.3. PFE_EXPRESSION

PFE Conditions

The PFE Conditions allow to configure when a specific piece of configuration is executed.

You can think about conditions like an if statement. If the conditions are evaluated to true, then the configuration is executed. Not all the components allow conditions, please check the schemas to check if the conditions are supported.

1. Legacy Conditions

Historically two different types of conditions are supported by the PFE. An array of simple AND connected conditions and an object that allows both AND and OR evaluations.

If you are still relying on this configuration structure, please migrate it to the new format below.

{
    ...,
    "conditions": [
        {
          "expression": "{$.valueOne} === {$.valueTwo}"
        }
    ]
}

{
    ...,
    "conditions": {
      "operator": "OR",
      "conditions": [
        {
          "expression": "{$.valueOne} === {$.valueTwo}"
        },
        {
          "expression": "{$.valueThree} === {$.valueFour}"
        }
      ]
    }
}

2. PFE Conditions Service

Additionally, to that, the support of custom condition evaluators was added. This new feature is provided through the PfeConditionsService.

The PfeConditionsService is an abstract class that you can implement to provide your own service for handling PFE conditions.

providers: [
    {
      provide: PfeConditionsService,
      useClass: MyCustomConditionsService,
    }
]

PFE also provides a default implementation for the PfeConditionsService the PfeConditionsServiceImpl, the information that appears on the next sections is a reference to the PFE implementation.

In order to use the default implementation from PFE you don't need to perform any additional step, since the PfeConditionsModule is already imported in the NgxPfeModule

2.1. Register Condition Evaluator

To create a custom condition evaluator you can create a service or just use a static function.

Here we have 2 examples:

• A condition that always returns true
• A condition that check if a feature flag is present.

Always True Condition

export function alwaysTrue(): ConditionEvaluator  {
    return {
       type: 'APP_ALWAYS_TRUE',
       evaluator: (configuration, state) => {
           return true;
       }
    };
}

Feature Flag Condition

export function evaluateFeatureFlag(featureFlagService: AppFeatureFlagService): ConditionEvaluator {
    return {
       type: 'APP_FEATURE_FLAG',
       evaluator: (config, state) => {
           return featureFlagService.isFeatureAvailable(config.featureName);
       }
    }
  };
}

To register the new condition you can use the "CONDITIONS_EVALUATORS" injection token and provide the type and the evaluator. In this example a factory is used, but any Angular provider mechanism is possible.

const conditionsEvaluators = [
    {
        provide: CONDITIONS_EVALUATORS,
        multi: true,
        useFactory: alwaysTrue,
    },
    {
        provide: CONDITIONS_EVALUATORS,
        multi: true,
        useFactory: evaluateFeatureFlag,
        deps: [AppFeatureFlagService]
    }
]

// In the module
{
    providers: [
        conditionsEvaluators
    ]
}

2.2. Usage

You can use the register conditions on the configuration as any other condition

{
  "pageId": "myPage",
  "nextOptionList": [
    {
      "nextPageId": "anotherPage",
      "conditions": [
        {
          "type": "APP_FEATURE_FLAG",
          "featureName": "anotherName"
        },
        {
          "type": "APP_ALWAYS_TRUE"
        }
      ]
    }
  ]

}

3. PFE Default Condition Evaluators

The PfeConditionService provides 3 condition evaluators that are register by default, but also allows you to register your own condition evaluators.

These can then be used in the PFE configuration and any of the components that use PFE.

Aside from that this default implementation handles the legacy conditions and transform the legacy conditions into the new conditions.

3.1. PFE_AND

The default PFE_AND condition will evaluate that all the conditions inside the condition are true

{
    "type": "PFE_AND",
    "conditions": [
        {
          "type": "PFE_EXPRESSION",
          "expression": "{$.valueOne} === {$.valueTwo}"
        },
        {
          "type": "PFE_EXPRESSION",
          "expression": "{$.valueThree} === {$.valueFour}"
        }
      ]
    }
}

3.2. PFE_OR

The default PFE_OR condition will evaluate that at least one of the conditions inside the condition is true

{
    "type": "PFE_OR",
    "conditions": [
        {
          "type": "PFE_EXPRESSION",
          "expression": "{$.valueOne} === {$.valueTwo}"
        },
        {
          "type": "PFE_EXPRESSION",
          "expression": "{$.valueThree} === {$.valueFour}"
        }
      ]
    }
}

3.3. PFE_EXPRESSION

The PFE_EXPRESSION condition will check that the expression inside the condition is true

{
  "type": "PFE_EXPRESSION",
  "expression": "{$.valueOne} === {$.valueTwo}"
}

{
  "type": "PFE_EXPRESSION",
  "value1Expression": "$.valueOne",
  "operator": "==",
  "value2Expression": "$.valueTwo"
}