How to use the @talend/react-cmf.expression function in @talend/react-cmf

import createSagaMiddleware from 'redux-saga';
import { all, call, fork } from 'redux-saga/effects';
import actions from './next/actions';
import components from './next/components';
import App from './next/components/App.container';
import { ALERT } from './next/constants/actions';
import { default as constants } from './next/constants';
import sagas from './next/sagas/watchers';
import locales from './next/locales';
import { registerLocales } from './i18n';
import settingsService from './next/services/settings.service';

const registerActionCreator = api.actionCreator.register;
const registerComponent = api.component.register;
const registerComponents = api.component.registerMany;
const registerExpressions = api.expression.registerMany;
const registerRouteFunction = api.route.registerFunction;

/**
 * Initialize CMF configuration
 * - Register your components in the CMF dictionary
 * - Register action creators in CMF actions dictionary
 */
export default function initialize(additionalConfiguration = {}) {
	// FIXME remove before release
	// for debug purpose
	window.registry = api.registry.getRegistry();

	// register all saga api
	api.registry.addToRegistry(
		'SEARCH_CATEGORIES_BY_PROVIDER',
		constants.search.SEARCH_CATEGORIES_BY_PROVIDER,

import { all, call, fork } from 'redux-saga/effects';
import actions from './next/actions';
import components from './next/components';
import App from './next/components/App.container';
import { ALERT } from './next/constants/actions';
import { default as constants } from './next/constants';
import sagas from './next/sagas/watchers';
import locales from './next/locales';
import { registerLocales } from './i18n';
import settingsService from './next/services/settings.service';
import preparationService from './next/services/preparation.service';

const registerActionCreator = api.actionCreator.register;
const registerComponent = api.component.register;
const registerComponents = api.component.registerMany;
const registerExpressions = api.expression.registerMany;
const registerRouteFunction = api.route.registerFunction;

/**
 * Initialize CMF configuration
 * - Register your components in the CMF dictionary
 * - Register action creators in CMF actions dictionary
 */
export default function initialize(additionalConfiguration = {}) {
	// FIXME remove before release
	// for debug purpose
	window.registry = api.registry.getRegistry();

	// register all saga api
	api.registry.addToRegistry(
		'SEARCH_CATEGORIES_BY_PROVIDER',
		constants.search.SEARCH_CATEGORIES_BY_PROVIDER,

return flagStatus;
});

api.expression.register('getItems', () => [
	{
		label: 'label1',
		actionCreator: 'item1:action',
	},
	{
		label: 'label2',
		actionCreator: 'item2:action',
	},
]);

const modelHasLabelAction = action('modelHasLabel');
api.expression.register('modelHasLabel', context => {
	modelHasLabelAction(context);
	return !!context.payload.model.label;
});

function loadStories() {
	Object.keys(examples).forEach(example => {
		const state = mock.state();
		state.routing = {
			locationBeforeTransitions: {
				pathname: '/storybook',
			},
		};
		state.cmf.collections = state.cmf.collections.set(
			'myResourceType',
			List([Map({ id: 'myID', label: 'myLabel' })]),
		);

api.actionCreator.register('subheaderbar:submit', actionsCreatorsSubHeader.submitSubheader);
api.actionCreator.register('subheaderbar:edit', actionsCreatorsSubHeader.editSubHeaderBar);
api.actionCreator.register('subheaderbar:cancel', actionsCreatorsSubHeader.cancelSubHeaderBar);
api.actionCreator.register('subheaderbar:change', actionsCreatorsSubHeader.changeSubHeaderBar);
api.actionCreator.register('subheaderbar:goback', actionsCreatorsSubHeader.goBackSubHeaderBar);
api.actionCreator.register('tabbar:select', selectTab);
api.actionCreator.register('editabletext:submit', actionsCreatorsEditableText.submitEditableText);
api.actionCreator.register('editabletext:edit', actionsCreatorsEditableText.editEditableText);
api.actionCreator.register('editabletext:cancel', actionsCreatorsEditableText.cancelEditableText);
api.actionCreator.register('editabletext:change', actionsCreatorsEditableText.changeEditableText);

const registerComponent = api.component.register;
registerComponent('ComponentOverlay', ComponentOverlay);

const isTrueExpressionAction = action('isTrueExpression');
api.expression.register('isTrueExpression', (context, first) => {
	isTrueExpressionAction(context, first);
	return !!first;
});

const isFlagExpressionAction = action('isFlagExpression');
api.expression.register('isFlagExpression', (config, flagId) => {
	const flagStatus = config.context.store.getState().app.flags[flagId];
	isFlagExpressionAction(config, flagId, flagStatus);
	return flagStatus;
});

api.expression.register('getItems', () => [
	{
		label: 'label1',
		actionCreator: 'item1:action',
	},

export function mapStateToProps(state, ownProps) {
	const props = {
		productsItems: cmf.selectors.collections.toJS(state, Constants.COLLECTION_ID),
	};
	const expression = get(ownProps, 'callToAction.renderIfExpression');
	if (expression) {
		props.callToAction = Object.assign(
			{},
			ownProps.callToAction,
			cmf.expression.mapStateToProps(state, ownProps.callToAction),
		);
		if (props.callToAction.renderIf === false) {
			props.callToAction = null;
		}
	}
	return props;
}

function evalExpressions(action, context, payload = {}) {
	const newAction = cmf.expression.getProps(
		action,
		['active', 'available', 'disabled', 'inProgress'],
		context,
		payload,
	);
	return newAction;
}