Hi everybody,
I'm building a custom component for a custom page in the Project Workspace. Doing so, I'm currently running into a problem, that I can not understand. Maybe somebody has an idea of why it is not working or what I could try to figure this out. But let's get into it step by step.
What am I trying to do?
I'm trying to read data from tables with columns configured via System Properties. To accomplish this I'm using two Data Brokers, a Client Script and three properties of my Custom Component.
How does it work?
The first Data Broker is reading two System Properties. The value of those System Properties is adjusted a bit via a Client Script and used as an input for the second Data Broker. The output of those Data Brokers is then used to bind the three properties of the Custom Component, which then uses the values for its things.
What does not work?
The Client Script handles the values as expected. The logs show, that the value from the System Properties is read correctly. Also the second Data Broker reads the expected columns and provides them to the Custom Component. But the columns from the first Data Broker simply show as null/undefined in the logs of the Custom Component. The Next Experience Developer Tools do not show the properties for the columns, but the UI Builder let's me configure them accordingly.
Code/Screenshots:
Log from the Client Script. It mentions Updated Client State, but the values are currently not saved as a Client State, but bound directly from Data Broker to Custom Component.
Configuration of the binding in the Custom Component. Works for tasks, does not work for the column properties.
Next Experience Developer Tools not showing it in the properties.
Currently not used, but saved correctly also Client State of Macroponent.
Logs from Custom Component show that the tasks are handled as expected, but the column properties are not provided.
Code for handling of the properties in Custom Component. I'm trying to take the initially set columns from the input properties into the state of the Custom Component. To enable an extension for personalization within the Component in the future.
var finalState = state;
if (!state.tasks) {
finalState = {
...state, tasks: state.properties.tasks.map((currentTask) => ({
...currentTask,
collapsed: false
}))
};
};
console.log("Project Columns: ", state.properties.projectColumns);
console.log("Task Columns: ", state.properties.taskColumns);
finalState = {...finalState, projectColumns:state.properties.projectColumns ? state.properties.projectColumns.split(',') : []};
finalState = {...finalState, taskColumns:state.properties.taskColumns ? state.properties.taskColumns.split(',') : []};
return finalState;
What has been tried?
Every kind of Cache clearance. Used two different PDIs, same behavior. Binding the properties via Data Broker or Client State.
As I don't have any idea what could be the issue here, I would be happy for any pointer of what could be tried to figure this one out.
Thanks for your help!
After writing this I noticed, that there was a typo in the log statements of the Custom Component, those are resolved now and the logged state.properties looks as follows once cleaned up:
